diff --git a/packages/admin-next/dashboard/src/components/table/data-table/data-table-root/data-table-root.tsx b/packages/admin-next/dashboard/src/components/table/data-table/data-table-root/data-table-root.tsx index 99ebdf4674..4eb520bb6b 100644 --- a/packages/admin-next/dashboard/src/components/table/data-table/data-table-root/data-table-root.tsx +++ b/packages/admin-next/dashboard/src/components/table/data-table/data-table-root/data-table-root.tsx @@ -140,7 +140,7 @@ export const DataTableRoot = ({ ({ : undefined, }} className={clx({ - "bg-ui-bg-base sticky left-0 after:absolute after:inset-y-0 after:right-0 after:h-full after:w-px after:bg-transparent after:content-['']": + "bg-ui-bg-base sticky inset-y-0 left-0 after:absolute after:inset-y-0 after:right-0 after:h-full after:w-px after:bg-transparent after:content-['']": isStickyHeader, "left-[68px]": isStickyHeader && hasSelect && !isSelectHeader, @@ -206,7 +206,7 @@ export const DataTableRoot = ({ key={row.id} data-selected={row.getIsSelected()} className={clx( - "transition-fg group/row [&_td:last-of-type]:w-[1%] [&_td:last-of-type]:whitespace-nowrap", + "transition-fg group/row group relative [&_td:last-of-type]:w-[1%] [&_td:last-of-type]:whitespace-nowrap", "has-[[data-row-link]:focus-visible]:bg-ui-bg-base-hover", { "bg-ui-bg-subtle hover:bg-ui-bg-subtle-hover": isOdd, @@ -241,23 +241,27 @@ export const DataTableRoot = ({ ? row.depth * 14 + 24 : undefined + const hasLeftOfsset = + isStickyCell && hasSelect && !isSelectCell + const Inner = flexRender( cell.column.columnDef.cell, cell.getContext() ) - const isTabableLink = index === 0 && !!to + const isTabableLink = isFirstCell && !!to + const shouldRenderAsLink = !!to && !isSelectCell return ( ({ : undefined, }} > - {to ? ( + {shouldRenderAsLink ? ( - {Inner} +
+ {Inner} +
) : ( Inner