Minor cleanup

src/components/Table/LGFilters.tsx

@@ -12,6 +12,9 @@ type TreeSelectFilterProps = {
   tData: TreeDataEntry[];
 };
 
+/*
+ * @deprecated Use react-table's onColumnFiltersChange prop.
+ */
 export const getColumnTreeSelectFilterProps = ({
   "data-cy": dataCy,
   onConfirm = () => {},
@@ -52,13 +55,14 @@ export const getColumnTreeSelectFilterProps = ({
 type InputFilterProps = {
   "data-cy"?: string;
   onConfirm?: ({ id, value }: { id: string; value: string }) => void;
-  placeholder?: string;
 };
 
+/*
+ * @deprecated Use react-table's onColumnFiltersChange prop.
+ */
 export const getColumnInputFilterProps = ({
   "data-cy": dataCy,
   onConfirm = () => {},
-  placeholder,
 }: InputFilterProps) => ({
   enableColumnFilter: false,
   meta: {
@@ -69,7 +73,6 @@ export const getColumnInputFilterProps = ({
           column.setFilterValue(newValue);
           onConfirm({ id: column.id, value: newValue });
         }}
-        placeholder={placeholder}
         value={column?.getFilterValue() ?? ""}
       />
     ),
@@ -94,6 +97,9 @@ type SortProps = {
   onToggle?: ({ id, value }: { id: string; value: string }) => void;
 };
 
+/*
+ * @deprecated Use react-table's onSortingChange prop.
+ */
 export const getColumnSortProps = ({
   "data-cy": dataCy,
   onToggle = () => {},
@@ -102,7 +108,6 @@ export const getColumnSortProps = ({
     sortComponent: ({ column }) => (
       <TableSortIcon
         data-cy={dataCy}
-        key={column.id}
         onToggle={(newValue) => {
           column.toggleSorting();
           onToggle({ id: column.id, value: newValue });

src/components/Table/utils.ts

@@ -1,5 +1,13 @@
 import { OnChangeFn } from "@tanstack/react-table";
 
+export enum TableQueryParams {
+  Limit = "limit",
+  Page = "page",
+  SortBy = "sortBy",
+  SortDir = "sortDir",
+  Sorts = "sorts",
+}
+
 /**
  * `onChangeHandler` simplifies applying a side effect with one of react-table's callback functions (e.g. onColumnFiltersChange, onSortingChange).
  * @param setState - state updater as returned by a React useState hook.
@@ -18,11 +26,3 @@ export const onChangeHandler = <T>(
       return updatedState;
     });
   }) satisfies OnChangeFn<T>;
-
-export enum TableQueryParams {
-  Limit = "limit",
-  Page = "page",
-  SortBy = "sortBy",
-  SortDir = "sortDir",
-  Sorts = "sorts",
-}

src/components/TablePopover/TableSortIcon.tsx

@@ -43,7 +43,6 @@ export const TableSortIcon: React.FC<TableSortIconProps> = ({
     } else {
       update = undefined;
     }
-    console.log(value, update);
     onToggle(update);
   };
 

src/hooks/useTableSort.ts

@@ -32,7 +32,7 @@ export const useTableSort = ({
         nextQueryParams[TableQueryParams.SortDir] = undefined;
         nextQueryParams[TableQueryParams.SortBy] = undefined;
       } else {
-        // TODO: For other tables that support multi-sort, we should be able to update this to handle a sorter array with more than one entry.
+        // TODO: For tables that support multi-sort, we should be able to update this to handle a sorter array with more than one entry.
         const { desc, id } = Array.isArray(sorter) ? sorter[0] : sorter;
         nextQueryParams[TableQueryParams.SortDir] = desc
           ? SortDirection.Desc

src/types/host.ts

@@ -86,21 +86,18 @@ export enum HostsTableFilterParams {
   Statuses = "statuses",
 }
 
+export const mapQueryParamToId: Record<HostsTableFilterParams, HostSortBy> = {
+  [HostsTableFilterParams.HostId]: HostSortBy.Id,
+  [HostsTableFilterParams.DistroId]: HostSortBy.Distro,
+  [HostsTableFilterParams.Statuses]: HostSortBy.Status,
+  [HostsTableFilterParams.CurrentTaskId]: HostSortBy.CurrentTask,
+  [HostsTableFilterParams.StartedBy]: HostSortBy.Owner,
+} as const;
+
 export const mapIdToFilterParam: PartialRecord<
   HostSortBy,
   keyof HostsQueryVariables
-> = {
-  [HostSortBy.Id]: HostsTableFilterParams.HostId,
-  [HostSortBy.Distro]: HostsTableFilterParams.DistroId,
-  [HostSortBy.Status]: HostsTableFilterParams.Statuses,
-  [HostSortBy.CurrentTask]: HostsTableFilterParams.CurrentTaskId,
-  [HostSortBy.Owner]: HostsTableFilterParams.StartedBy,
-} as const;
-
-export const mapQueryParamToId: PartialRecord<
-  keyof HostsQueryVariables,
-  HostSortBy
-> = Object.entries(mapIdToFilterParam).reduce(
+> = Object.entries(mapQueryParamToId).reduce(
   (obj, [id, param]) => ({
     ...obj,
     [param]: id,