Merge pull request #2812 from andrewjcasal/shift_annul_queue

Shift key to select rows for annul queue
online-go · Sep 8, 2024 · 44f5913 · 44f5913
2 parents 247b059 + fec8c83
commit 44f5913
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 37 deletions.
diff --git a/src/components/PaginatedTable/PaginatedTable.tsx b/src/components/PaginatedTable/PaginatedTable.tsx
@@ -55,6 +55,7 @@ interface PaginatedTableProperties<RawEntryT, GroomedEntryT = RawEntryT> {
     onRowClick?: (
         row: GroomedEntryT,
         ev: React.MouseEvent | React.TouchEvent | React.PointerEvent,
+        rows: GroomedEntryT[],
     ) => any;
     debug?: boolean;
     pageSizeOptions?: Array<number>;
@@ -63,7 +64,7 @@ interface PaginatedTableProperties<RawEntryT, GroomedEntryT = RawEntryT> {
     hidePageControls?: boolean;
     /** If provided, the table will listen for this push event and refresh its data accordingly */
     uiPushProps?: { event: string; channel: string };
-    annulQueue?: any[];
+    highlightedRows?: any[];
 }
 
 export interface PaginatedTableRef {
@@ -355,40 +356,21 @@ function _PaginatedTable<RawEntryT = any, GroomedEntryT = RawEntryT>(
                                     {column_render(column, row)}
                                 </td>
                             ));
-                            if (props.annulQueue) {
-                                if (props.onRowClick) {
-                                    return (
-                                        <tr
-                                            key={row.id}
-                                            className={
-                                                props.annulQueue.includes(row) ? "queued" : ""
-                                            }
-                                            onMouseUp={(ev) =>
-                                                props.onRowClick && props.onRowClick(row, ev)
-                                            }
-                                        >
-                                            {cols}
-                                        </tr>
-                                    );
-                                } else {
-                                    return <tr key={row.id}>{cols}</tr>;
-                                }
-                            } else {
-                                if (props.onRowClick) {
-                                    return (
-                                        <tr
-                                            key={row.id}
-                                            onMouseUp={(ev) =>
-                                                props.onRowClick && props.onRowClick(row, ev)
-                                            }
-                                        >
-                                            {cols}
-                                        </tr>
-                                    );
-                                } else {
-                                    return <tr key={row.id}>{cols}</tr>;
-                                }
-                            }
+                            return (
+                                <tr
+                                    key={row.id}
+                                    className={
+                                        props.highlightedRows && props.highlightedRows.includes(row)
+                                            ? "queued"
+                                            : ""
+                                    }
+                                    onMouseUp={(ev) =>
+                                        props.onRowClick && props.onRowClick(row, ev, rows)
+                                    }
+                                >
+                                    {cols}
+                                </tr>
+                            );
                         })}
                         {blank_rows}
                     </tbody>

diff --git a/src/views/User/GameHistoryTable.tsx b/src/views/User/GameHistoryTable.tsx
@@ -102,9 +102,27 @@ export function GameHistoryTable(props: GameHistoryProps) {
     function handleRowClick(
         row: GroomedGame,
         ev: React.MouseEvent | React.TouchEvent | React.PointerEvent,
+        rows: GroomedGame[],
     ) {
+        if (row.annulled) {
+            return;
+        }
+
         if (selectModeActive) {
-            toggleQueued(row);
+            if (ev.shiftKey) {
+                if (annulQueue.at(-1)) {
+                    window.getSelection()?.removeAllRanges();
+                    const indexes = [
+                        rows.findIndex((r) => r.id === annulQueue.at(-1).id),
+                        rows.findIndex((r) => r.id === row.id),
+                    ];
+                    const minIndex = Math.min(...indexes);
+                    const maxIndex = Math.max(...indexes);
+                    setAnnulQueue(rows.slice(minIndex, maxIndex + 1).filter((r) => !r.annulled));
+                }
+            } else {
+                toggleQueued(row);
+            }
         } else {
             openUrlIfALinkWasNotClicked(ev, row.href);
         }
@@ -336,7 +354,7 @@ export function GameHistoryTable(props: GameHistoryProps) {
                         groom={game_history_groomer}
                         pageSizeOptions={[10, 15, 25, 50]}
                         onRowClick={handleRowClick}
-                        annulQueue={annulQueue}
+                        highlightedRows={annulQueue}
                         columns={[
                             {
                                 header: _("User"),