Toasts: collapse to the one house system (CL-6372) - #117
Merged
Merged
Conversation
Pins that one failure fires exactly one toast, carries the house styling, and clears itself — the bug this branch fixes let a failed workbench create fire two: react-ui's styled Toaster and a second, raw sonner Toaster mounted alongside it.
A failed workbench create fired two toasts — react-ui's styled `<Toaster />` (mounted once in main.tsx, per docs/toasts.md) and a second, unstyled `<Toaster />` imported straight from sonner and mounted again in app.tsx. Sonner's toast() renders into every mounted Toaster, so one call rendered twice: the tokened grey box bottom-center and a default white pill bottom-right. Drop the stray sonner import and mount; react-ui's Toaster already wraps sonner with the house styling, bottom-center placement, replace- not-stack semantics, and prefers-reduced-motion handling, so nothing else changes. Every emission site already called @corbits/react-ui's toast() — grep confirms app.tsx's raw Toaster was the only sonner usage in the app. Drop the now-unused direct sonner dependency from apps/web/package.json.
TheGreatAxios
force-pushed
the
cl-6372-toasts
branch
from
August 20, 2026 13:34
53b4442 to
9118bf5
Compare
2 tasks
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Summary
A failed workbench create fired two toasts: a tokened grey box
bottom-center and a default white rounded pill bottom-right. Both
implementations found:
@corbits/react-ui's houseToaster/toast()— mounted oncein
apps/web/src/main.tsxperdocs/toasts.md, wrapssonnerinternally with house styling (
corbits-toast:border-border-strong,bg-card,shadow-surface, no radius), bottom-center placement,replace-not-stack semantics, and
prefers-reduced-motionhandling(
theme.css).<Toaster />imported straight fromsonner—mounted again in
apps/web/src/app.tsx, styled with sonner'sdefaults (bottom-right, white rounded pill).
sonner'stoast()renders into every mountedToaster, so every@corbits/react-uitoast()call — including the workbench-createfailure toast in
new-workbench-picker.tsx— rendered twice.Fix
Dropped the stray
sonnerimport/mount fromapp.tsxand the now-unused direct
sonnerdependency fromapps/web/package.json(
sonnerstill ships transitively as@corbits/react-ui's owndependency). No call site needed migrating — every emission in the
app already used
@corbits/react-ui'stoast(); the rawToastermount was the only
sonnerusage in the app.react-ui already ships the house toast primitive, so per the ticket
this uses it rather than writing a second one in workbench.
Known gap (flagging, not fixing here)
The ticket also asks for a destructive tint on error toasts and a
~5s auto-dismiss. Neither exists in the current pinned react-ui
toast (
toast.tsx, v0.1.0): it's a single plain-text variant with an1800ms duration, by design (see its own doc comment and shipped
tests). Since core UI components live in
corbitsdev/react-uiandthis repo only composes them, adding an error variant belongs
upstream — flagging for a follow-up there rather than reimplementing
styling divergence in workbench.
Test plan
bun testinapps/web— 582 pass, including newapps/web/test/toast-single-system.test.tsx: one failure eventfires exactly one toast, house styling, replace-not-stack, and
auto-dismiss.
bun run typecheckinapps/web— clean.bun run buildinapps/web— clean.bun run scripts/checks/react-ui-drift.ts— ok.bun run scripts/checks/ui-vocabulary.ts— ok.bun run scripts/checks/react-ui-pin.ts— ok.