community: declare what you like on soulseek, so the similar-users shelf finally has something to rank on

src/views/Community.svelte

@@ -58,6 +58,8 @@
         personaKey,
         loadUserInfo,
         loadSimilar,
+        refreshInterests,
+        setInterest,
         refreshLinks,
         linkSelf,
         unlinkSelf,
@@ -603,9 +605,13 @@
     $effect(() => {
         for (const f of pendingIn()) if (!f.username) untrack(() => loadRemoteProfile(f.persona_key));
     });
+    let likeDraft = $state("");
     // Discover's similar-users shelf asks the server once per session.
     $effect(() => {
-        if (community.section === "discover" && online) untrack(() => loadSimilar());
+        if (community.section === "discover" && online) {
+            untrack(() => loadSimilar());
+            untrack(() => refreshInterests());
+        }
     });
     function saveMeta(patch = {}) {
         if (!drawerUser) return;
@@ -1121,6 +1127,17 @@
                 <h2 class="ax-title">Similar Soulseek interests</h2>
                 <span class="prov"><Icon name="heart" size={12} /> the server's match on declared likes · not follows</span>
             </div>
+            {#if online}
+                <div class="likes">
+                    {#each community.interests?.likes ?? [] as thing (thing)}
+                        <span class="chip acc">{thing}<button class="x" title="Stop declaring {thing}" onclick={() => void setInterest(thing, true, false)} disabled={!!community.busy.interest}>×</button></span>
+                    {/each}
+                    <form class="inl" onsubmit={(e) => { e.preventDefault(); const t = likeDraft.trim(); if (t) { void setInterest(t, true, true); likeDraft = ""; } }}>
+                        <input placeholder="Declare a like — an artist, a label, a genre" maxlength="64" bind:value={likeDraft} />
+                        <button class="ax-ghost sm" type="submit" disabled={!likeDraft.trim() || !!community.busy.interest}>{community.busy.interest ? "Telling the server…" : "Declare"}</button>
+                    </form>
+                </div>
+            {/if}
             {#if community.similar?.users?.length}
                 <div class="track">
                     {#each community.similar.users.slice(0, 24) as su (su.username)}
@@ -2177,6 +2194,16 @@
     .field label span.over { color: var(--err); }
     .field input, .field textarea { background: var(--surf-hi); border: 1px solid transparent; border-radius: 8px; color: #fff; padding: 8px 12px; font-size: 13px; outline: none; resize: none; font-family: inherit; }
     .field input:focus, .field textarea:focus { border-color: rgba(255, 255, 255, 0.28); }
+    .likes { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin: 2px 0 12px; }
+    .likes .inl { flex: 1; min-width: 240px; }
+    .likes .chip .x {
+        all: unset;
+        cursor: pointer;
+        margin-left: 6px;
+        opacity: 0.65;
+        line-height: 1;
+    }
+    .likes .chip .x:hover { opacity: 1; }
     .inl { display: flex; gap: 8px; align-items: center; }
     .inl input { flex: 1; min-width: 0; }
     .chk { display: flex; align-items: center; gap: 7px; font-size: 11.5px; color: var(--text-muted); }