[SIEM] [Detection Engine] Fixes all rules sorting (#62039)

* fixes sorting to what it was in 7.6.1

* removes sortable=true from non-sortable columns, fixes naming of sortable column field from activate to enabled to match the field eui expects to sort on, fixes react render warning due to resetting tableRef's current field during a render

Author: dhurley14

x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/all/columns.tsx

@@ -144,7 +144,6 @@ export const getColumns = ({
           </LocalizedDateTooltip>
         );
       },
-      sortable: true,
       truncateText: true,
       width: '20%',
     },
@@ -180,7 +179,7 @@ export const getColumns = ({
     },
     {
       align: 'center',
-      field: 'activate',
+      field: 'enabled',
       name: i18n.COLUMN_ACTIVATE,
       render: (value: Rule['enabled'], item: Rule) => (
         <RuleSwitch
@@ -283,7 +282,6 @@ export const getMonitoringColumns = (): RulesStatusesColumns[] => {
           </LocalizedDateTooltip>
         );
       },
-      sortable: true,
       truncateText: true,
       width: '20%',
     },

x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/all/index.tsx

@@ -41,11 +41,12 @@ import { showRulesTable } from './helpers';
 import { allRulesReducer, State } from './reducer';
 import { RulesTableFilters } from './rules_table_filters/rules_table_filters';
 
+const SORT_FIELD = 'enabled';
 const initialState: State = {
   exportRuleIds: [],
   filterOptions: {
     filter: '',
-    sortField: 'enabled',
+    sortField: SORT_FIELD,
     sortOrder: 'desc',
   },
   loadingRuleIds: [],
@@ -127,9 +128,7 @@ export const AllRules = React.memo<AllRulesProps>(
     });
 
     const sorting = useMemo(
-      () => ({
-        sort: { field: 'enabled', direction: filterOptions.sortOrder },
-      }),
+      () => ({ sort: { field: 'enabled', direction: filterOptions.sortOrder } }),
       [filterOptions.sortOrder]
     );
 
@@ -171,7 +170,7 @@ export const AllRules = React.memo<AllRulesProps>(
         dispatch({
           type: 'updateFilterOptions',
           filterOptions: {
-            sortField: 'enabled', // Only enabled is supported for sorting currently
+            sortField: SORT_FIELD, // Only enabled is supported for sorting currently
             sortOrder: sort?.direction ?? 'desc',
           },
           pagination: { page: page.index + 1, perPage: page.size },

x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/all/reducer.ts

@@ -66,7 +66,10 @@ export const allRulesReducer = (
         tableRef.current != null &&
         tableRef.current.changeSelection != null
       ) {
-        tableRef.current.changeSelection([]);
+        // for future devs: eui basic table is not giving us a prop to set the value, so
+        // we are using the ref in setTimeout to reset on the next loop so that we
+        // do not get a warning telling us we are trying to update during a render
+        window.setTimeout(() => tableRef?.current?.changeSelection([]), 0);
       }
 
       return {

x-pack/legacy/plugins/siem/public/pages/detection_engine/rules/components/all_rules_tables/index.tsx

@@ -97,7 +97,7 @@ const AllRulesTablesComponent: React.FC<AllRulesTablesProps> = ({
           onChange={tableOnChangeCallback}
           pagination={paginationMemo}
           ref={tableRef}
-          {...sorting}
+          sorting={sorting}
           selection={hasNoPermissions ? undefined : euiBasicTableSelectionProps}
         />
       )}
@@ -111,7 +111,7 @@ const AllRulesTablesComponent: React.FC<AllRulesTablesProps> = ({
           noItemsMessage={emptyPrompt}
           onChange={tableOnChangeCallback}
           pagination={paginationMemo}
-          {...sorting}
+          sorting={sorting}
         />
       )}
     </>