shared playlists: a follow with news says so through a toast, and a follower's rows keep the owner's catalog ids

src/App.svelte

@@ -27,6 +27,7 @@
     import ResolverToast from "./components/ResolverToast.svelte";
     import UploadToast from "./components/UploadToast.svelte";
     import ProposalToast from "./components/ProposalToast.svelte";
+    import FollowNewsToast from "./components/FollowNewsToast.svelte";
     import SetlistScanChip from "./components/SetlistScanChip.svelte";
     import {
         ui,
@@ -186,6 +187,7 @@
     <ResolverToast />
     <UploadToast />
     <ProposalToast />
+    <FollowNewsToast />
     <SetlistScanChip />
     <PreviewOverlay />
     <LyricsSyncEditor />

src/components/FollowNewsToast.svelte

@@ -0,0 +1,123 @@
+<script>
+    // A playlist this device follows has news. The follow poll runs every
+    // ten minutes without a word, and its Inbox card is only on the Inbox,
+    // so the owner's new tracks would otherwise arrive in silence — the
+    // same gap the proposal toast closes for the board. Same slot, pill and
+    // motion; like that toast, several playlists inside the window count up
+    // in one pill rather than stacking.
+    import Icon from "./Icon.svelte";
+    import { followNewsToast } from "../lib/state.svelte.js";
+
+    const HOLD_MS = 4200;
+    const LEAVE_MS = 280;
+
+    const line = $derived.by(() => {
+        const t = followNewsToast;
+        const tracks = (n) => `${n} new ${n === 1 ? "track" : "tracks"}`;
+        if (t.count > 1) return { lead: `${t.count} playlists you follow`, rest: " have new tracks" };
+        if (t.added) return { lead: t.name, rest: `: ${tracks(t.added)} since you imported it${t.removed ? ` · ${t.removed} removed` : ""}` };
+        return { lead: t.name, rest: `: the owner removed ${t.removed} ${t.removed === 1 ? "track" : "tracks"}` };
+    });
+
+    let shown = $state(false);
+    let leaving = $state(false);
+    let holdTimer = 0;
+    let leaveTimer = 0;
+
+    $effect(() => {
+        const seq = followNewsToast.seq;
+        if (!seq) return;
+        clearTimeout(holdTimer);
+        clearTimeout(leaveTimer);
+        leaving = false;
+        shown = true;
+        holdTimer = setTimeout(() => {
+            leaving = true;
+            leaveTimer = setTimeout(() => {
+                shown = false;
+                leaving = false;
+            }, LEAVE_MS);
+        }, HOLD_MS);
+        return () => {
+            clearTimeout(holdTimer);
+            clearTimeout(leaveTimer);
+        };
+    });
+</script>
+
+{#if shown}
+    <div class="layer" aria-live="polite">
+        <div class="toast" class:leaving>
+            <span class="mark"><Icon name="playlist" size={14} /></span>
+            <span class="text"><b>{line.lead}</b>{line.rest}</span>
+        </div>
+    </div>
+{/if}
+
+<style>
+    /* The shared toast slot — UploadToast's geometry verbatim. */
+    .layer {
+        position: fixed;
+        left: 0;
+        right: 0;
+        bottom: calc(var(--player-height, 62px) + 8px + 26px);
+        display: flex;
+        justify-content: center;
+        z-index: 80;
+        pointer-events: none;
+    }
+    .toast {
+        display: inline-flex;
+        align-items: center;
+        gap: 10px;
+        max-width: min(70vw, 560px);
+        padding: 9px 16px;
+        border-radius: 99px;
+        background: rgba(22, 23, 28, 0.94);
+        border: 1px solid rgba(255, 255, 255, 0.12);
+        backdrop-filter: blur(14px);
+        -webkit-backdrop-filter: blur(14px);
+        box-shadow: 0 14px 34px rgba(0, 0, 0, 0.55);
+        font-size: 12.5px;
+        font-weight: 700;
+        color: #fff;
+        animation: toast-in 340ms cubic-bezier(0.22, 1, 0.36, 1) both;
+    }
+    .toast.leaving {
+        animation: toast-out 260ms ease both;
+    }
+    @keyframes toast-in {
+        from {
+            opacity: 0;
+            transform: translateY(16px) scale(0.95);
+        }
+        to {
+            opacity: 1;
+            transform: none;
+        }
+    }
+    @keyframes toast-out {
+        to {
+            opacity: 0;
+            transform: translateY(12px) scale(0.97);
+        }
+    }
+    .mark {
+        display: inline-flex;
+        color: var(--accent);
+    }
+    .text {
+        white-space: nowrap;
+        overflow: hidden;
+        text-overflow: ellipsis;
+    }
+    b {
+        font-weight: 800;
+    }
+    @media (prefers-reduced-motion: reduce) {
+        .toast,
+        .toast.leaving {
+            animation-duration: 1ms;
+        }
+    }
+</style>

src/lib/community.svelte.js

@@ -8,7 +8,7 @@
 // <time>", never "online"; and the adapter's states are named for what they
 // are (node stopped, incompatible, connecting), never softened.
 import * as api from "./api.js";
-import { announceProposal } from "./state.svelte.js";
+import { announceProposal, announceFollowNews } from "./state.svelte.js";
 
 const LS_SEEN = "community.lastSeen";
 const LS_FAVS = "community.roomFavs";
@@ -401,7 +401,10 @@ export async function startInboxWatch() {
 }
 
 /** One pass over the followed playlists, quiet like the inbox poll: the
- *  backend logs what it found, and a card appears only when there is news. */
+ *  backend logs what it found, a card appears only when there is news, and
+ *  the news itself is the one thing that speaks — a toast per playlist the
+ *  owner changed by rows. Only the poll announces: Check now on the share
+ *  sheet reports in place, where the person is already looking. */
 async function pollFollows() {
     if (checkingFollows || community.busy["followcheck"]) return;
     checkingFollows = true;
@@ -409,8 +412,9 @@ async function pollFollows() {
         if (!adapterConnected(community.freenet?.status)) return;
         await refreshFollowing();
         if (!community.following.length) return;
-        await api.sharedPlaylistsCheck();
+        const r = await api.sharedPlaylistsCheck();
         await refreshFollowing();
+        for (const n of r?.news ?? []) announceFollowNews(n.name, n.added, n.removed);
     } catch {
         // Never surfaces; the Check now button is the one that reports.
     } finally {

src/lib/state.svelte.js

@@ -256,6 +256,30 @@ export function announceProposal(from, playlist) {
     proposalToast.seq += 1;
 }
 
+/** A playlist this device follows has news (FollowNewsToast): the owner's
+ *  revision added rows, or dropped some. The follow poll runs every ten
+ *  minutes in silence and the Inbox card only shows when the page is open,
+ *  so without this a new track arrives unannounced. One poll can find news
+ *  on several follows at once: a second playlist inside the window counts
+ *  up ("3 playlists have new tracks") the way a burst of proposals does,
+ *  and the same playlist again just replaces its line. */
+export const followNewsToast = $state({ seq: 0, name: "", added: 0, removed: 0, count: 0 });
+const FOLLOW_NEWS_TOAST_WINDOW_MS = 8000;
+let followNewsToastAt = 0;
+let followNewsToastNames = new Set();
+
+export function announceFollowNews(name, added, removed) {
+    const now = Date.now();
+    if (now - followNewsToastAt >= FOLLOW_NEWS_TOAST_WINDOW_MS) followNewsToastNames = new Set();
+    followNewsToastNames.add(name);
+    followNewsToast.count = followNewsToastNames.size;
+    followNewsToast.name = name;
+    followNewsToast.added = added;
+    followNewsToast.removed = removed;
+    followNewsToastAt = now;
+    followNewsToast.seq += 1;
+}
+
 /** Background-import status, read by ImportToast. The import window keeps
  *  scanning/copying after it is closed (the component stays mounted, only
  *  its template goes), and closed must never mean invisible: while work
@@ -7809,6 +7833,7 @@ if (import.meta.env.DEV) {
         playlistStore, refreshPlaylists, goToView, peekNextIndices,
         slsk, search, runSearch, uploadToast, announceUpload,
         proposalToast, announceProposal,
+        followNewsToast, announceFollowNews,
         searchTabs, selectSearchTab, closeSearchTab, filesForGroup,
         downloads, network, sendDm, openChat,
     };