[Security Solution][Detections] - follow up cleanup on auto refresh rules (#83023) (#83089)

### Summary

This is a follow up cleanup PR to #82062 . There were a few comments I hadn't gotten to and wanted to follow up on.

Author: yctercero

x-pack/plugins/security_solution/cypress/tasks/alerts_detection_rules.ts

@@ -125,7 +125,6 @@ export const waitForRulesToBeLoaded = () => {
   cy.get(ASYNC_LOADING_PROGRESS).should('not.exist');
 };
 
-// when using, ensure you've called cy.clock prior in test
 export const checkAutoRefresh = (ms: number, condition: string) => {
   cy.get(ASYNC_LOADING_PROGRESS).should('not.be.visible');
   cy.tick(ms);

x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/index.tsx

@@ -13,6 +13,7 @@ import {
   EuiProgress,
   EuiOverlayMask,
   EuiConfirmModal,
+  EuiWindowEvent,
 } from '@elastic/eui';
 import React, { useCallback, useEffect, useMemo, useReducer, useRef, useState } from 'react';
 import { useHistory } from 'react-router-dom';
@@ -406,18 +407,6 @@ export const AllRules = React.memo<AllRulesProps>(
       [setAutoRefreshOn, handleRefreshData]
     );
 
-    useEffect(() => {
-      debounceResetIdleTimer();
-
-      window.addEventListener('mousemove', debounceResetIdleTimer, { passive: true });
-      window.addEventListener('keydown', debounceResetIdleTimer);
-
-      return () => {
-        window.removeEventListener('mousemove', debounceResetIdleTimer);
-        window.removeEventListener('keydown', debounceResetIdleTimer);
-      };
-    }, [handleResetIdleTimer, debounceResetIdleTimer]);
-
     const shouldShowRulesTable = useMemo(
       (): boolean => showRulesTable({ rulesCustomInstalled, rulesInstalled }) && !initLoading,
       [initLoading, rulesCustomInstalled, rulesInstalled]
@@ -470,6 +459,12 @@ export const AllRules = React.memo<AllRulesProps>(
 
     return (
       <>
+        <EuiWindowEvent event="mousemove" handler={debounceResetIdleTimer} />
+        <EuiWindowEvent event="mousedown" handler={debounceResetIdleTimer} />
+        <EuiWindowEvent event="click" handler={debounceResetIdleTimer} />
+        <EuiWindowEvent event="keydown" handler={debounceResetIdleTimer} />
+        <EuiWindowEvent event="scroll" handler={debounceResetIdleTimer} />
+        <EuiWindowEvent event="load" handler={debounceResetIdleTimer} />
         <GenericDownloader
           filename={`${i18n.EXPORT_FILENAME}.ndjson`}
           ids={exportRuleIds}

x-pack/plugins/security_solution/public/detections/pages/detection_engine/rules/all/utility_bar.test.tsx

@@ -12,10 +12,12 @@ import { waitFor } from '@testing-library/react';
 
 import { AllRulesUtilityBar } from './utility_bar';
 
+const theme = () => ({ eui: euiDarkVars, darkMode: true });
+
 describe('AllRules', () => {
   it('renders AllRulesUtilityBar total rules and selected rules', () => {
     const wrapper = mount(
-      <ThemeProvider theme={() => ({ eui: euiDarkVars, darkMode: true })}>
+      <ThemeProvider theme={theme}>
         <AllRulesUtilityBar
           userHasNoPermissions={false}
           onRefresh={jest.fn()}
@@ -36,7 +38,7 @@ describe('AllRules', () => {
 
   it('renders utility actions if user has permissions', () => {
     const wrapper = mount(
-      <ThemeProvider theme={() => ({ eui: euiDarkVars, darkMode: true })}>
+      <ThemeProvider theme={theme}>
         <AllRulesUtilityBar
           userHasNoPermissions={false}
           onRefresh={jest.fn()}
@@ -54,7 +56,7 @@ describe('AllRules', () => {
 
   it('renders no utility actions if user has no permissions', () => {
     const wrapper = mount(
-      <ThemeProvider theme={() => ({ eui: euiDarkVars, darkMode: true })}>
+      <ThemeProvider theme={theme}>
         <AllRulesUtilityBar
           userHasNoPermissions
           onRefresh={jest.fn()}
@@ -73,7 +75,7 @@ describe('AllRules', () => {
   it('invokes refresh on refresh action click', () => {
     const mockRefresh = jest.fn();
     const wrapper = mount(
-      <ThemeProvider theme={() => ({ eui: euiDarkVars, darkMode: true })}>
+      <ThemeProvider theme={theme}>
         <AllRulesUtilityBar
           userHasNoPermissions={false}
           onRefresh={mockRefresh}
@@ -94,7 +96,7 @@ describe('AllRules', () => {
   it('invokes onRefreshSwitch when auto refresh switch is clicked', async () => {
     const mockSwitch = jest.fn();
     const wrapper = mount(
-      <ThemeProvider theme={() => ({ eui: euiDarkVars, darkMode: true })}>
+      <ThemeProvider theme={theme}>
         <AllRulesUtilityBar
           userHasNoPermissions={false}
           onRefresh={jest.fn()}

x-pack/plugins/security_solution/server/ui_settings.ts

@@ -9,6 +9,7 @@ import { schema } from '@kbn/config-schema';
 
 import { CoreSetup } from '../../../../src/core/server';
 import {
+  APP_ID,
   DEFAULT_INDEX_KEY,
   DEFAULT_INDEX_PATTERN,
   DEFAULT_ANOMALY_SCORE,
@@ -47,7 +48,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
             '<p>Default refresh interval for the Security time filter, in milliseconds.</p>',
         }
       ),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.object({
         value: schema.number(),
@@ -66,7 +67,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
       description: i18n.translate('xpack.securitySolution.uiSettings.defaultTimeRangeDescription', {
         defaultMessage: '<p>Default period of time in the Security time filter.</p>',
       }),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.object({
         from: schema.string(),
@@ -82,7 +83,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
         defaultMessage:
           '<p>Comma-delimited list of Elasticsearch indices from which the Security app collects events.</p>',
       }),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.arrayOf(schema.string()),
     },
@@ -99,7 +100,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
             '<p>Value above which Machine Learning job anomalies are displayed in the Security app.</p><p>Valid values: 0 to 100.</p>',
         }
       ),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.number(),
     },
@@ -112,7 +113,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
         defaultMessage: '<p>Enables the News feed</p>',
       }),
       type: 'boolean',
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.boolean(),
     },
@@ -133,7 +134,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
   "value": ${DEFAULT_RULE_REFRESH_INTERVAL_VALUE},
   "idleTimeout": ${DEFAULT_RULE_REFRESH_IDLE_VALUE}
 }`,
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.object({
         idleTimeout: schema.number({ min: 300000 }),
@@ -149,7 +150,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
       description: i18n.translate('xpack.securitySolution.uiSettings.newsFeedUrlDescription', {
         defaultMessage: '<p>News feed content will be retrieved from this URL</p>',
       }),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.string(),
     },
@@ -166,7 +167,7 @@ export const initUiSettings = (uiSettings: CoreSetup['uiSettings']) => {
             'Array of URL templates to build the list of reputation URLs to be displayed on the IP Details page.',
         }
       ),
-      category: ['securitySolution'],
+      category: [APP_ID],
       requiresPageReload: true,
       schema: schema.arrayOf(
         schema.object({