parkhojeong commented on code in PR #68346:
URL: https://github.com/apache/airflow/pull/68346#discussion_r3419616872
##########
airflow-core/src/airflow/ui/src/components/DataTable/TableList.tsx:
##########
@@ -87,7 +93,22 @@ export const TableList = <TData,>({ allowFiltering,
renderSubComponent, table }:
<Table.Body>
{table.getRowModel().rows.map((row) => (
<Fragment key={row.id}>
- <Table.Row>
+ <Table.Row
+ _hover={onRowClick === undefined ? undefined : { bg: "bg.subtle"
}}
+ cursor={onRowClick === undefined ? undefined : "pointer"}
+ onClick={onRowClick === undefined ? undefined : () =>
onRowClick(row)}
Review Comment:
Thanks for the catch!
After thinking about it, using the row as a button would make the button
contain interactive elements. Also, a single cell would support two different
actions.
<!-- <img width="800" height="185" alt="image"
src="https://github.com/user-attachments/assets/2cded75d-9106-4c8d-9fe3-4dc64a6c068d";
/> -->
- <img width="253" height="84" alt="image"
src="https://github.com/user-attachments/assets/6bab3e4b-e38e-43a4-a7cf-ef6380f6036a";
/>
HTML spec is `The Button element: ... there must be no interactive content
descendant ...`
-
https://html.spec.whatwg.org/multipage/dom.html#concept-element-content-model
---
Given these concerns, I replaced the row button with a small icon button to
open the drawer. What do you think?
https://github.com/apache/airflow/pull/68346/commits/e8dfa958c7a2378b7e69fbcfb7f6c45003d1cfa3
<img width="788" height="268" alt="image"
src="https://github.com/user-attachments/assets/64497a47-7648-4f4d-87b5-1fe15f191e1b";
/>
--
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]
