fix(alerts): show a delete failure after its confirmation dialog is dismissed

未关闭
  • 哪里不对？
#369 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

维护者通常 1 天内回复

还没有人认领这个 Issue。

评估

难度
3/5
预计耗时
1-2 天
新手友好度
62/100
Issue 类型
缺陷
描述清晰度
描述清楚
活跃度
活跃
技术栈
nextjs, playwright, react, typescript
领域
frontend

调研方向

Start in src/components/alerts/confirm-delete.tsx, around the DialogError render (line 87) and the DialogCloseButton cancel (line 93), and read the #367 fix in src/components/connections/connection-controls.tsx (ConfirmDialog, ConfirmForm) to see how the form reports through a ref whether it is still mounted in an open dialog. Then read e2e/connections.spec.ts for the page.route hold-dismiss-release pattern before editing e2e/alert-rules.spec.ts. Done looks like: failure shown beside the Delete button in an assertive live region after dismissal, shown in the reopened dialog when applicable, still in-dialog only while open, with the new e2e case passing under safe-e2e.sh plus typecheck and lint.

由索引模型根据 Issue 内容生成。

描述

area: alerts bug priority: P2 size: XS

Context

The same defect as #367, in the alerts delete confirmation. ConfirmDeleteForm in src/components/alerts/confirm-delete.tsx shows a failure only through DialogError inside the dialog (line 87). Its Cancel button (DialogCloseButton, line 93) stays enabled while the confirm button reads "Deleting", and Escape closes the dialog as well. The form stays mounted, so the action finishes, and a failure that arrives after the dialog closed lands in the hidden dialog. Nothing is shown or announced.

Found by the Fable review of #368 (review round 1), which fixed the connections dialogs only.

Plan

  • Follow the #367 fix in src/components/connections/connection-controls.tsx (ConfirmDialog and ConfirmForm). The confirmation reports whether it is still mounted in an open dialog, read through a ref on its form. When it is not, ConfirmDelete shows the failure beside its button, and also passes it to the open dialog's DialogError when a reopen replaced the confirmation, because the page behind an open modal is inert.
  • Cover it in e2e/alert-rules.spec.ts the way e2e/connections.spec.ts covers #367: hold the server action with page.route, dismiss, release, and expect the failure beside the button. Include the reopened case.

Acceptance criteria

  • Dismissing an alert rule or budget delete dialog while it reads "Deleting", then the delete failing, shows the failure beside the Delete button in an assertive live region.
  • Reopening the dialog before the failure arrives shows it in the reopened dialog, focused and announced, and beside the button once the dialog closes.
  • A failure while the dialog is open still shows only inside it (expectFailureInDialog checks this).
  • Playwright e2e coverage added for the dismissed case.

Files and areas

  • src/components/alerts/confirm-delete.tsx
  • e2e/alert-rules.spec.ts
  • Non-goals: the connections dialogs (#367), projects and public metrics dialogs.

Verification

  • safe-e2e.sh on e2e/alert-rules.spec.ts
  • npm run typecheck, npm run lint

Model: anthropic/claude-opus-5-5 | Reasoning effort: high

主要语言
TypeScript
星标
1
派生
1
平均合并
6 小时 56 分钟
30 天内合并 PR
136

环境准备

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

eddiejaoude/StackDash 的其他 Issue

查看 eddiejaoude/StackDash 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。