Pass around toggle instead of toggler

Author: robertbrignull

extensions/ql-vscode/src/view/results/AlertTable.tsx

@@ -84,12 +84,6 @@ export class AlertTable extends React.Component<
       };
     };
 
-    const toggler: (keys: Keys.ResultKey[]) => (e: React.MouseEvent) => void = (
-      indices,
-    ) => {
-      return (e) => this.toggle(e, indices);
-    };
-
     if (!resultSet.interpretation.data.runs?.[0]?.results?.length) {
       return <AlertTableNoResults {...this.props} />;
     }
@@ -109,7 +103,7 @@ export class AlertTable extends React.Component<
                 databaseUri={databaseUri}
                 sourceLocationPrefix={sourceLocationPrefix}
                 updateSelectionCallback={updateSelectionCallback}
-                toggler={toggler}
+                toggleExpanded={this.toggle.bind(this)}
                 scroller={this.scroller}
               />
             ),

extensions/ql-vscode/src/view/results/AlertTablePathRow.tsx

@@ -18,7 +18,7 @@ interface Props {
   updateSelectionCallback: (
     resultKey: Keys.PathNode | Keys.Result | undefined,
   ) => () => void;
-  toggler: (keys: Keys.ResultKey[]) => (e: React.MouseEvent) => void;
+  toggleExpanded: (e: React.MouseEvent, keys: Keys.ResultKey[]) => void;
   scroller: ScrollIntoViewHelper;
 }
 
@@ -32,7 +32,7 @@ export function AlertTablePathRow(props: Props) {
     databaseUri,
     sourceLocationPrefix,
     updateSelectionCallback,
-    toggler,
+    toggleExpanded,
     scroller,
   } = props;
 
@@ -41,8 +41,8 @@ export function AlertTablePathRow(props: Props) {
     [pathIndex, resultIndex],
   );
   const handleDropdownClick = useMemo(
-    () => toggler([pathKey]),
-    [pathKey, toggler],
+    () => (e: React.MouseEvent) => toggleExpanded(e, [pathKey]),
+    [pathKey, toggleExpanded],
   );
 
   const isPathSpecificallySelected = Keys.equalsNotUndefined(

extensions/ql-vscode/src/view/results/AlertTableResultRow.tsx

@@ -20,7 +20,7 @@ interface Props {
   updateSelectionCallback: (
     resultKey: Keys.PathNode | Keys.Result | undefined,
   ) => () => void;
-  toggler: (keys: Keys.ResultKey[]) => (e: React.MouseEvent) => void;
+  toggleExpanded: (e: React.MouseEvent, keys: Keys.ResultKey[]) => void;
   scroller: ScrollIntoViewHelper;
 }
 
@@ -33,7 +33,7 @@ export function AlertTableResultRow(props: Props) {
     databaseUri,
     sourceLocationPrefix,
     updateSelectionCallback,
-    toggler,
+    toggleExpanded,
     scroller,
   } = props;
 
@@ -53,8 +53,8 @@ export function AlertTableResultRow(props: Props) {
         : /* if there's exactly one path, auto-expand
            * the path when expanding the result */
           [resultKey];
-    return toggler(indices);
-  }, [result, resultKey, toggler]);
+    return (e: React.MouseEvent) => toggleExpanded(e, indices);
+  }, [result, resultKey, toggleExpanded]);
 
   const resultRowIsSelected =
     selectedItem?.resultIndex === resultIndex &&
@@ -122,7 +122,7 @@ export function AlertTableResultRow(props: Props) {
             databaseUri={databaseUri}
             sourceLocationPrefix={sourceLocationPrefix}
             updateSelectionCallback={updateSelectionCallback}
-            toggler={toggler}
+            toggleExpanded={toggleExpanded}
             scroller={scroller}
           />
         ))}