[Security Solution][Endpoint] Add default query options to React-Quer…

…y client and adjust existing hooks (#131165)

* Expose the QueryClient used in the app as SecuritySolutionQueryClient
* Add defaults to `SecuritySolutionQueryClient`
* Update existing hooks and remove defaults from useQuery
* Fix option Type for hooks that use `useMutation()` from React-Query

x-pack/plugins/security_solution/public/common/containers/query_client/query_client_provider.tsx

@@ -8,14 +8,38 @@
 import React, { memo, PropsWithChildren, useMemo } from 'react';
 import { QueryClient, QueryClientProvider } from 'react-query';
 
+type QueryClientOptionsProp = ConstructorParameters<typeof QueryClient>[0];
+
+/**
+ * A security solution specific react-query query client that sets defaults
+ */
+export class SecuritySolutionQueryClient extends QueryClient {
+  constructor(options: QueryClientOptionsProp = {}) {
+    const optionsWithDefaults: QueryClientOptionsProp = {
+      ...options,
+      defaultOptions: {
+        ...(options.defaultOptions ?? {}),
+        queries: {
+          refetchIntervalInBackground: false,
+          refetchOnWindowFocus: false,
+          refetchOnMount: true,
+          keepPreviousData: true,
+          ...(options?.defaultOptions?.queries ?? {}),
+        },
+      },
+    };
+    super(optionsWithDefaults);
+  }
+}
+
 export type ReactQueryClientProviderProps = PropsWithChildren<{
-  queryClient?: QueryClient;
+  queryClient?: SecuritySolutionQueryClient;
 }>;
 
 export const ReactQueryClientProvider = memo<ReactQueryClientProviderProps>(
   ({ queryClient, children }) => {
     const client = useMemo(() => {
-      return queryClient || new QueryClient();
+      return queryClient || new SecuritySolutionQueryClient();
     }, [queryClient]);
     return <QueryClientProvider client={client}>{children}</QueryClientProvider>;
   }

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_delete_artifact.tsx

@@ -7,14 +7,19 @@
 import pMap from 'p-map';
 import { HttpFetchError } from '@kbn/core/public';
 import { ExceptionListItemSchema } from '@kbn/securitysolution-io-ts-list-types';
-import { useMutation, UseMutationResult, UseQueryOptions } from 'react-query';
+import { useMutation, UseMutationOptions, UseMutationResult } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
 const DEFAULT_OPTIONS = Object.freeze({});
 
 export function useBulkDeleteArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
-  customOptions: UseQueryOptions<ExceptionListItemSchema[], HttpFetchError> = DEFAULT_OPTIONS,
+  customOptions: UseMutationOptions<
+    ExceptionListItemSchema[],
+    HttpFetchError,
+    Array<{ itemId?: string; id?: string }>,
+    () => void
+  > = DEFAULT_OPTIONS,
   options: {
     concurrency: number;
   } = {

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_update_artifact.tsx

@@ -10,14 +10,19 @@ import {
   UpdateExceptionListItemSchema,
   ExceptionListItemSchema,
 } from '@kbn/securitysolution-io-ts-list-types';
-import { useMutation, UseMutationResult, UseQueryOptions } from 'react-query';
+import { useMutation, UseMutationOptions, UseMutationResult } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
 const DEFAULT_OPTIONS = Object.freeze({});
 
 export function useBulkUpdateArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
-  customOptions: UseQueryOptions<ExceptionListItemSchema[], HttpFetchError> = DEFAULT_OPTIONS,
+  customOptions: UseMutationOptions<
+    ExceptionListItemSchema[],
+    HttpFetchError,
+    UpdateExceptionListItemSchema[],
+    () => void
+  > = DEFAULT_OPTIONS,
   options: {
     concurrency: number;
   } = {

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_create_artifact.tsx

@@ -9,14 +9,19 @@ import {
   ExceptionListItemSchema,
 } from '@kbn/securitysolution-io-ts-list-types';
 import { HttpFetchError } from '@kbn/core/public';
-import { useMutation, UseMutationResult, UseQueryOptions } from 'react-query';
+import { useMutation, UseMutationOptions, UseMutationResult } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
 const DEFAULT_OPTIONS = Object.freeze({});
 
 export function useCreateArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
-  customOptions: UseQueryOptions<ExceptionListItemSchema, HttpFetchError> = DEFAULT_OPTIONS
+  customOptions: UseMutationOptions<
+    ExceptionListItemSchema,
+    HttpFetchError,
+    CreateExceptionListItemSchema,
+    () => void
+  > = DEFAULT_OPTIONS
 ): UseMutationResult<
   ExceptionListItemSchema,
   HttpFetchError,

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_delete_artifact.tsx

@@ -6,14 +6,19 @@
  */
 import { ExceptionListItemSchema } from '@kbn/securitysolution-io-ts-list-types';
 import { HttpFetchError } from '@kbn/core/public';
-import { useMutation, UseMutationResult, UseQueryOptions } from 'react-query';
+import { useMutation, UseMutationOptions, UseMutationResult } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
 const DEFAULT_OPTIONS = Object.freeze({});
 
 export function useDeleteArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
-  customOptions: UseQueryOptions<ExceptionListItemSchema, HttpFetchError> = DEFAULT_OPTIONS
+  customOptions: UseMutationOptions<
+    ExceptionListItemSchema,
+    HttpFetchError,
+    { itemId?: string; id?: string },
+    () => void
+  > = DEFAULT_OPTIONS
 ): UseMutationResult<
   ExceptionListItemSchema,
   HttpFetchError,

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_get_artifact.tsx

@@ -9,24 +9,17 @@ import { HttpFetchError } from '@kbn/core/public';
 import { QueryObserverResult, useQuery, UseQueryOptions } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
-const DEFAULT_OPTIONS = Object.freeze({});
-
 export function useGetArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
   itemId?: string,
   id?: string,
-  customQueryOptions: UseQueryOptions<ExceptionListItemSchema, HttpFetchError> = DEFAULT_OPTIONS
+  customQueryOptions?: UseQueryOptions<ExceptionListItemSchema, HttpFetchError>
 ): QueryObserverResult<ExceptionListItemSchema, HttpFetchError> {
   return useQuery<ExceptionListItemSchema, HttpFetchError>(
     ['get', exceptionListApiClient, itemId, id],
     () => {
       return exceptionListApiClient.get(itemId, id);
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      refetchOnMount: true,
-      ...customQueryOptions,
-    }
+    customQueryOptions
   );
 }

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_list_artifact.tsx

@@ -31,9 +31,7 @@ export function useListArtifact(
     excludedPolicies: string[];
   }> = DEFAULT_OPTIONS,
   searchableFields: MaybeImmutable<string[]> = DEFAULT_EXCEPTION_LIST_ITEM_SEARCHABLE_FIELDS,
-  customQueryOptions: Partial<
-    UseQueryOptions<FoundExceptionListItemSchema, HttpFetchError>
-  > = DEFAULT_OPTIONS,
+  customQueryOptions?: Partial<UseQueryOptions<FoundExceptionListItemSchema, HttpFetchError>>,
   customQueryIds: string[] = []
 ): QueryObserverResult<FoundExceptionListItemSchema, HttpFetchError> {
   const {
@@ -64,12 +62,6 @@ export function useListArtifact(
 
       return result;
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      refetchOnMount: true,
-      keepPreviousData: true,
-      ...customQueryOptions,
-    }
+    customQueryOptions
   );
 }

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_summary_artifact.tsx

@@ -21,9 +21,7 @@ export function useSummaryArtifact(
     policies: string[];
   }> = DEFAULT_OPTIONS,
   searchableFields: MaybeImmutable<string[]> = DEFAULT_EXCEPTION_LIST_ITEM_SEARCHABLE_FIELDS,
-  customQueryOptions: Partial<
-    UseQueryOptions<ExceptionListSummarySchema, HttpFetchError>
-  > = DEFAULT_OPTIONS
+  customQueryOptions: Partial<UseQueryOptions<ExceptionListSummarySchema, HttpFetchError>>
 ): QueryObserverResult<ExceptionListSummarySchema, HttpFetchError> {
   const { filter = '', policies = [] } = options;
 
@@ -37,12 +35,6 @@ export function useSummaryArtifact(
         })
       );
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      refetchOnMount: true,
-      keepPreviousData: true,
-      ...customQueryOptions,
-    }
+    customQueryOptions
   );
 }

x-pack/plugins/security_solution/public/management/hooks/artifacts/use_update_artifact.tsx

@@ -9,14 +9,19 @@ import {
   ExceptionListItemSchema,
 } from '@kbn/securitysolution-io-ts-list-types';
 import { HttpFetchError } from '@kbn/core/public';
-import { useMutation, UseMutationResult, UseQueryOptions } from 'react-query';
+import { useMutation, UseMutationOptions, UseMutationResult } from 'react-query';
 import { ExceptionsListApiClient } from '../../services/exceptions_list/exceptions_list_api_client';
 
 const DEFAULT_OPTIONS = Object.freeze({});
 
 export function useUpdateArtifact(
   exceptionListApiClient: ExceptionsListApiClient,
-  customQueryOptions: UseQueryOptions<ExceptionListItemSchema, HttpFetchError> = DEFAULT_OPTIONS
+  customQueryOptions: UseMutationOptions<
+    ExceptionListItemSchema,
+    HttpFetchError,
+    UpdateExceptionListItemSchema,
+    () => void
+  > = DEFAULT_OPTIONS
 ): UseMutationResult<
   ExceptionListItemSchema,
   HttpFetchError,

x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/mocks.tsx

@@ -13,7 +13,7 @@ import { I18nProvider } from '@kbn/i18n-react';
 import type { PackageInfo } from '@kbn/fleet-plugin/common/types';
 import { EuiThemeProvider } from '@kbn/kibana-react-plugin/common';
 import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public';
-import { QueryClient } from 'react-query';
+import { SecuritySolutionQueryClient } from '../../../../../common/containers/query_client/query_client_provider';
 import {
   AppContextTestRender,
   createAppRootMockRenderer,
@@ -85,7 +85,7 @@ export const createFleetContextRendererMock = (): AppContextTestRender => {
     additionalMiddleware: [mockedContext.middlewareSpy.actionSpyMiddleware],
   });
 
-  const queryClient = new QueryClient();
+  const queryClient = new SecuritySolutionQueryClient();
 
   const Wrapper: RenderOptions['wrapper'] = ({ children }) => {
     const services = useMemo(() => {

x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/with_security_context/render_context_providers.tsx

@@ -8,16 +8,18 @@
 import React, { memo, PropsWithChildren } from 'react';
 import { Provider as ReduxStoreProvider } from 'react-redux';
 import { Store } from 'redux';
-import type { QueryClient } from 'react-query';
-import { ReactQueryClientProvider } from '../../../../../../common/containers/query_client/query_client_provider';
+import {
+  ReactQueryClientProvider,
+  SecuritySolutionQueryClient,
+} from '../../../../../../common/containers/query_client/query_client_provider';
 import { SecuritySolutionStartDependenciesContext } from '../../../../../../common/components/user_privileges/endpoint/security_solution_start_dependencies';
 import { CurrentLicense } from '../../../../../../common/components/current_license';
 import { StartPlugins } from '../../../../../../types';
 
 export type RenderContextProvidersProps = PropsWithChildren<{
   store: Store;
   depsStart: Pick<StartPlugins, 'data' | 'fleet'>;
-  queryClient?: QueryClient;
+  queryClient?: SecuritySolutionQueryClient;
 }>;
 
 export const RenderContextProviders = memo<RenderContextProvidersProps>(

x-pack/plugins/security_solution/public/management/services/policies/hooks.ts

@@ -40,11 +40,11 @@ export function useGetEndpointSpecificPolicies(
         },
       });
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      onError,
-    }
+    onError
+      ? {
+          onError,
+        }
+      : undefined
   );
 }
 
@@ -56,7 +56,7 @@ export function useGetEndpointSpecificPolicies(
  */
 export function useGetAgentCountForPolicy({
   policyIds,
-  customQueryOptions = {},
+  customQueryOptions,
 }: {
   policyIds: string[];
   customQueryOptions?: UseQueryOptions<GetAgentPoliciesResponse, HttpFetchError>;
@@ -72,19 +72,15 @@ export function useGetAgentCountForPolicy({
         },
       });
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      ...customQueryOptions,
-    }
+    customQueryOptions
   );
 }
 
 /**
  * This hook returns the endpoint security package which contains endpoint version info
  */
 export function useGetEndpointSecurityPackage({
-  customQueryOptions = {},
+  customQueryOptions,
 }: {
   customQueryOptions?: UseQueryOptions<GetPackagesResponse['items'][number], HttpFetchError>;
 }): QueryObserverResult<GetPackagesResponse['items'][number], HttpFetchError> {
@@ -94,10 +90,6 @@ export function useGetEndpointSecurityPackage({
     () => {
       return sendGetEndpointSecurityPackage(http);
     },
-    {
-      refetchIntervalInBackground: false,
-      refetchOnWindowFocus: false,
-      ...customQueryOptions,
-    }
+    customQueryOptions
   );
 }