From 6e6c9614f5afec1f068d877ab6c3d7e125c1d07a Mon Sep 17 00:00:00 2001 From: Paul Tavares <56442535+paul-tavares@users.noreply.github.com> Date: Fri, 29 Apr 2022 10:04:25 -0400 Subject: [PATCH] [Security Solution][Endpoint] Add default query options to React-Query 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 --- .../query_client/query_client_provider.tsx | 28 +++++++++++++++++-- .../artifacts/use_bulk_delete_artifact.tsx | 9 ++++-- .../artifacts/use_bulk_update_artifact.tsx | 9 ++++-- .../hooks/artifacts/use_create_artifact.tsx | 9 ++++-- .../hooks/artifacts/use_delete_artifact.tsx | 9 ++++-- .../hooks/artifacts/use_get_artifact.tsx | 11 ++------ .../hooks/artifacts/use_list_artifact.tsx | 12 ++------ .../hooks/artifacts/use_summary_artifact.tsx | 12 ++------ .../hooks/artifacts/use_update_artifact.tsx | 9 ++++-- .../view/ingest_manager_integration/mocks.tsx | 4 +-- .../render_context_providers.tsx | 8 ++++-- .../management/services/policies/hooks.ts | 26 ++++++----------- 12 files changed, 83 insertions(+), 63 deletions(-) diff --git a/x-pack/plugins/security_solution/public/common/containers/query_client/query_client_provider.tsx b/x-pack/plugins/security_solution/public/common/containers/query_client/query_client_provider.tsx index 9d2f9ca9f48fa..2f67dc2734fed 100644 --- a/x-pack/plugins/security_solution/public/common/containers/query_client/query_client_provider.tsx +++ b/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[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( ({ queryClient, children }) => { const client = useMemo(() => { - return queryClient || new QueryClient(); + return queryClient || new SecuritySolutionQueryClient(); }, [queryClient]); return {children}; } diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_delete_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_delete_artifact.tsx index 994ed4f466d00..f534cc01e62ee 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_delete_artifact.tsx +++ b/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 = DEFAULT_OPTIONS, + customOptions: UseMutationOptions< + ExceptionListItemSchema[], + HttpFetchError, + Array<{ itemId?: string; id?: string }>, + () => void + > = DEFAULT_OPTIONS, options: { concurrency: number; } = { diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_update_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_update_artifact.tsx index 3389b3563577a..68090e2aabc90 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_bulk_update_artifact.tsx +++ b/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 = DEFAULT_OPTIONS, + customOptions: UseMutationOptions< + ExceptionListItemSchema[], + HttpFetchError, + UpdateExceptionListItemSchema[], + () => void + > = DEFAULT_OPTIONS, options: { concurrency: number; } = { diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_create_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_create_artifact.tsx index c1aed4be8005b..79dd59d744e7f 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_create_artifact.tsx +++ b/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 = DEFAULT_OPTIONS + customOptions: UseMutationOptions< + ExceptionListItemSchema, + HttpFetchError, + CreateExceptionListItemSchema, + () => void + > = DEFAULT_OPTIONS ): UseMutationResult< ExceptionListItemSchema, HttpFetchError, diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_delete_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_delete_artifact.tsx index 16568a0766444..a12b3aaa9ba40 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_delete_artifact.tsx +++ b/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 = DEFAULT_OPTIONS + customOptions: UseMutationOptions< + ExceptionListItemSchema, + HttpFetchError, + { itemId?: string; id?: string }, + () => void + > = DEFAULT_OPTIONS ): UseMutationResult< ExceptionListItemSchema, HttpFetchError, diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_get_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_get_artifact.tsx index eb80a689e5a0d..36ae203707c28 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_get_artifact.tsx +++ b/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 = DEFAULT_OPTIONS + customQueryOptions?: UseQueryOptions ): QueryObserverResult { return useQuery( ['get', exceptionListApiClient, itemId, id], () => { return exceptionListApiClient.get(itemId, id); }, - { - refetchIntervalInBackground: false, - refetchOnWindowFocus: false, - refetchOnMount: true, - ...customQueryOptions, - } + customQueryOptions ); } diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_list_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_list_artifact.tsx index 68bee6de0113a..64a5b908e2d9e 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_list_artifact.tsx +++ b/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 = DEFAULT_EXCEPTION_LIST_ITEM_SEARCHABLE_FIELDS, - customQueryOptions: Partial< - UseQueryOptions - > = DEFAULT_OPTIONS, + customQueryOptions?: Partial>, customQueryIds: string[] = [] ): QueryObserverResult { const { @@ -64,12 +62,6 @@ export function useListArtifact( return result; }, - { - refetchIntervalInBackground: false, - refetchOnWindowFocus: false, - refetchOnMount: true, - keepPreviousData: true, - ...customQueryOptions, - } + customQueryOptions ); } diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_summary_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_summary_artifact.tsx index 62e5372dc39aa..111fdb4565785 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_summary_artifact.tsx +++ b/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 = DEFAULT_EXCEPTION_LIST_ITEM_SEARCHABLE_FIELDS, - customQueryOptions: Partial< - UseQueryOptions - > = DEFAULT_OPTIONS + customQueryOptions: Partial> ): QueryObserverResult { const { filter = '', policies = [] } = options; @@ -37,12 +35,6 @@ export function useSummaryArtifact( }) ); }, - { - refetchIntervalInBackground: false, - refetchOnWindowFocus: false, - refetchOnMount: true, - keepPreviousData: true, - ...customQueryOptions, - } + customQueryOptions ); } diff --git a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_update_artifact.tsx b/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_update_artifact.tsx index 92da096f71e66..e3a7e37eebf56 100644 --- a/x-pack/plugins/security_solution/public/management/hooks/artifacts/use_update_artifact.tsx +++ b/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 = DEFAULT_OPTIONS + customQueryOptions: UseMutationOptions< + ExceptionListItemSchema, + HttpFetchError, + UpdateExceptionListItemSchema, + () => void + > = DEFAULT_OPTIONS ): UseMutationResult< ExceptionListItemSchema, HttpFetchError, diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/mocks.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/mocks.tsx index 908ebc22a19cd..daa44f01dbffd 100644 --- a/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/mocks.tsx +++ b/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(() => { diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/with_security_context/render_context_providers.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/with_security_context/render_context_providers.tsx index 9b3472192a718..ec222de1713f0 100644 --- a/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/with_security_context/render_context_providers.tsx +++ b/x-pack/plugins/security_solution/public/management/pages/policy/view/ingest_manager_integration/with_security_context/render_context_providers.tsx @@ -8,8 +8,10 @@ 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'; @@ -17,7 +19,7 @@ import { StartPlugins } from '../../../../../../types'; export type RenderContextProvidersProps = PropsWithChildren<{ store: Store; depsStart: Pick; - queryClient?: QueryClient; + queryClient?: SecuritySolutionQueryClient; }>; export const RenderContextProviders = memo( diff --git a/x-pack/plugins/security_solution/public/management/services/policies/hooks.ts b/x-pack/plugins/security_solution/public/management/services/policies/hooks.ts index 6cc6140d336d2..cf053128e5f37 100644 --- a/x-pack/plugins/security_solution/public/management/services/policies/hooks.ts +++ b/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; @@ -72,11 +72,7 @@ export function useGetAgentCountForPolicy({ }, }); }, - { - refetchIntervalInBackground: false, - refetchOnWindowFocus: false, - ...customQueryOptions, - } + customQueryOptions ); } @@ -84,7 +80,7 @@ export function useGetAgentCountForPolicy({ * This hook returns the endpoint security package which contains endpoint version info */ export function useGetEndpointSecurityPackage({ - customQueryOptions = {}, + customQueryOptions, }: { customQueryOptions?: UseQueryOptions; }): QueryObserverResult { @@ -94,10 +90,6 @@ export function useGetEndpointSecurityPackage({ () => { return sendGetEndpointSecurityPackage(http); }, - { - refetchIntervalInBackground: false, - refetchOnWindowFocus: false, - ...customQueryOptions, - } + customQueryOptions ); }