Dark Mode

Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Improve Grid view UX#54846

Merged
bbovenzi merged 7 commits intoapache:mainfrom
astronomer:fix-grid-navigation
Aug 27, 2025
Merged

Improve Grid view UX#54846
bbovenzi merged 7 commits intoapache:mainfrom
astronomer:fix-grid-navigation

Conversation

Copy link
Contributor

bbovenzi commented Aug 22, 2025 *
edited
Loading

  • Enable keyboard navigation anytime something in the grid view is selected instead of requiring a click on the grid
  • Moved the grid keyboard nav hints into a tooltip
  • Make toggling task groups button variant from surface to outline to match other fields
  • Add focus to Grid item when navigating to maintain standard accessibility tabbing through the UI
  • Fix keyboard accessibility for expand/collapse details panel button
  • Make expand/collapse details panel button less distracting
  • Move grid item tooltip back to use chakra's tooltip. It works better visually and doesn't seem to have a significant performance effect anymore

^ Add meaningful description above
Read the Pull Request Guidelines for more information.
In case of fundamental code changes, an Airflow Improvement Proposal (AIP) is needed.
In case of a new dependency, check compliance with the ASF 3rd Party License Policy.
In case of backwards incompatible changes please leave a note in a newsfragment file, named {pr_number}.significant.rst or {issue_number}.significant.rst, in airflow-core/newsfragments.

bbovenzi requested review from jscheffl, pierrejeambrun, ryanahamilton and shubhamraj-git as code owners August 22, 2025 19:55
boring-cyborg bot added the area:UI Related to UI/UX. For Frontend Developers. label Aug 22, 2025
bbovenzi changed the title Improve grid keyboard navigation Improve Grid view UX Aug 22, 2025
bbovenzi added 2 commits August 25, 2025 11:45
Copy link
Contributor

jscheffl commented Aug 25, 2025

"Just for navigating" across logs this is really useful. But the proposed UX (as well as previous implementation) has the problem that some use cases are made harder:

  • If I want to scroll the logs via cursoer up-down this is now impossible. I can only scroll logs via mouse wheel. I think this is not acceptable. I need to have the option to click on the logs panel and scroll there via up-down keys
  • Same for the code tab
  • Where I like that I can flip through the log, if I want to flip through details or XCom this is a bit harder. I also have a common use case where I need to flip through other details. Would it be possible not to force that every flip switches to log view?

Otherwise all other changes are fine.

Copy link
Contributor Author

bbovenzi commented Aug 26, 2025 *
edited
Loading

Oh you're right. It messes with scrollable pages. We probably should change it to Shift+arrow so we're not overriding a default behavior. And then do something else for the jump to start/end

Yes, we should persist the tab that's selected if its available. Let me work on that in another PR.

Copy link
Contributor Author

bbovenzi commented Aug 26, 2025

Updated to switch normal navigation to shift+Arrow and jump actions to mod+Arrow in order to not override other arrow actions

jscheffl reviewed Aug 26, 2025
Copy link
Contributor

jscheffl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the re-work! Almost perfect, just wanted to approve as I noticed that CTRL+UP/DOWN is now clashing with grid vs. Jumping hotkeys on the log panel :-(

Do we have other modifiers?

bbovenzi requested review from BasPH, Lee-W, bugraoz93, eladkal, hussein-awala, jason810496, mobuchowski, potiuk, romsharon98 and shahar1 as code owners August 27, 2025 18:39
Copy link
Contributor Author

bbovenzi commented Aug 27, 2025

I tested out a few others and I kept running into conflicts. I decided to just remove jumps altogether.

jscheffl approved these changes Aug 27, 2025
Copy link
Contributor

jscheffl left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Thanks for the rework! Looks good now!

bbovenzi merged commit 81ef598 into apache:main Aug 27, 2025
55 checks passed
bbovenzi deleted the fix-grid-navigation branch August 27, 2025 22:16
mangal-vairalkar pushed a commit to mangal-vairalkar/airflow that referenced this pull request Aug 30, 2025
* Improve grid kbd navigation

* Use chakra tooltip

* Fix static checks

* Fix static checks

* Upgrade keyboard commands to not conflict with regular arrow actions

* Remove jump hotkeys

* Remove english translation for jump
nothingmin pushed a commit to nothingmin/airflow that referenced this pull request Sep 2, 2025
* Improve grid kbd navigation

* Use chakra tooltip

* Fix static checks

* Fix static checks

* Upgrade keyboard commands to not conflict with regular arrow actions

* Remove jump hotkeys

* Remove english translation for jump
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Reviewers

jscheffl jscheffl approved these changes

pierrejeambrun Awaiting requested review from pierrejeambrun pierrejeambrun is a code owner

ryanahamilton Awaiting requested review from ryanahamilton ryanahamilton is a code owner

shubhamraj-git Awaiting requested review from shubhamraj-git shubhamraj-git is a code owner

bugraoz93 Awaiting requested review from bugraoz93 bugraoz93 is a code owner

Lee-W Awaiting requested review from Lee-W Lee-W is a code owner

jason810496 Awaiting requested review from jason810496 jason810496 is a code owner

potiuk Awaiting requested review from potiuk potiuk is a code owner

mobuchowski Awaiting requested review from mobuchowski mobuchowski is a code owner

BasPH Awaiting requested review from BasPH BasPH is a code owner

eladkal Awaiting requested review from eladkal

shahar1 Awaiting requested review from shahar1 shahar1 is a code owner

romsharon98 Awaiting requested review from romsharon98 romsharon98 is a code owner

hussein-awala Awaiting requested review from hussein-awala hussein-awala is a code owner

Assignees

No one assigned

Labels

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

Projects

None yet

Milestone

No milestone

Development

Successfully merging this pull request may close these issues.

2 participants