From 629f85141f50fee8b05cdf8eb883c15e3862bc38 Mon Sep 17 00:00:00 2001
From: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s
 <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Date: Fri, 17 Jul 2026 12:24:57 -0700
Subject: [PATCH 1/5] Show unread state on collapsed sidebar sections

Co-authored-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Co-authored-by: SmartyPants <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Signed-off-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
---
 .../src/features/sidebar/ui/AppSidebar.tsx    |  23 +++-
 .../sidebar/ui/CustomChannelSection.tsx       |  32 +++++
 .../features/sidebar/ui/SidebarSection.tsx    |  13 +++
 desktop/tests/e2e/channels.spec.ts            | 110 ++++++++++++++++++
 4 files changed, 176 insertions(+), 2 deletions(-)

diff --git a/desktop/src/features/sidebar/ui/AppSidebar.tsx b/desktop/src/features/sidebar/ui/AppSidebar.tsx
index cf0e65bc7a..01cb789344 100644
--- a/desktop/src/features/sidebar/ui/AppSidebar.tsx
+++ b/desktop/src/features/sidebar/ui/AppSidebar.tsx
@@ -481,6 +481,15 @@ export function AppSidebar({
       ),
     [directMessages, dmChannelLabels, sortModeFor],
   );
+  const unassignedChannelsHaveUnread = sectionBuckets.unassigned.some(
+    (channel) => unreadChannelIds.has(channel.id),
+  );
+  const forumsHaveUnread = forumChannels.some((channel) =>
+    unreadChannelIds.has(channel.id),
+  );
+  const directMessagesHaveUnread = sortedDirectMessages.some((channel) =>
+    unreadChannelIds.has(channel.id),
+  );
   const sidebarLoadingShape = useSidebarLoadingShape({
     activeCommunityId: activeCommunity?.id,
     currentPubkey,
@@ -709,7 +718,7 @@ export function AppSidebar({
                     ))}
                     <ChannelGroupSection
                       draggable
-                      hasUnread={unreadChannelIds.size > 0}
+                      hasUnread={unassignedChannelsHaveUnread}
                       isCollapsed={collapsedGroups.channels}
                       isActiveChannel={selectedView === "channel"}
                       activeWorkingByChannelId={activeWorkingByChannelId}
@@ -749,7 +758,7 @@ export function AppSidebar({
                   <FeatureGate feature="forum">
                     <ChannelGroupSection
                       createLabel="New forum"
-                      hasUnread={unreadChannelIds.size > 0}
+                      hasUnread={forumsHaveUnread}
                       isCollapsed={collapsedGroups.forums}
                       isActiveChannel={selectedView === "channel"}
                       activeWorkingByChannelId={activeWorkingByChannelId}
@@ -787,6 +796,15 @@ export function AppSidebar({
                           sectionLabel="direct messages"
                           testId="section-actions-dms"
                           onOpenChange={setDmActionsMenuOpen}
+                          hasUnread={directMessagesHaveUnread}
+                          onMarkAllRead={() => {
+                            for (const channel of sortedDirectMessages) {
+                              onMarkChannelRead(
+                                channel.id,
+                                channel.lastMessageAt,
+                              );
+                            }
+                          }}
                           onNewMessage={onNewMessage}
                           sortMode={sortModeFor("dms")}
                           onSortModeChange={(mode) =>
@@ -796,6 +814,7 @@ export function AppSidebar({
                       </div>
                     }
                     dmParticipantsByChannelId={dmParticipantsByChannelId}
+                    hasUnread={directMessagesHaveUnread}
                     isCollapsed={collapsedGroups.directMessages}
                     isActiveChannel={selectedView === "channel"}
                     activeWorkingByChannelId={activeWorkingByChannelId}
diff --git a/desktop/src/features/sidebar/ui/CustomChannelSection.tsx b/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
index 2b266e887e..2960bceee3 100644
--- a/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
+++ b/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
@@ -288,8 +288,20 @@ export function SectionActionsMenu({
   );
 }
 
+function SectionUnreadIndicator({ testId }: { testId: string }) {
+  return (
+    <span
+      aria-hidden="true"
+      className="h-2 w-2 shrink-0 rounded-full bg-primary"
+      data-testid={testId}
+      title="Contains unread channels"
+    />
+  );
+}
+
 function ChannelSectionHeader({
   contentId,
+  hasUnread,
   isCollapsed,
   onToggleCollapsed,
   title,
@@ -297,6 +309,7 @@ function ChannelSectionHeader({
   actions,
 }: {
   contentId: string;
+  hasUnread?: boolean;
   isCollapsed: boolean;
   onToggleCollapsed: () => void;
   title: string;
@@ -315,6 +328,14 @@ function ChannelSectionHeader({
           type="button"
         >
           <span data-sidebar-section-title>{title}</span>
+          {isCollapsed && hasUnread ? (
+            <>
+              <SectionUnreadIndicator
+                testId={`${testId}-section-unread-indicator`}
+              />
+              <span className="sr-only">Contains unread channels</span>
+            </>
+          ) : null}
           <span aria-hidden="true" className={SECTION_LABEL_CHEVRON_CLASS}>
             <ChevronDown
               className={cn(
@@ -493,6 +514,7 @@ export function ChannelGroupSection({
     >
       <ChannelSectionHeader
         contentId={contentId}
+        hasUnread={hasUnread}
         isCollapsed={isCollapsed}
         onToggleCollapsed={onToggleCollapsed}
         title={title}
@@ -663,6 +685,16 @@ export function CustomChannelSection({
                       >
                         {section.name}
                       </span>
+                      {isCollapsed && hasUnread ? (
+                        <>
+                          <SectionUnreadIndicator
+                            testId={`section-unread-indicator-${section.id}`}
+                          />
+                          <span className="sr-only">
+                            Contains unread channels
+                          </span>
+                        </>
+                      ) : null}
                       <span
                         aria-hidden="true"
                         className={SECTION_LABEL_CHEVRON_CLASS}
diff --git a/desktop/src/features/sidebar/ui/SidebarSection.tsx b/desktop/src/features/sidebar/ui/SidebarSection.tsx
index 3e39c60a6d..66accae914 100644
--- a/desktop/src/features/sidebar/ui/SidebarSection.tsx
+++ b/desktop/src/features/sidebar/ui/SidebarSection.tsx
@@ -343,6 +343,7 @@ export function SidebarSection({
   emptyState,
   items,
   channelLabels,
+  hasUnread = false,
   isCollapsed,
   isActiveChannel,
   presenceByChannelId,
@@ -367,6 +368,7 @@ export function SidebarSection({
   emptyState?: React.ReactNode;
   items: Channel[];
   channelLabels?: Record<string, string>;
+  hasUnread?: boolean;
   isCollapsed?: boolean;
   isActiveChannel: boolean;
   presenceByChannelId?: Record<string, PresenceStatus>;
@@ -412,6 +414,17 @@ export function SidebarSection({
               type="button"
             >
               <span data-sidebar-section-title>{title}</span>
+              {isCollapsed && hasUnread ? (
+                <>
+                  <span
+                    aria-hidden="true"
+                    className="h-2 w-2 shrink-0 rounded-full bg-primary"
+                    data-testid={`${testId}-section-unread-indicator`}
+                    title="Contains unread channels"
+                  />
+                  <span className="sr-only">Contains unread channels</span>
+                </>
+              ) : null}
               <span aria-hidden="true" className={SECTION_LABEL_CHEVRON_CLASS}>
                 <ChevronDown
                   className={cn(
diff --git a/desktop/tests/e2e/channels.spec.ts b/desktop/tests/e2e/channels.spec.ts
index 2186c727e6..7f14364165 100644
--- a/desktop/tests/e2e/channels.spec.ts
+++ b/desktop/tests/e2e/channels.spec.ts
@@ -10,6 +10,7 @@ import {
 } from "../helpers/bridge";
 
 const GENERAL_CHANNEL_ID = "9a1657ac-f7aa-5db0-b632-d8bbeb6dfb50";
+const RANDOM_CHANNEL_ID = "9dae0116-799b-5071-a0a8-fdd30a91a35d";
 const AGENTS_CHANNEL_ID = "94a444a4-c0a3-5966-ab05-530c6ddc2301";
 const MOCK_IDENTITY_PUBKEY = "deadbeef".repeat(8);
 // Relay-only agent owned by the mock viewer (see e2eBridge.ts
@@ -2082,6 +2083,115 @@ test("typing indicator shows avatars and maintains stable name order", async ({
   ).toContainText("alice and bob are typing");
 });
 
+test("collapsed custom section surfaces hidden unread state and mark-all clears it", async ({
+  page,
+}, testInfo) => {
+  const sectionId = "unread-section";
+  await page.addInitScript(
+    ({ channelId, pubkey, sectionId }) => {
+      window.localStorage.setItem(
+        `buzz-channel-sections.v1:${pubkey}`,
+        JSON.stringify({
+          version: 1,
+          sections: [
+            { id: sectionId, name: "Important", icon: "🔔", order: 0 },
+          ],
+          assignments: { [channelId]: sectionId },
+        }),
+      );
+    },
+    {
+      channelId: RANDOM_CHANNEL_ID,
+      pubkey: MOCK_IDENTITY_PUBKEY,
+      sectionId,
+    },
+  );
+
+  await page.goto("/");
+  await waitForMockLiveSubscription(page, "random");
+
+  const sectionLabel = page
+    .getByTestId(`section-title-${sectionId}`)
+    .locator("..");
+  await sectionLabel.click();
+  await expect(sectionLabel).toHaveAttribute("aria-expanded", "false");
+  await expect(page.getByTestId("channel-random")).toHaveCount(0);
+  await expect(
+    page.getByTestId(`section-unread-indicator-${sectionId}`),
+  ).toHaveCount(0);
+
+  await page.evaluate((pubkey) => {
+    window.__BUZZ_E2E_EMIT_MOCK_MESSAGE__?.({
+      channelName: "random",
+      content: "Hidden unread update for Important",
+      kind: 40002,
+      pubkey,
+    });
+  }, TEST_IDENTITIES.alice.pubkey);
+
+  const sectionUnread = page.getByTestId(
+    `section-unread-indicator-${sectionId}`,
+  );
+  await expect(sectionUnread).toBeVisible();
+  await expect(sectionLabel).toHaveAccessibleName(
+    "Important Contains unread channels",
+  );
+  await page.screenshot({
+    path: testInfo.outputPath("collapsed-custom-section-unread.png"),
+  });
+
+  await sectionLabel.hover();
+  await page.getByTestId(`section-actions-${sectionId}`).click();
+  await page.getByRole("menuitem", { name: "Mark all as read" }).click();
+  await expect(sectionUnread).toHaveCount(0);
+
+  await sectionLabel.click();
+  await expect(sectionLabel).toHaveAttribute("aria-expanded", "true");
+  await expect(page.getByTestId("channel-random")).toBeVisible();
+});
+
+test("collapsed built-in sections show only their own unread state", async ({
+  page,
+}, testInfo) => {
+  await page.goto("/");
+  await waitForMockLiveSubscription(page, "random");
+
+  // The shared mock fixture seeds older unread activity. Clear it so this test
+  // isolates the live event below rather than depending on fixture history.
+  await page.getByTestId("section-actions-channels").click();
+  await page.getByRole("menuitem", { name: "Mark all as read" }).click();
+  await expect(page.getByTestId("channel-unread-random")).toHaveCount(0);
+
+  const channelsLabel = page.getByTestId("stream-list-section-label");
+  const forumsLabel = page.getByTestId("forum-list-section-label");
+  const dmLabel = page.getByTestId("dm-list-section-label");
+  await channelsLabel.click();
+  await forumsLabel.click();
+  await dmLabel.click();
+
+  await page.evaluate((pubkey) => {
+    window.__BUZZ_E2E_EMIT_MOCK_MESSAGE__?.({
+      channelName: "random",
+      content: "Unread update scoped to Channels",
+      kind: 40002,
+      pubkey,
+    });
+  }, TEST_IDENTITIES.alice.pubkey);
+
+  await expect(
+    page.getByTestId("stream-list-section-unread-indicator"),
+  ).toBeVisible();
+  await expect(
+    page.getByTestId("forum-list-section-unread-indicator"),
+  ).toHaveCount(0);
+  await expect(
+    page.getByTestId("dm-list-section-unread-indicator"),
+  ).toHaveCount(0);
+  await page.screenshot({
+    path: testInfo.outputPath("collapsed-built-in-section-unread.png"),
+  });
+});
+
 test("sidebar shows unread indicator for newly active channels", async ({
   page,
 }) => {

From 30d5ac527081d7bc6490686b770e434fd261059f Mon Sep 17 00:00:00 2001
From: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s
 <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Date: Fri, 17 Jul 2026 12:55:49 -0700
Subject: [PATCH 2/5] Scope section read actions and strengthen coverage

Co-authored-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Co-authored-by: SmartyPants <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Signed-off-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
---
 desktop/src/app/AppShell.tsx                  |  1 -
 .../src/features/sidebar/ui/AppSidebar.tsx    | 14 +++--
 desktop/tests/e2e/channels.spec.ts            | 51 ++++++++++++++++++-
 3 files changed, 59 insertions(+), 7 deletions(-)

diff --git a/desktop/src/app/AppShell.tsx b/desktop/src/app/AppShell.tsx
index 5b65584e8c..c79e243762 100644
--- a/desktop/src/app/AppShell.tsx
+++ b/desktop/src/app/AppShell.tsx
@@ -865,7 +865,6 @@ export function AppShell() {
                           onCreateChannel={handleCreateChannel}
                           onCreateForum={handleCreateForum}
                           onHideDm={handleHideDm}
-                          onMarkAllChannelsRead={markAllChannelsRead}
                           onMarkChannelRead={markChannelRead}
                           onMarkChannelUnread={markChannelUnread}
                           onBrowseChannels={handleOpenBrowseChannels}
diff --git a/desktop/src/features/sidebar/ui/AppSidebar.tsx b/desktop/src/features/sidebar/ui/AppSidebar.tsx
index 01cb789344..130e44fa30 100644
--- a/desktop/src/features/sidebar/ui/AppSidebar.tsx
+++ b/desktop/src/features/sidebar/ui/AppSidebar.tsx
@@ -130,7 +130,6 @@ type AppSidebarProps = {
     channelId: string,
     lastMessageAt: string | null | undefined,
   ) => void;
-  onMarkAllChannelsRead: () => void;
   onBrowseChannels?: (onCreated?: (channelId: string) => void) => void;
   onOpenDm: (input: { pubkeys: string[] }) => Promise<void>;
   onUpdateCommunity: (
@@ -200,7 +199,6 @@ export function AppSidebar({
   onHideDm,
   onMarkChannelUnread,
   onMarkChannelRead,
-  onMarkAllChannelsRead,
   onBrowseChannels,
   onOpenDm,
   onUpdateCommunity,
@@ -732,7 +730,11 @@ export function AppSidebar({
                       quickCreateLabel="Add channel"
                       onQuickCreateClick={onBrowseChannels}
                       showQuickCreate
-                      onMarkAllRead={onMarkAllChannelsRead}
+                      onMarkAllRead={() => {
+                        for (const channel of sectionBuckets.unassigned) {
+                          onMarkChannelRead(channel.id, channel.lastMessageAt);
+                        }
+                      }}
                       onMarkChannelRead={onMarkChannelRead}
                       onMarkChannelUnread={onMarkChannelUnread}
                       onSelectChannel={onSelectChannel}
@@ -770,7 +772,11 @@ export function AppSidebar({
                       actionsTestId="section-actions-forums"
                       listTestId="forum-list"
                       onCreateClick={() => openCreateDialog("forum")}
-                      onMarkAllRead={onMarkAllChannelsRead}
+                      onMarkAllRead={() => {
+                        for (const channel of forumChannels) {
+                          onMarkChannelRead(channel.id, channel.lastMessageAt);
+                        }
+                      }}
                       onMarkChannelRead={onMarkChannelRead}
                       onMarkChannelUnread={onMarkChannelUnread}
                       onSelectChannel={onSelectChannel}
diff --git a/desktop/tests/e2e/channels.spec.ts b/desktop/tests/e2e/channels.spec.ts
index 7f14364165..63daf35e89 100644
--- a/desktop/tests/e2e/channels.spec.ts
+++ b/desktop/tests/e2e/channels.spec.ts
@@ -2138,8 +2138,22 @@ test("collapsed custom section surfaces hidden unread state and mark-all clears
   );
   await page.screenshot({
     path: testInfo.outputPath("collapsed-custom-section-unread.png"),
+    clip: { x: 0, y: 0, width: 300, height: 720 },
   });
 
+  // Expanded sections rely on their channel rows, so the header signal must
+  // disappear instead of duplicating unread state.
+  await sectionLabel.click();
+  await expect(sectionLabel).toHaveAttribute("aria-expanded", "true");
+  await expect(sectionUnread).toHaveCount(0);
+  await expect(page.getByTestId("channel-random")).toHaveCSS(
+    "font-weight",
+    "600",
+  );
+  await sectionLabel.click();
+  await expect(sectionLabel).toHaveAttribute("aria-expanded", "false");
+  await expect(sectionUnread).toBeVisible();
+
   await sectionLabel.hover();
   await page.getByTestId(`section-actions-${sectionId}`).click();
   await page.getByRole("menuitem", { name: "Mark all as read" }).click();
@@ -2156,10 +2170,17 @@ test("collapsed built-in sections show only their own unread state", async ({
   await page.goto("/");
   await waitForMockLiveSubscription(page, "random");
 
-  // The shared mock fixture seeds older unread activity. Clear it so this test
-  // isolates the live event below rather than depending on fixture history.
+  // The shared mock fixture seeds older unread activity. Clear each rendered
+  // built-in group so this test isolates the live events below.
   await page.getByTestId("section-actions-channels").click();
   await page.getByRole("menuitem", { name: "Mark all as read" }).click();
+  await page.getByTestId("section-actions-forums").click();
+  const forumMarkAll = page.getByRole("menuitem", { name: "Mark all as read" });
+  if ((await forumMarkAll.count()) > 0) {
+    await forumMarkAll.click();
+  } else {
+    await page.keyboard.press("Escape");
+  }
   await expect(page.getByTestId("channel-unread-random")).toHaveCount(0);
 
   const channelsLabel = page.getByTestId("stream-list-section-label");
@@ -2189,7 +2210,33 @@ test("collapsed built-in sections show only their own unread state", async ({
   ).toHaveCount(0);
   await page.screenshot({
     path: testInfo.outputPath("collapsed-built-in-section-unread.png"),
+    clip: { x: 0, y: 0, width: 300, height: 720 },
   });
+
+  await page.getByTestId("section-actions-channels").click();
+  await page.getByRole("menuitem", { name: "Mark all as read" }).click();
+  await expect(
+    page.getByTestId("stream-list-section-unread-indicator"),
+  ).toHaveCount(0);
+
+  await waitForMockLiveSubscription(page, "alice-tyler");
+  await page.evaluate((pubkey) => {
+    window.__BUZZ_E2E_EMIT_MOCK_MESSAGE__?.({
+      channelName: "alice-tyler",
+      content: "Unread update scoped to Direct messages",
+      pubkey,
+    });
+  }, TEST_IDENTITIES.alice.pubkey);
+
+  await expect(
+    page.getByTestId("dm-list-section-unread-indicator"),
+  ).toBeVisible();
+  await expect(
+    page.getByTestId("stream-list-section-unread-indicator"),
+  ).toHaveCount(0);
+  await expect(
+    page.getByTestId("forum-list-section-unread-indicator"),
+  ).toHaveCount(0);
 });
 
 test("sidebar shows unread indicator for newly active channels", async ({

From 8b661c6e6d8a02009a0875edb3784f121845c24e Mon Sep 17 00:00:00 2001
From: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s
 <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Date: Fri, 17 Jul 2026 13:26:41 -0700
Subject: [PATCH 3/5] Wait for sidebar animations before screenshots

Co-authored-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Co-authored-by: SmartyPants <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>

Signed-off-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
---
 desktop/tests/e2e/channels.spec.ts | 4 ++++
 1 file changed, 4 insertions(+)

diff --git a/desktop/tests/e2e/channels.spec.ts b/desktop/tests/e2e/channels.spec.ts
index 63daf35e89..5f8a78290c 100644
--- a/desktop/tests/e2e/channels.spec.ts
+++ b/desktop/tests/e2e/channels.spec.ts
@@ -1,5 +1,7 @@
 import { expect, test } from "@playwright/test";
 
+import { waitForAnimations } from "../helpers/animations";
+
 import { KIND_TYPING_INDICATOR } from "../../src/shared/constants/kinds";
 import {
   TEST_IDENTITIES,
@@ -2136,6 +2138,7 @@ test("collapsed custom section surfaces hidden unread state and mark-all clears
   await expect(sectionLabel).toHaveAccessibleName(
     "Important Contains unread channels",
   );
+  await waitForAnimations(page);
   await page.screenshot({
     path: testInfo.outputPath("collapsed-custom-section-unread.png"),
     clip: { x: 0, y: 0, width: 300, height: 720 },
@@ -2208,6 +2211,7 @@ test("collapsed built-in sections show only their own unread state", async ({
   await expect(
     page.getByTestId("dm-list-section-unread-indicator"),
   ).toHaveCount(0);
+  await waitForAnimations(page);
   await page.screenshot({
     path: testInfo.outputPath("collapsed-built-in-section-unread.png"),
     clip: { x: 0, y: 0, width: 300, height: 720 },

From 898027de045df894679a4b7a667a5d8f13035480 Mon Sep 17 00:00:00 2001
From: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s
 <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Date: Fri, 17 Jul 2026 13:48:45 -0700
Subject: [PATCH 4/5] Refine section unread indicator sizing

Co-authored-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Co-authored-by: SmartyPants <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Signed-off-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
---
 desktop/src/features/sidebar/ui/CustomChannelSection.tsx | 2 +-
 desktop/src/features/sidebar/ui/SidebarSection.tsx       | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/desktop/src/features/sidebar/ui/CustomChannelSection.tsx b/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
index 2960bceee3..470e1c142a 100644
--- a/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
+++ b/desktop/src/features/sidebar/ui/CustomChannelSection.tsx
@@ -292,7 +292,7 @@ function SectionUnreadIndicator({ testId }: { testId: string }) {
   return (
     <span
       aria-hidden="true"
-      className="h-2 w-2 shrink-0 rounded-full bg-primary"
+      className="ml-0.5 size-1.5 shrink-0 rounded-full bg-primary"
       data-testid={testId}
       title="Contains unread channels"
     />
diff --git a/desktop/src/features/sidebar/ui/SidebarSection.tsx b/desktop/src/features/sidebar/ui/SidebarSection.tsx
index 66accae914..527ac3f0d7 100644
--- a/desktop/src/features/sidebar/ui/SidebarSection.tsx
+++ b/desktop/src/features/sidebar/ui/SidebarSection.tsx
@@ -418,7 +418,7 @@ export function SidebarSection({
                 <>
                   <span
                     aria-hidden="true"
-                    className="h-2 w-2 shrink-0 rounded-full bg-primary"
+                    className="ml-0.5 size-1.5 shrink-0 rounded-full bg-primary"
                     data-testid={`${testId}-section-unread-indicator`}
                     title="Contains unread channels"
                   />

From 7085f87b6750401def6ad013ab55c2b6860f0e31 Mon Sep 17 00:00:00 2001
From: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s
 <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Date: Fri, 17 Jul 2026 14:50:40 -0700
Subject: [PATCH 5/5] Seed custom sections before mock bridge setup

Co-authored-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Co-authored-by: SmartyPants <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
Signed-off-by: npub1yqxl8fhpqxfzquefhxee324mskczp6ygqftu6kvrt3hp4x2fzntqvmcw9s <200df3a6e10192207329b9b398aabb85b020e8880257cd59835c6e1a994914d6@sprout-oss.stage.blox.sqprod.co>
---
 desktop/tests/e2e/channels.spec.ts | 52 ++++++++++++++++--------------
 1 file changed, 28 insertions(+), 24 deletions(-)

diff --git a/desktop/tests/e2e/channels.spec.ts b/desktop/tests/e2e/channels.spec.ts
index 5f8a78290c..b5111873fc 100644
--- a/desktop/tests/e2e/channels.spec.ts
+++ b/desktop/tests/e2e/channels.spec.ts
@@ -15,6 +15,9 @@ const GENERAL_CHANNEL_ID = "9a1657ac-f7aa-5db0-b632-d8bbeb6dfb50";
 const RANDOM_CHANNEL_ID = "9dae0116-799b-5071-a0a8-fdd30a91a35d";
 const AGENTS_CHANNEL_ID = "94a444a4-c0a3-5966-ab05-530c6ddc2301";
 const MOCK_IDENTITY_PUBKEY = "deadbeef".repeat(8);
+const COLLAPSED_CUSTOM_SECTION_TEST =
+  "collapsed custom section surfaces hidden unread state and mark-all clears it";
+const UNREAD_SECTION_ID = "unread-section";
 // Relay-only agent owned by the mock viewer (see e2eBridge.ts
 // OWNED_RELAY_AGENT_PUBKEY). Classified as a bot via mockRelayAgents and
 // owned-by-viewer via its mockProfiles owner_pubkey, so the sidebar
@@ -468,7 +471,29 @@ async function expectIntroActionsShareRow(
   }
 }
 
-test.beforeEach(async ({ page }) => {
+test.beforeEach(async ({ page }, testInfo) => {
+  if (testInfo.title === COLLAPSED_CUSTOM_SECTION_TEST) {
+    await page.addInitScript(
+      ({ channelId, pubkey, sectionId }) => {
+        window.localStorage.setItem(
+          `buzz-channel-sections.v1:${pubkey}`,
+          JSON.stringify({
+            version: 1,
+            sections: [
+              { id: sectionId, name: "Important", icon: "🔔", order: 0 },
+            ],
+            assignments: { [channelId]: sectionId },
+          }),
+        );
+      },
+      {
+        channelId: RANDOM_CHANNEL_ID,
+        pubkey: MOCK_IDENTITY_PUBKEY,
+        sectionId: UNREAD_SECTION_ID,
+      },
+    );
+  }
+
   await installMockBridge(page);
 });
 
@@ -2085,29 +2110,8 @@ test("typing indicator shows avatars and maintains stable name order", async ({
   ).toContainText("alice and bob are typing");
 });
 
-test("collapsed custom section surfaces hidden unread state and mark-all clears it", async ({
-  page,
-}, testInfo) => {
-  const sectionId = "unread-section";
-  await page.addInitScript(
-    ({ channelId, pubkey, sectionId }) => {
-      window.localStorage.setItem(
-        `buzz-channel-sections.v1:${pubkey}`,
-        JSON.stringify({
-          version: 1,
-          sections: [
-            { id: sectionId, name: "Important", icon: "🔔", order: 0 },
-          ],
-          assignments: { [channelId]: sectionId },
-        }),
-      );
-    },
-    {
-      channelId: RANDOM_CHANNEL_ID,
-      pubkey: MOCK_IDENTITY_PUBKEY,
-      sectionId,
-    },
-  );
+test(COLLAPSED_CUSTOM_SECTION_TEST, async ({ page }, testInfo) => {
+  const sectionId = UNREAD_SECTION_ID;
 
   await page.goto("/");
   await waitForMockLiveSubscription(page, "random");