Destructive actions
Confirming before anything is removed or stopped.
Anything that removes, stops or disconnects asks first, in ConfirmDialog, saying exactly what will happen. There is no undo yet, so the confirmation carries the weight.
The problem
Some actions take something away from someone: stopping sharing hides your whole network from them, disconnecting an account stops it syncing, deleting a network removes it. Bridge has no undo yet, so a slip can't be taken back. But a dialog that just says "Are you sure?" gets clicked through without being read.
What to do
- Always ask first. Every action that removes, stops or disconnects opens ConfirmDialog before anything happens. There's no undo to fall back on.
- Name the exact thing. The question names the person or item, and the red button repeats the verb: "Stop sharing", never "OK".
- Make it look different. The confirm button is solid red. In a menu, the item is red text, last, after a line, so nobody hits it on the way to something else.
Which one do I use?
| Situation | Do this | Bridge example |
|---|---|---|
| Stop sharing with one person, remove a contact, delete a network | ConfirmDialog, destructive: red button and warning icon | Stop sharing with Leah Okonkwo? |
| The same for several people at once | ConfirmDialog with the count in the question | Stop sharing with 3 people? |
| The action sits in a row's ⋮ menu | A danger item, last, after a separator; it opens the ConfirmDialog | Contact ⋮ → Stop sharing |
| Stopping something that keeps your data (nothing is lost) | ConfirmDialog without destructive: no red | Disconnect your calendar? |
See it work
Live examples built from the package on the sample network. Click through them.
Ask first, then show the result in place
Stop sharing opens the dialog. While it works, the button spins and the dialog can't be closed; afterward the row itself shows the new state.
Leah Okonkwo
Partner, Saltmarsh Partners
Several at once: say how many
The question carries the count, so people see the size of what they're doing.
Leah Okonkwo
Partner, Saltmarsh Partners
Priya Natarajan
Co-founder & CEO, Quillbase
Kwame Asante
CEO, Halcyra Bio
What to write
| Part | Rule | Example |
|---|---|---|
| Title | A question with the verb and the specific person or thing. | Stop sharing with Leah Okonkwo? |
| Body | What happens, and whether it can be reversed. One or two sentences. | Leah will no longer see your network. You can share again at any time. |
| Confirm button | The same verb as the title. Never OK, Yes or Confirm. | Stop sharing |
| Cancel | Always "Cancel". Focus starts here. | Cancel |
| Afterward | The thing on screen changes in place. A toast only if the result happens out of sight (Feedback and undo). | The row's button becomes "Share network" |
Accessibility
- ConfirmDialog is an alert dialog: its title and body are read out, and focus is kept inside until it's answered.
- Focus starts on Cancel, so pressing Enter by habit never confirms by accident.
- Clicking outside doesn't close it, and while the action runs nothing can, so the person always sees the outcome.
- Red is never the only signal: the button's words say what will happen.
| Keys | What happens |
|---|---|
| Esc | Closes the dialog without acting (not while the action is running). |
| Tab | Moves between Cancel and the confirm button. |
| Enter / Space | Presses the focused button. |
Components this uses
Each opens that component’s own page, with its options and code.
| Component | Its job here |
|---|---|
| ConfirmDialog | Asks the question before anything happens; red with destructive. |
| Button | destructive (solid red) for the confirm; danger-ghost for a quiet Stop sharing button on a page. |
| ActionMenu | A danger item, last after a separator, when the action lives in a ⋮ menu. |
| Toast | Only when the result happens out of sight. |
Where Bridge OS differs today
Follow this page, not the gap.
- Bridge OS's StopSharingConfirmDialog duplicates ConfirmDialog with fixed copy; it should move onto ConfirmDialog.
- The sharing table's bulk Stop sharing uses the browser's native
confirm()(sharing-table.tsx); it moves to ConfirmDialog.
Sources
- Decision 2026-11-02
- Decision (destructive = solid red); components.md → Button, ActionMenu
- ux-copywriter skill → Confirmation dialogs
- components.md → ConfirmDialog
- Bridge OS sharing-table.tsx (bulk Stop sharing)
- Bridge OS stop-sharing-button.tsx; Feedback and undo pattern
- ConfirmDialog page → examples (Disconnect calendar)