github-actions[bot] opened a new pull request, #75318:
URL: https://github.com/apache/airflow/pull/75318

   * Wrap long values in Dag version diff table so After stays visible
   
   The Versions tab compares two Dag versions in a table whose path,
   before and after cells show serialized values of up to 120 characters.
   These are mostly JSON or long paths with no spaces, so the browser
   could not wrap them. The table grew far wider than its container
   (2146px in a 1100px window), and since DataTable has no horizontal
   scroll, the rightmost After column was clipped out of view. Narrower
   windows made it worse.
   
   Let those cells wrap with overflow-wrap: anywhere and
   white-space: pre-wrap. overflow-wrap: break-word is not enough: it
   does not lower the cell's min-content width, so the table would still
   overflow. The trade-off is that short paths can break mid-word in
   narrow windows.
   
   * UI: Read a Dag version diff's values as JSON, not as a cut string
   
   A change to a Dag version carries the serialized value on each side, and
   a whole task added or removed carries its entire payload. Flattened into
   a cell and cut at 120 characters, those values said little more than
   that something had changed; as a JSON preview they name the keys that
   differ and open in place when the rest matters.
   
   The cells were also set as code, whose surface sits on the table's own
   striped rows at nearly the same shade, and a path was free to break
   after any character, so a column squeezed by its neighbours read
   vertically, one glyph per line. A side the change does not have now
   leaves its cell empty, since a dash reads as a value the version holds.
   
   Carrying a preview on each side of a comparison asks two things of the
   rendered JSON field that its other callers never did. It sized itself
   for one payload per row, where one long entry — a dotted class path, a
   URL — could widen its column past the pane whatever bound it was given,
   since a badge sets its value on one line. And its copy button, shown
   outright, competes with the values for attention on every row it
   appears in; waiting for the pointer, or for focus so a keyboard can
   still reach it, keeps a list to its content. Both now hold wherever a
   JSON field is rendered.
   
   What the comparison says about itself was spread over three stacked
   rows above the table, and the warning that a bound had cut it short sat
   nowhere near the field that sets that bound — the one control that can
   lift it. The summary now heads the table's own header row, beside the
   columns menu, and the bound carries its own notice.
   
   The tab's components were sharing two files, which left the table, its
   cells and the page's query in the same place as whichever one was being
   read.
   
   Co-Authored-By: Claude <[email protected]>
   
   ---------
   (cherry picked from commit 5c021ce54423c022541fdcf72da2537adbf1a1bd)
   
   Co-authored-by: Brent Bovenzi <[email protected]>
   Co-authored-by: jedcunningham 
<[email protected]>
   Co-authored-by: Claude <[email protected]>


-- 
This is an automated message from the Apache Git Service.
To respond to the message, please log on to GitHub and use the
URL above to go to the specific comment.

To unsubscribe, e-mail: [email protected]

For queries about this service, please contact Infrastructure at:
[email protected]

Reply via email to