Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
16 changes: 11 additions & 5 deletions desktop/src/features/sidebar/ui/WorkspaceRail.test.mjs
Original file line number Diff line number Diff line change
Expand Up @@ -25,22 +25,25 @@ describe("workspaceRailIndicators", () => {
it("shows no badge for an observed workspace with unread but no mentions", () => {
const r = workspaceRailIndicators({ hasUnread: true, state: "ready" });
assert.equal(r.showBadge, false);
assert.equal(r.showDot, true);
assert.equal(r.pending, false);
});

it("shows no badge for an observed workspace with no unread", () => {
it("shows no badge and no dot for an observed workspace with no unread", () => {
const r = workspaceRailIndicators({ hasUnread: false, state: "ready" });
assert.equal(r.showBadge, false);
assert.equal(r.showDot, false);
assert.equal(r.pending, false);
});

it("shows a mention badge with the count when mentions are present", () => {
it("shows a mention badge with the count when mentions are present — no dot", () => {
const r = workspaceRailIndicators({
hasUnread: true,
count: 3,
state: "ready",
});
assert.equal(r.showBadge, true);
assert.equal(r.showDot, false);
assert.equal(r.mentionCount, 3);
assert.equal(r.badgeLabel, "3");
});
Expand All @@ -54,30 +57,33 @@ describe("workspaceRailIndicators", () => {
assert.equal(r.badgeLabel, "99+");
});

it("never reports mentions for an unobserved (unknown) workspace", () => {
it("never reports mentions or dot for an unobserved (unknown) workspace", () => {
const r = workspaceRailIndicators({
hasUnread: true,
count: 5,
state: "unknown",
});
assert.equal(r.showBadge, false);
assert.equal(r.showDot, false);
assert.equal(r.mentionCount, 0);
assert.equal(r.pending, true);
});

it("treats loading as pending, not as no-unread", () => {
it("treats loading as pending — no badge, no dot", () => {
const r = workspaceRailIndicators({ hasUnread: false, state: "loading" });
assert.equal(r.pending, true);
assert.equal(r.showBadge, false);
assert.equal(r.showDot, false);
});

it("never reports mentions on an errored observation", () => {
it("never reports mentions or dot on an errored observation", () => {
const r = workspaceRailIndicators({
hasUnread: true,
count: 2,
state: "error",
});
assert.equal(r.showBadge, false);
assert.equal(r.showDot, false);
assert.equal(r.mentionCount, 0);
assert.equal(r.pending, false);
});
Expand Down
23 changes: 20 additions & 3 deletions desktop/src/features/sidebar/ui/WorkspaceRail.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -45,21 +45,29 @@ export function workspaceInitials(name: string): string {
/**
* Presentation decisions for one workspace button, derived from its observed
* mention state. Pure so it can be unit-tested without a DOM. The `state` guard
* ensures we NEVER render a mention badge for a relay we could not observe
* ensures we NEVER render any indicator for a relay we could not observe
* (`unknown`/`loading`/`error`) — only a `ready` observation is trusted.
*
* Two-tier indicator system:
* - `showBadge`: numeric mention count (mentions/thread-replies present).
* - `showDot`: plain unread dot when there are regular channel unreads but no
* mentions. Mutually exclusive with `showBadge` by construction.
*/
export function workspaceRailIndicators(unread: WorkspaceUnreadState): {
mentionCount: number;
showBadge: boolean;
showDot: boolean;
pending: boolean;
badgeLabel: string;
} {
const observed = unread.state === "ready";
const mentionCount = observed ? (unread.count ?? 0) : 0;
const showBadge = mentionCount > 0;
const showDot = observed && unread.hasUnread && !showBadge;
return {
mentionCount,
showBadge,
showDot,
pending: unread.state === "unknown" || unread.state === "loading",
badgeLabel:
mentionCount > MAX_BADGE ? `${MAX_BADGE}+` : String(mentionCount),
Expand All @@ -81,12 +89,14 @@ function WorkspaceButton({
onSwitch: () => void;
menu: React.ReactNode;
}) {
const { mentionCount, showBadge, pending, badgeLabel } =
const { mentionCount, showBadge, showDot, pending, badgeLabel } =
workspaceRailIndicators(unread);

const tooltipLabel = showBadge
? `${workspace.name} — ${mentionCount} mention${mentionCount === 1 ? "" : "s"}`
: workspace.name;
: showDot
? `${workspace.name} — unread`
: workspace.name;

return (
<ContextMenu>
Expand Down Expand Up @@ -129,6 +139,13 @@ function WorkspaceButton({
>
{badgeLabel}
</span>
) : showDot ? (
<span
className="absolute -bottom-0.5 -right-0.5 h-2 w-2 shrink-0 rounded-full bg-primary ring-2 ring-sidebar"
data-testid={`workspace-rail-unread-dot-${workspace.id}`}
>
<span className="sr-only">unread</span>
</span>
) : null}
</button>
</ContextMenuTrigger>
Expand Down
Loading