fix(web-ui): show the scheduled job mark on session rows only

src/web-ui/src/app/components/NavPanel/sections/sessions/SessionStatusIndicator.tsx

@@ -1,4 +1,4 @@
-import { memo } from 'react';
+import { memo, type ReactNode } from 'react';
 import { Icon } from '@openbitfun/ui';
 import { CircleAlert, CircleCheck, CirclePause, CircleStop, CloudOff, Hand, Loader2, MessageCircleQuestion } from 'lucide-react';
 import { useI18n } from '@/infrastructure/i18n';
@@ -17,7 +17,18 @@ const presentation = {
   syncing: { glyph: CloudOff, tone: 'secondary', label: 'nav.sessions.status.syncing' },
 } as const;
 
-export const SessionStatusIndicator = memo(function SessionStatusIndicator({ sessionId }: { sessionId: string }) {
+export const SessionStatusIndicator = memo(function SessionStatusIndicator({
+  sessionId,
+  idleFallback,
+}: {
+  sessionId: string;
+  /**
+   * Rendered in the same trailing cell while the session has nothing to report,
+   * so a second row mark can sit on the row's right edge without claiming a
+   * second cell. The cell still yields to the row menu on hover or focus.
+   */
+  idleFallback?: ReactNode;
+}) {
   const { t } = useI18n('common');
   const status = useSessionNavStatus(sessionId);
   const appearance = status.kind === 'idle' ? null : presentation[status.kind];
@@ -27,6 +38,14 @@ export const SessionStatusIndicator = memo(function SessionStatusIndicator({ ses
       : t(appearance.label)
     : '';
 
+  if (!appearance && idleFallback) {
+    return (
+      <span className="session-status-indicator openbitfun-nav-panel__inline-item-status">
+        {idleFallback}
+      </span>
+    );
+  }
+
   return appearance ? (
     <span
       className="session-status-indicator openbitfun-nav-panel__inline-item-status"

src/web-ui/src/app/components/NavPanel/sections/sessions/SessionsSection.scss

@@ -361,22 +361,6 @@
     }
   }
 
-  &__inline-item-cron-badge {
-    flex: 0 0 auto;
-    display: inline-flex;
-    align-items: center;
-    gap: 3px;
-    height: 14px;
-    padding: 0 5px;
-    border: 1px solid var(--openbitfun-color-border-subtle);
-    border-radius: 999px;
-    background: var(--openbitfun-color-action-quiet-hover);
-    color: var(--openbitfun-color-content-secondary);
-    font-size: var(--openbitfun-type-micro-font-size);
-    font-weight: var(--openbitfun-type-label-selected-font-weight);
-    white-space: nowrap;
-  }
-
   &__inline-item-background-subagent-badge {
     flex: 0 0 auto;
     position: relative;

src/web-ui/src/app/components/NavPanel/sections/sessions/SessionsSection.tsx

@@ -1513,6 +1513,17 @@ const SessionsSection: React.FC<SessionsSectionProps> = ({
           const backgroundSubagentActivityCount = backgroundSubagentActivity?.totalCount ?? 0;
           const showBackgroundSubagentActivity = !isChildSession && backgroundSubagentActivityCount > 0;
           const scheduledJobCount = cronJobCountsBySession.get(session.sessionId) ?? 0;
+          // Same mark the session status indicator draws, in the same trailing
+          // cell: one 12px secondary clock on the row's right edge, no count.
+          // Sessions with a status to report keep that status instead.
+          const scheduledJobMark = scheduledJobCount > 0 ? (
+            <Icon
+              name="clock"
+              size="xs"
+              tone="secondary"
+              label={t('nav.scheduledJobs.badgeTooltip', { count: scheduledJobCount })}
+            />
+          ) : undefined;
           const parentSessionId = relationship.parentSessionId;
           const parentSession = parentSessionId ? flowChatState.sessions.get(parentSessionId) : undefined;
           const parentTitle = parentSession ? resolveSessionTitle(parentSession) : '';
@@ -1724,15 +1735,6 @@ const SessionsSection: React.FC<SessionsSectionProps> = ({
                         {dispatchPresentation?.badgeLabel}
                       </OverflowText></span>
                     ) : null}
-                    {scheduledJobCount > 0 ? (
-                      <span
-                        className="openbitfun-nav-panel__inline-item-cron-badge"
-                        title={t('nav.scheduledJobs.badgeTooltip', { count: scheduledJobCount })}
-                      >
-                        <Icon name="clock" size="2xs" aria-hidden />
-                        {scheduledJobCount}
-                      </span>
-                    ) : null}
                     {reviewActivityKind ? (
                       <span className="openbitfun-nav-panel__inline-item-review-badge">
                         <Loader2 className="openbitfun-nav-panel__inline-item-review-icon" aria-hidden />
@@ -1770,7 +1772,10 @@ const SessionsSection: React.FC<SessionsSectionProps> = ({
                     </span>
                   </span>
                   <div className="openbitfun-nav-panel__inline-item-trailing">
-                    <SessionStatusIndicator sessionId={session.sessionId} />
+                    <SessionStatusIndicator
+                      sessionId={session.sessionId}
+                      idleFallback={scheduledJobMark}
+                    />
                     <div
                       className={`openbitfun-nav-panel__inline-item-actions${openMenuSessionId === session.sessionId ? ' is-open' : ''}`}
                       data-openbitfun-component="sessions-section"

src/web-ui/src/app/components/NavPanel/sections/sessions/SessionsSectionLayout.test.ts

@@ -170,8 +170,6 @@ describe('SessionsSection layout styles', () => {
     const btwBadgeBlock = extractInlineItemBlock(stylesheet, 'btw-badge');
     const reviewBadgeBlock = extractInlineItemBlock(stylesheet, 'review-badge');
     const backgroundSubagentBadgeBlock = extractInlineItemBlock(stylesheet, 'background-subagent-badge');
-    // Shared by session rows and workspace rows, so it must hold its slot width.
-    const cronBadgeBlock = extractInlineItemBlock(stylesheet, 'cron-badge');
 
     expect(labelBlock).toContain('flex: 1 1 0;');
     expect(labelBlock).toContain('overflow: hidden;');
@@ -191,10 +189,13 @@ describe('SessionsSection layout styles', () => {
     expect(backgroundSubagentBadgeBlock).toContain('line-height: 0;');
     expect(backgroundSubagentBadgeBlock).toContain('width: var(--openbitfun-control-icon-size-md);');
     expect(backgroundSubagentBadgeBlock).toContain('height: var(--openbitfun-control-icon-size-md);');
-    expect(cronBadgeBlock).toContain('flex: 0 0 auto;');
-    expect(cronBadgeBlock).toContain('display: inline-flex;');
-    expect(cronBadgeBlock).toContain('align-items: center;');
-    expect(cronBadgeBlock).toContain('white-space: nowrap;');
+    // The scheduled-job mark is not a chip beside the title: it is one 12px
+    // secondary clock in the trailing cell, the same drawing and slot the session
+    // status indicator uses, so no `cron` rule may come back to the stylesheet.
+    expect(stylesheet).not.toContain('cron');
+    expect(readSessionsSectionSource()).toContain('idleFallback={scheduledJobMark}');
+    expect(readSessionsSectionSource()).toMatch(/<Icon\s+name="clock"\s+size="xs"\s+tone="secondary"/);
+    expect(readSessionsSectionSource()).not.toMatch(/inline-item-cron/);
 
     const backgroundSubagentIconBlock = extractInlineItemBlock(stylesheet, 'background-subagent-icon');
     expect(backgroundSubagentIconBlock).toContain('place-self: center;');

src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceItem.tsx

@@ -54,11 +54,6 @@ import {
   type WorkspaceInfo,
 } from '@/shared/types';
 import { SSHContext } from '@/features/ssh-remote/SSHRemoteContext';
-import {
-  ensureCronJobCountsListener,
-  getCronJobCountsSnapshot,
-  subscribeCronJobCounts,
-} from '@/app/components/scheduled-jobs/cronJobCountsStore';
 import { useWorkspaceSearchIndex } from '@/tools/file-explorer';
 import { WORKSPACE_SEARCH_AVAILABLE } from '@/infrastructure/config/workspaceSearchAvailability';
 import { useSideAnchoredPopoverPosition } from '@/shared/utils/useSideAnchoredPopoverPosition';
@@ -110,25 +105,6 @@ const WorkspaceItem: React.FC<WorkspaceItemProps> = ({
 }) => {
   const { t } = useI18n('common');
   const { t: tFiles } = useTranslation('panels/files');
-  useEffect(() => { ensureCronJobCountsListener(); }, []);
-  const cronJobCounts = useSyncExternalStore(
-    subscribeCronJobCounts,
-    getCronJobCountsSnapshot,
-    getCronJobCountsSnapshot,
-  );
-  const scheduledJobCount = cronJobCounts.byWorkspaceId.get(workspace.id) ?? 0;
-  // Rendered through ActionItem's trailing slot so both name rows keep the badge on
-  // the name line. The rows flatten that label slot with `display: contents`, so a
-  // badge appended to the label children would silently break if that rule changed.
-  const scheduledJobBadge = scheduledJobCount > 0 ? (
-    <span
-      className="openbitfun-nav-panel__inline-item-cron-badge"
-      title={t('nav.scheduledJobs.badgeTooltip', { count: scheduledJobCount })}
-    >
-      <Icon name="clock" size="2xs" aria-hidden />
-      {scheduledJobCount}
-    </span>
-  ) : undefined;
   const {
     setActiveWorkspace,
     closeWorkspaceById,
@@ -878,7 +854,6 @@ const WorkspaceItem: React.FC<WorkspaceItemProps> = ({
               className="openbitfun-nav-panel__assistant-item-name-action"
               triggerClassName="openbitfun-nav-panel__assistant-item-name-btn"
               labelBehavior="static"
-              metadata={scheduledJobBadge}
               onClick={e => { e.stopPropagation(); handleCollapseToggle(); }}
               data-testid="nav-workspace-name-btn"
               data-workspace-id={workspace.id}
@@ -1185,7 +1160,6 @@ const WorkspaceItem: React.FC<WorkspaceItemProps> = ({
                   className="openbitfun-nav-panel__workspace-item-name-action"
                   triggerClassName="openbitfun-nav-panel__workspace-item-name-btn"
                   labelBehavior="static"
-                  metadata={scheduledJobBadge}
                   onClick={e => { e.stopPropagation(); handleCollapseToggle(); }}
                   data-testid="nav-workspace-name-btn"
                   data-workspace-id={workspace.id}

src/web-ui/src/app/components/NavPanel/sections/workspaces/WorkspaceListSectionLayout.test.ts

@@ -159,17 +159,19 @@ describe('WorkspaceListSection layout styles', () => {
     expect(source.match(/data-testid="nav-workspace-new-session-btn"/g)).toHaveLength(2);
   });
 
-  it('keeps the scheduled-job badge on the trailing slot of both workspace rows', () => {
+  it('keeps the scheduled-job mark off workspace rows', () => {
     const source = readWorkspaceItemSource();
 
-    // The workspace row and the assistant-group row both flatten their ActionItem
-    // label slot with `display: contents`, so the badge must stay one flex sibling of
-    // the name and be rendered by each variant from a single source.
-    expect(source).toContain('const scheduledJobBadge = scheduledJobCount > 0 ? (');
-    expect(source.match(/metadata=\{scheduledJobBadge\}/g)).toHaveLength(2);
-    expect(source).not.toContain('{scheduledJobCount > 0 ?');
-    expect(source).toContain('className="openbitfun-nav-panel__inline-item-cron-badge"');
-    expect(source).toContain("title={t('nav.scheduledJobs.badgeTooltip', { count: scheduledJobCount })}");
+    // A workspace row owns no session, so the scheduled-job count it used to
+    // borrow from its sessions belongs on the session rows only. The workspace
+    // row must not subscribe to the counts store or claim the name row's
+    // trailing metadata slot for it.
+    expect(source).not.toContain('cronJobCountsStore');
+    expect(source).not.toContain('scheduledJobCount');
+    expect(source).not.toContain('scheduledJobBadge');
+    expect(source).not.toContain('inline-item-cron');
+    expect(source).not.toContain('nav.scheduledJobs.badgeTooltip');
+    expect(source).not.toContain('metadata={scheduledJobBadge}');
   });
 
   it('keeps workspace and assistant rows flat on hover', () => {