UI: Add grid tooltip to show RunType & note

[RoyLee1224]

Related issue

#28737

Changes

The tooltip now displays the following information on hover:

• Run ID
• Run Type
• Logical Date
• Duration
• Note (if available)

Handles Long Notes: Long notes will now be truncated with an ellipsis (...) to maintain a clean layout.

Screenshots

Before	After

Discussion and Feedback

1. Is the current tooltip sufficient? Is there anything that should be added or removed?
2. I noticed that Dag Recent Runs & Task Recent Runs also have tooltips. I'm happy to unify the tooltip styles across the application for a consistent user experience.

Task Recent Runs	Dag Recent Runs

---

^ 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.

[pierrejeambrun]

Thanks for the pull request.

I don't think we should show the note. Because the note needs to support markdown rendering, and also because the note can be hundreds of lines long. I'm not sure the tooltip would look good with such a long markdown note.

[RoyLee1224]

Hi @pierrejeambrun, thanks for the great feedback!

You've raised valid points. To address long notes, I've truncated them with an ellipsis to keep the UI clean. For Markdown,

it's shown as plain-text preview.

Long Note	Markdown

My concern is that simply indicating 'Contains Notes' requires users to click through to the details page. This can be inconvenient for those who just want to quickly scan the content.

What are your thoughts on this compromised approach of showing a truncated, plain-text preview of the note? I'm very open to discussing this further and exploring other potential solutions.

[pierrejeambrun]

I'm not super fan of showing a truncated note, I think it does not convey a lot of information and unformatted markdown does not look nice.

In airflow 2 we used to have a small visual indicator on the 'square' representing a TI or DagRun in the grid to indicate that there was a note, I did like that at the time. (And you had to select the specific TI or Run to then go see the Note)

Otherwise I think we can just get rid of the note in the tooltip tbh.

[jscheffl]

I'm not super fan of showing a truncated note, I think it does not convey a lot of information and unformatted markdown does not look nice.

In airflow 2 we used to have a small visual indicator on the 'square' representing a TI or DagRun in the grid to indicate that there was a note, I did like that at the time. (And you had to select the specific TI or Run to then go see the Note)

Otherwise I think we can just get rid of the note in the tooltip tbh.

I also think a note-indicator is suffcient. Notes can be a bit longer, if we preview then at least 5 lines... but I also do not think the note itself is super important in the popup.

[bbovenzi]

Let's check the rendering performance of a Dag with 50+ tasks and 25 runs. That was the main reason we dropped the tooltips from 3.0.0, the chakra v3 tooltip was slowing the down the UI a ton. So we need to test if later versions are better, if not, make our own performant tooltip.

[pierrejeambrun]

Brent merged back a new optimized tooltip for the grid in #53438. (It was removed because chakra tooltip performance was too bad on a big grid).

This PR can be rebased and updated to improve the current tooltip.