Alt text for first screenshot continued here to due to arbitrary Mastodon character limit on alt text:
Code lines shown are lines 90-128:
class ImportProgress extends kitten.Component {
importStarted = false
importEnded = false
message = 'Uploading…'
/** @type {boolean|string} */
error = false
stats = {
domainsFound: 0,
domainsImported: 0,
duplicatesIgnored: 0
}
html () {
return kitten.html`
<div id='import-status'>
<if ${this.importStarted}>
<if ${this.importEnded && !this.error}>
<then>
<markdown>
#### Import complete!
| Domains | |
| -------------------- | ---------------------------------------- |
| Found | ${this.stats.domainsFound} |
| Imported | ${this.stats.domainsImported} |
| Ignored (duplicates) | ${this.stats.duplicatesIgnored} |
[View places](/settings/places/)
</markdown>
<style>
table {
table-layout: auto;
}
</style>
</then>
<else>
<div><${SvgSpinner} /> ${this.message}</div>
</else>
</if>
</if>
<if ${this.error}>
<div class='error'>❌ ${this.error}</div>
</if>
</div>
`
}
onConnect () {
this.addEventHandler(this.page.request.session, 'placesExportUploaded', /** @this {ImportProgress} */ async function (upload) {