Skip to content

fix: align param controls in trigger DAG flexible form (#67852)#68003

Open
bujjibabukatta wants to merge 1 commit into
apache:mainfrom
bujjibabukatta:fix/#67852
Open

fix: align param controls in trigger DAG flexible form (#67852)#68003
bujjibabukatta wants to merge 1 commit into
apache:mainfrom
bujjibabukatta:fix/#67852

Conversation

@bujjibabukatta
Copy link
Copy Markdown

Summary

Fixes #67852

In the AF3 Trigger DAG modal, boolean toggle switches and other param controls were not vertically aligned with their labels in the horizontal two-column layout. When labels differed in length, controls appeared at inconsistent heights, making the form harder to scan.

Changes

FieldRow.tsx

  • Added columnGap={4} to Field.Root to add breathing room between the label and control columns
  • Added justifyContent="center" to the control Stack so that Switch toggles (and other controls) vertically center within their column cell

No changes to FieldBool.tsx or any other field component — the misalignment was purely a layout issue in FieldRow.

Testing

Tested with a DAG that has multiple boolean params of varying label lengths. Toggles now share a consistent right-aligned column, matching the AF2 trigger form behaviour described in the issue.

Related

@boring-cyborg boring-cyborg Bot added the area:UI Related to UI/UX. For Frontend Developers. label Jun 4, 2026
@boring-cyborg
Copy link
Copy Markdown

boring-cyborg Bot commented Jun 4, 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.

Trigger DAG modal: two-column layout for params (label left, control right)

1 participant