Problem
Several features hand-roll dialogs, drawers, coachmarks, menus, popovers, and browser confirmations, losing focus trapping, Escape handling, portal layering, collision handling, and focus restoration.
Remediation action
Replace audited custom overlays and native confirmations with existing Radix/shadcn primitives.
Representative scope
apps/web/src/components/deployments/EnvironmentSettings.tsx:341
apps/web/src/components/drawer/DrawerStack.tsx:187
apps/web/src/components/organizations/byok/BYOKKeysManager.tsx:377
apps/web/src/components/integrations/SlackIntegrationDetails.tsx:164
apps/web/src/components/subscriptions/seats/SeatsDetail.tsx:273
apps/web/src/app/(app)/claw/kilo-chat/components/ConversationItem.tsx:203
apps/web/src/app/(app)/claw/kilo-chat/components/EmojiQuickPick.tsx:17
apps/web/src/components/gastown/OnboardingTooltips.tsx:196
apps/web/src/components/gastown/TerminalBar.tsx:719
apps/web/src/components/organizations/custom-modes/ModeDrawer.tsx:28
Acceptance criteria
- Dialogs and irreversible confirmations use
Dialog or AlertDialog; menus use DropdownMenu; pickers use Popover; mobile drawers use Sheet.
- Focus trap/restoration, Escape, outside dismissal, keyboard navigation, and accessible title/description behavior come from primitives.
- Browser
confirm() and arbitrary overlay z-index values are removed from audited flows.
- Destructive confirmations name action and consequence, with explicit keep/cancel outcome.
- Drawer stack behavior is preserved while adopting accessible Sheet/Dialog semantics.
Problem
Several features hand-roll dialogs, drawers, coachmarks, menus, popovers, and browser confirmations, losing focus trapping, Escape handling, portal layering, collision handling, and focus restoration.
Remediation action
Replace audited custom overlays and native confirmations with existing Radix/shadcn primitives.
Representative scope
apps/web/src/components/deployments/EnvironmentSettings.tsx:341apps/web/src/components/drawer/DrawerStack.tsx:187apps/web/src/components/organizations/byok/BYOKKeysManager.tsx:377apps/web/src/components/integrations/SlackIntegrationDetails.tsx:164apps/web/src/components/subscriptions/seats/SeatsDetail.tsx:273apps/web/src/app/(app)/claw/kilo-chat/components/ConversationItem.tsx:203apps/web/src/app/(app)/claw/kilo-chat/components/EmojiQuickPick.tsx:17apps/web/src/components/gastown/OnboardingTooltips.tsx:196apps/web/src/components/gastown/TerminalBar.tsx:719apps/web/src/components/organizations/custom-modes/ModeDrawer.tsx:28Acceptance criteria
DialogorAlertDialog; menus useDropdownMenu; pickers usePopover; mobile drawers useSheet.confirm()and arbitrary overlay z-index values are removed from audited flows.