fix(web): improve sidebar and minimap indicator legibility

apps/web/src/components/LegacySidebar.tsx

@@ -909,11 +909,7 @@ export const SidebarThreadRow = memo(function SidebarThreadRow(props: SidebarThr
               >
                 <span
                   data-legacy-sidebar-unscaled-content
-                  className={
-                    props.compactStatusIndicators
-                      ? "size-[9px] rounded-full bg-yellow-500 dark:bg-yellow-300"
-                      : "size-1.5 rounded-full bg-yellow-500 dark:bg-yellow-300"
-                  }
+                  className="size-1.5 rounded-full bg-yellow-500 dark:bg-yellow-300"
                 />
               </TooltipTrigger>
               <TooltipPopup side="top">Waiting for {thread.actionResume.actionName}</TooltipPopup>

apps/web/src/components/Sidebar.tsx

@@ -628,7 +628,6 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
   environmentLabel: string | null;
   environmentKnown: boolean;
   showLocalEnvironmentIcon: boolean;
-  showWorktreeIndicators: boolean;
   configuredEnvironmentIconColor: EnvironmentIconColor | undefined;
   projectCwd: string | null;
   projectFaviconPath: string | null;
@@ -1622,9 +1621,7 @@ const SidebarThreadRow = memo(function SidebarThreadRow(props: {
                   branch, so the row lost its most stable identifier. */}
               {thread.branch ? (
                 <>
-                  {props.showWorktreeIndicators ? (
-                    <ThreadWorktreeIndicator thread={thread} />
-                  ) : null}
+                  <ThreadWorktreeIndicator thread={thread} />
                   <span className="min-w-0 flex-1 truncate whitespace-nowrap">{thread.branch}</span>
                 </>
               ) : (
@@ -1826,7 +1823,6 @@ export default function Sidebar() {
   const projectGroupingSettings = useClientSettings(selectProjectGroupingSettings);
   const environmentIconColors = useClientSettings((s) => s.environmentIconColors);
   const showLocalEnvironmentIcon = useClientSettings((s) => s.showLocalEnvironmentIcon);
-  const showWorktreeIndicators = useClientSettings((s) => s.showThreadWorktreeIndicators);
   const {
     settleThread,
     unsettleThread,
@@ -3878,7 +3874,6 @@ export default function Sidebar() {
                         environmentLabel={environmentLabelById.get(thread.environmentId) ?? null}
                         environmentKnown={environmentLabelById.has(thread.environmentId)}
                         showLocalEnvironmentIcon={showLocalEnvironmentIcon}
-                        showWorktreeIndicators={showWorktreeIndicators}
                         configuredEnvironmentIconColor={environmentIconColors[thread.environmentId]}
                         projectCwd={
                           projectCwdByKey.get(`${thread.environmentId}:${thread.projectId}`) ?? null

apps/web/src/components/ThreadStatusIndicators.test.tsx

@@ -2,7 +2,25 @@ import { ThreadId } from "@t3tools/contracts";
 import { renderToStaticMarkup } from "react-dom/server";
 import { describe, expect, it } from "vite-plus/test";
 
-import { ThreadWorktreeIndicator } from "./ThreadStatusIndicators";
+import { ThreadStatusLabel, ThreadWorktreeIndicator } from "./ThreadStatusIndicators";
+
+describe("ThreadStatusLabel", () => {
+  it("keeps the status dot the same size when labels are compacted", () => {
+    const status = {
+      colorClass: "text-sky-600",
+      dotClass: "bg-sky-500",
+      label: "Working",
+      pulse: false,
+    };
+
+    const expandedMarkup = renderToStaticMarkup(<ThreadStatusLabel status={status} />);
+    const compactMarkup = renderToStaticMarkup(<ThreadStatusLabel status={status} compact />);
+
+    expect(expandedMarkup).toContain("size-1.5");
+    expect(compactMarkup).toContain("size-1.5");
+    expect(compactMarkup).not.toContain("size-[9px]");
+  });
+});
 
 describe("ThreadWorktreeIndicator", () => {
   it("renders the worktree folder and branch in an accessible label", () => {

apps/web/src/components/ThreadStatusIndicators.tsx

@@ -369,7 +369,7 @@ export function ThreadStatusLabel({
         >
           <span
             data-legacy-sidebar-unscaled-content
-            className={`size-[9px] rounded-full ${status.dotClass} ${
+            className={`size-1.5 rounded-full ${status.dotClass} ${
               status.pulse ? "animate-status-pulse" : ""
             }`}
           />
@@ -391,7 +391,7 @@ export function ThreadStatusLabel({
       >
         <span
           data-legacy-sidebar-unscaled-content
-          className={`h-1.5 w-1.5 rounded-full ${status.dotClass} ${
+          className={`size-1.5 rounded-full ${status.dotClass} ${
             status.pulse ? "animate-status-pulse" : ""
           }`}
         />

apps/web/src/components/chat/MessagesTimeline.test.tsx

@@ -391,6 +391,7 @@ describe("MessagesTimeline", () => {
 
     expect(markup).toContain('data-testid="timeline-minimap"');
     expect(markup).toContain("data-thread-annotation-marker");
+    expect(markup).toContain('data-slot="popover-trigger"');
     expect(markup).toContain("[@media(pointer:coarse)]:block");
     expect(markup).toContain("[@media(pointer:coarse)]:opacity-100");
     expect(markup).not.toContain("data-thread-annotation-overflow");
@@ -413,6 +414,7 @@ describe("MessagesTimeline", () => {
 
     expect(markup).toContain("data-thread-annotation-overflow");
     expect(markup).toContain('aria-label="Annotation attached to an earlier message"');
+    expect(markup).toContain('data-slot="popover-trigger"');
     expect(markup).toContain('class="pointer-events-auto absolute left-3"');
     expect(markup).not.toContain("data-thread-annotation-marker");
   });