Skip to content

fix: remove conditional dialog mounts; bump @chakra-ui/react to ^3.35.0#67796

Open
sridhar-3009 wants to merge 1 commit into
apache:mainfrom
sridhar-3009:fix/unpin-chakra-ui-dialog-mounts
Open

fix: remove conditional dialog mounts; bump @chakra-ui/react to ^3.35.0#67796
sridhar-3009 wants to merge 1 commit into
apache:mainfrom
sridhar-3009:fix/unpin-chakra-ui-dialog-mounts

Conversation

@sridhar-3009
Copy link
Copy Markdown

Summary

Resolves #67647.

Ark UI 5.36 moved pointer-events cleanup from an inline DOM style to the dismissable layer's close-transition callback. Dialogs that were conditionally mounted ({open ? <Dialog/> : undefined}) unmounted before that transition ran, leaving pointer-events: none permanently stuck on document — every button/link click was silently swallowed until a hard refresh.

Root cause

The conditional mount pattern was intentional: unmounting reset useState (note, selectedOptions, etc.) so re-opening the dialog showed the server value, not the user's uncommitted input. Ark UI 5.36 made this pattern incompatible with the new cleanup approach.

Fix

Buttons — remove the open guard; always render the dialog:

// before
{open ? <ClearRunDialog ... /> : undefined}

// after
<ClearRunDialog ... />

Dialogs — add useEffect to reset local state when open goes false:

useEffect(() => {
  if (!open) {
    setNote(dagRun.note);
    setSelectedOptions(["existingTasks"]);
  }
}, [open, dagRun.note]);

This preserves the note-reset behaviour (#47071) while letting the dialog drive its own close transition.

Affected files

  • Clear/Run/ClearRunButton.tsx + ClearRunDialog.tsx
  • Clear/TaskInstance/ClearTaskInstanceButton.tsx + ClearTaskInstanceDialog.tsx
  • MarkAs/Run/MarkRunAsButton.tsx + MarkRunAsDialog.tsx
  • MarkAs/TaskInstance/MarkTaskInstanceAsButton.tsx + MarkTaskInstanceAsDialog.tsx
  • pages/TaskInstance/Header.tsx
  • package.json: ~3.34.0^3.35.0
  • CONTRIBUTING.md: remove now-resolved caveat section

Verification checklist

  • Open any Clear/Mark-as dialog; cancel via X, Escape, or backdrop click; confirm the rest of the page remains clickable
  • Reopen the same dialog; confirm the note field shows the run/TI server value
  • Confirm a clear/mark-as action; close success dialog; confirm page is still clickable

….35.0

Ark UI 5.36 moved the pointer-events cleanup from an inline DOM style to
the dismissable layer's close-transition callback. Conditionally mounted
dialogs ({open ? <Dialog/> : undefined}) unmount before that transition
fires, leaving pointer-events:none stuck on document — all button/link
clicks stop working until a full page refresh.

Fix: always render the affected dialogs; control visibility via the open
prop. Reset local state (note, selectedOptions, preventRunningTask) via
useEffect on open→false so re-opening shows the server value, not what
the user typed before cancelling (preserves the behaviour that motivated
the conditional mount in the first place).

Affected components:
- Clear/Run/ClearRunButton + ClearRunDialog
- Clear/TaskInstance/ClearTaskInstanceButton + ClearTaskInstanceDialog
- MarkAs/Run/MarkRunAsButton + MarkRunAsDialog
- MarkAs/TaskInstance/MarkTaskInstanceAsButton + MarkTaskInstanceAsDialog
- pages/TaskInstance/Header (clearOpen guard)

Also bumps @chakra-ui/react from ~3.34.0 to ^3.35.0 and removes the
now-resolved CONTRIBUTING.md caveat section.

Closes apache#67647
@boring-cyborg boring-cyborg Bot added the area:UI Related to UI/UX. For Frontend Developers. label May 31, 2026
@boring-cyborg
Copy link
Copy Markdown

boring-cyborg Bot commented May 31, 2026

Congratulations on your first Pull Request and welcome to the Apache Airflow community! If you have any issues or are unsure about any anything please check our Contributors' Guide
Here are some useful points:

  • Pay attention to the quality of your code (ruff, mypy and type annotations). Our prek-hooks will help you with that.
  • In case of a new feature add useful documentation (in docstrings or in docs/ directory). Adding a new operator? Check this short guide Consider adding an example Dag that shows how users should use it.
  • Consider using Breeze environment for testing locally, it's a heavy docker but it ships with a working Airflow and a lot of integrations.
  • Be patient and persistent. It might take some time to get a review or get the final approval from Committers.
  • Please follow ASF Code of Conduct for all communication including (but not limited to) comments on Pull Requests, Mailing list and Slack.
  • Be sure to read the Airflow Coding style.
  • Always keep your Pull Requests rebased, otherwise your build might fail due to changes not related to your commits.
    Apache Airflow is a community-driven project and together we are making it better 🚀.
    In case of doubts contact the developers at:
    Mailing List: dev@airflow.apache.org
    Slack: https://s.apache.org/airflow-slack

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

area:UI Related to UI/UX. For Frontend Developers.

Projects

None yet

Development

Successfully merging this pull request may close these issues.

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

1 participant