From 9f9aa5c82454acb4a4cb1b7199337e53ac2115b2 Mon Sep 17 00:00:00 2001
From: Arthur Bassi <arthur.bassi@luby.com.br>
Date: Fri, 4 Sep 2026 13:27:53 -0300
Subject: [PATCH] fix(work-orders): restore AAP span grip while keeping
 keyboard reorder

---
 .../table/wo-table-row-reorder-handle.tsx     | 31 ++++---------------
 .../wo-table-row-reorder-keyboard.test.tsx    |  3 +-
 2 files changed, 8 insertions(+), 26 deletions(-)

diff --git a/src/app/(protected)/workorders/_components/list/table/wo-table-row-reorder-handle.tsx b/src/app/(protected)/workorders/_components/list/table/wo-table-row-reorder-handle.tsx
index 16220c5f..cfd2dcf5 100644
--- a/src/app/(protected)/workorders/_components/list/table/wo-table-row-reorder-handle.tsx
+++ b/src/app/(protected)/workorders/_components/list/table/wo-table-row-reorder-handle.tsx
@@ -7,13 +7,6 @@ type WoTableRowReorderHandleProps = {
   onArrowReorder: (delta: -1 | 1) => void;
 };
 
-function gripCursor(disabled: boolean, isDragging: boolean): string {
-  if (disabled) {
-    return "default";
-  }
-  return isDragging ? "grabbing" : "grab";
-}
-
 export function WoTableRowReorderHandle({
   disabled,
   isDragging,
@@ -21,27 +14,15 @@ export function WoTableRowReorderHandle({
   onArrowReorder,
 }: WoTableRowReorderHandleProps) {
   return (
-    <button
-      type="button"
-      disabled={disabled}
+    <span
+      role="button"
+      aria-disabled={disabled}
       tabIndex={disabled ? -1 : 0}
       aria-label={woNumber ? `Reorder work order ${woNumber}` : "Reorder work order"}
-      className="flex items-center justify-center bg-transparent p-0"
+      className="flex items-center justify-center"
       style={{
-        appearance: "none",
-        display: "inline-flex",
-        boxSizing: "border-box",
-        verticalAlign: "middle",
-        cursor: gripCursor(disabled, isDragging),
+        cursor: isDragging ? "grabbing" : "grab",
         color: "var(--color-text-muted)",
-        border: "none",
-        background: "transparent",
-        padding: 0,
-        margin: 0,
-        lineHeight: 0,
-        font: "inherit",
-        minWidth: 0,
-        minHeight: 0,
       }}
       onClick={(event) => event.stopPropagation()}
       onKeyDown={(event) => {
@@ -54,6 +35,6 @@ export function WoTableRowReorderHandle({
       }}
     >
       <GripVertical size={14} aria-hidden />
-    </button>
+    </span>
   );
 }
diff --git a/src/test/app/(protected)/workorders/wo-table-row-reorder-keyboard.test.tsx b/src/test/app/(protected)/workorders/wo-table-row-reorder-keyboard.test.tsx
index 13cfd51e..836eb62b 100644
--- a/src/test/app/(protected)/workorders/wo-table-row-reorder-keyboard.test.tsx
+++ b/src/test/app/(protected)/workorders/wo-table-row-reorder-keyboard.test.tsx
@@ -126,7 +126,8 @@ describe("WoTableRow keyboard reorder", () => {
     renderRow(row, [row], handlers({ onReorder }));
 
     const grip = screen.getByRole("button", { name: "Reorder work order WO-1" });
-    expect(grip).toBeDisabled();
+    expect(grip).toHaveAttribute("aria-disabled", "true");
+    expect(grip).toHaveAttribute("tabindex", "-1");
     fireEvent.keyDown(grip, { key: "ArrowDown" });
     expect(onReorder).not.toHaveBeenCalled();
   });