githubnext/chopinPublic

Let's compose rich plans together

Polish Chopin chat and Decisions UI #268

MergedMaggieAppletonmerged 11 commits intomainfromrefs/pull/268/head
  1. MA

    ## Why

    Several small details in Chat and Decisions made the interface harder to read. This groups nine UI cleanup requests from the live review: CHOPIN-001, 002, 003, 004, 007, 009, 010, 012, and 013.

    ## What changed

    - Agent names and direct chat attributions now say **Chopin**. The stop button's tooltip and accessible name say **Stop Chopin**. - Chat timestamps use a new 11.3–11.5 px metadata size from the existing type scale. Their darker color keeps them legible at that size; queued status stays at its original size. - The stop button uses the supplied filled rounded-square icon. System notice icons and text are vertically centered. - An empty Decisions tab now has a centered icon, title, and clear explanation of where future questions and answers will appear. It waits until the document has loaded before saying there are no decisions, stays scrollable in a short pane, and offers Try again if opening the document fails. - When decisions are present, the first card now starts 24 px below the tab bar instead of 48 px. The narrow-pane rule changes only side gutters, so the top gap stays 24 px across widths. The centered empty view keeps its own spacing. - The unanswered count beside Decisions is now a soft gray rounded square with a smaller numeral. It keeps the same 20 px footprint and the tab still announces the count to screen readers. - A resolved decision popover now puts the answerer and time on one line, separated by 24 px. Long names wrap safely in narrower popovers.

    ## Visuals

    Real chat transcript with the smaller timestamps and Chopin attribution:

    ![Chat transcript showing Chopin and smaller metadata timestamps](https://github.com/user-attachments/assets/5b9369be-7c7a-43b6-8394-a4af2a466f0e)

    The filled stop icon used by the chat composer:

    ![Filled stop control icon](https://github.com/user-attachments/assets/9c94c23d-1aac-4929-a2bb-456c8ce3f871)

    The empty Decisions tab at desktop and phone widths:

    ![Centered empty Decisions panel in the desktop workspace](https://github.com/user-attachments/assets/889a2a7a-ba35-4bfb-bbd6-ce8c5790d8df)

    ![Centered empty Decisions panel on a phone](https://github.com/user-attachments/assets/20434bc3-fc7e-42d3-9633-6b0b132a18a9)

    Populated Decisions at the reported 945×850 viewport. The small marker shows the new 24 px gap:

    ![First Decisions card 24 px below the tab bar](https://github.com/user-attachments/assets/5f7c93fb-c39d-4738-b4ef-f14499bf5cfb)

    The same active Decisions tab before and after the quieter count:

    ![Before and after the Decisions tab count redesign](https://github.com/user-attachments/assets/397b932c-53f9-4b24-95fb-dbe8fe58aa0f)

    The resolved decision popover before and after; the author and time now share one row:

    ![Before and after the decision popover attribution and time layout](https://github.com/user-attachments/assets/bdbe2ec8-5528-490c-8728-9fc1f1773dc1)

    ## Verification

    - `bun test`: 3,623 passed, 3 PostgreSQL-only tests skipped. - `bun run ci`, `bun run types`, and `bun run build` passed for the grouped changes. - Focused chat browser flows: 4 passed. Browser behavior checks: 14 passed. - Changed chat and typography visual/accessibility checks: 4 passed at wide and narrow widths. The full design snapshot suite has unrelated font-raster differences on this machine; the same unchanged menu snapshot fails on a main-based checkout. - Empty Decisions behavior passed 19 focused unit tests and five Chromium checks spanning desktop, phone, short panes, document reset, failed load and retry, read-only access, and screen-reader status. - The populated Decisions browser check measured a 24 px top gap at 945×850; the short-pane empty-state browser check still passed. Types, formatting/lint checks, and a production build passed after this change. - Independent agents reviewed the final grouped diff and re-reviewed the Decisions loading, reset, and accessibility fixes with no remaining finding. - A separate agent reviewed the spacing change, including responsive gutters and scroll/focus behavior, with no finding. All three GitHub CI jobs, including the full browser suite, passed on commit `b3c9d402`. - The quieter count passed 10 focused unit tests, a real Chromium sidecar check at 945×850 (measured 20×20 px), type checks, build, and local CI. An independent reviewer found no remaining issue after the test assertion was refined. All three GitHub CI jobs, including the full browser suite, passed on commit `c2d5e173`. - The popover metadata passed a focused Chromium geometry check: 24 px gap and same-line alignment at 945×850, and no overflow with a long name at 390×620. Type checks, build, local CI, and independent review pass. All three GitHub CI jobs, including the full browser suite, passed on commit `d1b44c8d`.

  2. MaggieAppletonrenamed Polish Chopin chat labels and controls to Polish Chopin chat and Decisions UIlast month on GitHub

  3. MaggieAppletonreferenced this in Rest the chat composer at two lines and grow with content #278last month on GitHub

  4. MaggieAppletonreferenced this in Make UI copy consistent #283last month on GitHub

  5. MaggieAppletonreferenced this in Show a Planner question as waiting on a decision in chat #285last month on GitHub

  6. MaggieAppletonreferenced this in Make archived documents read plainly as archived #280last month on GitHub

  7. MaggieAppletonreferenced this in Show Chopin's work as live stages with inspectable tools #296last month on GitHub

  8. lavaman131referenced 49292ec7ff18last month on GitHub

  9. MA
    Author

    @copilot change the gap between the author and time on the resolved decision popover to be 16px

  10. Copilotbotmentionedlast month on GitHub

  11. Copilotbotsubscribedlast month on GitHub

  12. MaggieAppletoncopilot-work-startedlast month on GitHub

  13. MA
    Author

    @copilot Change the gap between the decisions label and the quieter count to be smaller. looks like it's around 10-12px. make it 4-6px.

  14. Copilotbotmentionedlast month on GitHub

  15. Copilotbotsubscribedlast month on GitHub

  16. > @copilot change the gap between the author and time on the resolved decision popover to be 16px >

    Updated the author/time gap to 16px and adjusted the browser assertion. Commit: `7530c2d`.

  17. Copilotbotmentionedlast month on GitHub

  18. Copilotbotsubscribedlast month on GitHub

  19. MaggieAppletoncopilot-work-finishedlast month on GitHub

  20. MaggieAppletoncopilot-work-startedlast month on GitHub

  21. > @copilot Change the gap between the decisions label and the quieter count to be smaller. looks like it's around 10-12px. make it 4-6px.

    Reduced the Decisions/count gap to 4px and added a focused assertion. Commit: `6fa7b88`.

  22. Copilotbotmentionedlast month on GitHub

  23. Copilotbotsubscribedlast month on GitHub

  24. MaggieAppletoncopilot-work-finishedlast month on GitHub

  25. MaggieAppletonmerged e4ef6672a5c1last month on GitHub

  26. MaggieAppletonclosedlast month on GitHub

  27. MaggieAppletonhead-ref-deletedlast month on GitHub