fix(chat): correct delete-message dialog dismiss race and restore destructive styling

[zhangmo8]

Summary

Fixes two long-standing UX issues with the message delete action:

1. Dialog dismiss race — AlertDialogAction wraps reka-ui DialogClose which calls rootContext.onOpenChange(false) on click, closing the dialog. Our @click handler ran after that close, by which time pendingDeleteMessageId was already cleared, so confirmMessageDelete returned early and no deletion happened.

2. Destructive styling — The delete confirm button used default primary colors; the trash icon in the toolbar used muted-foreground. Both now use the destructive color palette.

Changes

File	Change
AlertDialogAction.vue	Added optional variant prop, forwarded to buttonVariants({ variant })
ChatPage.vue	Delete confirm button: variant="destructive" + @click.capture to beat DialogClose event ordering
MessageToolbar.vue	Trash icon: text-destructive/70 hover:text-destructive hover:bg-destructive/10
useMessageActions.ts	Accept toast/t options; show destructive error toast on delete failure instead of silent console.error
useMessageActions.test.ts	New test covering delete-failure toast path

Verification

• pnpm exec vitest run test/renderer/features/chat-page/composables/useMessageActions.test.ts test/renderer/components/ChatPage.test.ts — 99 passed
• pnpm run format / pnpm run i18n / pnpm run lint — all clean

Summary by CodeRabbit

• New Features

  • Added destructive styling to the delete action.
  • Added destructive variants for alert-dialog action buttons.
  • Deletion failures now display a localized error notification.

• Bug Fixes

  • Improved delete confirmation handling to ensure actions respond reliably.

• Tests

  • Added coverage verifying error notifications when message deletion fails.

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro Plus

Run ID: e0248337-dfee-4b76-b7a3-37adf20eda30

📥 Commits

Reviewing files that changed from the base of the PR and between 528955a and 87a1431.

📒 Files selected for processing (5)

• src/renderer/src/components/message/MessageToolbar.vue
• src/renderer/src/features/chat-page/ChatPage.vue
• src/renderer/src/features/chat-page/composables/useMessageActions.ts
• src/shadcn/components/ui/alert-dialog/AlertDialogAction.vue
• test/renderer/features/chat-page/composables/useMessageActions.test.ts

---

📝 Walkthrough

Walkthrough

Message deletion now uses destructive confirmation styling, capture-phase click handling, and localized destructive toasts when deletion fails in writable session views.

Changes

Message deletion flow

Layer / File(s)	Summary
Destructive confirmation styling and event wiring src/shadcn/components/ui/alert-dialog/AlertDialogAction.vue, src/renderer/src/components/message/MessageToolbar.vue, src/renderer/src/features/chat-page/ChatPage.vue	AlertDialogAction supports variant-based button styling; deletion controls use destructive colors and capture-phase confirmation handling.
Delete error feedback and validation src/renderer/src/features/chat-page/composables/useMessageActions.ts, src/renderer/src/features/chat-page/ChatPage.vue, test/renderer/features/chat-page/composables/useMessageActions.test.ts	useMessageActions receives translation and toast callbacks, emits localized destructive feedback for failed deletions, and tests the error path.

Estimated code review effort: 3 (Moderate) | ~20 minutes

Sequence Diagram(s)

sequenceDiagram
  participant ChatPage
  participant useMessageActions
  participant sessionClient
  participant toast
  participant t
  ChatPage->>useMessageActions: confirmMessageDelete()
  useMessageActions->>sessionClient: deleteMessage()
  sessionClient-->>useMessageActions: deletion error
  useMessageActions->>t: translate delete error strings
  t-->>useMessageActions: localized title and description
  useMessageActions->>toast: show destructive error toast

Loading

Possibly related PRs

• ThinkInAIXYZ/deepchat#1863: Modifies the ChatPage message-deletion confirmation flow.
• ThinkInAIXYZ/deepchat#2000: Modifies the useMessageActions message-deletion path and its tests.

Suggested reviewers: yyhhyyyyyy

🚥 Pre-merge checks | ✅ 5

✅ Passed checks (5 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	The title clearly matches the main changes: fixing the delete-dialog dismiss race and restoring destructive styling.
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.
Linked Issues check	✅ Passed	Check skipped because no linked issues were found for this pull request.
Out of Scope Changes check	✅ Passed	Check skipped because no linked issues were found for this pull request.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/delete-message-dialog

---

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

• X
• Mastodon
• Reddit
• LinkedIn

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

[yyhhyyyyyy]

LGTM.