apache/airflow

UI: Unpin @chakra-ui/react (currently capped at ~3.34.0)

已关闭

#67,647 创建于 2026年5月28日

 (3 条评论) (0 个反应) (0 位负责人)Python (16,781 个派生)batch import
area:UIgood first issue

仓库指标

星标
 (44,809 个星标)
PR 合并指标
 (平均合并 7天 18小时) (30 天内合并 834 个 PR)

描述

Background

PR #67646 capped @chakra-ui/react at ~3.34.0 (patch only) because the 3.35 bump pulled in @ark-ui/react >=5.36 and triggered a page-unresponsive bug after closing any Clear / Mark-as dialog without confirming. (Or even after successfully submitting I believe)

Per Ark UI's 5.36.0 release notes:

Dialog / Drawer: Avoid setting inline pointer-events when modal, letting the dismissable layer manage it.

The cleanup moved from an inline DOM style (which disappeared on unmount) to the dismissable layer's close-transition callback. Several buttons in this codebase mount their dialog conditionally ({open ? <Dialog .../> : undefined}), which unmounts the dialog before the close transition runs and leaves the pointer-events: none lock stuck on document.

What needs doing

Unpin @chakra-ui/react so we can pick up 3.35+ and future Ark UI fixes. To do so safely the conditional-mount sites must be rewritten first.

  1. Go over all the Run/TI actions (clear, mark as, delete, etc...) and verify that after cancelling and confirming the UI remains usable. Without any fix the UI will not respond to mouse click on buttons anywhere in the page.

  2. Bump @chakra-ui/react to ^3.35.0 (or latest) in airflow-core/src/airflow/ui/package.json and remove the Dependency upgrade caveats section in airflow-core/src/airflow/ui/CONTRIBUTING.md.

Note!: The pattern that unmounts the modals was done on purpose so the 'note' value would 'reset' to the TI / Run note when re-opened again. We didn't want to fix #47071 and we don't want a regression on that front.

Affected files

Parent buttons / headers that need to drop the {open ? <Dialog/> : undefined} wrapping:

  • airflow-core/src/airflow/ui/src/components/Clear/Run/ClearRunButton.tsx
  • airflow-core/src/airflow/ui/src/components/Clear/TaskInstance/ClearTaskInstanceButton.tsx (three discriminator branches)
  • airflow-core/src/airflow/ui/src/components/MarkAs/Run/MarkRunAsButton.tsx
  • airflow-core/src/airflow/ui/src/components/MarkAs/TaskInstance/MarkTaskInstanceAsButton.tsx
  • airflow-core/src/airflow/ui/src/pages/TaskInstance/Header.tsx

Dialogs themselves (will need a handleClose and possibly an enabled: open on a dry-run query):

  • airflow-core/src/airflow/ui/src/components/Clear/Run/ClearRunDialog.tsx
  • airflow-core/src/airflow/ui/src/components/Clear/TaskInstance/ClearTaskInstanceDialog.tsx
  • airflow-core/src/airflow/ui/src/components/MarkAs/Run/MarkRunAsDialog.tsx
  • airflow-core/src/airflow/ui/src/components/MarkAs/TaskInstance/MarkTaskInstanceAsDialog.tsx

How to verify

  1. Open any Clear or Mark-as dialog from the Dag Runs list, the Task Instances list, or the per-run / per-TI detail pages.
  2. Close the dialog without confirming (X button, Escape, or click the backdrop).
  3. The rest of the page must still be clickable. Scroll alone isn't enough — links, buttons, and table rows must respond.
  4. Repeat after a confirmed action (Confirm + close on success) — same expectation.
  5. Reopen the same dialog: the note field should show the run/TI's note value, not whatever you typed before cancelling.

贡献者指南