🤖 Fix all outstanding eslint warnings

frontend/components/AddHostsModal/PlatformWrapper/PlatformWrapper.tsx

@@ -60,9 +60,9 @@ const platformSubNav: IPlatformSubNav[] = [
 interface IPlatformWrapperProps {
   enrollSecret: string;
   onCancel: () => void;
-  certificate: any;
+  certificate: string | undefined;
   isFetchingCertificate: boolean;
-  fetchCertificateError: any;
+  fetchCertificateError: Error | null;
   config: IConfig | null;
 }
 
@@ -419,7 +419,7 @@ const PlatformWrapper = ({
                   <br />
                   {fetchCertificateError ? (
                     <span className={`${baseClass}__error`}>
-                      {fetchCertificateError}
+                      {fetchCertificateError?.message}
                     </span>
                   ) : (
                     <Button variant="inverse" onClick={onDownloadFlagfile}>

frontend/components/ClickableUrls/ClickableUrls.tsx

@@ -31,6 +31,7 @@ const ClickableUrls = ({ text, className }: IClickableUrls): JSX.Element => {
   return (
     <div
       className={clickableUrlClasses}
+      // eslint-disable-next-line react/no-danger
       dangerouslySetInnerHTML={{ __html: sanitizedTextWithLinks }}
     />
   );

frontend/components/Editor/Editor.tsx

@@ -52,6 +52,7 @@ interface IEditorProps {
   isFormField?: boolean;
   maxLines?: number;
   className?: string;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   onChange?: (value: string, event?: any) => void;
   onBlur?: () => void;
 }

frontend/components/HumanTimeDiffWithDateTip/HumanTimeDiffWithDateTip.tsx

@@ -7,6 +7,7 @@ import ReactTooltip, { Place } from "react-tooltip";
 
 interface IHumanTimeDiffWithDateTip {
   timeString: string;
+  // eslint-disable-next-line react/no-unused-prop-types
   cutoffBeforeFleetLaunch?: boolean;
   tooltipPosition?: Place;
 }

frontend/components/PaginatedList/PaginatedList.tests.tsx

@@ -47,13 +47,6 @@ describe("PaginatedList", () => {
     },
   ];
 
-  const fetchTinyPage = (pageNumber: number) => {
-    if (pageNumber <= 2) {
-      return [items[pageNumber]];
-    }
-    throw new Error("Invalid page number");
-  };
-
   const fetchSmallPage = (pageNumber: number) => {
     if (pageNumber === 0) {
       return [items[0], items[1]];

frontend/components/PaginatedList/PaginatedList.tsx

@@ -75,6 +75,7 @@ interface IPaginatedListProps<TItem> {
   helpText?: React.ReactNode;
 }
 
+// eslint-disable-next-line @typescript-eslint/no-explicit-any
 function PaginatedListInner<TItem extends Record<string, any>>(
   {
     data,
@@ -104,7 +105,7 @@ function PaginatedListInner<TItem extends Record<string, any>>(
   const [dirtyItems, setDirtyItems] = useState<Record<string | number, TItem>>(
     {}
   );
-  const [error, setError] = useState<Error | null>(null);
+  const [error] = useState<Error | null>(null);
   const idKey = _idKey ?? "id";
   const labelKey = _labelKey ?? "name";
   const pageSize = _pageSize ?? 20;

frontend/components/SQLEditor/SQLEditor.tsx

@@ -91,12 +91,12 @@ const SQLEditor = ({
     [`${baseClass}__wrapper--readonly-copy`]: !!isReadonlyCopy,
   });
 
-  const onClickCopy = () => {
+  const onClickCopy = useCallback(() => {
     stringToClipboard(value || "").then(() => {
       setCopied(true);
       setTimeout(() => setCopied(false), 2000);
     });
-  };
+  }, [value]);
 
   const fixHotkeys = (editor: Ace.Editor) => {
     editor.commands.removeCommand("gotoline");
@@ -261,7 +261,7 @@ const SQLEditor = ({
     onLoad && onLoad(editor);
   };
 
-  const onBlurHandler = (event: any, editor?: Ace.Editor): void => {
+  const onBlurHandler = (_event: unknown, editor?: Ace.Editor): void => {
     onBlur && onBlur(editor);
   };
 
@@ -313,7 +313,7 @@ const SQLEditor = ({
         </div>
       </div>
     );
-  }, [error, label, labelActionComponent, enableCopy, copied]);
+  }, [error, label, labelActionComponent, enableCopy, copied, onClickCopy]);
 
   const renderHelpText = () => {
     if (helpText) {

frontend/components/SyntaxHighlightedCode/SyntaxHighlightedCode.tsx

@@ -0,0 +1,32 @@
+import React from "react";
+
+import { syntaxHighlight } from "utilities/helpers";
+
+interface ISyntaxHighlightedCodeProps {
+  json: unknown;
+  className?: string;
+}
+
+/**
+ * Renders a JSON object as syntax-highlighted HTML inside a <pre> tag.
+ *
+ * This component wraps the `syntaxHighlight` utility which generates safe HTML
+ * from trusted JSON data (all HTML entities are escaped before span tags are
+ * added for styling). The dangerouslySetInnerHTML usage is intentional and safe
+ * because the content is never derived from user input — it is always
+ * serialized from a controlled JavaScript object.
+ */
+const SyntaxHighlightedCode = ({
+  json,
+  className,
+}: ISyntaxHighlightedCodeProps): JSX.Element => {
+  return (
+    <pre
+      className={className}
+      // eslint-disable-next-line react/no-danger
+      dangerouslySetInnerHTML={{ __html: syntaxHighlight(json) }}
+    />
+  );
+};
+
+export default SyntaxHighlightedCode;

frontend/components/SyntaxHighlightedCode/index.ts

@@ -0,0 +1 @@
+export { default } from "./SyntaxHighlightedCode";

frontend/components/TableContainer/DataTable/DataTable.tests.tsx

@@ -176,6 +176,7 @@ describe("DataTable - component", () => {
       },
     ];
 
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const data: any = [];
 
     render(

frontend/components/TableContainer/DataTable/DataTable.tsx

@@ -10,6 +10,7 @@ import React, {
 } from "react";
 import classnames from "classnames";
 import {
+  Cell,
   Column,
   HeaderGroup,
   Row,
@@ -37,18 +38,19 @@ const baseClass = "data-table-block";
 
 interface IDataTableProps {
   columns: Column[];
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   data: any;
   filters?: Record<string, string | number | boolean>;
   isLoading: boolean;
   manualSortBy?: boolean;
-  sortHeader: any;
-  sortDirection: any;
-  onSort: any; // TODO: an event type
+  sortHeader: string;
+  sortDirection: string;
+  onSort: (id: string | undefined, desc?: boolean) => void;
   disableMultiRowSelect: boolean;
   keyboardSelectableRows?: boolean;
   showMarkAllPages: boolean;
   isAllPagesSelected: boolean; // TODO: make dependent on showMarkAllPages
-  toggleAllPagesSelected?: any; // TODO: an event type and make it dependent on showMarkAllPages
+  toggleAllPagesSelected?: (value: boolean) => void;
   resultsTitle?: string;
   defaultPageSize: number;
   defaultPageIndex?: number;
@@ -72,6 +74,7 @@ interface IDataTableProps {
   /** Set to `true` to not display the footer section of the table */
   hideFooter?: boolean;
   onSelectSingleRow?: (value: Row) => void;
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   onClickRow?: (value: any) => void;
   onResultsCountChange?: (value: number) => void;
   /** Optional help text to render on bottom-left of the table. Hidden when table is loading and no
@@ -84,6 +87,7 @@ interface IDataTableProps {
   /** Optional override for react-table's row ID derivation.
    *  Note: avoid index-only row IDs in server-side paginated or selectable tables,
    *  as IDs would collide across pages. */
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   getRowId?: (row: any, index: number) => string;
 }
 
@@ -188,6 +192,7 @@ const DataTable = ({
       // Use a stable row ID when available (row.id), otherwise fall back to the index-based ID (default of react-table)
       getRowId:
         getRowIdProp ??
+        // eslint-disable-next-line @typescript-eslint/no-explicit-any
         ((row: any, index: number) =>
           row && row.id != null ? String(row.id) : String(index)),
       initialState: {
@@ -291,11 +296,22 @@ const DataTable = ({
       !!allFilters.length && setAllFilters(allFilters);
       setExportRows && setExportRows(rows);
     }
-  }, [tableFilters]);
+    // NOTE: `rows` is intentionally excluded from deps to avoid an infinite
+    // re-render loop.  `setExportRows` calls setState in the parent, which
+    // regenerates column configs, which produces a new `rows` reference,
+    // which would re-trigger this effect → OOM.  `tableFilters` is the
+    // correct trigger for this side-effect.
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [tableFilters, setAllFilters, setExportRows, setGlobalFilter]);
 
   useEffect(() => {
     setExportRows && setExportRows(rows);
-  }, [tableState.filters, rows.length]);
+    // NOTE: `rows` is intentionally excluded – only `rows.length` is used so
+    // we detect actual data-count changes without reacting to every
+    // referential change (which would cause an infinite loop via
+    // setExportRows → parent re-render → new columns → new rows → …).
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [tableState.filters, rows.length, setExportRows]);
 
   // Listen for changes to filters if clientSideFilter is enabled
 
@@ -323,7 +339,14 @@ const DataTable = ({
       toggleAllRowsSelected(false); // Resets row selection on query change (client-side)
     }
     isInitialRender.current = false;
-  }, [searchQuery, searchQueryColumn]);
+  }, [
+    searchQuery,
+    searchQueryColumn,
+    isClientSideFilter,
+    persistSelectedRows,
+    setDebouncedClientFilter,
+    toggleAllRowsSelected,
+  ]);
 
   useEffect(() => {
     if (isClientSideFilter && selectedDropdownFilter) {
@@ -332,7 +355,12 @@ const DataTable = ({
         ? setDebouncedClientFilter("platforms", "")
         : setDebouncedClientFilter("platforms", selectedDropdownFilter);
     }
-  }, [selectedDropdownFilter]);
+  }, [
+    selectedDropdownFilter,
+    isClientSideFilter,
+    setDebouncedClientFilter,
+    toggleAllRowsSelected,
+  ]);
 
   // track previous sort state
   const prevSort = useRef<{ id?: string; desc?: boolean }>({
@@ -372,7 +400,14 @@ const DataTable = ({
     prevSort.current = column
       ? { id: newId, desc: newDesc }
       : { id: undefined, desc: undefined };
-  }, [sortBy, sortHeader, onSort, sortDirection, isClientSidePagination]);
+  }, [
+    sortBy,
+    sortHeader,
+    onSort,
+    sortDirection,
+    isClientSidePagination,
+    gotoPage,
+  ]);
 
   /** For onClientSidePaginationChange only:
    * Prevents bug where URL page + table page mismatch
@@ -404,7 +439,7 @@ const DataTable = ({
 
   useEffect(() => {
     setPageSize(defaultPageSize);
-  }, [setPageSize]);
+  }, [setPageSize, defaultPageSize]);
 
   useDeepEffect(() => {
     if (
@@ -416,7 +451,7 @@ const DataTable = ({
   }, [tableState.selectedRowIds, toggleAllPagesSelected]);
 
   const onToggleAllPagesClick = useCallback(() => {
-    toggleAllPagesSelected();
+    toggleAllPagesSelected?.(true);
   }, [toggleAllPagesSelected]);
 
   const onClearSelectionClick = useCallback(() => {
@@ -426,7 +461,7 @@ const DataTable = ({
   }, [onClearSelection, toggleAllPagesSelected, toggleAllRowsSelected]);
 
   const onSelectRowClick = useCallback(
-    (row: any) => {
+    (row: Row) => {
       if (disableMultiRowSelect) {
         row.toggleRowSelected();
         onSelectSingleRow && onSelectSingleRow(row);
@@ -483,6 +518,7 @@ const DataTable = ({
   };
 
   const renderPrimarySelectAction = (): JSX.Element | null => {
+    // eslint-disable-next-line @typescript-eslint/no-explicit-any
     const targetIds = selectedFlatRows.map((row: any) => row.original.id);
     const buttonText =
       typeof primarySelectAction?.buttonText === "function"
@@ -504,6 +540,7 @@ const DataTable = ({
 
   const renderSecondarySelectActions = (): JSX.Element[] | null => {
     if (secondarySelectActions) {
+      // eslint-disable-next-line @typescript-eslint/no-explicit-any
       const targetIds = selectedFlatRows.map((row: any) => row.original.id);
       const buttons = secondarySelectActions.map((actionProps) => {
         actionProps = { ...actionProps, targetIds };
@@ -666,10 +703,13 @@ const DataTable = ({
                   // Can tab onto an entire row if a child element does not have the same onClick functionality as clicking the whole row
                   tabIndex={keyboardSelectableRows ? 0 : -1}
                 >
-                  {row.cells.map((cell: any, index: number) => {
+                  {/* eslint-disable-next-line @typescript-eslint/no-unused-vars */}
+                  {row.cells.map((cell: Cell, _index: number) => {
                     // Only allow row click behavior on first cell
                     // if the first cell is not a checkbox
-                    const cellProps = cell.getCellProps();
+                    // Destructure key from cellProps to avoid "key specified more than once" warning
+                    // eslint-disable-next-line @typescript-eslint/no-unused-vars
+                    const { key: _cellKey, ...cellProps } = cell.getCellProps();
                     const multiRowSelectEnabled = !disableMultiRowSelect;
 
                     return (

frontend/components/TableContainer/DataTable/TextCell/TextCell.tsx

@@ -6,6 +6,7 @@ import { DEFAULT_EMPTY_CELL_VALUE } from "utilities/constants";
 const baseClass = "text-cell";
 interface ITextCellProps {
   value?: React.ReactNode | { timeString: string };
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any
   formatter?: (val: any) => React.ReactNode; // string, number, or null
   grey?: boolean;
   italic?: boolean;