android: the catalog's numbers — Popular's own lane, a count per row, the artist's photo

Popular is asked on its own as well as with the page, so the section can
paint before the full page is built and an artist whose page came back
with none still gets one. A catalog record's rows that the album's own
artist anchor found no count for — a feature's guest, a compilation's
stranger — get the deferred Last.fm pass by their own artist id. The
artist page's ⋯ is its own sheet now: choose a hero photo from this phone,
or put the catalog's own back; set_artist_hero is pick_artist_hero's
install step split out and shared, so the desktop's dialog keeps its door.
You gains the desktop's Refresh artist portraits, and a data: URL is the
image itself in the art gate — a chosen hero comes back from Rust as one,
and the thumbnail fetch used to throw it away.

src/mobile/HalfSheet.svelte

@@ -11,7 +11,7 @@
     import { nav, closeHalf, push, top, patch, go, back, openHalf, openSheet } from "./nav.svelte.js";
     import { player, playNext, enqueue, playEntries, playQueueAt, removeFromQueue, moveToNext, moveInQueue, setSleep, sleepLabel } from "./player.svelte.js";
     import { streamSong, saveSong, streamCatalogAlbum, saveCatalogAlbum } from "./resolve.svelte.js";
-    import { catalog, yearOf } from "./catalog.svelte.js";
+    import { catalog, yearOf, artistKey, picture, heroFromPhoto, heroClear } from "./catalog.svelte.js";
     import { pls, bulk, bulkable, runBulk, coverFor, queueable, entryOf, playFrom, shufflePlay, togglePin, renamePlaylist, describePlaylist, duplicatePlaylist, deletePlaylist, removeItems, addEntries, createPlaylist, moveItem, coverFromPhoto, coverClear } from "./playlists.svelte.js";
     import { DOORS, start as startImport, pickImportFolder, startFolder } from "./importer.svelte.js";
     import { slsk, refreshRooms, disconnect, openThread, addBuddy, removeBuddy, leaveRoom } from "./slsk.svelte.js";
@@ -38,6 +38,7 @@
         if (t.n === "library") return "library-more";
         if (t.n === "playlist") return "playlist-more";
         if (t.n === "catalogAlbum") return "catalogAlbum-more";
+        if (t.n === "artist") return "artist-more";
         return "home-more";
     });
 
@@ -682,6 +683,25 @@
                 <div class="sheet-hair"></div>
                 {@render row("refresh", "Rescan library", "looks for new files in the folder", act(rescan))}
             </div>
+        {:else if kind === "artist-more"}
+            {@const nm = top().c.name}
+            {@const ent = catalog.artists[artistKey(nm)] ?? null}
+            {@const pg = ent?.page ?? null}
+            {@const aid = pg?.artist?.id ?? ent?.id ?? null}
+            <div class="sheet-head">
+                <span class="art">{#if picture(pg?.artist?.picture)}<img src={picture(pg.artist.picture)} alt="" />{:else}<Icon name="users" size={22} />{/if}</span>
+                <span class="b"><span class="t">{nm}</span><span class="m">{pg?.albums?.length ? pg.albums.length + " releases on the catalog" : "Artist"}</span></span>
+            </div>
+            <div class="sheet-rows">
+                {#if aid != null}
+                    {@render row("image", "Choose hero photo…", "a wide picture from this phone, 1920×800 or larger", act(() => heroFromPhoto(aid, nm).catch(oops)))}
+                    {#if pg?.banner_custom}
+                        {@render row("x", "Remove custom hero", "the catalog's own photos come back", act(() => heroClear(aid, nm).catch(oops)))}
+                    {/if}
+                    <div class="sheet-hair"></div>
+                {/if}
+                {@render row("settings", "Artwork settings", "covers and portraits, in You", act(() => go("you")))}
+            </div>
         {:else if kind === "home-more"}
             <div class="sheet-title">SoulStream</div>
             <div class="sheet-rows">