diff --git a/packages/junior-dashboard/e2e/conversations-attention.spec.ts b/packages/junior-dashboard/e2e/conversations-attention.spec.ts index 3f656f1f76..2642919678 100644 --- a/packages/junior-dashboard/e2e/conversations-attention.spec.ts +++ b/packages/junior-dashboard/e2e/conversations-attention.spec.ts @@ -81,8 +81,8 @@ async function mockWaitingConversation( }); } -test.describe("conversation time sections", () => { - test("puts waiting conversations first in their time section", async ({ +test.describe("conversation sections", () => { + test("puts waiting conversations in Needs attention first", async ({ page, dashboard, }) => { @@ -90,29 +90,31 @@ test.describe("conversation time sections", () => { await page.goto(dashboard.baseURL); const list = page.getByRole("list", { name: "Your conversations" }); - const today = list.getByRole("button", { name: "Today" }); + const attention = list.getByRole("button", { name: "Needs attention" }); const waitingCard = list.getByRole("listitem").filter({ has: page.getByRole("heading", { name: "Checkout latency triage" }), }); - await expect(list.getByRole("button").first()).toHaveText(/^Today/); + await expect(list.getByRole("button").first()).toHaveText( + /^Needs attention/, + ); await expect(list.getByRole("listitem").first()).toContainText( "Checkout latency triage", ); await expect( waitingCard.getByRole("img", { name: "Waiting on you" }), ).toBeVisible(); - await screenshot(page, "conversations-waiting-first"); + await screenshot(page, "conversations-needs-attention"); - await today.click(); - await expect(today).toHaveAttribute("aria-expanded", "false"); + await attention.click(); + await expect(attention).toHaveAttribute("aria-expanded", "false"); await expect(waitingCard).toHaveCount(0); await screenshot(page, "conversations-sections-collapsed"); await page.reload(); - await expect(today).toHaveAttribute("aria-expanded", "false"); + await expect(attention).toHaveAttribute("aria-expanded", "false"); await expect(waitingCard).toHaveCount(0); - await today.click(); + await attention.click(); await expect(waitingCard).toBeVisible(); }); @@ -193,7 +195,9 @@ test.describe("conversation time sections", () => { const chip = sidebar.getByRole("link", { name: /Approve the checkout fix/, }); - await expect(sidebar.getByRole("button").first()).toHaveText(/^Today/); + await expect(sidebar.getByRole("button").first()).toHaveText( + /^Needs attention/, + ); await expect( waitingRow.getByRole("img", { name: "Waiting on you" }), ).toBeVisible(); @@ -239,9 +243,9 @@ test.describe("conversation time sections", () => { .getByRole("button", { name: "Close conversation details" }) .click(); - const today = sidebar.getByRole("button", { name: "Today" }); - await today.click(); - await expect(today).toHaveAttribute("aria-expanded", "false"); + const attention = sidebar.getByRole("button", { name: "Needs attention" }); + await attention.click(); + await expect(attention).toHaveAttribute("aria-expanded", "false"); await expect(waitingRow).toHaveCount(0); }); }); diff --git a/packages/junior-dashboard/src/client/conversations/conversationSections.ts b/packages/junior-dashboard/src/client/conversations/conversationSections.ts index 307e6ce938..462f3f61ba 100644 --- a/packages/junior-dashboard/src/client/conversations/conversationSections.ts +++ b/packages/junior-dashboard/src/client/conversations/conversationSections.ts @@ -7,13 +7,18 @@ export type ConversationSection = { }; const DAY_MS = 24 * 60 * 60 * 1000; +// Sorts before every time section. +const ATTENTION_SECTION = { + key: "attention", + label: "Needs attention", + order: Number.NEGATIVE_INFINITY, +}; /** - * Group conversations by last activity: Today, Yesterday, Previous 7 days, - * Previous 30 days, then one section per month. + * Group conversations into Needs attention, then by last activity: Today, + * Yesterday, Previous 7 days, Previous 30 days, then one section per month. * - * Conversations in `attentionIds` lead their section, so unread and waiting - * rows sit above read rows without leaving their time group. + * Conversations in `attentionIds` go to Needs attention, newest first. */ export function buildConversationSections( conversations: Conversation[], @@ -25,20 +30,19 @@ export function buildConversationSections( ): ConversationSection[] { const nowDay = calendarDay(options.nowMs, options.timeZone); const sections = new Map(); - const byActivity = [...conversations].sort( + const sorted = [...conversations].sort( (left, right) => activityTime(right) - activityTime(left), ); - const sorted = options.attentionIds - ? attentionFirst(byActivity, options.attentionIds) - : byActivity; for (const conversation of sorted) { - const section = conversationSection( - activityTime(conversation), - nowDay, - options.nowMs, - options.timeZone, - ); + const section = options.attentionIds?.has(conversation.id) + ? ATTENTION_SECTION + : conversationSection( + activityTime(conversation), + nowDay, + options.nowMs, + options.timeZone, + ); const existing = sections.get(section.key); if (existing) { existing.conversations.push(conversation); diff --git a/packages/junior-dashboard/tests/conversationSections.test.ts b/packages/junior-dashboard/tests/conversationSections.test.ts index 95478d7c91..df8515cbbf 100644 --- a/packages/junior-dashboard/tests/conversationSections.test.ts +++ b/packages/junior-dashboard/tests/conversationSections.test.ts @@ -60,7 +60,7 @@ describe("conversation activity sections", () => { ]); }); - it("puts attention conversations first inside their own time section", () => { + it("puts attention conversations in Needs attention before Today", () => { const sections = buildConversationSections( [ conversation("today", "2026-08-03T11:00:00-07:00"), @@ -73,12 +73,13 @@ describe("conversation activity sections", () => { ); expect(sectionIds(sections)).toEqual([ - { conversations: ["today-unread", "today"], label: "Today" }, - { conversations: ["yesterday"], label: "Yesterday" }, { - conversations: ["waiting-old", "saturday"], - label: "Previous 7 days", + conversations: ["today-unread", "waiting-old"], + label: "Needs attention", }, + { conversations: ["today"], label: "Today" }, + { conversations: ["yesterday"], label: "Yesterday" }, + { conversations: ["saturday"], label: "Previous 7 days" }, ]); });