Skip to content

Commit 941e4a2

Browse files
committed
fix(webapp): make query result sorting keyboard accessible
1 parent 1cae855 commit 941e4a2

1 file changed

Lines changed: 10 additions & 4 deletions

File tree

apps/webapp/app/components/code/TSQLResultsTable.tsx

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -959,11 +959,17 @@ function HeaderCellContent({
959959
) : (
960960
<span className="min-w-0 flex-1 truncate text-left">{children}</span>
961961
)}
962-
{/* Sort indicator */}
962+
{/* The full header remains a pointer target, while this dedicated control makes sorting keyboard-accessible without nesting the tooltip or filter controls. */}
963963
{canSort && (
964-
<span
964+
<button
965+
type="button"
966+
aria-label="Toggle sort"
967+
onClick={(event) => {
968+
event.stopPropagation();
969+
onSortClick?.(event);
970+
}}
965971
className={cn(
966-
"shrink-0 transition-colors",
972+
"shrink-0 rounded transition-colors focus-custom",
967973
sortHighlighted ? "text-text-bright" : "text-text-dimmed"
968974
)}
969975
>
@@ -974,7 +980,7 @@ function HeaderCellContent({
974980
) : (
975981
<ChevronUpDownIcon className="size-4" />
976982
)}
977-
</span>
983+
</button>
978984
)}
979985
{onFilterClick && (
980986
<button

0 commit comments

Comments
 (0)