Skip to content

Clinical primary buttons in Clinical blue; My Day lists the flagged item once - #3455

Merged
gitar-bot[bot] merged 3 commits into
mainfrom
claude/design-review-polish-7wb6f7
Oct 11, 2026
Merged

gitar-bot[bot] merged 3 commits into
mainfrom
claude/design-review-polish-7wb6f7

Conversation

@BigSimmo

@BigSimmo BigSimmo commented Oct 11, 2026 •

Copy link
Copy Markdown
Owner

User description

Summary

Follow-ups to #3453. The owner agreed to all three on 11 Oct.

  • Before: in Clinical, most main buttons were near-black. Only two pages were blue, and each had its own one-off override. After: the shared primary button takes the area colour everywhere. That means Clinical blue by default and a Work area's own colour inside its frame (design rule C8.3). The two one-off overrides are gone. High-contrast mode keeps the native button colours.
  • Before: My Day showed the most important item twice, first in the amber flag card and then again as the first row of Needs you. After: Needs you leaves that item out of its rows while the flag shows. "All N" still counts it, so the link matches the full list it opens. If the flag card is hidden, the item is listed in Needs you as before. When the flagged item is the only one, Needs you says "Nothing else needs you today." instead of "Nothing needs you right now".
  • Emergent tags stay red. That was already the case after Give both modes one look: Clinical band, grouped lists, calmer controls #3453, so this PR has no change for it.

Areas touched: Personal practice, App experience, Design system

Verification

  • Checks run:
    • npx vitest run tests/my-day-dashboard.dom.test.tsx tests/my-day-page.dom.test.tsx tests/my-day-dashboard.test.ts: Tests 101 passed (101)
    • The button colour tests (guide centre, recommend, CME routines and state notice, open shifts board, design-system): Tests 160 passed (160)
    • check:diff-integrity: PASS — 3 changed test file(s), 99 -> 101 test case(s)
    • tsc, eslint and prettier are clean on the changed files.
    • Browser and forced-colours checks are left to CI.

Risk and rollout

  • Risk: visual only. Clinical's primary buttons change from near-black to blue. My Day's Needs you shows one fewer row while the flag card is showing.
  • Rollback: revert this PR.
  • Provider or production effects: none.

Notes

  • The primary button now sets the command colour tokens on itself, so existing class names and tests are unchanged. Other filled controls that use the command colour (tabs, pagination) are not changed.

🤖 Generated with Claude Code

https://claude.ai/code/session_01T6yVRM8TyEHCooxU8ke9nA


Generated by Claude Code


Summary by cubic

Sets the shared primary button to take the area colour everywhere (Clinical blue by default, a Work area's own colour inside its frame) and stops My Day's Needs you from repeating the item the flag card above already shows.

Primary buttons

  • The two one-off per-page overrides are removed; the Work pressed state falls back to a readable deep shade, and high-contrast mode keeps the native button pair.
  • Emergent tag red and other filled command-colour controls are unchanged.

Needs you

  • The flagged item is left out of the rows while the flag shows; the "All N" count still includes it so the link matches the full list it opens.
  • Hiding the flag card brings the item back into the rows. When the flagged item is the only one and nothing is hidden, the card reads "Nothing else needs you today."

Written for commit 770ae1d. Summary will update on new commits.

View guided diff Turn on auto-fix


CodeAnt-AI Description

Match primary button colors to each area and remove duplicate My Day items

What Changed

  • Primary buttons use Clinical blue by default and the Work area's color inside its frame; high-contrast mode keeps native button colors.
  • My Day no longer lists the flagged item twice while the flag card is visible. The “See all” count still includes it, and hiding the flag card restores it to the list.
  • The “Needs you” message no longer says that zero items are hidden until tomorrow.

Impact

✅ Clinical buttons match their area
✅ No duplicate flagged items in My Day
✅ “See all” still opens the full item list

💡 Usage Guide

Checking Your Pull Request

Every time you make a pull request, our system automatically looks through it. We check for security issues, mistakes in how you're setting up your infrastructure, and common code problems. We do this to make sure your changes are solid and won't cause any trouble later.

Talking to CodeAnt AI

Got a question or need a hand with something in your pull request? You can easily get in touch with CodeAnt AI right here. Just type the following in a comment on your pull request, and replace "Your question here" with whatever you want to ask:

@codeant-ai ask: Your question here

This lets you have a chat with CodeAnt AI about your pull request, making it easier to understand and improve your code.

Example

@codeant-ai ask: Can you suggest a safer alternative to storing this secret?

Preserve Org Learnings with CodeAnt

You can record team preferences so CodeAnt AI applies them in future reviews. Reply directly to the specific CodeAnt AI suggestion (in the same thread) and replace "Your feedback here" with your input:

@codeant-ai: Your feedback here

This helps CodeAnt AI learn and adapt to your team's coding style and standards.

Example

@codeant-ai: Do not flag unused imports.

Retrigger review

Ask CodeAnt AI to review the PR again, by typing:

@codeant-ai: review

Check Your Repository Health

To analyze the health of your code repository, visit our dashboard at https://app.codeant.ai. This tool helps you identify potential issues and areas for improvement in your codebase, ensuring your repository maintains high standards of code health.


Summary by Gitar

  • Needs you copy:
    • Drops the "hidden until tomorrow" note when no items are hidden, so it only appears when total exceeds waiting
  • Primary buttons:
    • Adds the primary variant to the specifier builder continue button and the Documents search link in search/page.tsx

This will update automatically on new commits.

…tem once

The shared primary Button now takes the area colour everywhere: Clinical
blue by default, and a Work area's own colour inside its frame. The two
per-page remaps are removed. High-contrast mode keeps the native button pair.

My Day's Needs you no longer repeats the item the flag card above already
shows. It still counts it, so All N matches the full list.

Co-Authored-By: Claude Opus 5.5 (1M context) <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01T6yVRM8TyEHCooxU8ke9nA
@codeant-ai

codeant-ai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

🤖 CodeAnt AI — Review Status

Status Commit Started (UTC) Finished (UTC)
✅ Reviewed your PR fef4f08 Oct 11, 2026 · 06:29 06:35

@supabase

supabase Bot commented Oct 11, 2026

Copy link
Copy Markdown

This pull request has been ignored for the connected project sjrfecxgysukkwxsowpy because there are no changes detected in supabase directory. You can change this behaviour in Project Integrations Settings ↗︎.


Preview Branches by Supabase.
Learn more about Supabase Branching ↗︎.

@codeant-ai

codeant-ai Bot commented Oct 11, 2026

Copy link
Copy Markdown

Thanks for using CodeAnt! 🎉

We're free for open-source projects. if you're enjoying it, help us grow by sharing.

Share on X ·
Reddit ·
LinkedIn

@greptile-apps greptile-apps Bot left a comment

Copy link
Copy Markdown

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

BigSimmo has reached the 50-credit limit for trial accounts. To continue receiving code reviews, upgrade your plan.

@coderabbitai

coderabbitai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor

Important

  • 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration
  • Configuration used: Organization UI
  • Review profile: ASSERTIVE
  • Plan: Advanced
  • Run ID: 0368b72d-3928-45db-9ebd-078dbece83c3

  • Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

Comment @coderabbitai help to get the list of available commands.

@claude

claude Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor

Claude encountered an error after 2s —— View job


I'll analyze this and get back to you.

@chatgpt-codex-connector

chatgpt-codex-connector Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

Codex Review Summary

This comment shows the latest Codex review activity on this pull request.

Review Status Commit Review trigger
📝 Code Review ✅ Completed 2026-10-11T06:33:49.831990Z fef4f08 PR opened
ℹ️ About Codex in GitHub

Your team has set up Codex to review pull requests in this repo. Reviews are triggered when you

  • Open a pull request for review
  • Mark a draft as ready
  • Comment "@codex review" or "@codex security review".

Codex reacts with 👀 while any review is running, comments if it has suggestions, and reacts with 👍 once all reviews finish with no findings.

@codeant-ai codeant-ai Bot added the size:L This PR changes 100-499 lines, ignoring generated files label Oct 11, 2026
@qodo-code-review qodo-code-review Bot added 🕐 40+ Minutes and removed size:L This PR changes 100-499 lines, ignoring generated files labels Oct 11, 2026
@qodo-code-review

Copy link
Copy Markdown
Contributor

PR Summary by Qodo

Use area colours for primary buttons and avoid duplicate My Day items

✨ Enhancement 🐞 Bug fix 🧪 Tests 🕐 40+ Minutes

Grey Divider

AI Description

• Give shared primary buttons Clinical blue or their Work area colour, while preserving native
 high-contrast colours.
• Show a flagged My Day item only in its flag card, while retaining full-list counts.
• Update dashboard tests for flagged, hidden, and snoozed items.
Diagram

graph TD
  Clinical["Clinical tokens"] --> Button["Primary button"] --> Pages["Page actions"]
  Work["Work frame"] --> Button
  Items["Day items"] --> Flag{"Flag visible?"} --> Selector["Needs You selector"] --> Card["Needs You card"]
Loading
High-Level Assessment

Keep area-colour resolution in the shared primary variant and omit the flagged item during row selection. Per-page colour overrides would drift, while removing the item from the underlying list would make All N disagree with the full list.

Files changed (10) +107 / -66

Enhancement (2) +12 / -2
work-mode.cssExpose Work area colours to primary buttons +5/-0

Expose Work area colours to primary buttons

• Work frames provide action colour tokens for the shared primary face, including hover, active, and contrast colours.

src/app/work-mode.css

button-face.tsMake the shared primary face area-coloured +7/-2

Make the shared primary face area-coloured

• Primary buttons use Work action tokens when available and Clinical accent tokens otherwise. Forced-colours mode retains native button backgrounds; other variants are unchanged.

src/components/ui/button-face.ts

Bug fix (3) +16 / -8
my-day-dashboard.tsxPass the visible flagged item to Needs you +4/-1

Pass the visible flagged item to Needs you

• The dashboard excludes the leading flag item from Needs you rows only while the flag card is visible, and tells the card when to adjust its row count.

src/components/my-day/my-day-dashboard.tsx

my-day-today-cards.tsxCount only distinct Needs you rows +7/-6

Count only distinct Needs you rows

• The card subtracts a displayed flag item from its row count without changing All N. Its empty-row message no longer claims zero items are snoozed when the flag is the only item.

src/components/my-day/my-day-today-cards.tsx

dashboard.tsExclude the flag item from selected rows +5/-1

Exclude the flag item from selected rows

• The Needs you selector accepts an optional flagged ID, omits it before capping displayed rows, and preserves waiting and total counts.

src/lib/my-day/dashboard.ts

Refactor (2) +2 / -29
page.tsxRemove the Document Search button colour override +1/-13

Remove the Document Search button colour override

• The search link now uses the shared primary button face without a page-specific Clinical accent override.

src/app/(search-app)/documents/search/page.tsx

specifier-builder-page.tsxRemove Specifier Builder button colour overrides +1/-16

Remove Specifier Builder button colour overrides

• The copy and navigation buttons now receive Clinical colouring from the shared primary variant.

src/components/specifiers/specifier-builder-page.tsx

Tests (3) +77 / -27
my-day-dashboard.dom.test.tsxTest distinct flag and Needs you display +47/-19

Test distinct flag and Needs you display

• Dashboard tests verify row order, counts, snoozing, and restoration when the flag is hidden. Existing fixtures are adjusted where tests need an item that remains in Needs you.

tests/my-day-dashboard.dom.test.tsx

my-day-dashboard.test.tsTest flagged-item selection and counts +13/-0

Test flagged-item selection and counts

• Selector tests cover flag exclusion, preserved totals, snoozed rows, and unchanged rows without a flag.

tests/my-day-dashboard.test.ts

my-day-page.dom.test.tsxAdapt page tests to distinct My Day rows +17/-8

Adapt page tests to distinct My Day rows

• Page fixtures account for items shown in the flag rather than Needs you. The full-list navigation test still verifies access to an item beyond the displayed rows.

tests/my-day-page.dom.test.tsx

@codeant-ai

codeant-ai Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

🏁 CodeAnt Quality Gate Results

Commit: eabc8cb6
Scan Time: 2026-10-11 06:50:48 UTC

✅ Overall Status: PASSED

Quality Gate Details

Quality Gate Status Details
Secrets ✅ PASSED 0 secrets found
Duplicate Code ✅ PASSED 0.0% duplicated
SAST ✅ PASSED No security issues
Bugs ✅ PASSED Rating S: No bugs
IAC ✅ PASSED No IAC issues

View Full Results

@codspeed

codspeed Bot commented Oct 11, 2026 •

Copy link
Copy Markdown

Merging this PR will not alter performance

⚠️ 2 benchmarks spent significant time in system calls

System calls cannot be consistently instrumented, so they are not included in the measure, which understates the real cost. Please switch to the Walltime instrument to accurately measure system calls.

Measurement and system calls

ℹ️ 1 benchmark has no flame graph

The flamegraph could not be generated because too much time was spent in runtime internals, making the visualization not useful for performance analysis.

✅ 8 untouched benchmarks


Comparing claude/design-review-polish-7wb6f7 (eabc8cb) with main (4fb41bc)

Open in CodSpeed

@gitar-bot
gitar-bot Bot enabled auto-merge (squash) October 11, 2026 06:31
gitar-bot[bot]
gitar-bot Bot previously approved these changes Oct 11, 2026

@gitar-bot gitar-bot Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Gitar has auto-approved this PR (configure)

@codeant-ai

codeant-ai Bot commented Oct 11, 2026

Copy link
Copy Markdown

CodeAnt Nitpicks

2 code suggestions

1. --action-active inherits the root --command-active instead of a work-area color, so pressing a primary button flashes near-black in light mode or gray in dark mode.

Css layout issue · src/app/work-mode.css:125


2. In Work frames, --action-active inherits the global command active color, so pressing a primary button switches it away from the area's color.

Incorrect variable usage · src/components/ui/button-face.ts:19

@qodo-code-review

qodo-code-review Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor

Code Review by Qodo

🐞 Bugs (0) 📘 Rule violations (0) 🔗 Cross-repo conflicts (0) 📜 Skill insights (0)

Grey Divider


Action required

No findings for this group


Remediation recommended

No findings for this group


Informational

No findings for this group

Grey Divider


Resolved findings

1. Pressed dark buttons lose readable labels ✓ Resolved
Description
--action-active inherits the generic --command-active colour instead of an active colour paired
with the Work button's text. In dark mode, pressing a primary button puts its light label on the
light #cbd1d8 fill, making the label difficult to read.
Code

src/app/work-mode.css[125]

+  --action-active: var(--command-active);
Relevance

●●● Strong

Recent Work primary-button contrast and forced-colors findings were accepted; this is a direct
dark-mode token contrast defect.

PR-#3443

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The design-review skill requires theme adherence and visual consistency. The new Work action token
takes its active colour from the generic command token, while the dark Work frame uses light heading
text for its button foreground; the dark token layer sets the inherited command-active fill to a
similarly light grey.

src/app/work-mode.css[94-125]
src/app/ckb-v2-tokens.css[345-362]
src/components/ui/button-face.ts[18-19]
Skill: design-review

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Work primary buttons use the generic light command-active fill in dark mode while retaining light Work button text.

## Fix Focus Areas
- src/app/work-mode.css[119-126]
- src/components/ui/button-face.ts[18-19]

## Recommended Fix
Set `--action-active` to a Work-area pressed colour that maintains contrast with `--action-contrast` in both themes. Verify the primary button's pressed state in dark mode.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


2. Dark work buttons lose native contrast ✓ Resolved
Description
The primary button face forces --command to ButtonFace in forced-colors mode but leaves
--command-contrast mapped through the work frame’s --action-contrast. In a dark work area, that
contrast value resolves to CanvasText, so button labels do not use the ButtonText color paired
with their forced ButtonFace background.
Code

src/components/ui/button-face.ts[19]

+    "[--command:var(--action,var(--clinical-accent))] [--command-hover:var(--action-hover,var(--clinical-accent-hover))] [--command-active:var(--action-active,var(--clinical-accent-active))] [--command-contrast:var(--action-contrast,var(--clinical-accent-contrast))] forced-colors:[--command:ButtonFace] forced-colors:[--command-hover:ButtonFace] forced-colors:[--command-active:ButtonFace] bg-[color:var(--command)] text-[color:var(--command-contrast)] shadow-[var(--e1)] hover:bg-[color:var(--command-hover)] hover:shadow-[var(--e3)] active:bg-[color:var(--command-active)]",
Relevance

●●● Strong

Recent Work primary-button accessibility findings were accepted, supporting correction of the
forced-colors foreground/background pairing.

PR-#3443

ⓘ Recommendations generated based on similar findings in past PRs

Evidence
The new primary face forces only its three background tokens to ButtonFace. The work frame
supplies its contrast through --work-primary-text, which dark mode sets to --text-heading; the
forced-colors tokens set that heading color to CanvasText, while the native button foreground is
ButtonText.

src/components/ui/button-face.ts[17-19]
src/app/work-mode.css[93-100]
src/app/work-mode.css[119-126]
src/app/ckb-v2-tokens.css[446-459]

Agent prompt
The issue below was found during a code review. Follow the provided context and guidance below and implement a solution

## Issue description
Dark work-area primary buttons use `CanvasText` on a forced `ButtonFace` background instead of the native button color pair.

## Fix Focus Areas
- src/components/ui/button-face.ts[19-19]
- src/app/work-mode.css[93-100]
- src/app/work-mode.css[119-126]

## Recommended Fix
Add a forced-colors override setting the primary face’s `--command-contrast` to `ButtonText`, alongside its existing `ButtonFace` overrides. Verify the computed background and text tokens in a dark work frame.

ⓘ Copy this prompt and use it to remediate the issue with your preferred AI generation tools


Grey Divider

Context sources
✅ Compliance rules (platform): 9 rules
✅ Skills: 6 invoked
  design-review
  accessibility-review
  testing-review
  ux-review
  review
  ui
✅ Cross-repo context — repo relationships
Review mode: Auto: ⚖️ Balanced: Behavioral changes span shared UI styling and dashboard filtering; careful single-pass review is appropriate.

Grey Divider

Tip of the day
💡 Did you know, you can tweak Display settings with a live preview to see your comment before it ships

More tips ↗ | Customize Qodo ↗ | Qodo docs ↗

Grey Divider

Qodo Logo

Comment thread src/components/ui/button-face.ts Resolved
Comment thread src/app/work-mode.css Resolved
@codeant-ai

codeant-ai Bot commented Oct 11, 2026

Copy link
Copy Markdown

CodeAnt PR Risk: Low Risk

  • The PR appears safe to merge.
  • Needs you excludes the item already shown in the flag card while preserving counts; tests cover hidden flags, snoozes, and the full list.
  • Primary buttons use the clinical accent by default and the work-area color when set; the changed styling preserves hover, pressed, and forced-colors states.

Assessed commit: fef4f087b701

@qodo-code-review

Copy link
Copy Markdown
Contributor

Qodo Fixer

✅ Committed (2) · ☑ Fixed (2)

Grey Divider

Commits pushed directly to this PR — no separate fix PR opened.

Process — 2 fixed
  • ☑ Fixed: Pressed dark buttons lose readable labels
  • ☑ Fixed: Dark work buttons lose native contrast

@gitar-bot

gitar-bot Bot commented Oct 11, 2026 •

Copy link
Copy Markdown
Contributor
Code Review ✅ Approved

🟡 Medium risk · The dashboard omits the flagged item from Needs you rows while its card shows, which could cause users scanning only the rows to miss it.

Makes the shared primary button take the area colour (Clinical blue by default, Work area colour inside its frame) and removes the two one-off overrides, while My Day's Needs you omits the flagged item from its rows so it isn't repeated under the flag card. No issues found.

Auto-approved: No blocking issues found.
Please see Auto-approve Docs for details on setting custom approval criteria.

Review coverage

🤖 Auto-approval Approved

📋 Rules No rules evaluated

🧪 Functional validation Not enabled · Set up

Options

Auto-apply is off → Gitar will not commit updates to this branch.
Display: compact → Counting what did not apply, without listing it.

Comment with these commands to change the behavior for this request:

Auto-apply Compact
gitar auto-apply:on         
gitar display:verbose         

Was this helpful? React with 👍 / 👎 | Gitar

@gitar-bot gitar-bot Bot left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Gitar has auto-approved this PR (configure)

@gitar-bot
gitar-bot Bot merged commit 0c2587a into main Oct 11, 2026
45 of 46 checks passed
@gitar-bot
gitar-bot Bot deleted the claude/design-review-polish-7wb6f7 branch October 11, 2026 06:50
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants