diff --git a/packages/cloud/connection_details/components/spa_no_router_link/spa_no_router_link.tsx b/packages/cloud/connection_details/components/spa_no_router_link/spa_no_router_link.tsx index 3a8799c04f646..de9509712a687 100644 --- a/packages/cloud/connection_details/components/spa_no_router_link/spa_no_router_link.tsx +++ b/packages/cloud/connection_details/components/spa_no_router_link/spa_no_router_link.tsx @@ -21,7 +21,7 @@ export interface SpaNoRouterLinkProps { 'data-test-subj'?: string; } -export const SpaNoRouterLink: React.FC = ({ +export const SpaNoRouterLink: React.FC> = ({ url, go, onClick, diff --git a/packages/cloud/connection_details/context/options.tsx b/packages/cloud/connection_details/context/options.tsx index 1deb4e4d8eab9..8f4bfe60b7d8b 100644 --- a/packages/cloud/connection_details/context/options.tsx +++ b/packages/cloud/connection_details/context/options.tsx @@ -14,10 +14,9 @@ import { context as serviceContext } from './service'; export const context = React.createContext({}); -export const ConnectionDetailsOptsProvider: React.FC = ({ - children, - ...opts -}) => { +export const ConnectionDetailsOptsProvider: React.FC< + React.PropsWithChildren +> = ({ children, ...opts }) => { const service = React.useMemo(() => new ConnectionDetailsService(opts), [opts]); return ( diff --git a/packages/cloud/connection_details/kibana/kibana_connection_details_provider.tsx b/packages/cloud/connection_details/kibana/kibana_connection_details_provider.tsx index 068c3af1cb48f..444ff70ff9128 100644 --- a/packages/cloud/connection_details/kibana/kibana_connection_details_provider.tsx +++ b/packages/cloud/connection_details/kibana/kibana_connection_details_provider.tsx @@ -138,9 +138,9 @@ export interface KibanaConnectionDetailsProviderProps { }; } -export const KibanaConnectionDetailsProvider: React.FC = ( - props -) => { +export const KibanaConnectionDetailsProvider: React.FC< + React.PropsWithChildren +> = (props) => { const opts = useAsyncMemo( () => createOpts(props), [props.onNavigation, props.options, props.start] diff --git a/packages/cloud/connection_details/kibana/kibana_wired_connection_details_provider.tsx b/packages/cloud/connection_details/kibana/kibana_wired_connection_details_provider.tsx index ba312637fb22d..c42c41e37410e 100644 --- a/packages/cloud/connection_details/kibana/kibana_wired_connection_details_provider.tsx +++ b/packages/cloud/connection_details/kibana/kibana_wired_connection_details_provider.tsx @@ -20,7 +20,7 @@ export type KibanaWiredConnectionDetailsProviderProps = Omit< >; export const KibanaWiredConnectionDetailsProvider: React.FC< - KibanaWiredConnectionDetailsProviderProps + React.PropsWithChildren > = (props) => { return ( diff --git a/packages/cloud/connection_details/stories.tsx b/packages/cloud/connection_details/stories.tsx index baaa59d06726b..c79762ef24123 100644 --- a/packages/cloud/connection_details/stories.tsx +++ b/packages/cloud/connection_details/stories.tsx @@ -42,7 +42,7 @@ const defaultOpts: ConnectionDetailsOpts = { }, }; -export const StoriesProvider: React.FC> = ({ +export const StoriesProvider: React.FC>> = ({ children, ...rest }) => { @@ -53,7 +53,9 @@ export const StoriesProvider: React.FC> = ({ ); }; -export const StoriesProviderKeyCreationError: React.FC = ({ children }) => { +export const StoriesProviderKeyCreationError: React.FC> = ({ + children, +}) => { const opts: ConnectionDetailsOpts = { ...defaultOpts, apiKeys: { @@ -68,7 +70,9 @@ export const StoriesProviderKeyCreationError: React.FC = ({ children }) => { return {children}; }; -export const StoriesProviderNoKeyPermissions: React.FC = ({ children }) => { +export const StoriesProviderNoKeyPermissions: React.FC> = ({ + children, +}) => { const opts: ConnectionDetailsOpts = { ...defaultOpts, apiKeys: { diff --git a/packages/content-management/content_editor/src/components/metadata_form.tsx b/packages/content-management/content_editor/src/components/metadata_form.tsx index b91a49c9c11d6..f5b520b02099c 100644 --- a/packages/content-management/content_editor/src/components/metadata_form.tsx +++ b/packages/content-management/content_editor/src/components/metadata_form.tsx @@ -36,7 +36,7 @@ interface Props { const isFormFieldValid = (field: Field) => !Boolean(field.errors?.length); -export const MetadataForm: FC = ({ +export const MetadataForm: FC> = ({ form, tagsReferences, TagList, diff --git a/packages/content-management/favorites/favorites_public/src/favorites_context.tsx b/packages/content-management/favorites/favorites_public/src/favorites_context.tsx index 3271576689874..9014d72291607 100644 --- a/packages/content-management/favorites/favorites_public/src/favorites_context.tsx +++ b/packages/content-management/favorites/favorites_public/src/favorites_context.tsx @@ -18,7 +18,7 @@ interface FavoritesContextValue { const FavoritesContext = React.createContext(null); -export const FavoritesContextProvider: React.FC = ({ +export const FavoritesContextProvider: React.FC> = ({ favoritesClient, notifyError, children, diff --git a/packages/content-management/table_list_view_table/src/components/tag_filter_panel.tsx b/packages/content-management/table_list_view_table/src/components/tag_filter_panel.tsx index 39d1dd9e6686f..eba9ba647ce2f 100644 --- a/packages/content-management/table_list_view_table/src/components/tag_filter_panel.tsx +++ b/packages/content-management/table_list_view_table/src/components/tag_filter_panel.tsx @@ -57,7 +57,10 @@ interface Context { const TagFilterContext = React.createContext(null); -export const TagFilterContextProvider: FC = ({ children, ...props }) => { +export const TagFilterContextProvider: FC> = ({ + children, + ...props +}) => { return {children}; }; diff --git a/packages/content-management/table_list_view_table/src/components/user_filter_panel.tsx b/packages/content-management/table_list_view_table/src/components/user_filter_panel.tsx index 9c340b32da37d..c223efabe4028 100644 --- a/packages/content-management/table_list_view_table/src/components/user_filter_panel.tsx +++ b/packages/content-management/table_list_view_table/src/components/user_filter_panel.tsx @@ -25,7 +25,10 @@ interface Context { const UserFilterContext = React.createContext(null); -export const UserFilterContextProvider: FC = ({ children, ...props }) => { +export const UserFilterContextProvider: FC> = ({ + children, + ...props +}) => { if (!props.enabled) { return <>{children}; } diff --git a/packages/core/notifications/core-notifications-browser-internal/src/toasts/deduplicate_toasts.test.tsx b/packages/core/notifications/core-notifications-browser-internal/src/toasts/deduplicate_toasts.test.tsx index 9ff1ef42fdebe..d3acc0c97778e 100644 --- a/packages/core/notifications/core-notifications-browser-internal/src/toasts/deduplicate_toasts.test.tsx +++ b/packages/core/notifications/core-notifications-browser-internal/src/toasts/deduplicate_toasts.test.tsx @@ -121,7 +121,7 @@ function verifyTextAndTitle( expect(text).toEqual(expectedText); } -function getNodeText(node: ReactNode) { +function getNodeText(node: ReactNode | MountPoint) { const rendered = render(node as ReactElement); return rendered.text(); } diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_alerts_data_view.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_alerts_data_view.test.tsx index 42a502ebaae0a..2f4e8598a4cf6 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_alerts_data_view.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_alerts_data_view.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import React, { FunctionComponent } from 'react'; +import React from 'react'; import { AlertConsumers } from '@kbn/rule-data-utils'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; import { renderHook } from '@testing-library/react-hooks/dom'; @@ -46,7 +46,7 @@ mockServices.dataViewsService.create.mockResolvedValue(mockDataView); const queryClient = new QueryClient(testQueryClientConfig); -const wrapper: FunctionComponent = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_create_rule.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_create_rule.test.tsx index 4e319bbd67fa9..b51f878592da8 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_create_rule.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_create_rule.test.tsx @@ -66,7 +66,7 @@ const ruleToCreate: CreateRuleBody = { const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_fields_query.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_fields_query.test.tsx index 11bef3e417d2a..3607e75bc868e 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_fields_query.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_fields_query.test.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import React, { FunctionComponent } from 'react'; +import React, { FC } from 'react'; import { AlertConsumers } from '@kbn/rule-data-utils'; import * as ReactQuery from '@tanstack/react-query'; import { renderHook } from '@testing-library/react-hooks'; @@ -19,7 +19,7 @@ const { QueryClient, QueryClientProvider } = ReactQuery; const queryClient = new QueryClient(testQueryClientConfig); -const wrapper: FunctionComponent = ({ children }) => ( +const wrapper: FC> = ({ children }) => ( {children} ); @@ -62,7 +62,10 @@ describe('useFetchAlertsFieldsQuery', () => { it('should correctly override the `enabled` option', () => { const { rerender } = renderHook( - ({ featureIds, enabled }: { featureIds: AlertConsumers[]; enabled?: boolean }) => + ({ + featureIds, + enabled, + }: React.PropsWithChildren<{ featureIds: AlertConsumers[]; enabled?: boolean }>) => useFetchAlertsFieldsQuery({ http: mockHttpClient, featureIds }, { enabled }), { wrapper, diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_index_names_query.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_index_names_query.test.tsx index 2838513bb64e4..ab702a2ea09ec 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_index_names_query.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_fetch_alerts_index_names_query.test.tsx @@ -19,7 +19,7 @@ jest.mock('../apis/fetch_alerts_index_names'); const queryClient = new QueryClient(testQueryClientConfig); -const wrapper: FunctionComponent = ({ children }) => ( +const wrapper: FunctionComponent> = ({ children }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_get_alerts_group_aggregations_query.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_get_alerts_group_aggregations_query.test.tsx index da5b0a8be00db..14aca036ed87e 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_get_alerts_group_aggregations_query.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_get_alerts_group_aggregations_query.test.tsx @@ -26,7 +26,7 @@ const queryClient = new QueryClient({ }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_health_check.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_health_check.test.tsx index a1c02b4be7ef3..da4d5bc3a878c 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_health_check.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_health_check.test.tsx @@ -33,7 +33,7 @@ const { fetchAlertingFrameworkHealth } = jest.requireMock( const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connector_types.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connector_types.test.tsx index 1ff9ec930d2a7..506aa947136e4 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connector_types.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connector_types.test.tsx @@ -17,7 +17,7 @@ import { useLoadActionTypes } from './use_load_connector_types'; const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connectors.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connectors.test.tsx index 2c15fee412235..6ab5c58cb1514 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connectors.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_connectors.test.tsx @@ -17,7 +17,7 @@ import { useLoadConnectors } from './use_load_connectors'; const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_rule_type_aad_template_fields.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_rule_type_aad_template_fields.test.tsx index 75108b628492d..7d3c0815ffae5 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_rule_type_aad_template_fields.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_load_rule_type_aad_template_fields.test.tsx @@ -17,7 +17,7 @@ import { useLoadRuleTypeAadTemplateField } from './use_load_rule_type_aad_templa const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_resolve_rule.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_resolve_rule.test.tsx index b378fad3cdda9..4f74179fa8d52 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_resolve_rule.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_resolve_rule.test.tsx @@ -17,7 +17,7 @@ import { useResolveRule } from './use_resolve_rule'; const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_search_alerts_query.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_search_alerts_query.test.tsx index 7137927ad44c2..664a525796d42 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_search_alerts_query.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_search_alerts_query.test.tsx @@ -111,7 +111,7 @@ describe('useSearchAlertsQuery', () => { sort: [], }; - const wrapper: FunctionComponent = ({ children }) => ( + const wrapper: FunctionComponent> = ({ children }) => ( {children} diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_update_rule.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_update_rule.test.tsx index 379a6ba4c4067..ec3579f20db51 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_update_rule.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_update_rule.test.tsx @@ -63,7 +63,7 @@ const ruleToUpdate: UpdateRuleBody = { const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/common/hooks/use_virtual_data_view_query.test.tsx b/packages/kbn-alerts-ui-shared/src/common/hooks/use_virtual_data_view_query.test.tsx index 2d9a6f6d80cb4..834409a87f52a 100644 --- a/packages/kbn-alerts-ui-shared/src/common/hooks/use_virtual_data_view_query.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/common/hooks/use_virtual_data_view_query.test.tsx @@ -20,7 +20,7 @@ const useQuerySpy = jest.spyOn(ReactQuery, 'useQuery'); const queryClient = new QueryClient(testQueryClientConfig); -const wrapper: FunctionComponent = ({ children }) => ( +const wrapper: FunctionComponent> = ({ children }) => ( {children} ); @@ -38,7 +38,7 @@ describe('useVirtualDataViewQuery', () => { it('does not create a data view if indexNames is empty or nullish', () => { const { rerender } = renderHook( - ({ indexNames }: { indexNames: string[] }) => + ({ indexNames }: React.PropsWithChildren<{ indexNames: string[] }>) => useVirtualDataViewQuery({ dataViewsService: mockDataViewsService, indexNames }), { wrapper, diff --git a/packages/kbn-alerts-ui-shared/src/rule_form/hooks/use_load_dependencies.test.tsx b/packages/kbn-alerts-ui-shared/src/rule_form/hooks/use_load_dependencies.test.tsx index 4c2e78916951d..e80bda0692a69 100644 --- a/packages/kbn-alerts-ui-shared/src/rule_form/hooks/use_load_dependencies.test.tsx +++ b/packages/kbn-alerts-ui-shared/src/rule_form/hooks/use_load_dependencies.test.tsx @@ -143,7 +143,7 @@ getAvailableRuleTypes.mockReturnValue([ const queryClient = new QueryClient(); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_circuit_breaker_error.tsx b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_circuit_breaker_error.tsx index d817aa4a67ba6..7b8618bd50dcd 100644 --- a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_circuit_breaker_error.tsx +++ b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_circuit_breaker_error.tsx @@ -14,7 +14,7 @@ import { CIRCUIT_BREAKER_SEE_FULL_ERROR_TEXT, } from '../translations'; -export const RuleFormCircuitBreakerError: FC<{}> = ({ children }) => { +export const RuleFormCircuitBreakerError: FC> = ({ children }) => { const [showDetails, setShowDetails] = useState(false); const onToggleShowDetails = useCallback(() => { diff --git a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_error_prompt_wrapper.tsx b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_error_prompt_wrapper.tsx index 8705399a0e478..359a7cc911a3e 100644 --- a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_error_prompt_wrapper.tsx +++ b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_errors/rule_form_error_prompt_wrapper.tsx @@ -15,11 +15,9 @@ interface RuleFormErrorPromptWrapperProps { hasShadow?: boolean; } -export const RuleFormErrorPromptWrapper: React.FC = ({ - children, - hasBorder, - hasShadow, -}) => { +export const RuleFormErrorPromptWrapper: React.FC< + React.PropsWithChildren +> = ({ children, hasBorder, hasShadow }) => { const styles = useEuiBackgroundColorCSS().transparent; return ( diff --git a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_state/rule_form_state_provider.tsx b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_state/rule_form_state_provider.tsx index d63463dff55e1..0ac6cc86d2549 100644 --- a/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_state/rule_form_state_provider.tsx +++ b/packages/kbn-alerts-ui-shared/src/rule_form/rule_form_state/rule_form_state_provider.tsx @@ -17,7 +17,9 @@ export interface RuleFormStateProviderProps { initialRuleFormState: RuleFormState; } -export const RuleFormStateProvider: React.FC = (props) => { +export const RuleFormStateProvider: React.FC< + React.PropsWithChildren +> = (props) => { const { children, initialRuleFormState } = props; const { formData, diff --git a/packages/kbn-cases-components/src/__stories__/tooltip.stories.tsx b/packages/kbn-cases-components/src/__stories__/tooltip.stories.tsx index d867c6052416c..13824fecedb40 100644 --- a/packages/kbn-cases-components/src/__stories__/tooltip.stories.tsx +++ b/packages/kbn-cases-components/src/__stories__/tooltip.stories.tsx @@ -35,17 +35,17 @@ const tooltipContent: CaseTooltipContentProps = { }; const tooltipProps: CaseTooltipProps = { - children: TestSpan, + children: , loading: false, content: tooltipContent, }; -const longTitle = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. +const longTitle = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry standard dummy text ever since the 1500s!! Lorem!!!`; -const longDescription = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. - Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer - took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, +const longDescription = `Lorem Ipsum is simply dummy text of the printing and typesetting industry. + Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer + took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged.`; const Template = (args: CaseTooltipProps) => ( diff --git a/packages/kbn-cases-components/src/tooltip/tooltip.test.tsx b/packages/kbn-cases-components/src/tooltip/tooltip.test.tsx index 067fa42d25aba..d9af660aea1eb 100644 --- a/packages/kbn-cases-components/src/tooltip/tooltip.test.tsx +++ b/packages/kbn-cases-components/src/tooltip/tooltip.test.tsx @@ -33,7 +33,7 @@ const tooltipContent: CaseTooltipContentProps = { }; const tooltipProps: CaseTooltipProps = { - children: TestSpan, + children: , loading: false, content: tooltipContent, }; diff --git a/packages/kbn-test-jest-helpers/src/enzyme_helpers.tsx b/packages/kbn-test-jest-helpers/src/enzyme_helpers.tsx index b2218eeddaa82..f1843d6d9c8cf 100644 --- a/packages/kbn-test-jest-helpers/src/enzyme_helpers.tsx +++ b/packages/kbn-test-jest-helpers/src/enzyme_helpers.tsx @@ -22,6 +22,7 @@ import { shallow, MountRendererProps, ShallowRendererProps, + ComponentType, } from 'enzyme'; import React, { ReactElement } from 'react'; import { act as reactAct } from 'react-dom/test-utils'; @@ -58,13 +59,16 @@ function getOptions(context = {}, props = {}) { * @param options properties to pass into shallow wrapper * @return The wrapper instance around the rendered output with intl object in context */ -export function shallowWithIntl(node: React.ReactElement, options?: ShallowRendererProps) { +export function shallowWithIntl( + node: React.ReactElement, + options?: ShallowRendererProps & { wrappingComponent?: React.ComponentType } +) { const { context, ...props } = options || {}; const optionsWithIntl = getOptions(context, props); return shallow(nodeWithIntlProp(node), { - wrappingComponent: I18nProvider, + wrappingComponent: I18nProvider as ComponentType<{}>, ...optionsWithIntl, }); } @@ -82,7 +86,7 @@ export function mountWithIntl(node: React.ReactElement, options?: MountRendererP const optionsWithIntl = getOptions(context, props); return mount(nodeWithIntlProp(node), { - wrappingComponent: I18nProvider, + wrappingComponent: I18nProvider as ComponentType<{}>, ...optionsWithIntl, }); } @@ -100,7 +104,7 @@ export function renderWithIntl(node: React.ReactElement, options?: any) { const optionsWithIntl = getOptions(context, props); return render(nodeWithIntlProp(node), { - wrappingComponent: I18nProvider, + wrappingComponent: I18nProvider as ComponentType<{}>, ...optionsWithIntl, }); } @@ -136,7 +140,7 @@ interface ReactHookWrapper { */ export const mountHook = ( body: (args: Args) => HookValue, - WrapperComponent?: React.ComponentType, + WrapperComponent?: React.ComponentType<{ children?: React.ReactNode }>, initialArgs: Args = {} as Args ): ReactHookWrapper => { const hookValueCallback = jest.fn(); @@ -182,16 +186,31 @@ export const mountHook = ( }; }; -export function shallowWithI18nProvider(child: ReactElement, options?: ShallowRendererProps) { - const wrapped = shallow({child}, options); +export function shallowWithI18nProvider( + child: ReactElement, + options?: Omit & { + wrappingComponent?: React.ComponentType> | ComponentType; + } +) { + const wrapped = shallow({child}, options as ShallowRendererProps); return wrapped.children().dive(); } -export function mountWithI18nProvider(child: ReactElement, options?: MountRendererProps) { - const wrapped = mount({child}, options); +export function mountWithI18nProvider( + child: ReactElement, + options?: Omit & { + wrappingComponent?: React.ComponentType> | ComponentType; + } +) { + const wrapped = mount({child}, options as MountRendererProps); return wrapped.children().childAt(0); } -export function renderWithI18nProvider(child: ReactElement, options?: MountRendererProps) { +export function renderWithI18nProvider( + child: ReactElement, + options?: Omit & { + wrappingComponent?: React.ComponentType> | ComponentType; + } +) { return render({child}, options); } diff --git a/packages/kbn-test-jest-helpers/src/testbed/testbed.ts b/packages/kbn-test-jest-helpers/src/testbed/testbed.ts index fc7ba8b28c36f..51108b281a712 100644 --- a/packages/kbn-test-jest-helpers/src/testbed/testbed.ts +++ b/packages/kbn-test-jest-helpers/src/testbed/testbed.ts @@ -7,8 +7,8 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import { Component as ReactComponent } from 'react'; -import { ComponentType, HTMLAttributes, ReactWrapper } from 'enzyme'; +import { Component as ReactComponent, ComponentType } from 'react'; +import { HTMLAttributes, ReactWrapper } from 'enzyme'; import { findTestSubject } from '../find_test_subject'; import { reactRouterMock } from '../router_helpers'; diff --git a/packages/kbn-unified-data-table/src/components/data_table_footer.tsx b/packages/kbn-unified-data-table/src/components/data_table_footer.tsx index 023c534a16da9..a29abb70778ab 100644 --- a/packages/kbn-unified-data-table/src/components/data_table_footer.tsx +++ b/packages/kbn-unified-data-table/src/components/data_table_footer.tsx @@ -113,12 +113,9 @@ interface UnifiedDataTableFooterContainerProps extends UnifiedDataTableFooterPro hasButton: boolean; } -const UnifiedDataTableFooterContainer: React.FC = ({ - hasButton, - rowCount, - children, - fieldFormats, -}) => { +const UnifiedDataTableFooterContainer: React.FC< + React.PropsWithChildren +> = ({ hasButton, rowCount, children, fieldFormats }) => { const { euiTheme } = useEuiTheme(); const formattedRowCount = fieldFormats diff --git a/packages/kbn-unified-data-table/src/components/data_table_row_control.tsx b/packages/kbn-unified-data-table/src/components/data_table_row_control.tsx index 590546421d07a..68bf3174975b8 100644 --- a/packages/kbn-unified-data-table/src/components/data_table_row_control.tsx +++ b/packages/kbn-unified-data-table/src/components/data_table_row_control.tsx @@ -14,7 +14,10 @@ export enum Size { normal = 'normal', } -export const DataTableRowControl: React.FC<{ size?: Size }> = ({ size, children }) => { +export const DataTableRowControl: React.FC> = ({ + size, + children, +}) => { const classes = classnames('unifiedDataTable__rowControl', { // normalize the size of the control [`unifiedDataTable__rowControl--size-${size}`]: size, diff --git a/packages/kbn-unified-doc-viewer/src/components/field_name/__stories__/field_name.stories.tsx b/packages/kbn-unified-doc-viewer/src/components/field_name/__stories__/field_name.stories.tsx index b5186993e9b4d..2b07c68993bfe 100644 --- a/packages/kbn-unified-doc-viewer/src/components/field_name/__stories__/field_name.stories.tsx +++ b/packages/kbn-unified-doc-viewer/src/components/field_name/__stories__/field_name.stories.tsx @@ -24,7 +24,7 @@ const field = new DataViewField({ readFromDocValues: true, }); -const renderFieldName = (fldName: {} | null | undefined) => { +const renderFieldName = (fldName: React.ReactNode) => { return ( { +export class ErrorBoundary extends React.Component< + React.PropsWithChildren<{}>, + { hasError: boolean } +> { constructor(props: {}) { super(props); this.state = { hasError: false }; diff --git a/packages/kbn-unified-field-list/src/components/field_popover/field_popover_header.tsx b/packages/kbn-unified-field-list/src/components/field_popover/field_popover_header.tsx index 0e606dd897df5..65d5a1da98034 100644 --- a/packages/kbn-unified-field-list/src/components/field_popover/field_popover_header.tsx +++ b/packages/kbn-unified-field-list/src/components/field_popover/field_popover_header.tsx @@ -168,7 +168,7 @@ export const FieldPopoverHeader: React.FC = ({ ); }; -const FieldDescriptionWrapper: React.FC = ({ children }) => { +const FieldDescriptionWrapper: React.FC> = ({ children }) => { return ( <> diff --git a/packages/kbn-user-profile-components/src/hooks/use_update_user_profile.test.tsx b/packages/kbn-user-profile-components/src/hooks/use_update_user_profile.test.tsx index b174d5581d377..0837292d36ac6 100644 --- a/packages/kbn-user-profile-components/src/hooks/use_update_user_profile.test.tsx +++ b/packages/kbn-user-profile-components/src/hooks/use_update_user_profile.test.tsx @@ -35,7 +35,7 @@ const security = { const { http, notifications } = core; -const wrapper: WrapperComponent = ({ children }) => ( +const wrapper: WrapperComponent> = ({ children }) => ( > = ({ } }; -class MountPointPortalErrorBoundary extends Component<{}, { error?: unknown }> { +class MountPointPortalErrorBoundary extends Component< + { children?: React.ReactNode }, + { error?: unknown } +> { state = { error: undefined, }; diff --git a/packages/shared-ux/button_toolbar/src/popover/popover.tsx b/packages/shared-ux/button_toolbar/src/popover/popover.tsx index 239221752132e..b4cd210d881c4 100644 --- a/packages/shared-ux/button_toolbar/src/popover/popover.tsx +++ b/packages/shared-ux/button_toolbar/src/popover/popover.tsx @@ -26,7 +26,7 @@ type AllowedPopoverProps = Omit< * Props for `ToolbarPopover`. */ export type Props = AllowedButtonProps & - AllowedPopoverProps & { + Omit & { children: (arg: { closePopover: () => void }) => React.ReactNode; label: NonNullable['label']>; }; diff --git a/packages/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx b/packages/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx index 2bf4de8770c02..6100dceaa2499 100644 --- a/packages/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx +++ b/packages/shared-ux/chrome/navigation/src/ui/navigation.stories.tsx @@ -37,7 +37,9 @@ interface Props { children?: React.ReactNode | (({ isCollapsed }: { isCollapsed: boolean }) => React.ReactNode); } -const NavigationWrapper: FC> = (props) => { +const NavigationWrapper: FC, 'children'>> = ( + props +) => { const [isCollapsed, setIsCollapsed] = useState(false); const onCollapseToggle = (nextIsCollapsed: boolean) => { diff --git a/packages/shared-ux/router/impl/routes.tsx b/packages/shared-ux/router/impl/routes.tsx index 84444accf1cf6..9c1a97de65830 100644 --- a/packages/shared-ux/router/impl/routes.tsx +++ b/packages/shared-ux/router/impl/routes.tsx @@ -20,7 +20,7 @@ type RouterElementChildren = Array< path: string; render: Function; children: RouterElementChildren; - component: Function; + component: React.ComponentType; }, string | React.JSXElementConstructor > diff --git a/src/plugins/chart_expressions/expression_xy/public/components/legend_action.test.tsx b/src/plugins/chart_expressions/expression_xy/public/components/legend_action.test.tsx index e27b975c1fc0a..d9e7385cb0c86 100644 --- a/src/plugins/chart_expressions/expression_xy/public/components/legend_action.test.tsx +++ b/src/plugins/chart_expressions/expression_xy/public/components/legend_action.test.tsx @@ -12,7 +12,7 @@ import { Datatable } from '@kbn/expressions-plugin/common'; import { LegendActionProps, SeriesIdentifier } from '@elastic/charts'; import { EuiPopover } from '@elastic/eui'; import { mountWithIntl } from '@kbn/test-jest-helpers'; -import { ComponentType, ReactWrapper } from 'enzyme'; +import { ReactWrapper } from 'enzyme'; import type { DataLayerConfig } from '../../common'; import { LayerTypes } from '../../common/constants'; import { getLegendAction } from './legend_action'; @@ -180,7 +180,7 @@ const sampleLayer: DataLayerConfig = { describe('getLegendAction', function () { let wrapperProps: LegendActionProps; - const Component: ComponentType = getLegendAction( + const Component: React.ComponentType = getLegendAction( [sampleLayer], jest.fn(), [legendCellValueActions], diff --git a/src/plugins/dashboard/public/dashboard_app/listing_page/dashboard_listing_page.test.tsx b/src/plugins/dashboard/public/dashboard_app/listing_page/dashboard_listing_page.test.tsx index 151d61395b5fe..4b0ad49ec9b14 100644 --- a/src/plugins/dashboard/public/dashboard_app/listing_page/dashboard_listing_page.test.tsx +++ b/src/plugins/dashboard/public/dashboard_app/listing_page/dashboard_listing_page.test.tsx @@ -9,7 +9,7 @@ import React from 'react'; import { act } from 'react-dom/test-utils'; -import { mount, ReactWrapper } from 'enzyme'; +import { mount, ReactWrapper, ComponentType } from 'enzyme'; import { I18nProvider } from '@kbn/i18n-react'; import { createKbnUrlStateStorage } from '@kbn/kibana-utils-plugin/public'; @@ -51,7 +51,9 @@ function mountWith({ props: incomingProps }: { props?: DashboardListingPageProps }> = ({ children }) => { return {children}; }; - const component = mount(, { wrappingComponent }); + const component = mount(, { + wrappingComponent: wrappingComponent as ComponentType<{}>, + }); return { component, props }; } diff --git a/src/plugins/dashboard/public/dashboard_listing/dashboard_listing.test.tsx b/src/plugins/dashboard/public/dashboard_listing/dashboard_listing.test.tsx index 5f513213cb71f..c1aabad7eb23f 100644 --- a/src/plugins/dashboard/public/dashboard_listing/dashboard_listing.test.tsx +++ b/src/plugins/dashboard/public/dashboard_listing/dashboard_listing.test.tsx @@ -9,7 +9,7 @@ import React, { PropsWithChildren } from 'react'; import { act } from 'react-dom/test-utils'; -import { mount, ReactWrapper } from 'enzyme'; +import { mount, ReactWrapper, ComponentType } from 'enzyme'; import { I18nProvider } from '@kbn/i18n-react'; import { pluginServices } from '../services/plugin_services'; @@ -58,7 +58,9 @@ function mountWith({ props: incomingProps }: { props?: Partial = ({ children }) => { return {children}; }; - const component = mount(, { wrappingComponent }); + const component = mount(, { + wrappingComponent: wrappingComponent as ComponentType<{}>, + }); return { component, props }; } diff --git a/src/plugins/dashboard/public/dashboard_listing/dashboard_listing_empty_prompt.test.tsx b/src/plugins/dashboard/public/dashboard_listing/dashboard_listing_empty_prompt.test.tsx index 563b05385398d..92d108231b4fc 100644 --- a/src/plugins/dashboard/public/dashboard_listing/dashboard_listing_empty_prompt.test.tsx +++ b/src/plugins/dashboard/public/dashboard_listing/dashboard_listing_empty_prompt.test.tsx @@ -9,7 +9,7 @@ import React from 'react'; import { act } from 'react-dom/test-utils'; -import { mount, ReactWrapper } from 'enzyme'; +import { mount, ReactWrapper, ComponentType } from 'enzyme'; import { I18nProvider } from '@kbn/i18n-react'; @@ -49,7 +49,9 @@ function mountWith({ }> = ({ children }) => { return {children}; }; - const component = mount(, { wrappingComponent }); + const component = mount(, { + wrappingComponent: wrappingComponent as ComponentType<{}>, + }); return { component, props }; } diff --git a/src/plugins/dashboard/public/dashboard_listing/dashboard_unsaved_listing.test.tsx b/src/plugins/dashboard/public/dashboard_listing/dashboard_unsaved_listing.test.tsx index cfe75ce90a8b0..e777cc12258ee 100644 --- a/src/plugins/dashboard/public/dashboard_listing/dashboard_unsaved_listing.test.tsx +++ b/src/plugins/dashboard/public/dashboard_listing/dashboard_unsaved_listing.test.tsx @@ -8,7 +8,7 @@ */ import React from 'react'; -import { mount } from 'enzyme'; +import { mount, ComponentType } from 'enzyme'; import { I18nProvider } from '@kbn/i18n-react'; import { waitFor } from '@testing-library/react'; @@ -32,7 +32,9 @@ function mountWith({ props: incomingProps }: { props?: Partial = ({ children }) => { return {children}; }; - const component = mount(, { wrappingComponent }); + const component = mount(, { + wrappingComponent: wrappingComponent as ComponentType<{}>, + }); return { component, props }; } diff --git a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/url.tsx b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/url.tsx index feefb97ac1a7a..03cd4aae87b44 100644 --- a/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/url.tsx +++ b/src/plugins/data_view_field_editor/public/components/field_format_editor/editors/url/url.tsx @@ -17,7 +17,8 @@ import { } from '@elastic/eui'; import { UrlFormat } from '@kbn/field-formats-plugin/common'; import { FormattedMessage } from '@kbn/i18n-react'; -import { context as contextType } from '@kbn/kibana-react-plugin/public'; +import { context as contextType, KibanaReactContextValue } from '@kbn/kibana-react-plugin/public'; +import { CoreStart } from '@kbn/core/public'; import React, { Fragment } from 'react'; import { FormatEditorSamples } from '../../samples'; import { DefaultFormatEditor } from '../default/default'; @@ -56,6 +57,9 @@ export class UrlFormatEditor extends DefaultFormatEditor< > { static contextType = contextType; static formatId = formatId; + + declare context: KibanaReactContextValue>; + private get sampleIconPath() { const sampleIconPath = `/plugins/dataViewFieldEditor/assets/icons/{{value}}.png`; return this.context?.services.http @@ -207,7 +211,7 @@ export class UrlFormatEditor extends DefaultFormatEditor< helpText={ { +const WrapperWithPadding: FC> = ({ children }) => { const padding = useEuiPaddingSize('s'); return ( diff --git a/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx b/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx index 93444b292d583..acfaaf7daba3e 100644 --- a/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx +++ b/src/plugins/discover/public/application/context/hooks/use_context_app_fetch.test.tsx @@ -106,7 +106,7 @@ const initDefaults = (tieBreakerFields: string[], dataViewId = 'the-data-view-id return { result: renderHook(() => useContextAppFetch(props.props), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }).result, diff --git a/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx b/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx index 046e97641a4c4..e14b5afc30d04 100644 --- a/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx +++ b/src/plugins/discover/public/application/main/components/layout/use_discover_histogram.test.tsx @@ -121,7 +121,9 @@ describe('useDiscoverHistogram', () => { hideChart, }; - const Wrapper: WrapperComponent = ({ children }) => ( + const Wrapper: WrapperComponent> = ({ + children, + }) => ( {children as ReactElement} ); diff --git a/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx b/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx index 824c57452eaa1..4bab0f75e87e6 100644 --- a/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx +++ b/src/plugins/discover/public/application/main/components/layout/use_fetch_more_records.test.tsx @@ -49,7 +49,7 @@ describe('useFetchMoreRecords', () => { const getWrapper = ( stateContainer: DiscoverStateContainer - ): WrapperComponent => { + ): WrapperComponent> => { return ({ children }) => ( <>{children} diff --git a/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx b/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx index 0106b4bc9adcb..014d29321bf87 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx +++ b/src/plugins/discover/public/context_awareness/hooks/use_profiles.test.tsx @@ -37,7 +37,7 @@ const getProfiles$Spy = jest.spyOn(discoverServiceMock.profilesManager, 'getProf const render = () => { return renderHook((props) => useProfiles(props), { - initialProps: { record } as GetProfilesOptions, + initialProps: { record } as React.PropsWithChildren, wrapper: ({ children }) => ( {children} ), diff --git a/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx b/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx index a6797dc1a9499..8edbc35ab11a1 100644 --- a/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx +++ b/src/plugins/discover/public/context_awareness/hooks/use_root_profile.test.tsx @@ -15,7 +15,9 @@ import { useRootProfile } from './use_root_profile'; const render = () => { return renderHook((props) => useRootProfile(props), { - initialProps: { solutionNavId: 'solutionNavId' }, + initialProps: { solutionNavId: 'solutionNavId' } as React.PropsWithChildren<{ + solutionNavId: string; + }>, wrapper: ({ children }) => ( {children} ), diff --git a/src/plugins/discover/public/customizations/customization_provider.test.tsx b/src/plugins/discover/public/customizations/customization_provider.test.tsx index 7412303b61e96..7dbdc9e3c3475 100644 --- a/src/plugins/discover/public/customizations/customization_provider.test.tsx +++ b/src/plugins/discover/public/customizations/customization_provider.test.tsx @@ -66,7 +66,7 @@ describe('useDiscoverCustomization', () => { it('should provide customization', () => { const customization: DiscoverCustomization = { id: 'top_nav' }; const wrapper = renderHook(() => useDiscoverCustomization('top_nav'), { - wrapper: ({ children }) => { + wrapper: ({ children }: React.PropsWithChildren<{}>) => { const service = createCustomizationService(); service.set(customization); return ( @@ -80,8 +80,10 @@ describe('useDiscoverCustomization', () => { it('should allow changing the customization', () => { const customization: DiscoverCustomization = { id: 'top_nav' }; const service = createCustomizationService(); - const wrapper = renderHook((id) => useDiscoverCustomization(id), { - initialProps: customization.id as DiscoverCustomizationId, + const wrapper = renderHook(({ id }) => useDiscoverCustomization(id), { + initialProps: { id: customization.id } as React.PropsWithChildren<{ + id: DiscoverCustomizationId; + }>, wrapper: ({ children }) => { service.set(customization); return ( @@ -92,13 +94,13 @@ describe('useDiscoverCustomization', () => { expect(wrapper.result.current).toBe(customization); const newCustomization: DiscoverCustomization = { id: 'search_bar' }; service.set(newCustomization); - wrapper.rerender('search_bar'); + wrapper.rerender({ id: 'search_bar' }); expect(wrapper.result.current).toBe(newCustomization); }); it('should provide undefined if customization is not found', () => { const wrapper = renderHook(() => useDiscoverCustomization('top_nav'), { - wrapper: ({ children }) => { + wrapper: ({ children }: React.PropsWithChildren<{}>) => { const service = createCustomizationService(); return ( {children} @@ -113,7 +115,7 @@ describe('useDiscoverCustomization$', () => { it('should provide customization$', () => { const customization: DiscoverCustomization = { id: 'top_nav' }; const wrapper = renderHook(() => useDiscoverCustomization$('top_nav'), { - wrapper: ({ children }) => { + wrapper: ({ children }: React.PropsWithChildren<{}>) => { const service = createCustomizationService(); service.set(customization); return ( @@ -131,8 +133,10 @@ describe('useDiscoverCustomization$', () => { it('should allow changing the customization', () => { const customization: DiscoverCustomization = { id: 'top_nav' }; const service = createCustomizationService(); - const wrapper = renderHook((id) => useDiscoverCustomization$(id), { - initialProps: customization.id as DiscoverCustomizationId, + const wrapper = renderHook(({ id }) => useDiscoverCustomization$(id), { + initialProps: { id: customization.id } as React.PropsWithChildren<{ + id: DiscoverCustomizationId; + }>, wrapper: ({ children }) => { service.set(customization); return ( @@ -147,7 +151,7 @@ describe('useDiscoverCustomization$', () => { expect(result).toBe(customization); const newCustomization: DiscoverCustomization = { id: 'search_bar' }; service.set(newCustomization); - wrapper.rerender('search_bar'); + wrapper.rerender({ id: 'search_bar' }); wrapper.result.current.subscribe((current) => { result = current; }); @@ -156,7 +160,7 @@ describe('useDiscoverCustomization$', () => { it('should provide undefined if customization is not found', () => { const wrapper = renderHook(() => useDiscoverCustomization$('top_nav'), { - wrapper: ({ children }) => { + wrapper: ({ children }: React.PropsWithChildren<{}>) => { const service = createCustomizationService(); return ( {children} diff --git a/src/plugins/discover/public/hooks/use_data_view.test.tsx b/src/plugins/discover/public/hooks/use_data_view.test.tsx index 42dda41b8b939..5ef2194ab8db1 100644 --- a/src/plugins/discover/public/hooks/use_data_view.test.tsx +++ b/src/plugins/discover/public/hooks/use_data_view.test.tsx @@ -38,7 +38,7 @@ const mockServices = { const render = async ({ dataViewId }: { dataViewId: string }) => { const hookResult = renderHook(() => useDataView({ index: dataViewId }), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/src/plugins/discover/public/hooks/use_navigation_props.test.tsx b/src/plugins/discover/public/hooks/use_navigation_props.test.tsx index 8fddea8a9db12..36c86e01a9bb9 100644 --- a/src/plugins/discover/public/hooks/use_navigation_props.test.tsx +++ b/src/plugins/discover/public/hooks/use_navigation_props.test.tsx @@ -58,7 +58,7 @@ const render = async () => { columns: ['mock-column'], }), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} diff --git a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/form.tsx b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/form.tsx index 7fca6465c83d3..c624256fe9196 100644 --- a/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/form.tsx +++ b/src/plugins/es_ui_shared/static/forms/hook_form_lib/components/form.tsx @@ -16,7 +16,7 @@ import { FormHook } from '../types'; export interface Props { form: FormHook; - FormWrapper?: React.ComponentType; + FormWrapper?: React.ComponentType>; children: ReactNode | ReactNode[]; [key: string]: any; } diff --git a/src/plugins/expression_shape/public/components/progress/progress_drawer.tsx b/src/plugins/expression_shape/public/components/progress/progress_drawer.tsx index 7ccae3f9ca1c9..dfcb68dbf0d07 100644 --- a/src/plugins/expression_shape/public/components/progress/progress_drawer.tsx +++ b/src/plugins/expression_shape/public/components/progress/progress_drawer.tsx @@ -12,7 +12,7 @@ import { ShapeDrawer, ShapeRef, ShapeDrawerComponentProps } from '../reusable'; import { getShape } from './shapes'; export const ProgressDrawerComponent = React.forwardRef( - (props: ShapeDrawerComponentProps, ref: Ref) => ( + (props: React.PropsWithChildren, ref: Ref) => ( ) ); diff --git a/src/plugins/expression_shape/public/components/reusable/shape_factory.tsx b/src/plugins/expression_shape/public/components/reusable/shape_factory.tsx index dc564d54dabf5..760ada5c7175f 100644 --- a/src/plugins/expression_shape/public/components/reusable/shape_factory.tsx +++ b/src/plugins/expression_shape/public/components/reusable/shape_factory.tsx @@ -17,7 +17,7 @@ export const getShapeComponent = (svgParams: SvgConfig) => shapeContentAttributes, children, textAttributes, - }: ShapeProps) { + }: React.PropsWithChildren) { const { viewBox: initialViewBox, shapeProps: defaultShapeContentAttributes, diff --git a/src/plugins/share/public/components/url_panel_content.tsx b/src/plugins/share/public/components/url_panel_content.tsx index eaf795bf6268a..0d789e5339588 100644 --- a/src/plugins/share/public/components/url_panel_content.tsx +++ b/src/plugins/share/public/components/url_panel_content.tsx @@ -7,7 +7,7 @@ * License v3.0 only", or the "Server Side Public License, v 1". */ -import React, { Component, ReactElement } from 'react'; +import React, { Component } from 'react'; import { EuiButton, EuiCopy, @@ -582,7 +582,7 @@ export class UrlPanelContent extends Component { ); }; - private renderUrlParamExtensions = (): ReactElement | void => { + private renderUrlParamExtensions = (): React.ReactNode => { if (!this.props.urlParamExtensions) { return; } diff --git a/src/plugins/unified_search/public/filter_badge/filter_badge_error_boundary.tsx b/src/plugins/unified_search/public/filter_badge/filter_badge_error_boundary.tsx index bab4233935db4..4f116432fc8f6 100644 --- a/src/plugins/unified_search/public/filter_badge/filter_badge_error_boundary.tsx +++ b/src/plugins/unified_search/public/filter_badge/filter_badge_error_boundary.tsx @@ -18,7 +18,7 @@ interface FilterBadgeErrorBoundaryState { } export class FilterBadgeErrorBoundary extends Component< - FilterBadgeErrorBoundaryProps, + React.PropsWithChildren, FilterBadgeErrorBoundaryState > { constructor(props: FilterBadgeErrorBoundaryProps) { diff --git a/src/plugins/vis_types/timeseries/public/application/components/panel_config/table.tsx b/src/plugins/vis_types/timeseries/public/application/components/panel_config/table.tsx index 065d2006c217d..c2f398b784b63 100644 --- a/src/plugins/vis_types/timeseries/public/application/components/panel_config/table.tsx +++ b/src/plugins/vis_types/timeseries/public/application/components/panel_config/table.tsx @@ -39,6 +39,7 @@ import { QueryBarWrapper } from '../query_bar_wrapper'; import { getDefaultQueryLanguage } from '../lib/get_default_query_language'; import { VisDataContext } from '../../contexts/vis_data_context'; import { BUCKET_TYPES } from '../../../../common/enums'; +import type { TimeseriesUIRestrictions } from '../../../../common/ui_restrictions'; import { PanelConfigProps, PANEL_CONFIG_TABS } from './types'; import { TimeseriesVisParams } from '../../../types'; import { getIndexPatternKey } from '../../../../common/index_patterns_utils'; @@ -48,6 +49,9 @@ export class TablePanelConfig extends Component< { selectedTab: PANEL_CONFIG_TABS } > { static contextType = VisDataContext; + + declare context: { uiRestrictions?: TimeseriesUIRestrictions }; + constructor(props: PanelConfigProps) { super(props); this.state = { selectedTab: PANEL_CONFIG_TABS.DATA }; diff --git a/x-pack/packages/kbn-elastic-assistant/impl/assistant/use_conversation/index.test.tsx b/x-pack/packages/kbn-elastic-assistant/impl/assistant/use_conversation/index.test.tsx index 0cc7ddb8aed1e..696a2e41b37c2 100644 --- a/x-pack/packages/kbn-elastic-assistant/impl/assistant/use_conversation/index.test.tsx +++ b/x-pack/packages/kbn-elastic-assistant/impl/assistant/use_conversation/index.test.tsx @@ -56,7 +56,7 @@ describe('useConversation', () => { it('should create a new conversation when called with valid conversationId and message', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useConversation(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); @@ -77,7 +77,7 @@ describe('useConversation', () => { it('should delete an existing conversation when called with valid conversationId', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useConversation(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); @@ -95,7 +95,7 @@ describe('useConversation', () => { it('should update the apiConfig for an existing conversation when called with a valid conversationId and apiConfig', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useConversation(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); @@ -116,7 +116,7 @@ describe('useConversation', () => { it('should remove the last message from a conversation when called with valid conversationId', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useConversation(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/x-pack/packages/security-solution/data_table/components/data_table/helpers.test.tsx b/x-pack/packages/security-solution/data_table/components/data_table/helpers.test.tsx index 597f661aa3650..0d8b3eb283749 100644 --- a/x-pack/packages/security-solution/data_table/components/data_table/helpers.test.tsx +++ b/x-pack/packages/security-solution/data_table/components/data_table/helpers.test.tsx @@ -78,7 +78,7 @@ describe('helpers', () => { }, }, _owner: null, - }, + } as unknown as React.ReactNode, isSortable: true, }, { @@ -113,7 +113,7 @@ describe('helpers', () => { }, }, _owner: null, - }, + } as unknown as React.ReactNode, isSortable: true, }, ]; diff --git a/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/actions/add_to_new_case/index.test.tsx b/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/actions/add_to_new_case/index.test.tsx index ba4aee43c32c7..aa96fd4d8f928 100644 --- a/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/actions/add_to_new_case/index.test.tsx +++ b/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/actions/add_to_new_case/index.test.tsx @@ -64,7 +64,7 @@ describe('AddToNewCaseAction', () => { describe('when clicking on add to new case link', () => { it('should open create case flyout with header content and provided markdown', () => { - let headerContent: React.ReactNode = null; + let headerContent: HTMLElement | null = null; const openCreateCaseFlyout = jest.fn(({ headerContent: _headerContent }) => { headerContent = render(_headerContent).container; }); diff --git a/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/hooks/use_ilm_explain/index.test.tsx b/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/hooks/use_ilm_explain/index.test.tsx index 768845f023011..bfc66c3711dbb 100644 --- a/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/hooks/use_ilm_explain/index.test.tsx +++ b/x-pack/packages/security-solution/ecs_data_quality_dashboard/impl/data_quality_panel/data_quality_details/indices_details/pattern/hooks/use_ilm_explain/index.test.tsx @@ -114,7 +114,7 @@ describe('useIlmExplain', () => { beforeEach(async () => { const { result, waitForNextUpdate } = renderHook(() => useIlmExplain(pattern), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( = ({ timestamp, children }) => { +export const TimeToolTip: FunctionComponent> = ({ + timestamp, + children, +}) => { return ( {children ?? moment(timestamp).fromNow()} diff --git a/x-pack/plugins/canvas/public/components/app/index.tsx b/x-pack/plugins/canvas/public/components/app/index.tsx index 862f2539d1682..e23891ccc9bca 100644 --- a/x-pack/plugins/canvas/public/components/app/index.tsx +++ b/x-pack/plugins/canvas/public/components/app/index.tsx @@ -14,7 +14,7 @@ import { shortcutManager } from '../../lib/shortcut_manager'; import { CanvasRouter } from '../../routes'; import { Flyouts } from '../flyouts'; -class ShortcutManagerContextWrapper extends React.Component { +class ShortcutManagerContextWrapper extends React.Component> { static childContextTypes = { shortcuts: PropTypes.object.isRequired, }; diff --git a/x-pack/plugins/canvas/public/routes/index.tsx b/x-pack/plugins/canvas/public/routes/index.tsx index 18c1784fa9722..3b40785044953 100644 --- a/x-pack/plugins/canvas/public/routes/index.tsx +++ b/x-pack/plugins/canvas/public/routes/index.tsx @@ -6,7 +6,7 @@ */ import React, { FC } from 'react'; -import { RouteComponentProps, Redirect } from 'react-router-dom'; +import { Redirect, RouteChildrenProps } from 'react-router-dom'; import { Router, Routes, Route } from '@kbn/shared-ux-router'; import { History } from 'history'; import { parse, stringify } from 'query-string'; @@ -28,7 +28,7 @@ export const CanvasRouter: FC<{ history: History }> = ({ history }) => ( { + children={(route: RouteChildrenProps) => { // If it looks like the hash is a route then we will do a redirect if (isHashPath(route.location.hash) && !route.location.pathname) { const [hashPath, hashQuery] = route.location.hash.split('?'); diff --git a/x-pack/plugins/cases/public/common/hooks.test.tsx b/x-pack/plugins/cases/public/common/hooks.test.tsx index 42ca1c20d578e..d2cea878504bb 100644 --- a/x-pack/plugins/cases/public/common/hooks.test.tsx +++ b/x-pack/plugins/cases/public/common/hooks.test.tsx @@ -28,7 +28,9 @@ describe('hooks', () => { it('returns true if it is the main application', () => { const { result } = renderHook(() => useIsMainApplication(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current).toBe(true); @@ -38,7 +40,9 @@ describe('hooks', () => { useApplicationMock.mockReturnValue({ appId: 'testAppId', appTitle: 'Test app' }); const { result } = renderHook(() => useIsMainApplication(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current).toBe(false); diff --git a/x-pack/plugins/cases/public/common/lib/kibana/hooks.test.tsx b/x-pack/plugins/cases/public/common/lib/kibana/hooks.test.tsx index 1ec28de4c3d3c..8d0beb130edc6 100644 --- a/x-pack/plugins/cases/public/common/lib/kibana/hooks.test.tsx +++ b/x-pack/plugins/cases/public/common/lib/kibana/hooks.test.tsx @@ -14,12 +14,12 @@ import { allCasesPermissions, TestProviders } from '../../mock'; describe('hooks', () => { describe('useApplicationCapabilities', () => { it('should return the correct capabilities', async () => { - const { result } = renderHook<{}, ReturnType>( - () => useApplicationCapabilities(), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren<{}>, + ReturnType + >(() => useApplicationCapabilities(), { + wrapper: ({ children }) => {children}, + }); expect(result.current).toEqual({ actions: { crud: true, read: true }, diff --git a/x-pack/plugins/cases/public/common/navigation/hooks.test.tsx b/x-pack/plugins/cases/public/common/navigation/hooks.test.tsx index 7d296db032a75..2170ed2d0e583 100644 --- a/x-pack/plugins/cases/public/common/navigation/hooks.test.tsx +++ b/x-pack/plugins/cases/public/common/navigation/hooks.test.tsx @@ -37,7 +37,9 @@ describe('hooks', () => { const { result } = renderHook( () => useCasesNavigation({ deepLinkId: CasesDeepLinkId.cases }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -54,7 +56,9 @@ describe('hooks', () => { const { result } = renderHook( () => useCasesNavigation({ deepLinkId: CasesDeepLinkId.cases }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); const [, navigateToCases] = result.current; @@ -70,7 +74,9 @@ describe('hooks', () => { describe('useAllCasesNavigation', () => { it('it calls getAppUrl with correct arguments', () => { const { result } = renderHook(() => useAllCasesNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -82,7 +88,9 @@ describe('hooks', () => { it('it calls navigateToAllCases with correct arguments', () => { const { result } = renderHook(() => useAllCasesNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -96,7 +104,9 @@ describe('hooks', () => { describe('useCreateCaseNavigation', () => { it('it calls getAppUrl with correct arguments', () => { const { result } = renderHook(() => useCreateCaseNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -112,7 +122,9 @@ describe('hooks', () => { it('it calls navigateToAllCases with correct arguments', () => { const { result } = renderHook(() => useCreateCaseNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -126,7 +138,9 @@ describe('hooks', () => { describe('useConfigureCasesNavigation', () => { it('it calls getAppUrl with correct arguments', () => { const { result } = renderHook(() => useConfigureCasesNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -142,7 +156,9 @@ describe('hooks', () => { it('it calls navigateToAllCases with correct arguments', () => { const { result } = renderHook(() => useConfigureCasesNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -156,7 +172,9 @@ describe('hooks', () => { describe('useCaseViewNavigation', () => { it('it calls getAppUrl with correct arguments', () => { const { result } = renderHook(() => useCaseViewNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -172,7 +190,9 @@ describe('hooks', () => { it('it calls navigateToAllCases with correct arguments', () => { const { result } = renderHook(() => useCaseViewNavigation(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { diff --git a/x-pack/plugins/cases/public/common/use_cases_features.test.tsx b/x-pack/plugins/cases/public/common/use_cases_features.test.tsx index 41d7c062ca4d3..eeabf3fb0cab2 100644 --- a/x-pack/plugins/cases/public/common/use_cases_features.test.tsx +++ b/x-pack/plugins/cases/public/common/use_cases_features.test.tsx @@ -37,9 +37,14 @@ describe('useCasesFeatures', () => { it.each(tests)( 'returns isAlertsEnabled=%s and isSyncAlertsEnabled=%s if feature.alerts=%s', async (isAlertsEnabled, isSyncAlertsEnabled, alerts) => { - const { result } = renderHook<{}, UseCasesFeatures>(() => useCasesFeatures(), { - wrapper: ({ children }) => {children}, - }); + const { result } = renderHook, UseCasesFeatures>( + () => useCasesFeatures(), + { + wrapper: ({ children }) => ( + {children} + ), + } + ); expect(result.current).toEqual({ isAlertsEnabled, @@ -52,13 +57,16 @@ describe('useCasesFeatures', () => { ); it('returns the metrics correctly', async () => { - const { result } = renderHook<{}, UseCasesFeatures>(() => useCasesFeatures(), { - wrapper: ({ children }) => ( - - {children} - - ), - }); + const { result } = renderHook, UseCasesFeatures>( + () => useCasesFeatures(), + { + wrapper: ({ children }) => ( + + {children} + + ), + } + ); expect(result.current).toEqual({ isAlertsEnabled: true, @@ -83,9 +91,12 @@ describe('useCasesFeatures', () => { license: { type }, }); - const { result } = renderHook<{}, UseCasesFeatures>(() => useCasesFeatures(), { - wrapper: ({ children }) => {children}, - }); + const { result } = renderHook, UseCasesFeatures>( + () => useCasesFeatures(), + { + wrapper: ({ children }) => {children}, + } + ); expect(result.current).toEqual({ isAlertsEnabled: true, diff --git a/x-pack/plugins/cases/public/common/use_license.test.tsx b/x-pack/plugins/cases/public/common/use_license.test.tsx index 588abc83306bb..0c28be2ca746d 100644 --- a/x-pack/plugins/cases/public/common/use_license.test.tsx +++ b/x-pack/plugins/cases/public/common/use_license.test.tsx @@ -18,7 +18,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeast('basic')).toBeTruthy(); @@ -29,7 +33,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeast('platinum')).toBeFalsy(); @@ -44,7 +52,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeast('basic')).toBeFalsy(); @@ -59,7 +71,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeast('basic')).toBeFalsy(); @@ -76,7 +92,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastPlatinum()).toBeTruthy(); @@ -91,7 +111,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastPlatinum()).toBeFalsy(); @@ -108,7 +132,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastGold()).toBeTruthy(); @@ -123,7 +151,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastGold()).toBeFalsy(); @@ -140,7 +172,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastEnterprise()).toBeTruthy(); @@ -155,7 +191,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.isAtLeastEnterprise()).toBeFalsy(); @@ -172,7 +212,11 @@ describe('useLicense', () => { () => { return useLicense(); }, - { wrapper: ({ children }) => {children} } + { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), + } ); expect(result.current.getLicense()).toEqual(license); diff --git a/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx b/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx index 5324a5a793067..7122a830d2d18 100644 --- a/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx +++ b/x-pack/plugins/cases/public/components/all_cases/all_cases_list.test.tsx @@ -262,12 +262,12 @@ describe('AllCasesListGeneric', () => { expect(column[key].querySelector('span')).toHaveTextContent(emptyTag); }; - const { result } = renderHook( - () => useCasesColumns(defaultColumnArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseCasesColumnsReturnValue + >(() => useCasesColumns(defaultColumnArgs), { + wrapper: ({ children }) => {children}, + }); await waitFor(() => { result.current.columns.map( diff --git a/x-pack/plugins/cases/public/components/all_cases/table_filter_config/use_filter_config.test.tsx b/x-pack/plugins/cases/public/components/all_cases/table_filter_config/use_filter_config.test.tsx index daea26475e364..89419d587237c 100644 --- a/x-pack/plugins/cases/public/components/all_cases/table_filter_config/use_filter_config.test.tsx +++ b/x-pack/plugins/cases/public/components/all_cases/table_filter_config/use_filter_config.test.tsx @@ -64,7 +64,9 @@ describe('useFilterConfig', () => { it('should remove a selected option if the filter is deleted', async () => { const { rerender } = renderHook(useFilterConfig, { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren[0]>) => ( + {children} + ), initialProps: { systemFilterConfig: filters, onFilterOptionsChange, @@ -104,7 +106,9 @@ describe('useFilterConfig', () => { ); const { result } = renderHook(useFilterConfig, { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren[0]>) => ( + {children} + ), initialProps: { systemFilterConfig: filters, onFilterOptionsChange, diff --git a/x-pack/plugins/cases/public/components/all_cases/use_all_cases_state.test.tsx b/x-pack/plugins/cases/public/components/all_cases/use_all_cases_state.test.tsx index ce394a5047fed..1e257c8fbcefd 100644 --- a/x-pack/plugins/cases/public/components/all_cases/use_all_cases_state.test.tsx +++ b/x-pack/plugins/cases/public/components/all_cases/use_all_cases_state.test.tsx @@ -59,7 +59,9 @@ describe('useAllCasesQueryParams', () => { it('returns default state with empty URL and local storage', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual(DEFAULT_CASES_TABLE_STATE.queryParams); @@ -80,7 +82,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject(existingLocalStorageValues.queryParams); @@ -99,7 +103,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.filterOptions).toMatchObject(existingLocalStorageValues.filterOptions); @@ -109,7 +115,9 @@ describe('useAllCasesQueryParams', () => { mockLocation.search = stringifyUrlParams({ page: 2, perPage: 15 }); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ @@ -125,7 +133,9 @@ describe('useAllCasesQueryParams', () => { }); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.filterOptions).toMatchObject({ @@ -144,7 +154,9 @@ describe('useAllCasesQueryParams', () => { mockLocation.search = nonDefaultUrlParams.toString(); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.filterOptions).toMatchObject({ @@ -159,7 +171,9 @@ describe('useAllCasesQueryParams', () => { })}&foo=bar&foo=baz&test=my-test`; const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -197,7 +211,9 @@ describe('useAllCasesQueryParams', () => { }; const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -238,7 +254,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ @@ -265,7 +283,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.filterOptions).toMatchObject({ severity: ['high'], status: ['open'] }); @@ -283,7 +303,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(mockReplace).toHaveBeenCalledWith({ @@ -303,7 +325,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { rerender } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); rerender(); @@ -328,7 +352,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(mockReplace).toHaveBeenCalledTimes(0); @@ -341,7 +367,9 @@ describe('useAllCasesQueryParams', () => { }); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual(DEFAULT_CASES_TABLE_STATE.queryParams); @@ -364,7 +392,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual({ @@ -376,7 +406,9 @@ describe('useAllCasesQueryParams', () => { it('updates the query params correctly', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -394,7 +426,9 @@ describe('useAllCasesQueryParams', () => { it('updates URL when updating the query params', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -410,7 +444,9 @@ describe('useAllCasesQueryParams', () => { it('updates the local storage when updating the query params', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -431,7 +467,9 @@ describe('useAllCasesQueryParams', () => { it('updates the filter options correctly', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -447,7 +485,9 @@ describe('useAllCasesQueryParams', () => { it('updates the URL when updating the filter options', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -461,7 +501,9 @@ describe('useAllCasesQueryParams', () => { it('updates the local storage when updating the filter options', () => { const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -496,7 +538,9 @@ describe('useAllCasesQueryParams', () => { })); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); const localStorageState = JSON.parse(localStorage.getItem(LS_KEY) ?? '{}'); @@ -516,7 +560,9 @@ describe('useAllCasesQueryParams', () => { const lsSpy = jest.spyOn(Storage.prototype, 'setItem'); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); // first call is the initial call made by useLocalStorage @@ -532,7 +578,9 @@ describe('useAllCasesQueryParams', () => { const lsSpy = jest.spyOn(Storage.prototype, 'setItem'); const { rerender } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); rerender(); @@ -559,7 +607,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); // first call is the initial call made by useLocalStorage @@ -580,7 +630,9 @@ describe('useAllCasesQueryParams', () => { const lsSpy = jest.spyOn(Storage.prototype, 'setItem'); renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); // first call is the initial call made by useLocalStorage @@ -597,7 +649,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ @@ -609,7 +663,9 @@ describe('useAllCasesQueryParams', () => { mockLocation.search = stringifyUrlParams({ perPage: 1000 }); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ @@ -627,7 +683,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ sortOrder: 'desc' }); @@ -638,7 +696,9 @@ describe('useAllCasesQueryParams', () => { mockLocation.search = stringifyUrlParams({ sortOrder: 'foobar' }); const { result } = renderHook(() => useAllCasesState(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toMatchObject({ sortOrder: 'desc' }); @@ -648,7 +708,9 @@ describe('useAllCasesQueryParams', () => { describe('Modal', () => { it('returns default state with empty URL and local storage', () => { const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual(DEFAULT_CASES_TABLE_STATE.queryParams); @@ -657,7 +719,9 @@ describe('useAllCasesQueryParams', () => { it('updates the query params correctly', () => { const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -675,7 +739,9 @@ describe('useAllCasesQueryParams', () => { it('updates the filter options correctly', () => { const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -691,7 +757,9 @@ describe('useAllCasesQueryParams', () => { it('does not update the URL when changing the state of the table', () => { const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -703,7 +771,9 @@ describe('useAllCasesQueryParams', () => { it('does not update the local storage when changing the state of the table', () => { const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); act(() => { @@ -728,7 +798,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(mockPush).not.toHaveBeenCalled(); @@ -741,7 +813,9 @@ describe('useAllCasesQueryParams', () => { }); const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual(DEFAULT_CASES_TABLE_STATE.queryParams); @@ -760,7 +834,9 @@ describe('useAllCasesQueryParams', () => { localStorage.setItem(LS_KEY, JSON.stringify(existingLocalStorageValues)); const { result } = renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.queryParams).toStrictEqual(DEFAULT_CASES_TABLE_STATE.queryParams); @@ -774,7 +850,9 @@ describe('useAllCasesQueryParams', () => { }); renderHook(() => useAllCasesState(true), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); const localStorageState = JSON.parse(localStorage.getItem(LS_KEY) ?? '{}'); diff --git a/x-pack/plugins/cases/public/components/app/use_readonly_header.test.tsx b/x-pack/plugins/cases/public/components/app/use_readonly_header.test.tsx index 39e7fa39b461f..9be5a6336b3c2 100644 --- a/x-pack/plugins/cases/public/components/app/use_readonly_header.test.tsx +++ b/x-pack/plugins/cases/public/components/app/use_readonly_header.test.tsx @@ -25,7 +25,9 @@ describe('CaseContainerComponent', () => { it('does not display the readonly glasses badge when the user has write permissions', () => { renderHook(() => useReadonlyHeader(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(mockedSetBadge).not.toBeCalled(); @@ -33,7 +35,7 @@ describe('CaseContainerComponent', () => { it('displays the readonly glasses badge read permissions but not write', () => { renderHook(() => useReadonlyHeader(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/x-pack/plugins/cases/public/components/configure_cases/closure_options.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/closure_options.test.tsx index 0202651b6f2bf..7af225725cf22 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/closure_options.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/closure_options.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ReactWrapper, ComponentType } from 'enzyme'; import { mount } from 'enzyme'; import type { ClosureOptionsProps } from './closure_options'; @@ -24,7 +24,9 @@ describe('ClosureOptions', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); test('it shows the closure options form group', () => { diff --git a/x-pack/plugins/cases/public/components/configure_cases/closure_options_radio.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/closure_options_radio.test.tsx index 7fb66f2e1eb14..55016b85b17b8 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/closure_options_radio.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/closure_options_radio.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import type { ClosureOptionsRadioComponentProps } from './closure_options_radio'; @@ -23,7 +23,9 @@ describe('ClosureOptionsRadio', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); test('it renders', () => { @@ -46,7 +48,7 @@ describe('ClosureOptionsRadio', () => { test('it disables the close by user radio button', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect(newWrapper.find('input[id="close-by-user"]').prop('disabled')).toEqual(true); @@ -54,7 +56,7 @@ describe('ClosureOptionsRadio', () => { test('it disables correctly the close by pushing radio button', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect(newWrapper.find('input[id="close-by-pushing"]').prop('disabled')).toEqual(true); @@ -64,7 +66,7 @@ describe('ClosureOptionsRadio', () => { const newWrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ); expect(newWrapper.find('input[id="close-by-pushing"]').prop('checked')).toEqual(true); diff --git a/x-pack/plugins/cases/public/components/configure_cases/connectors.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/connectors.test.tsx index 9db8d82c6b315..0769e7a29cc59 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/connectors.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/connectors.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import { render, screen } from '@testing-library/react'; @@ -41,7 +41,9 @@ describe('Connectors', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); beforeEach(() => { @@ -90,7 +92,7 @@ describe('Connectors', () => { selectedConnector={{ id: 'servicenow-1', type: ConnectorTypes.serviceNowITSM }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ); @@ -117,7 +119,7 @@ describe('Connectors', () => { selectedConnector={{ id: 'servicenow-1', type: ConnectorTypes.serviceNowITSM }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ); diff --git a/x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx index f2e298afa0842..fa661c12b509b 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/connectors_dropdown.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ReactWrapper, ComponentType } from 'enzyme'; import { mount } from 'enzyme'; import { EuiSuperSelect } from '@elastic/eui'; import { render, screen } from '@testing-library/react'; @@ -34,7 +34,9 @@ describe('ConnectorsDropdown', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); test('it renders', () => { @@ -298,7 +300,7 @@ describe('ConnectorsDropdown', () => { test('it disables the dropdown', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect( @@ -308,7 +310,7 @@ describe('ConnectorsDropdown', () => { test('it loading correctly', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect( @@ -318,7 +320,7 @@ describe('ConnectorsDropdown', () => { test('it selects the correct connector', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect( @@ -348,7 +350,7 @@ describe('ConnectorsDropdown', () => { ]} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ) ).not.toThrowError(); diff --git a/x-pack/plugins/cases/public/components/configure_cases/field_mapping.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/field_mapping.test.tsx index d96c83387c76e..c1f9ae938e3ea 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/field_mapping.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/field_mapping.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import type { FieldMappingProps } from './field_mapping'; @@ -24,7 +24,9 @@ describe('FieldMappingRow', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); test('it renders', () => { @@ -37,7 +39,7 @@ describe('FieldMappingRow', () => { test('it does not render without mappings', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect( newWrapper diff --git a/x-pack/plugins/cases/public/components/configure_cases/index.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/index.test.tsx index 97e43a2ade559..3c9e7a721e3ed 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/index.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import { waitFor, screen, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; @@ -87,7 +87,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -138,7 +138,7 @@ describe('ConfigureCases', () => { })); useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -180,7 +180,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -202,7 +202,7 @@ describe('ConfigureCases', () => { test('it disables correctly when the user cannot update', () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, wrappingComponentProps: { permissions: noUpdateCasesPermissions() }, }); @@ -259,7 +259,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -297,7 +297,7 @@ describe('ConfigureCases', () => { })); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect(wrapper.find(Connectors).prop('isLoading')).toBe(true); }); @@ -328,7 +328,7 @@ describe('ConfigureCases', () => { useGetConnectorsMock.mockImplementation(() => useConnectorsResponse); useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -373,7 +373,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -414,7 +414,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -468,7 +468,7 @@ describe('ConfigureCases', () => { })); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); wrapper.find('button[data-test-subj="dropdown-connectors"]').simulate('click'); @@ -513,7 +513,7 @@ describe('ConfigureCases', () => { useGetUrlSearchMock.mockImplementation(() => searchURL); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); }); @@ -562,7 +562,7 @@ describe('ConfigureCases', () => { test('it show the add flyout when pressing the add connector button', async () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); wrapper.find('button[data-test-subj="dropdown-connectors"]').simulate('click'); @@ -597,7 +597,7 @@ describe('ConfigureCases', () => { .mockReturnValue(true); const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); wrapper .find('button[data-test-subj="case-configure-update-selected-connector-button"]') diff --git a/x-pack/plugins/cases/public/components/configure_cases/mapping.test.tsx b/x-pack/plugins/cases/public/components/configure_cases/mapping.test.tsx index 413499010cdb2..c727d1acb611c 100644 --- a/x-pack/plugins/cases/public/components/configure_cases/mapping.test.tsx +++ b/x-pack/plugins/cases/public/components/configure_cases/mapping.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { mount } from 'enzyme'; +import { mount, type ComponentType } from 'enzyme'; import { TestProviders } from '../../common/mock'; import type { MappingProps } from './mapping'; @@ -23,12 +23,16 @@ describe('Mapping', () => { }; test('it shows mapping form group', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); expect(wrapper.find('[data-test-subj="static-mappings"]').first().exists()).toBe(true); }); test('correctly maps fields', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); expect(wrapper.find('[data-test-subj="field-mapping-source"] code').first().text()).toBe( 'title' ); @@ -38,14 +42,18 @@ describe('Mapping', () => { }); test('displays the title correctly', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); expect(wrapper.find('[data-test-subj="field-mapping-text"] h4').first().text()).toBe( 'ServiceNow ITSM field mappings' ); }); test('displays the description correctly', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); expect(wrapper.find('[data-test-subj="field-mapping-desc"]').first().text()).toBe( 'Map Case fields to ServiceNow ITSM fields when pushing data to ServiceNow ITSM. Field mappings require an established connection to ServiceNow ITSM.' ); @@ -53,7 +61,7 @@ describe('Mapping', () => { test('displays connection warning when isLoading: false and mappings: []', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect(wrapper.find('[data-test-subj="field-mapping-desc"]').first().text()).toBe( 'Failed to retrieve mappings for ServiceNow ITSM.' diff --git a/x-pack/plugins/cases/public/components/links/index.test.tsx b/x-pack/plugins/cases/public/components/links/index.test.tsx index 4d962197951a9..6649f0ed91375 100644 --- a/x-pack/plugins/cases/public/components/links/index.test.tsx +++ b/x-pack/plugins/cases/public/components/links/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import { render, screen } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; @@ -29,7 +29,9 @@ describe('Configuration button', () => { }; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); test('it renders without the tooltip', () => { @@ -59,7 +61,7 @@ describe('Configuration button', () => { msgTooltip={msgTooltip} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ); @@ -85,7 +87,7 @@ describe('Configuration button', () => { msgTooltip={<>{msgTooltip}} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, } ); diff --git a/x-pack/plugins/cases/public/components/use_create_case_modal/index.test.tsx b/x-pack/plugins/cases/public/components/use_create_case_modal/index.test.tsx index ab5bd1bd10dfe..dcef6d26393aa 100644 --- a/x-pack/plugins/cases/public/components/use_create_case_modal/index.test.tsx +++ b/x-pack/plugins/cases/public/components/use_create_case_modal/index.test.tsx @@ -27,23 +27,23 @@ describe('useCreateCaseModal', () => { }); it('init', async () => { - const { result } = renderHook( - () => useCreateCaseModal({ onCaseCreated }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseCreateCaseModalReturnedValues + >(() => useCreateCaseModal({ onCaseCreated }), { + wrapper: ({ children }) => {children}, + }); expect(result.current.isModalOpen).toBe(false); }); it('opens the modal', async () => { - const { result } = renderHook( - () => useCreateCaseModal({ onCaseCreated }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseCreateCaseModalReturnedValues + >(() => useCreateCaseModal({ onCaseCreated }), { + wrapper: ({ children }) => {children}, + }); act(() => { result.current.openModal(); @@ -53,12 +53,12 @@ describe('useCreateCaseModal', () => { }); it('closes the modal', async () => { - const { result } = renderHook( - () => useCreateCaseModal({ onCaseCreated }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseCreateCaseModalReturnedValues + >(() => useCreateCaseModal({ onCaseCreated }), { + wrapper: ({ children }) => {children}, + }); act(() => { result.current.openModal(); @@ -70,7 +70,7 @@ describe('useCreateCaseModal', () => { it('returns a memoized value', async () => { const { result, rerender } = renderHook< - UseCreateCaseModalProps, + React.PropsWithChildren, UseCreateCaseModalReturnedValues >(() => useCreateCaseModal({ onCaseCreated }), { wrapper: ({ children }) => {children}, @@ -84,12 +84,12 @@ describe('useCreateCaseModal', () => { }); it('closes the modal when creating a case', async () => { - const { result } = renderHook( - () => useCreateCaseModal({ onCaseCreated }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseCreateCaseModalReturnedValues + >(() => useCreateCaseModal({ onCaseCreated }), { + wrapper: ({ children }) => {children}, + }); act(() => { result.current.openModal(); diff --git a/x-pack/plugins/cases/public/components/use_push_to_service/index.test.tsx b/x-pack/plugins/cases/public/components/use_push_to_service/index.test.tsx index bf607c7659333..fccca04bb278f 100644 --- a/x-pack/plugins/cases/public/components/use_push_to_service/index.test.tsx +++ b/x-pack/plugins/cases/public/components/use_push_to_service/index.test.tsx @@ -68,12 +68,12 @@ describe('usePushToService', () => { }); it('calls pushCaseToExternalService with correct arguments', async () => { - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); await act(async () => { await result.current.handlePushToService(); @@ -94,12 +94,12 @@ describe('usePushToService', () => { }, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); const errorsMsg = result.current.errorsMsg; expect(errorsMsg).toHaveLength(1); @@ -116,12 +116,12 @@ describe('usePushToService', () => { }, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); const errorsMsg = result.current.errorsMsg; expect(errorsMsg).toHaveLength(1); @@ -130,7 +130,10 @@ describe('usePushToService', () => { }); it('Displays message when user has select none as connector', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -153,7 +156,10 @@ describe('usePushToService', () => { }); it('Displays message when connector is deleted', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -177,7 +183,10 @@ describe('usePushToService', () => { }); it('Displays message when case is closed', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -195,7 +204,10 @@ describe('usePushToService', () => { }); it('should not call pushCaseToExternalService when the selected connector is none', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -219,12 +231,12 @@ describe('usePushToService', () => { }); it('refresh case view page after push', async () => { - const { result, waitFor } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result, waitFor } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); await act(async () => { await result.current.handlePushToService(); @@ -237,14 +249,14 @@ describe('usePushToService', () => { describe('user does not have write or push permissions', () => { it('returns correct information about push permissions', async () => { - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => ( - {children} - ), - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => ( + {children} + ), + }); expect(result.current.hasPushPermissions).toBe(false); }); @@ -258,14 +270,14 @@ describe('usePushToService', () => { }, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => ( - {children} - ), - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => ( + {children} + ), + }); expect(result.current.errorsMsg).toEqual([]); expect(result.current.hasErrorMessages).toBe(false); @@ -280,21 +292,24 @@ describe('usePushToService', () => { }, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => ( - {children} - ), - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => ( + {children} + ), + }); expect(result.current.errorsMsg).toEqual([]); expect(result.current.hasErrorMessages).toBe(false); }); it('does not display a message when user does not have any connector configured', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -317,7 +332,10 @@ describe('usePushToService', () => { }); it('does not display a message when user does have a connector but is configured to none', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -340,7 +358,10 @@ describe('usePushToService', () => { }); it('does not display a message when connector is deleted', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -364,7 +385,10 @@ describe('usePushToService', () => { }); it('does not display a message when case is closed', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -384,12 +408,12 @@ describe('usePushToService', () => { describe('returned values', () => { it('initial', async () => { - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); const { handlePushToService, errorsMsg, ...rest } = result.current; @@ -406,12 +430,12 @@ describe('usePushToService', () => { it('isLoading is true when usePostPushToService is loading', async () => { usePostPushToServiceMock.mockReturnValue({ ...mockPostPush, isLoading: true }); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); expect(result.current.isLoading).toBe(true); }); @@ -422,29 +446,32 @@ describe('usePushToService', () => { data: actionLicense, }); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); expect(result.current.isLoading).toBe(true); }); it('hasErrorMessages=true if there are error messages', async () => { - const { result } = renderHook( - () => usePushToService({ ...defaultArgs, caseStatus: CaseStatuses.closed }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService({ ...defaultArgs, caseStatus: CaseStatuses.closed }), { + wrapper: ({ children }) => {children}, + }); expect(result.current.hasErrorMessages).toBe(true); }); it('needsToBePushed=true if the connector needs to be pushed', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -468,7 +495,10 @@ describe('usePushToService', () => { }); it('needsToBePushed=false if the connector does not exist', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -489,7 +519,10 @@ describe('usePushToService', () => { }); it('hasBeenPushed=false if the connector has been pushed', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -513,7 +546,10 @@ describe('usePushToService', () => { }); it('hasBeenPushed=false if the connector does not exist', async () => { - const { result } = renderHook( + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >( () => usePushToService({ ...defaultArgs, @@ -539,14 +575,14 @@ describe('usePushToService', () => { data: actionLicense, }); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => ( - {children} - ), - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => ( + {children} + ), + }); expect(result.current.hasPushPermissions).toBe(false); }); @@ -560,12 +596,12 @@ describe('usePushToService', () => { }, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); expect(result.current.hasLicenseError).toBe(true); }); @@ -576,12 +612,12 @@ describe('usePushToService', () => { data: undefined, })); - const { result } = renderHook( - () => usePushToService(defaultArgs), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + ReturnUsePushToService + >(() => usePushToService(defaultArgs), { + wrapper: ({ children }) => {children}, + }); expect(result.current.hasLicenseError).toBe(false); }); diff --git a/x-pack/plugins/cases/public/components/user_actions/copy_link.test.tsx b/x-pack/plugins/cases/public/components/user_actions/copy_link.test.tsx index 110b2aa9f23b7..a8351dfeed692 100644 --- a/x-pack/plugins/cases/public/components/user_actions/copy_link.test.tsx +++ b/x-pack/plugins/cases/public/components/user_actions/copy_link.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ReactWrapper, ComponentType } from 'enzyme'; import { mount } from 'enzyme'; import copy from 'copy-to-clipboard'; @@ -33,7 +33,9 @@ describe('UserActionCopyLink ', () => { let wrapper: ReactWrapper; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); beforeEach(() => { diff --git a/x-pack/plugins/cases/public/components/user_actions/timestamp.test.tsx b/x-pack/plugins/cases/public/components/user_actions/timestamp.test.tsx index 01751b142be05..020031c5fa5c2 100644 --- a/x-pack/plugins/cases/public/components/user_actions/timestamp.test.tsx +++ b/x-pack/plugins/cases/public/components/user_actions/timestamp.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import type { ReactWrapper } from 'enzyme'; +import type { ComponentType, ReactWrapper } from 'enzyme'; import { mount } from 'enzyme'; import { TestProviders } from '../../common/mock'; import { UserActionTimestamp } from './timestamp'; @@ -35,7 +35,9 @@ describe('UserActionTimestamp ', () => { let wrapper: ReactWrapper; beforeAll(() => { - wrapper = mount(, { wrappingComponent: TestProviders }); + wrapper = mount(, { + wrappingComponent: TestProviders as ComponentType>, + }); }); it('it renders', async () => { @@ -49,7 +51,7 @@ describe('UserActionTimestamp ', () => { it('it shows only the created time when the updated time is missing', async () => { const newWrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType>, }); expect( diff --git a/x-pack/plugins/cases/public/containers/configure/use_get_supported_action_connectors.tsx.test.tsx b/x-pack/plugins/cases/public/containers/configure/use_get_supported_action_connectors.tsx.test.tsx index c6a05daff7f4e..a81d6ac46d189 100644 --- a/x-pack/plugins/cases/public/containers/configure/use_get_supported_action_connectors.tsx.test.tsx +++ b/x-pack/plugins/cases/public/containers/configure/use_get_supported_action_connectors.tsx.test.tsx @@ -27,7 +27,9 @@ describe('useConnectors', () => { it('fetches connectors', async () => { const spy = jest.spyOn(api, 'getSupportedActionConnectors'); const { waitForNextUpdate } = renderHook(() => useGetSupportedActionConnectors(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); @@ -45,7 +47,9 @@ describe('useConnectors', () => { }); const { waitForNextUpdate } = renderHook(() => useGetSupportedActionConnectors(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); @@ -57,7 +61,9 @@ describe('useConnectors', () => { useApplicationCapabilitiesMock().actions = { crud: false, read: false }; const { result, waitForNextUpdate } = renderHook(() => useGetSupportedActionConnectors(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); @@ -71,7 +77,7 @@ describe('useConnectors', () => { useApplicationCapabilitiesMock().actions = { crud: true, read: true }; const { result, waitForNextUpdate } = renderHook(() => useGetSupportedActionConnectors(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/x-pack/plugins/cases/public/containers/use_get_categories.test.tsx b/x-pack/plugins/cases/public/containers/use_get_categories.test.tsx index c503dbf25603a..d80f03822ec7a 100644 --- a/x-pack/plugins/cases/public/containers/use_get_categories.test.tsx +++ b/x-pack/plugins/cases/public/containers/use_get_categories.test.tsx @@ -25,7 +25,9 @@ describe('useGetCategories', () => { it('calls getCategories api', async () => { const spyOnGetCategories = jest.spyOn(api, 'getCategories'); const { waitForNextUpdate } = renderHook(() => useGetCategories(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); @@ -46,7 +48,9 @@ describe('useGetCategories', () => { (useToasts as jest.Mock).mockReturnValue({ addError }); const { waitForNextUpdate } = renderHook(() => useGetCategories(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); diff --git a/x-pack/plugins/cases/public/containers/use_get_tags.test.tsx b/x-pack/plugins/cases/public/containers/use_get_tags.test.tsx index badbcc7a93352..a19074ff279ee 100644 --- a/x-pack/plugins/cases/public/containers/use_get_tags.test.tsx +++ b/x-pack/plugins/cases/public/containers/use_get_tags.test.tsx @@ -25,7 +25,9 @@ describe('useGetTags', () => { it('calls getTags api', async () => { const spyOnGetTags = jest.spyOn(api, 'getTags'); const { waitForNextUpdate } = renderHook(() => useGetTags(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(spyOnGetTags).toBeCalledWith({ @@ -42,7 +44,9 @@ describe('useGetTags', () => { throw new Error('Something went wrong'); }); const { waitForNextUpdate } = renderHook(() => useGetTags(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(addError).toBeCalled(); diff --git a/x-pack/plugins/cross_cluster_replication/public/app/components/auto_follow_pattern_delete_provider.d.ts b/x-pack/plugins/cross_cluster_replication/public/app/components/auto_follow_pattern_delete_provider.d.ts index 2ea33df51463c..9473adbaa244d 100644 --- a/x-pack/plugins/cross_cluster_replication/public/app/components/auto_follow_pattern_delete_provider.d.ts +++ b/x-pack/plugins/cross_cluster_replication/public/app/components/auto_follow_pattern_delete_provider.d.ts @@ -5,6 +5,8 @@ * 2.0. */ -import { FC, PropsWithChildren } from 'react'; +import { FC, ReactNode } from 'react'; -declare const AutoFollowPatternDeleteProvider: FC>; +declare const AutoFollowPatternDeleteProvider: FC<{ + children: (deleteAutoFollowPattern: (ids: string[]) => void) => ReactNode; +}>; diff --git a/x-pack/plugins/enterprise_search/public/applications/shared/layout/endpoints_header_action.tsx b/x-pack/plugins/enterprise_search/public/applications/shared/layout/endpoints_header_action.tsx index 0085b913cdbb3..0b7de3c1eb23b 100644 --- a/x-pack/plugins/enterprise_search/public/applications/shared/layout/endpoints_header_action.tsx +++ b/x-pack/plugins/enterprise_search/public/applications/shared/layout/endpoints_header_action.tsx @@ -17,7 +17,7 @@ import { i18n } from '@kbn/i18n'; import { EndpointIcon } from './endpoint_icon'; -export const EndpointsHeaderAction: React.FC = ({ children }) => { +export const EndpointsHeaderAction: React.FC> = ({ children }) => { const [open, setOpen] = React.useState(false); return ( diff --git a/x-pack/plugins/fleet/public/applications/fleet/app.tsx b/x-pack/plugins/fleet/public/applications/fleet/app.tsx index ae4bbdf49747a..8a4edef8dc87c 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/app.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/app.tsx @@ -288,10 +288,12 @@ const FleetTopNav = memo( } ); -const AppLayout: React.FC<{ - setHeaderActionMenu: AppMountParameters['setHeaderActionMenu']; - isReadOnly?: boolean; -}> = ({ children, setHeaderActionMenu, isReadOnly }) => { +const AppLayout: React.FC< + React.PropsWithChildren<{ + setHeaderActionMenu: AppMountParameters['setHeaderActionMenu']; + isReadOnly?: boolean; + }> +> = ({ children, setHeaderActionMenu, isReadOnly }) => { return ( <> diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.tsx index 7a8cfe4e956aa..3070b0961ab6d 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/agent_policy/create_package_policy_page/single_page_layout/index.tsx @@ -337,7 +337,7 @@ export const CreatePackagePolicySinglePage: CreatePackagePolicyParams = ({ // If an auth block view is registered to the UI Extension context, we expect the registered component to return a React component when the PLI is not sufficient, // or simply a wrapper returning the children if the PLI is sufficient. - const PliAuthBlockWrapper: React.FC = useMemo( + const PliAuthBlockWrapper: React.FC> = useMemo( () => pliAuthBlockView?.Component && !isPackageInfoLoading ? pliAuthBlockView.Component diff --git a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/index.tsx b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/index.tsx index 2fc729cb76c82..27e874349b932 100644 --- a/x-pack/plugins/fleet/public/applications/fleet/sections/settings/index.tsx +++ b/x-pack/plugins/fleet/public/applications/fleet/sections/settings/index.tsx @@ -106,9 +106,9 @@ export const SettingsApp = withConfirmModalProvider(() => { - {(route: { match: { params: { itemId: string } } }) => { + {(route: { match: { params: { itemId: string } } | null }) => { const fleetServerHost = fleetServerHostsItems.find( - (o) => route.match.params.itemId === o.id + (o) => route.match?.params.itemId === o.id ); if (!fleetServerHost) { return ; @@ -155,9 +155,9 @@ export const SettingsApp = withConfirmModalProvider(() => { - {(route: { match: { params: { itemId: string } } }) => { + {(route: { match: { params: { itemId: string } } | null }) => { const fleetProxy = proxies.data?.items.find( - (item) => route.match.params.itemId === item.id + (item) => route.match?.params.itemId === item.id ); if (!fleetProxy) { return ; @@ -170,8 +170,8 @@ export const SettingsApp = withConfirmModalProvider(() => { }} - {(route: { match: { params: { outputId: string } } }) => { - const output = outputItems.find((o) => route.match.params.outputId === o.id); + {(route: { match: { params: { outputId: string } } | null }) => { + const output = outputItems.find((o) => route.match?.params.outputId === o.id); if (!output) { return ; } @@ -199,9 +199,9 @@ export const SettingsApp = withConfirmModalProvider(() => { - {(route: { match: { params: { downloadSourceId: string } } }) => { + {(route: { match: { params: { downloadSourceId: string } } | null }) => { const downloadSource = downloadSources.data?.items.find( - (o) => route.match.params.downloadSourceId === o.id + (o) => route.match?.params.downloadSourceId === o.id ); if (!downloadSource) { return ; diff --git a/x-pack/plugins/fleet/public/applications/integrations/hooks/use_read_only_context.tsx b/x-pack/plugins/fleet/public/applications/integrations/hooks/use_read_only_context.tsx index fd30ef4b85090..5b6c1c9b86ab5 100644 --- a/x-pack/plugins/fleet/public/applications/integrations/hooks/use_read_only_context.tsx +++ b/x-pack/plugins/fleet/public/applications/integrations/hooks/use_read_only_context.tsx @@ -11,7 +11,7 @@ const ReadOnlyContext = createContext<{ isReadOnly: boolean; setIsReadOnly: (v: { isReadOnly: false, setIsReadOnly: () => {} } ); -export const ReadOnlyContextProvider: React.FC = ({ children }) => { +export const ReadOnlyContextProvider: React.FC> = ({ children }) => { const [isReadOnly, setIsReadOnly] = useState(false); return ( = ({ children, showTooltip }) => { +const PermissionWrapper: React.FunctionComponent< + React.PropsWithChildren<{ + showTooltip: boolean; + }> +> = ({ children, showTooltip }) => { return showTooltip && children ? ( ; + Component: LazyExoticComponent>>; } export interface PliAuthBlockExtension { diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/footer/footer.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/footer/footer.test.tsx index 91ecb8a13defa..d06762b4656fa 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/footer/footer.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/footer/footer.test.tsx @@ -20,7 +20,7 @@ jest.mock('../../../../common/hooks/use_navigate', () => ({ useNavigate: () => mockNavigate, })); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/connector_step/connector_step.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/connector_step/connector_step.test.tsx index 121f8da98143a..807cfbe6cc288 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/connector_step/connector_step.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/connector_step/connector_step.test.tsx @@ -41,7 +41,7 @@ jest.mock('@kbn/triggers-actions-ui-plugin/public/common/constants', () => ({ ConnectorAddModal: () =>
, })); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/data_stream_step.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/data_stream_step.test.tsx index 476c5b24cbf5f..a0d95d4bb77b0 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/data_stream_step.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/data_stream_step.test.tsx @@ -42,7 +42,7 @@ jest.mock('./use_load_package_names', () => { }; }); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/generation_modal.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/generation_modal.test.tsx index 4d0f6eee1c407..0397e46e023c7 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/generation_modal.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/generation_modal.test.tsx @@ -46,7 +46,7 @@ jest.mock('../../../../../common/lib/api', () => ({ const mockOnComplete = jest.fn(); const mockOnClose = jest.fn(); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/sample_logs_input.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/sample_logs_input.test.tsx index a02af7aa99723..6d8ad5eaf6d5c 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/sample_logs_input.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/data_stream_step/sample_logs_input.test.tsx @@ -13,7 +13,7 @@ import { ActionsProvider } from '../../state'; import { mockActions } from '../../mocks/state'; import { mockServices } from '../../../../../services/mocks/services'; -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/deploy_step/deploy_step.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/deploy_step/deploy_step.test.tsx index 1a35c9e4f02c9..ef8a5187430b7 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/deploy_step/deploy_step.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/deploy_step/deploy_step.test.tsx @@ -56,7 +56,7 @@ jest.mock('@elastic/filesaver', () => ({ saveAs: (...params: unknown[]) => mockSaveAs(...params), })); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/integration_step/integration_step.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/integration_step/integration_step.test.tsx index daeb3ce39b825..371d6901faf7a 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/integration_step/integration_step.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/integration_step/integration_step.test.tsx @@ -14,7 +14,7 @@ import { mockActions, mockState } from '../../mocks/state'; const integrationSettings = mockState.integrationSettings!; -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/review_step/review_step.test.tsx b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/review_step/review_step.test.tsx index 8a9da9295a8f0..5fa0c851bb0ef 100644 --- a/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/review_step/review_step.test.tsx +++ b/x-pack/plugins/integration_assistant/public/components/create_integration/create_integration_assistant/steps/review_step/review_step.test.tsx @@ -44,7 +44,7 @@ jest.mock('@kbn/code-editor', () => ({ ), })); -const wrapper: React.FC = ({ children }) => ( +const wrapper: React.FC> = ({ children }) => ( {children} diff --git a/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/dimension_panel.test.tsx b/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/dimension_panel.test.tsx index 06231a60afecc..5112963a65ac3 100644 --- a/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/dimension_panel.test.tsx +++ b/x-pack/plugins/lens/public/datasources/form_based/dimension_panel/dimension_panel.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { ReactWrapper, ShallowWrapper } from 'enzyme'; +import { ReactWrapper, ShallowWrapper, ComponentType } from 'enzyme'; import React, { ChangeEvent } from 'react'; import { screen, act, render, within } from '@testing-library/react'; import userEvent from '@testing-library/user-event'; @@ -173,7 +173,7 @@ function mountWithServices(component: React.ReactElement): ReactWrapper { // This is an elegant way to wrap a component in Enzyme // preserving the root at the component level rather than // at the wrapper one - wrappingComponent: KibanaContextProvider, + wrappingComponent: KibanaContextProvider as ComponentType<{}>, wrappingComponentProps: { services }, }); } diff --git a/x-pack/plugins/lens/public/mocks/store_mocks.tsx b/x-pack/plugins/lens/public/mocks/store_mocks.tsx index 2056aca4fe8d8..f465eadc9dfdd 100644 --- a/x-pack/plugins/lens/public/mocks/store_mocks.tsx +++ b/x-pack/plugins/lens/public/mocks/store_mocks.tsx @@ -77,7 +77,7 @@ export const renderWithReduxStore = ( const { store } = makeLensStore({ preloadedState, storeDeps }); const { wrapper, ...options } = renderOptions || {}; - const CustomWrapper = wrapper as React.ComponentType; + const CustomWrapper = wrapper as React.ComponentType>; const Wrapper: React.FC> = ({ children }) => { return ( diff --git a/x-pack/plugins/lens/public/shared_components/info_badges/info_badge.tsx b/x-pack/plugins/lens/public/shared_components/info_badges/info_badge.tsx index cc78c59b69eea..b9f7f73f4f659 100644 --- a/x-pack/plugins/lens/public/shared_components/info_badges/info_badge.tsx +++ b/x-pack/plugins/lens/public/shared_components/info_badges/info_badge.tsx @@ -14,7 +14,7 @@ import { useEuiTheme, } from '@elastic/eui'; import { css } from '@emotion/react'; -import React, { type ReactChildren, type ReactChild } from 'react'; +import React from 'react'; export function InfoBadge({ title, @@ -28,7 +28,7 @@ export function InfoBadge({ dataView: string; index: number; palette?: string[]; - children?: ReactChild | ReactChildren; + children?: React.ReactNode; 'data-test-subj-prefix': string; }) { const { euiTheme } = useEuiTheme(); diff --git a/x-pack/plugins/lens/public/shared_components/prepend_provider.tsx b/x-pack/plugins/lens/public/shared_components/prepend_provider.tsx index 4ff2687f28450..02fb5c81521d2 100644 --- a/x-pack/plugins/lens/public/shared_components/prepend_provider.tsx +++ b/x-pack/plugins/lens/public/shared_components/prepend_provider.tsx @@ -11,14 +11,7 @@ import { EuiFormLabel, useResizeObserver, } from '@elastic/eui'; -import React, { - createContext, - useState, - useContext, - ReactChild, - ReactChildren, - useEffect, -} from 'react'; +import React, { createContext, useState, useContext, useEffect } from 'react'; export const PrependWidthContext = createContext<{ minWidth: number; @@ -28,7 +21,7 @@ export const PrependWidthContext = createContext<{ onResize: () => {}, }); -export const PrependWidthProvider = ({ children }: { children: ReactChild | ReactChildren }) => { +export const PrependWidthProvider = ({ children }: { children: React.ReactNode }) => { const [minPrependWidth, setMinPrependWidth] = useState(0); const prependResizeObserver = ({ width }: { width: number }) => { @@ -46,7 +39,7 @@ export const PrependWidthProvider = ({ children }: { children: ReactChild | Reac ); }; -export const Prepend = ({ children }: { children: ReactChild | ReactChildren }) => { +export const Prepend = ({ children }: { children: React.ReactNode }) => { const { minWidth, onResize } = useContext(PrependWidthContext); const [resizeRef, setResizeRef] = useState(null); diff --git a/x-pack/plugins/monitoring/public/application/pages/apm/apm_template.tsx b/x-pack/plugins/monitoring/public/application/pages/apm/apm_template.tsx index 023370469a458..62366ebb24dc7 100644 --- a/x-pack/plugins/monitoring/public/application/pages/apm/apm_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/apm/apm_template.tsx @@ -9,7 +9,7 @@ import { i18n } from '@kbn/i18n'; import { PageTemplate } from '../page_template'; import { TabMenuItem, PageTemplateProps } from '../page_template'; -export const ApmTemplate: React.FC = ({ ...props }) => { +export const ApmTemplate: React.FC> = ({ ...props }) => { const tabs: TabMenuItem[] = [ { id: 'overview', diff --git a/x-pack/plugins/monitoring/public/application/pages/beats/beats_template.tsx b/x-pack/plugins/monitoring/public/application/pages/beats/beats_template.tsx index 7a070c735bbea..f2908b5d0010a 100644 --- a/x-pack/plugins/monitoring/public/application/pages/beats/beats_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/beats/beats_template.tsx @@ -13,7 +13,10 @@ interface BeatsTemplateProps extends PageTemplateProps { instance?: any; } -export const BeatsTemplate: React.FC = ({ instance, ...props }) => { +export const BeatsTemplate: React.FC> = ({ + instance, + ...props +}) => { const tabs: TabMenuItem[] = []; if (!instance) { diff --git a/x-pack/plugins/monitoring/public/application/pages/elasticsearch/elasticsearch_template.tsx b/x-pack/plugins/monitoring/public/application/pages/elasticsearch/elasticsearch_template.tsx index a1d2fc6ca2fe3..4aa03483e9010 100644 --- a/x-pack/plugins/monitoring/public/application/pages/elasticsearch/elasticsearch_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/elasticsearch/elasticsearch_template.tsx @@ -19,10 +19,9 @@ interface ElasticsearchTemplateProps extends PageTemplateProps { cluster?: any; } -export const ElasticsearchTemplate: React.FC = ({ - cluster, - ...props -}) => { +export const ElasticsearchTemplate: React.FC< + React.PropsWithChildren +> = ({ cluster, ...props }) => { const { services } = useKibana(); const tabs: TabMenuItem[] = [ diff --git a/x-pack/plugins/monitoring/public/application/pages/elasticsearch/item_template.tsx b/x-pack/plugins/monitoring/public/application/pages/elasticsearch/item_template.tsx index 05d567a9b3ff7..13b2053688753 100644 --- a/x-pack/plugins/monitoring/public/application/pages/elasticsearch/item_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/elasticsearch/item_template.tsx @@ -13,7 +13,7 @@ interface ItemTemplateProps extends PageTemplateProps { id: string; pageType: string; } -export const ItemTemplate: React.FC = (props) => { +export const ItemTemplate: React.FC> = (props) => { const { pageType, id, ...rest } = props; const tabs: TabMenuItem[] = [ { diff --git a/x-pack/plugins/monitoring/public/application/pages/enterprise_search/ent_search_template.tsx b/x-pack/plugins/monitoring/public/application/pages/enterprise_search/ent_search_template.tsx index c74951f098494..0a436e622f7af 100644 --- a/x-pack/plugins/monitoring/public/application/pages/enterprise_search/ent_search_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/enterprise_search/ent_search_template.tsx @@ -10,6 +10,8 @@ import { PageTemplateProps } from '../page_template'; type EntSearchTemplateProps = PageTemplateProps; -export const EntSearchTemplate: React.FC = (props) => { +export const EntSearchTemplate: React.FC> = ( + props +) => { return ; }; diff --git a/x-pack/plugins/monitoring/public/application/pages/kibana/kibana_template.tsx b/x-pack/plugins/monitoring/public/application/pages/kibana/kibana_template.tsx index c068dfb5d4de4..931ddeee63e81 100644 --- a/x-pack/plugins/monitoring/public/application/pages/kibana/kibana_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/kibana/kibana_template.tsx @@ -8,7 +8,9 @@ import React from 'react'; import { i18n } from '@kbn/i18n'; import { PageTemplate, TabMenuItem, PageTemplateProps } from '../page_template'; -export const KibanaTemplate: React.FC = ({ ...props }) => { +export const KibanaTemplate: React.FC> = ({ + ...props +}) => { const tabs: TabMenuItem[] = [ { id: 'overview', diff --git a/x-pack/plugins/monitoring/public/application/pages/logstash/logstash_template.tsx b/x-pack/plugins/monitoring/public/application/pages/logstash/logstash_template.tsx index 96ac605b1ae54..c63d30c27deda 100644 --- a/x-pack/plugins/monitoring/public/application/pages/logstash/logstash_template.tsx +++ b/x-pack/plugins/monitoring/public/application/pages/logstash/logstash_template.tsx @@ -17,7 +17,7 @@ interface LogstashTemplateProps extends PageTemplateProps { tabsDisabled?: boolean; } -export const LogstashTemplate: React.FC = ({ +export const LogstashTemplate: React.FC> = ({ cluster, instance, pipelineId, diff --git a/x-pack/plugins/observability_solution/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts b/x-pack/plugins/observability_solution/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts index 8f677cba46c17..3dd235706a4ec 100644 --- a/x-pack/plugins/observability_solution/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts +++ b/x-pack/plugins/observability_solution/apm/public/components/shared/stacktrace/frame_heading_renderers/index.ts @@ -9,7 +9,7 @@ import { ComponentType } from 'react'; import { Stackframe } from '../../../../../typings/es_schemas/raw/fields/stackframe'; export interface FrameHeadingRendererProps { - fileDetailComponent: ComponentType; + fileDetailComponent: ComponentType>; stackframe: Stackframe; idx?: string; } diff --git a/x-pack/plugins/observability_solution/apm/public/context/url_params_context/url_params_context.tsx b/x-pack/plugins/observability_solution/apm/public/context/url_params_context/url_params_context.tsx index 17dd919e7b61d..1579ab784dba6 100644 --- a/x-pack/plugins/observability_solution/apm/public/context/url_params_context/url_params_context.tsx +++ b/x-pack/plugins/observability_solution/apm/public/context/url_params_context/url_params_context.tsx @@ -5,8 +5,15 @@ * 2.0. */ -import React, { createContext, useCallback, useMemo, useRef, useState } from 'react'; -import { withRouter } from 'react-router-dom'; +import React, { + createContext, + useCallback, + useMemo, + useRef, + useState, + PropsWithChildren, +} from 'react'; +import { withRouter, RouteComponentProps } from 'react-router-dom'; import { getDateRange } from './helpers'; import { resolveUrlParams } from './resolve_url_params'; import { UrlParams } from './types'; @@ -24,7 +31,10 @@ const UrlParamsContext = createContext({ urlParams: {} as UrlParams, }); -const UrlParamsProvider: React.ComponentClass<{}> = withRouter(({ location, children }) => { +const UrlParamsProvider: React.ComponentClass<{}> = withRouter< + PropsWithChildren, + React.FC> +>(({ location, children }) => { const refUrlParams = useRef(resolveUrlParams(location, {})); const { start, end, rangeFrom, rangeTo } = refUrlParams.current; diff --git a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_profiling_kuery.test.tsx b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_profiling_kuery.test.tsx index f5bd973aca2ec..10325ce51f81f 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_profiling_kuery.test.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/asset_details/hooks/use_profiling_kuery.test.tsx @@ -26,7 +26,7 @@ describe('useProfilingKuery', () => { it('gets initial search value from the URL if present', () => { const { result } = renderHook(() => useProfilingKuery(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( { const { result } = renderHook( () => ({ profilingKuery: useProfilingKuery(), history: useHistory() }), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), } diff --git a/x-pack/plugins/observability_solution/infra/public/components/logging/log_customization_menu.tsx b/x-pack/plugins/observability_solution/infra/public/components/logging/log_customization_menu.tsx index 0893f846aaf3f..5e7db2009b33c 100644 --- a/x-pack/plugins/observability_solution/infra/public/components/logging/log_customization_menu.tsx +++ b/x-pack/plugins/observability_solution/infra/public/components/logging/log_customization_menu.tsx @@ -15,7 +15,10 @@ interface LogCustomizationMenuState { isShown: boolean; } -export class LogCustomizationMenu extends React.Component<{}, LogCustomizationMenuState> { +export class LogCustomizationMenu extends React.Component< + React.PropsWithChildren<{}>, + LogCustomizationMenuState +> { public readonly state = { isShown: false, }; diff --git a/x-pack/plugins/observability_solution/infra/public/containers/plugin_config_context.test.tsx b/x-pack/plugins/observability_solution/infra/public/containers/plugin_config_context.test.tsx index 8b5bcc8de861c..62c582a818240 100644 --- a/x-pack/plugins/observability_solution/infra/public/containers/plugin_config_context.test.tsx +++ b/x-pack/plugins/observability_solution/infra/public/containers/plugin_config_context.test.tsx @@ -33,7 +33,7 @@ describe('usePluginConfig()', () => { }, }; const { result } = renderHook(() => usePluginConfig(), { - wrapper: ({ children }) => { + wrapper: ({ children }: React.PropsWithChildren<{}>) => { return ( {children} ); diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/section.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/section.tsx index 504ca07ec0ca3..3ef9684b4cd56 100644 --- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/section.tsx +++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/section.tsx @@ -22,7 +22,7 @@ type SectionProps = LayoutProps & { sectionLabel: string; }; -export const Section: FunctionComponent = ({ +export const Section: FunctionComponent> = ({ children, metrics, navLabel, diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/sub_section.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/sub_section.tsx index 4d66b822661d0..eab6988904833 100644 --- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/sub_section.tsx +++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metric_detail/components/sub_section.tsx @@ -15,7 +15,7 @@ type SubSectionProps = LayoutProps & { label?: string; }; -export const SubSection: FunctionComponent = ({ +export const SubSection: FunctionComponent> = ({ id, label, children, diff --git a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/hooks/use_metric_explorer_state.test.tsx b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/hooks/use_metric_explorer_state.test.tsx index f200530c8b7ca..bcea796c3b00a 100644 --- a/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/hooks/use_metric_explorer_state.test.tsx +++ b/x-pack/plugins/observability_solution/infra/public/pages/metrics/metrics_explorer/hooks/use_metric_explorer_state.test.tsx @@ -26,7 +26,7 @@ jest.mock('../../../../alerting/use_alert_prefill', () => ({ const renderUseMetricsExplorerStateHook = () => renderHook(() => useMetricsExplorerState(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/x-pack/plugins/observability_solution/infra/public/utils/data_search/use_data_search_request.test.tsx b/x-pack/plugins/observability_solution/infra/public/utils/data_search/use_data_search_request.test.tsx index acc7ce55358ea..33369c1125e15 100644 --- a/x-pack/plugins/observability_solution/infra/public/utils/data_search/use_data_search_request.test.tsx +++ b/x-pack/plugins/observability_solution/infra/public/utils/data_search/use_data_search_request.test.tsx @@ -34,7 +34,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -79,7 +81,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -148,7 +152,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); diff --git a/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_entry_flyout/log_entry_actions_menu.test.tsx b/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_entry_flyout/log_entry_actions_menu.test.tsx index a38626fd10eae..ad989f8460016 100644 --- a/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_entry_flyout/log_entry_actions_menu.test.tsx +++ b/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_entry_flyout/log_entry_actions_menu.test.tsx @@ -38,7 +38,7 @@ urlServiceWithUptimeLocator.locators.create< }, }); -const ProviderWrapper: FC<{ urlService?: UrlService }> = ({ +const ProviderWrapper: FC> = ({ children, urlService = emptyUrlService, }) => { diff --git a/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_text_stream/highlighting.tsx b/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_text_stream/highlighting.tsx index 7868a9cc5fc24..e8ddd350927db 100644 --- a/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_text_stream/highlighting.tsx +++ b/x-pack/plugins/observability_solution/logs_shared/public/components/logging/log_text_stream/highlighting.tsx @@ -39,7 +39,7 @@ export const HighlightMarker = euiStyled.mark` export const highlightFieldValue = ( value: string, highlightTerms: string[], - HighlightComponent: React.ComponentType + HighlightComponent: React.ComponentType> ) => highlightTerms.reduce( (fragments, highlightTerm, index) => { diff --git a/x-pack/plugins/observability_solution/logs_shared/public/components/resettable_error_boundary.tsx b/x-pack/plugins/observability_solution/logs_shared/public/components/resettable_error_boundary.tsx index 6e9dc178a4d84..2a192e5571326 100644 --- a/x-pack/plugins/observability_solution/logs_shared/public/components/resettable_error_boundary.tsx +++ b/x-pack/plugins/observability_solution/logs_shared/public/components/resettable_error_boundary.tsx @@ -25,7 +25,7 @@ interface ResettableErrorBoundaryState { } export class ResettableErrorBoundary extends React.Component< - ResettableErrorBoundaryProps, + React.PropsWithChildren>, ResettableErrorBoundaryState > { state: ResettableErrorBoundaryState = { diff --git a/x-pack/plugins/observability_solution/logs_shared/public/utils/data_search/use_data_search_request.test.tsx b/x-pack/plugins/observability_solution/logs_shared/public/utils/data_search/use_data_search_request.test.tsx index acc7ce55358ea..33369c1125e15 100644 --- a/x-pack/plugins/observability_solution/logs_shared/public/utils/data_search/use_data_search_request.test.tsx +++ b/x-pack/plugins/observability_solution/logs_shared/public/utils/data_search/use_data_search_request.test.tsx @@ -34,7 +34,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -79,7 +81,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -148,7 +152,9 @@ describe('useDataSearch hook', () => { parseResponses: noopParseResponse, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); diff --git a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.test.tsx b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.test.tsx index aa5c659baf882..3ebca243a56b3 100644 --- a/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.test.tsx +++ b/x-pack/plugins/observability_solution/observability_ai_assistant_app/public/hooks/use_conversation.test.tsx @@ -81,7 +81,7 @@ const useKibanaMockServices = { }; describe('useConversation', () => { - let wrapper: WrapperComponent; + let wrapper: WrapperComponent>; beforeEach(() => { jest.clearAllMocks(); diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/pages/template.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/pages/template.tsx index c349b76927b7e..12a64588b006b 100644 --- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/pages/template.tsx +++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/pages/template.tsx @@ -15,7 +15,10 @@ interface TemplateProps { customHeader?: React.ReactNode; } -export const PageTemplate: React.FC = ({ children, customHeader }) => { +export const PageTemplate: React.FC> = ({ + children, + customHeader, +}) => { return ( { +export const BackButton: React.FC> = ({ children }) => { const navigate = useNavigate(); const location = useLocation(); diff --git a/x-pack/plugins/observability_solution/observability_onboarding/public/application/shared/test_wrapper.tsx b/x-pack/plugins/observability_solution/observability_onboarding/public/application/shared/test_wrapper.tsx index 0188a92507a3a..55083bfd6c139 100644 --- a/x-pack/plugins/observability_solution/observability_onboarding/public/application/shared/test_wrapper.tsx +++ b/x-pack/plugins/observability_solution/observability_onboarding/public/application/shared/test_wrapper.tsx @@ -14,7 +14,7 @@ interface WrapperProps { } export const Wrapper = - (props: WrapperProps): React.FC => + (props: WrapperProps): React.FC> => ({ children }) => { return ( diff --git a/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_breadcrumbs.test.tsx b/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_breadcrumbs.test.tsx index 1b3c0da6ed1bc..15849039bde8b 100644 --- a/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_breadcrumbs.test.tsx +++ b/x-pack/plugins/observability_solution/observability_shared/public/hooks/use_breadcrumbs.test.tsx @@ -39,7 +39,7 @@ describe('useBreadcrumbs', () => { describe('when setBreadcrumbs and setTitle are not defined', () => { it('does not set breadcrumbs or the title', () => { renderHook(() => useBreadcrumbs([]), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( ; - reduxStore?: Store; -}> = ({ reload$, children, reduxStore }) => { +export const SyntheticsEmbeddableContext: React.FC< + React.PropsWithChildren<{ + reload$: Subject; + reduxStore?: Store; + }> +> = ({ reload$, children, reduxStore }) => { const props = getSyntheticsAppProps(); return ( diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/embeddable_panel_wrapper.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/embeddable_panel_wrapper.tsx index bb8ec04105167..1d3328197fb55 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/embeddable_panel_wrapper.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/components/common/components/embeddable_panel_wrapper.tsx @@ -10,11 +10,13 @@ import { EuiFlexGroup, EuiFlexItem, EuiPanel, EuiProgress, EuiTitle } from '@ela import { AddToDashboard } from './add_to_dashboard'; import { SYNTHETICS_STATS_OVERVIEW_EMBEDDABLE } from '../../../../embeddables/constants'; -export const EmbeddablePanelWrapper: FC<{ - title: string; - loading?: boolean; - titleAppend?: React.ReactNode; -}> = ({ children, title, loading, titleAppend }) => { +export const EmbeddablePanelWrapper: FC< + React.PropsWithChildren<{ + title: string; + loading?: boolean; + titleAppend?: React.ReactNode; + }> +> = ({ children, title, loading, titleAppend }) => { const isSyntheticsApp = window.location.pathname.includes('/app/synthetics'); return ( diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_embeddable_context.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_embeddable_context.tsx index 0ae588714bf97..507ac233ff6e6 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_embeddable_context.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_embeddable_context.tsx @@ -16,7 +16,9 @@ const defaultContext: SyntheticsEmbeddableContext = {} as SyntheticsEmbeddableCo export const SyntheticsEmbeddableContext = createContext(defaultContext); -export const SyntheticsEmbeddableStateContextProvider: React.FC = ({ children }) => { +export const SyntheticsEmbeddableStateContextProvider: React.FC> = ({ + children, +}) => { const value = useMemo(() => { return { history: createMemoryHistory() }; }, []); diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_refresh_context.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_refresh_context.tsx index 3e044febc6348..b53620921fdd1 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_refresh_context.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_refresh_context.tsx @@ -34,9 +34,11 @@ const defaultContext: SyntheticsRefreshContext = { export const SyntheticsRefreshContext = createContext(defaultContext); -export const SyntheticsRefreshContextProvider: FC<{ - reload$?: Subject; -}> = ({ children, reload$ }) => { +export const SyntheticsRefreshContextProvider: FC< + React.PropsWithChildren<{ + reload$?: Subject; + }> +> = ({ children, reload$ }) => { const [lastRefresh, setLastRefresh] = useState(Date.now()); const refreshPaused = useSelector(selectRefreshPaused); diff --git a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_shared_context.tsx b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_shared_context.tsx index da35fb89dbf3b..abe990d4f401c 100644 --- a/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_shared_context.tsx +++ b/x-pack/plugins/observability_solution/synthetics/public/apps/synthetics/contexts/synthetics_shared_context.tsx @@ -18,7 +18,7 @@ import { SyntheticsAppProps } from './synthetics_settings_context'; import { storage, store } from '../state'; export const SyntheticsSharedContext: React.FC< - SyntheticsAppProps & { reload$?: Subject; reduxStore?: Store } + React.PropsWithChildren; reduxStore?: Store }> > = ({ reduxStore, coreStart, setupPlugins, startPlugins, children, darkMode, reload$ }) => { return ( = withRouter(({ location, children }) => { +const UrlParamsProvider: React.ComponentClass = withRouter< + React.PropsWithChildren, + React.FC> +>(({ location, children }) => { const refUrlParams = useRef(resolveUrlParams(location, {})); const { start, end, rangeFrom, rangeTo, exactStart, exactEnd } = refUrlParams.current; diff --git a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx index e92c515c4162f..07cbe6b58340f 100644 --- a/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx +++ b/x-pack/plugins/remote_clusters/public/application/sections/components/remote_cluster_form/remote_cluster_form.tsx @@ -88,6 +88,8 @@ export class RemoteClusterForm extends Component { static contextType = AppContext; private readonly generateId: (idSuffix?: string) => string; + declare context: Context; + constructor(props: Props, context: Context) { super(props, context); diff --git a/x-pack/plugins/search_playground/public/providers/form_provider.tsx b/x-pack/plugins/search_playground/public/providers/form_provider.tsx index fc7c1e8a4c12f..1c804663af9e6 100644 --- a/x-pack/plugins/search_playground/public/providers/form_provider.tsx +++ b/x-pack/plugins/search_playground/public/providers/form_provider.tsx @@ -47,7 +47,10 @@ interface FormProviderProps { storage?: Storage; } -export const FormProvider: React.FC = ({ children, storage = localStorage }) => { +export const FormProvider: React.FC> = ({ + children, + storage = localStorage, +}) => { const models = useLLMsModels(); const [searchParams] = useSearchParams(); const index = useMemo(() => searchParams.get('default-index'), [searchParams]); diff --git a/x-pack/plugins/search_playground/public/providers/playground_provider.tsx b/x-pack/plugins/search_playground/public/providers/playground_provider.tsx index d2cb5bc8a5b94..58ebae76e7de2 100644 --- a/x-pack/plugins/search_playground/public/providers/playground_provider.tsx +++ b/x-pack/plugins/search_playground/public/providers/playground_provider.tsx @@ -10,7 +10,7 @@ import { QueryClientProvider } from '@tanstack/react-query'; import { queryClient } from '../utils/query_client'; import { FormProvider } from './form_provider'; -export const PlaygroundProvider: FC = ({ children }) => { +export const PlaygroundProvider: FC> = ({ children }) => { return ( {children} diff --git a/x-pack/plugins/security/public/components/use_badge.test.tsx b/x-pack/plugins/security/public/components/use_badge.test.tsx index f5d3c28e5f0b2..07d0261235301 100644 --- a/x-pack/plugins/security/public/components/use_badge.test.tsx +++ b/x-pack/plugins/security/public/components/use_badge.test.tsx @@ -17,7 +17,7 @@ import { useBadge } from './use_badge'; describe('useBadge', () => { it('should add badge to chrome', async () => { const coreStart = coreMock.createStart(); - const badge: ChromeBadge = { + const badge: React.PropsWithChildren = { text: 'text', tooltip: 'text', }; @@ -33,7 +33,7 @@ describe('useBadge', () => { it('should remove badge from chrome on unmount', async () => { const coreStart = coreMock.createStart(); - const badge: ChromeBadge = { + const badge: React.PropsWithChildren = { text: 'text', tooltip: 'text', }; @@ -53,7 +53,7 @@ describe('useBadge', () => { it('should update chrome when badge changes', async () => { const coreStart = coreMock.createStart(); - const badge1: ChromeBadge = { + const badge1: React.PropsWithChildren = { text: 'text', tooltip: 'text', }; diff --git a/x-pack/plugins/security/public/components/use_capabilities.test.tsx b/x-pack/plugins/security/public/components/use_capabilities.test.tsx index b5eca83a8d53e..5e8491199a5da 100644 --- a/x-pack/plugins/security/public/components/use_capabilities.test.tsx +++ b/x-pack/plugins/security/public/components/use_capabilities.test.tsx @@ -17,8 +17,8 @@ describe('useCapabilities', () => { it('should return capabilities', async () => { const coreStart = coreMock.createStart(); - const { result } = renderHook(useCapabilities, { - wrapper: ({ children }) => ( + const { result } = renderHook(() => useCapabilities(), { + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); @@ -35,8 +35,8 @@ describe('useCapabilities', () => { }, }; - const { result } = renderHook(useCapabilities, { - initialProps: 'users', + const { result } = renderHook(({ featureId }) => useCapabilities(featureId), { + initialProps: { featureId: 'users' } as React.PropsWithChildren<{ featureId: string }>, wrapper: ({ children }) => ( {children} ), diff --git a/x-pack/plugins/security/public/management/roles/edit_role/collapsible_panel/collapsible_panel.tsx b/x-pack/plugins/security/public/management/roles/edit_role/collapsible_panel/collapsible_panel.tsx index 18901968b7cc2..ac09602072161 100644 --- a/x-pack/plugins/security/public/management/roles/edit_role/collapsible_panel/collapsible_panel.tsx +++ b/x-pack/plugins/security/public/management/roles/edit_role/collapsible_panel/collapsible_panel.tsx @@ -32,7 +32,7 @@ interface State { collapsed: boolean; } -export class CollapsiblePanel extends Component { +export class CollapsiblePanel extends Component, State> { public state = { collapsed: false, }; diff --git a/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx b/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx index ebc668a85105c..eaa1b850cb70b 100644 --- a/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx +++ b/x-pack/plugins/security_solution/public/common/components/drag_and_drop/draggable_wrapper.tsx @@ -45,7 +45,7 @@ DragEffects.displayName = 'DragEffects'; * writing, there's no hook equivalent for `componentDidCatch`, per * https://reactjs.org/docs/hooks-faq.html#do-hooks-cover-all-use-cases-for-classes */ -class DragDropErrorBoundary extends React.PureComponent { +class DragDropErrorBoundary extends React.PureComponent> { componentDidCatch() { this.forceUpdate(); // required for recovery } diff --git a/x-pack/plugins/security_solution/public/common/components/endpoint/link_to_app.test.tsx b/x-pack/plugins/security_solution/public/common/components/endpoint/link_to_app.test.tsx index 4290cff8c2b1f..52b3b53a10f01 100644 --- a/x-pack/plugins/security_solution/public/common/components/endpoint/link_to_app.test.tsx +++ b/x-pack/plugins/security_solution/public/common/components/endpoint/link_to_app.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { mount } from 'enzyme'; +import { mount, type ComponentType } from 'enzyme'; import { LinkToApp } from './link_to_app'; import type { CoreStart } from '@kbn/core/public'; import { KibanaContextProvider } from '@kbn/kibana-react-plugin/public'; @@ -21,7 +21,7 @@ describe('LinkToApp component', () => { let fakeCoreStart: jest.Mocked; const render = (ui: Parameters[0]) => mount(ui, { - wrappingComponent: KibanaContextProvider, + wrappingComponent: KibanaContextProvider as ComponentType<{}>, wrappingComponentProps: { services: { application: fakeCoreStart.application }, }, diff --git a/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/insight/use_insight_query.test.ts b/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/insight/use_insight_query.test.ts index 82474c2d381de..a162c625c7adc 100644 --- a/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/insight/use_insight_query.test.ts +++ b/x-pack/plugins/security_solution/public/common/components/markdown_editor/plugins/insight/use_insight_query.test.ts @@ -4,6 +4,7 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ +import type React from 'react'; import { renderHook } from '@testing-library/react-hooks'; import type { QueryOperator } from '@kbn/timelines-plugin/common'; import { DataProviderTypeEnum } from '../../../../../../common/api/timeline'; @@ -29,7 +30,7 @@ const mockProvider = { describe('useInsightQuery', () => { it('should return renderable defaults', () => { - const { result } = renderHook( + const { result } = renderHook, UseInsightQueryResult>( () => useInsightQuery({ dataProviders: [mockProvider], diff --git a/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.test.tsx b/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.test.tsx index c9c2b5cb25c62..f02fe4167dee8 100644 --- a/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.test.tsx +++ b/x-pack/plugins/security_solution/public/common/components/matrix_histogram/index.test.tsx @@ -6,7 +6,7 @@ */ import type { ReactWrapper } from 'enzyme'; -import { mount } from 'enzyme'; +import { mount, type ComponentType } from 'enzyme'; import React from 'react'; import { MatrixHistogram } from '.'; @@ -80,7 +80,7 @@ describe('Matrix Histogram Component', () => { describe('rendering', () => { beforeEach(() => { wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); }); @@ -119,7 +119,7 @@ describe('Matrix Histogram Component', () => { describe('spacer', () => { test('it renders a spacer by default', () => { wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('[data-test-subj="spacer"]').exists()).toEqual(true); }); @@ -128,7 +128,7 @@ describe('Matrix Histogram Component', () => { wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, } ); expect(wrapper.find('[data-test-subj="spacer"]').exists()).toEqual(false); @@ -138,7 +138,7 @@ describe('Matrix Histogram Component', () => { describe('select dropdown', () => { test('should be hidden if only one option is provided', () => { wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('EuiSelect').exists()).toEqual(false); }); @@ -151,7 +151,7 @@ describe('Matrix Histogram Component', () => { getLensAttributes: getDnsTopDomainsLensAttributes, }; wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('[data-test-subj="inspect-icon-button"]').exists()).toEqual(false); }); @@ -165,7 +165,7 @@ describe('Matrix Histogram Component', () => { test('toggleQuery updates toggleStatus', () => { wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('[data-test-subj="visualization-embeddable"]').exists()).toEqual(true); wrapper.find('[data-test-subj="query-toggle-header"]').first().simulate('click'); @@ -174,7 +174,7 @@ describe('Matrix Histogram Component', () => { test('toggleStatus=true, render components', () => { wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('[data-test-subj="visualization-embeddable"]').exists()).toEqual(true); }); @@ -182,7 +182,7 @@ describe('Matrix Histogram Component', () => { test('toggleStatus=false, do not render components', () => { mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle }); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('MatrixLoader').exists()).toBe(false); }); @@ -190,7 +190,7 @@ describe('Matrix Histogram Component', () => { test('toggleStatus=false, skip', () => { mockUseQueryToggle.mockReturnValue({ toggleStatus: false, setToggleStatus: mockSetToggle }); wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as ComponentType<{}>, }); expect(wrapper.find('[data-test-subj="visualization-embeddable"]').exists()).toEqual(false); diff --git a/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_visualization_response.test.tsx b/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_visualization_response.test.tsx index cb13823d8512c..6089bdc665392 100644 --- a/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_visualization_response.test.tsx +++ b/x-pack/plugins/security_solution/public/common/components/visualization_actions/use_visualization_response.test.tsx @@ -45,7 +45,9 @@ describe('useVisualizationResponse', () => { }); it('should get result by visualization id', () => { const { result } = renderHook(() => useVisualizationResponse({ visualizationId }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); expect(result.current.responses).toEqual( parseVisualizationData(mockState.inputs.global.queries[0].inspect.response) diff --git a/x-pack/plugins/security_solution/public/common/containers/source/index.test.tsx b/x-pack/plugins/security_solution/public/common/containers/source/index.test.tsx index 761dad997c8ce..189e04a5c1d64 100644 --- a/x-pack/plugins/security_solution/public/common/containers/source/index.test.tsx +++ b/x-pack/plugins/security_solution/public/common/containers/source/index.test.tsx @@ -5,6 +5,7 @@ * 2.0. */ +import type { PropsWithChildren } from 'react'; import type { IndexFieldSearch } from './use_data_view'; import { useDataView } from './use_data_view'; import { mocksSource } from './mock'; @@ -85,7 +86,7 @@ describe('source/index.tsx', () => { it('sets field data for data view', async () => { await act(async () => { const { waitForNextUpdate, result } = renderHook< - string, + PropsWithChildren<{}>, { indexFieldsSearch: IndexFieldSearch } >(() => useDataView(), { wrapper: TestProviders, @@ -106,7 +107,7 @@ describe('source/index.tsx', () => { let indexFieldsSearch: IndexFieldSearch; await act(async () => { const { waitForNextUpdate, result } = renderHook< - string, + PropsWithChildren<{}>, { indexFieldsSearch: IndexFieldSearch } >(() => useDataView(), { wrapper: TestProviders, @@ -135,7 +136,7 @@ describe('source/index.tsx', () => { let indexFieldsSearch: IndexFieldSearch; await act(async () => { const { waitForNextUpdate, result } = renderHook< - string, + PropsWithChildren<{}>, { indexFieldsSearch: IndexFieldSearch } >(() => useDataView(), { wrapper: TestProviders, diff --git a/x-pack/plugins/security_solution/public/common/hooks/use_data_view_id.test.ts b/x-pack/plugins/security_solution/public/common/hooks/use_data_view_id.test.ts index cbfedd2ad0b6d..bbfa85b383158 100644 --- a/x-pack/plugins/security_solution/public/common/hooks/use_data_view_id.test.ts +++ b/x-pack/plugins/security_solution/public/common/hooks/use_data_view_id.test.ts @@ -4,6 +4,8 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ + +import type { PropsWithChildren } from 'react'; import { renderHook } from '@testing-library/react-hooks'; import { TestProviders } from '../mock'; import { SourcererScopeName } from '../../sourcerer/store/model'; @@ -15,7 +17,13 @@ describe('useDataViewId', () => { it.each(Object.values(SourcererScopeName))( 'should return the data view id for %s scope', (scope) => { - const { result } = renderHook(useDataViewId, { initialProps: scope, wrapper: TestProviders }); + const { result } = renderHook< + PropsWithChildren<{ scope: SourcererScopeName }>, + string | undefined + >((props) => useDataViewId(props.scope), { + initialProps: { scope }, + wrapper: TestProviders, + }); expect(result.current).toEqual(DEFAULT_DATA_VIEW_ID); // mocked value } ); @@ -25,8 +33,11 @@ describe('useDataViewId', () => { .spyOn(sourcererSelectors, 'sourcererScopeSelectedDataViewId') .mockImplementationOnce(() => null); - const { result } = renderHook(useDataViewId, { - initialProps: SourcererScopeName.default, + const { result } = renderHook< + PropsWithChildren<{ scope: SourcererScopeName }>, + string | undefined + >((props) => useDataViewId(props.scope), { + initialProps: { scope: SourcererScopeName.default }, wrapper: TestProviders, }); expect(result.current).toEqual(undefined); diff --git a/x-pack/plugins/security_solution/public/common/hooks/use_invalid_filter_query.test.tsx b/x-pack/plugins/security_solution/public/common/hooks/use_invalid_filter_query.test.tsx index 1d13f556306d7..8b94e964452bb 100644 --- a/x-pack/plugins/security_solution/public/common/hooks/use_invalid_filter_query.test.tsx +++ b/x-pack/plugins/security_solution/public/common/hooks/use_invalid_filter_query.test.tsx @@ -38,7 +38,7 @@ const getProps = () => ({ endDate: '2018-01-02T00:00:00.000Z', }); -const getWrapper = (store: Store): React.FC => { +const getWrapper = (store: Store): React.FC> => { // eslint-disable-next-line react/display-name return ({ children }) => ( diff --git a/x-pack/plugins/security_solution/public/common/links/links.test.tsx b/x-pack/plugins/security_solution/public/common/links/links.test.tsx index b54dfbc3dbc42..aeffa1d44f823 100644 --- a/x-pack/plugins/security_solution/public/common/links/links.test.tsx +++ b/x-pack/plugins/security_solution/public/common/links/links.test.tsx @@ -86,7 +86,7 @@ const mockUiSettingsClient = uiSettingsServiceMock.createStartContract(); const renderUseAppLinks = () => renderHook<{}, AppLinkItems>(() => useAppLinks(), { wrapper: TestProviders }); const renderUseLinkExists = (id: SecurityPageName) => - renderHook(() => useLinkExists(id), { + renderHook, boolean>(() => useLinkExists(id), { wrapper: TestProviders, }); diff --git a/x-pack/plugins/security_solution/public/common/mock/create_react_query_wrapper.tsx b/x-pack/plugins/security_solution/public/common/mock/create_react_query_wrapper.tsx index 42377ecca87c8..c13b26b1d0b4b 100644 --- a/x-pack/plugins/security_solution/public/common/mock/create_react_query_wrapper.tsx +++ b/x-pack/plugins/security_solution/public/common/mock/create_react_query_wrapper.tsx @@ -8,7 +8,7 @@ import React from 'react'; import { QueryClient, QueryClientProvider } from '@tanstack/react-query'; -export function createReactQueryWrapper(): React.FC { +export function createReactQueryWrapper(): React.FC> { const queryClient = new QueryClient({ defaultOptions: { queries: { diff --git a/x-pack/plugins/security_solution/public/common/store/reducer.test.tsx b/x-pack/plugins/security_solution/public/common/store/reducer.test.tsx index ec2143ea75854..fc06e6369e949 100644 --- a/x-pack/plugins/security_solution/public/common/store/reducer.test.tsx +++ b/x-pack/plugins/security_solution/public/common/store/reducer.test.tsx @@ -76,7 +76,7 @@ describe('createInitialState', () => { test('indicesExist should be TRUE if patternList is NOT empty', async () => { const { result } = renderHook(() => useSourcererDataView(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); @@ -113,7 +113,7 @@ describe('createInitialState', () => { initialNotesState ); const { result } = renderHook(() => useSourcererDataView(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} ), }); diff --git a/x-pack/plugins/security_solution/public/dashboards/hooks/use_create_security_dashboard_link.test.tsx b/x-pack/plugins/security_solution/public/dashboards/hooks/use_create_security_dashboard_link.test.tsx index 52540aff6aa7e..36aa70bc5678c 100644 --- a/x-pack/plugins/security_solution/public/dashboards/hooks/use_create_security_dashboard_link.test.tsx +++ b/x-pack/plugins/security_solution/public/dashboards/hooks/use_create_security_dashboard_link.test.tsx @@ -27,7 +27,7 @@ jest.mock('../../common/components/link_to', () => ({ const renderUseCreateSecurityDashboardLink = () => renderHook(() => useCreateSecurityDashboardLink(), { - wrapper: ({ children }) => ( + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( {children} diff --git a/x-pack/plugins/security_solution/public/detection_engine/rule_creation/components/step_rule_actions/index.test.tsx b/x-pack/plugins/security_solution/public/detection_engine/rule_creation/components/step_rule_actions/index.test.tsx index 1785da88cc16a..583769069157d 100644 --- a/x-pack/plugins/security_solution/public/detection_engine/rule_creation/components/step_rule_actions/index.test.tsx +++ b/x-pack/plugins/security_solution/public/detection_engine/rule_creation/components/step_rule_actions/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import { render } from '@testing-library/react'; import { TestProviders } from '../../../../common/mock'; @@ -79,7 +79,7 @@ describe('StepRuleActions', () => { }; it('renders correctly', () => { const wrapper = mount( {}} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('Form[data-test-subj="stepRuleActions"]')).toHaveLength(1); diff --git a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/status_icon/index.test.tsx b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/status_icon/index.test.tsx index 810bab87e5f97..1e69f12d63024 100644 --- a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/status_icon/index.test.tsx +++ b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/status_icon/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { shallow } from 'enzyme'; +import { shallow, type ComponentType as EnzymeComponentType } from 'enzyme'; import { TestProviders } from '../../../../common/mock'; import { RuleStatusIcon } from '.'; @@ -15,7 +15,7 @@ jest.mock('../../../../common/lib/kibana'); describe('RuleStatusIcon', () => { it('renders correctly', () => { const wrapper = shallow(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('EuiAvatar')).toHaveLength(1); diff --git a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.test.tsx b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.test.tsx index 8cb278ddccdfe..bdbc01ada58ff 100644 --- a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.test.tsx +++ b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_about_rule/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { mount, shallow } from 'enzyme'; +import { mount, shallow, type ComponentType as EnzymeComponentType } from 'enzyme'; import { act } from '@testing-library/react'; import { stubIndexPattern } from '@kbn/data-plugin/common/stubs'; @@ -149,7 +149,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -174,7 +174,7 @@ describe('StepAboutRuleComponent', () => { defineStepDefaultOverride={{ ruleType: 'threat_match' } as DefineStepRule} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -198,7 +198,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -226,7 +226,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -249,7 +249,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -305,7 +305,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -367,7 +367,7 @@ describe('StepAboutRuleComponent', () => { }} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -412,7 +412,7 @@ describe('StepAboutRuleComponent', () => { }); mount( {}} defineStepDefaultOverride={stepDefineStepMLRule} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); const indexNames = ['.ml-anomalies-shared']; @@ -433,7 +433,7 @@ describe('StepAboutRuleComponent', () => { }); mount( {}} defineStepDefaultOverride={stepDefineStepMLRule} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(useFetchIndex).lastCalledWith(stepDefineStepMLRule.index); diff --git a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_schedule_rule/index.test.tsx b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_schedule_rule/index.test.tsx index 2dc12fffe8759..7e85334527d55 100644 --- a/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_schedule_rule/index.test.tsx +++ b/x-pack/plugins/security_solution/public/detection_engine/rule_creation_ui/components/step_schedule_rule/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { shallow, mount } from 'enzyme'; +import { shallow, mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import { TestProviders } from '../../../../common/mock'; import { StepScheduleRule, StepScheduleRuleReadOnly } from '.'; @@ -40,7 +40,7 @@ describe('StepScheduleRule', () => { }; it('renders correctly', () => { const wrapper = mount( {}} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('Form[data-test-subj="stepScheduleRule"]')).toHaveLength(1); diff --git a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_summary_charts_panel/use_summary_chart_data.test.tsx b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_summary_charts_panel/use_summary_chart_data.test.tsx index 22dd8da0e1101..74e04a61ae5bd 100644 --- a/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_summary_charts_panel/use_summary_chart_data.test.tsx +++ b/x-pack/plugins/security_solution/public/detections/components/alerts_kpis/alerts_summary_charts_panel/use_summary_chart_data.test.tsx @@ -6,6 +6,7 @@ */ import { renderHook } from '@testing-library/react-hooks'; +import type { PropsWithChildren } from 'react'; import { TestProviders } from '../../../../common/mock'; import { ALERTS_QUERY_NAMES } from '../../../containers/detection_engine/alerts/constants'; import type { UseAlerts, UseAlertsQueryProps } from './use_summary_chart_data'; @@ -75,7 +76,7 @@ describe('getAlertsQuery', () => { // helper function to render the hook const renderUseSummaryChartData = (props: Partial = {}) => - renderHook>( + renderHook, ReturnType>( () => useSummaryChartData({ aggregations: aggregations.severityAggregations, diff --git a/x-pack/plugins/security_solution/public/detections/components/alerts_table/timeline_actions/alert_context_menu.test.tsx b/x-pack/plugins/security_solution/public/detections/components/alerts_table/timeline_actions/alert_context_menu.test.tsx index b91db35cdeaa7..bdef9cd84c8f6 100644 --- a/x-pack/plugins/security_solution/public/detections/components/alerts_table/timeline_actions/alert_context_menu.test.tsx +++ b/x-pack/plugins/security_solution/public/detections/components/alerts_table/timeline_actions/alert_context_menu.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import { AlertContextMenu } from './alert_context_menu'; import { TestProviders } from '../../../../common/mock'; import React from 'react'; @@ -115,7 +115,7 @@ describe('Alert table context menu', () => { describe('Case actions', () => { test('it render AddToCase context menu item if timelineId === TimelineId.detectionsPage', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); @@ -127,7 +127,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -138,7 +138,7 @@ describe('Alert table context menu', () => { test('it render AddToCase context menu item if timelineId === TimelineId.active', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); @@ -148,7 +148,7 @@ describe('Alert table context menu', () => { test('it does NOT render AddToCase context menu item when timelineId is not in the allowed list', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); expect(wrapper.find(addToExistingCaseButton).first().exists()).toEqual(false); @@ -159,7 +159,7 @@ describe('Alert table context menu', () => { describe('Alert status actions', () => { test('it renders the correct status action buttons', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); @@ -189,7 +189,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -202,7 +202,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -221,7 +221,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -234,7 +234,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -253,7 +253,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -275,7 +275,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -287,7 +287,7 @@ describe('Alert table context menu', () => { const wrapper = mount( , { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); @@ -301,7 +301,7 @@ describe('Alert table context menu', () => { describe('Apply alert tags action', () => { test('it renders the apply alert tags action button', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); @@ -313,7 +313,7 @@ describe('Alert table context menu', () => { describe('Assign alert action', () => { test('it renders the assign alert action button', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find(actionMenuButton).simulate('click'); diff --git a/x-pack/plugins/security_solution/public/detections/components/rules/rule_switch/index.test.tsx b/x-pack/plugins/security_solution/public/detections/components/rules/rule_switch/index.test.tsx index 8698cab56bb45..62848c95531ec 100644 --- a/x-pack/plugins/security_solution/public/detections/components/rules/rule_switch/index.test.tsx +++ b/x-pack/plugins/security_solution/public/detections/components/rules/rule_switch/index.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import React from 'react'; import { waitFor } from '@testing-library/react'; @@ -45,7 +45,7 @@ describe('RuleSwitch', () => { test('it renders loader if "isLoading" is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitchLoader"]').exists()).toBeTruthy(); @@ -54,7 +54,7 @@ describe('RuleSwitch', () => { test('it renders switch disabled if "isDisabled" is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props().disabled).toBeTruthy(); @@ -62,21 +62,21 @@ describe('RuleSwitch', () => { test('it renders switch enabled if "enabled" is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props().checked).toBeTruthy(); }); test('it renders switch disabled if "enabled" is false', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props().checked).toBeFalsy(); }); test('it sets the undefined aria-label for switch if ruleName not passed', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect( wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props()['aria-label'] @@ -85,7 +85,7 @@ describe('RuleSwitch', () => { test('it sets the correct aria-label for switch if "enabled" is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props()['aria-label']).toBe( 'Switch off "test"' @@ -94,7 +94,7 @@ describe('RuleSwitch', () => { test('it sets the correct aria-label for switch if "enabled" is false', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="ruleSwitch"]').at(0).props()['aria-label']).toBe( 'Switch on "test"' @@ -106,7 +106,7 @@ describe('RuleSwitch', () => { (performBulkAction as jest.Mock).mockRejectedValue(mockError); const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find('[data-test-subj="ruleSwitch"]').at(2).simulate('click'); @@ -121,7 +121,7 @@ describe('RuleSwitch', () => { (useRulesTableContextOptional as jest.Mock).mockReturnValue(rulesTableContext); const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); wrapper.find('[data-test-subj="ruleSwitch"]').at(2).simulate('click'); diff --git a/x-pack/plugins/security_solution/public/detections/containers/detection_engine/alerts/use_signal_index.test.tsx b/x-pack/plugins/security_solution/public/detections/containers/detection_engine/alerts/use_signal_index.test.tsx index eb4860d1d6ef3..7fed5e84b5320 100644 --- a/x-pack/plugins/security_solution/public/detections/containers/detection_engine/alerts/use_signal_index.test.tsx +++ b/x-pack/plugins/security_solution/public/detections/containers/detection_engine/alerts/use_signal_index.test.tsx @@ -4,6 +4,7 @@ * 2.0; you may not use this file except in compliance with the Elastic License * 2.0. */ +import type { PropsWithChildren } from 'react'; import { renderHook, act } from '@testing-library/react-hooks'; import { TestProvidersWithPrivileges } from '../../../../common/mock'; import type { ReturnSignalIndex } from './use_signal_index'; @@ -31,7 +32,7 @@ describe('useSignalIndex', () => { test('init', async () => { await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -50,7 +51,7 @@ describe('useSignalIndex', () => { test('fetch alerts info', async () => { await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -71,7 +72,7 @@ describe('useSignalIndex', () => { test('make sure that createSignalIndex is giving back the signal info', async () => { await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -97,7 +98,7 @@ describe('useSignalIndex', () => { test('make sure that createSignalIndex have been called when trying to create signal index', async () => { const spyOnCreateSignalIndex = jest.spyOn(api, 'createSignalIndex'); await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -120,7 +121,7 @@ describe('useSignalIndex', () => { throw new Error('Something went wrong, let see what happen'); }); await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -148,7 +149,7 @@ describe('useSignalIndex', () => { throw new Error('Something went wrong, let see what happen'); }); await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, @@ -175,7 +176,7 @@ describe('useSignalIndex', () => { jest.spyOn(sourcererSelectors, 'signalIndexMappingOutdated').mockReturnValue(false); await act(async () => { - const { result, waitForNextUpdate } = renderHook( + const { result, waitForNextUpdate } = renderHook, ReturnSignalIndex>( () => useSignalIndex(), { wrapper: TestProvidersWithPrivileges, diff --git a/x-pack/plugins/security_solution/public/detections/hooks/trigger_actions_alert_table/use_persistent_controls.test.tsx b/x-pack/plugins/security_solution/public/detections/hooks/trigger_actions_alert_table/use_persistent_controls.test.tsx index 7e1826c4652a3..7334be4e2a466 100644 --- a/x-pack/plugins/security_solution/public/detections/hooks/trigger_actions_alert_table/use_persistent_controls.test.tsx +++ b/x-pack/plugins/security_solution/public/detections/hooks/trigger_actions_alert_table/use_persistent_controls.test.tsx @@ -88,7 +88,9 @@ describe('usePersistentControls', () => { }); const usePersistentControls = getPersistentControlsHook(tableId); const { result } = renderHook(() => usePersistentControls(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); const groupSelector = result.current.right.props.additionalMenuOptions[0]; diff --git a/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.test.tsx b/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.test.tsx index 59bc7faec4120..a41cd65f9db3c 100644 --- a/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.test.tsx +++ b/x-pack/plugins/security_solution/public/management/pages/policy/view/policy_details.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import React from 'react'; import { AGENT_API_ROUTES, PACKAGE_POLICY_API_ROOT } from '@kbn/fleet-plugin/common'; import { EndpointDocGenerator } from '../../../../../common/endpoint/generate_data'; @@ -57,7 +57,8 @@ describe('Policy Details', () => { const AppWrapper = appContextMockRenderer.AppWrapper; ({ history, coreStart, middlewareSpy } = appContextMockRenderer); - render = () => mount(, { wrappingComponent: AppWrapper }); + render = () => + mount(, { wrappingComponent: AppWrapper as EnzymeComponentType<{}> }); http = coreStart.http; }); diff --git a/x-pack/plugins/security_solution/public/overview/components/detection_response/alerts_by_status/use_alerts_by_status.test.tsx b/x-pack/plugins/security_solution/public/overview/components/detection_response/alerts_by_status/use_alerts_by_status.test.tsx index 15f933754b68e..b7df916c60342 100644 --- a/x-pack/plugins/security_solution/public/overview/components/detection_response/alerts_by_status/use_alerts_by_status.test.tsx +++ b/x-pack/plugins/security_solution/public/overview/components/detection_response/alerts_by_status/use_alerts_by_status.test.tsx @@ -5,6 +5,7 @@ * 2.0. */ +import type { PropsWithChildren } from 'react'; import { renderHook } from '@testing-library/react-hooks'; import { TestProviders } from '../../../../common/mock'; import { ALERTS_QUERY_NAMES } from '../../../../detections/containers/detection_engine/alerts/constants'; @@ -42,7 +43,7 @@ jest.mock('../../../../common/containers/use_global_time', () => { // helper function to render the hook const renderUseAlertsByStatus = (props: Partial = {}) => - renderHook>( + renderHook, ReturnType>( () => useAlertsByStatus({ queryId: 'test', diff --git a/x-pack/plugins/security_solution/public/overview/components/detection_response/cases_by_status/use_cases_by_status.test.tsx b/x-pack/plugins/security_solution/public/overview/components/detection_response/cases_by_status/use_cases_by_status.test.tsx index cee2884d1bdf1..5821dd349749d 100644 --- a/x-pack/plugins/security_solution/public/overview/components/detection_response/cases_by_status/use_cases_by_status.test.tsx +++ b/x-pack/plugins/security_solution/public/overview/components/detection_response/cases_by_status/use_cases_by_status.test.tsx @@ -5,6 +5,7 @@ * 2.0. */ +import type { PropsWithChildren } from 'react'; import { renderHook, act } from '@testing-library/react-hooks'; import { mockCasesContract } from '@kbn/cases-plugin/public/mocks'; import { useKibana } from '../../../../common/lib/kibana'; @@ -63,12 +64,12 @@ describe('useCasesByStatus', () => { jest.clearAllMocks(); }); test('init', () => { - const { result } = renderHook( - () => useCasesByStatus({}), - { - wrapper: TestProviders, - } - ); + const { result } = renderHook< + PropsWithChildren, + UseCasesByStatusResults + >(() => useCasesByStatus({}), { + wrapper: TestProviders, + }); expect(result.current).toEqual({ closed: 0, inProgress: 0, @@ -81,7 +82,7 @@ describe('useCasesByStatus', () => { test('fetch data', async () => { const { result, waitForNextUpdate } = renderHook< - UseCasesByStatusProps, + PropsWithChildren, UseCasesByStatusResults >(() => useCasesByStatus({ skip: false }), { wrapper: TestProviders, @@ -98,19 +99,19 @@ describe('useCasesByStatus', () => { }); test('it should call setQuery when fetching', async () => { - const { waitForNextUpdate } = renderHook( - () => useCasesByStatus({ skip: false }), - { - wrapper: TestProviders, - } - ); + const { waitForNextUpdate } = renderHook< + PropsWithChildren, + UseCasesByStatusResults + >(() => useCasesByStatus({ skip: false }), { + wrapper: TestProviders, + }); await waitForNextUpdate(); expect(mockSetQuery).toHaveBeenCalled(); }); test('it should call deleteQuery when unmounting', async () => { const { waitForNextUpdate, unmount } = renderHook< - UseCasesByStatusProps, + PropsWithChildren, UseCasesByStatusResults >(() => useCasesByStatus({ skip: false }), { wrapper: TestProviders, @@ -127,7 +128,7 @@ describe('useCasesByStatus', () => { const localProps = { skip: false }; const { rerender, waitForNextUpdate } = renderHook< - UseCasesByStatusProps, + PropsWithChildren, UseCasesByStatusResults >(() => useCasesByStatus(localProps), { wrapper: TestProviders, diff --git a/x-pack/plugins/security_solution/public/overview/components/event_counts/index.test.tsx b/x-pack/plugins/security_solution/public/overview/components/event_counts/index.test.tsx index bd4a8a3168457..6bd427d547c86 100644 --- a/x-pack/plugins/security_solution/public/overview/components/event_counts/index.test.tsx +++ b/x-pack/plugins/security_solution/public/overview/components/event_counts/index.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import React from 'react'; import type { OverviewHostProps } from '../overview_host'; @@ -34,7 +34,9 @@ describe('EventCounts', () => { }; test('it filters the `Host events` widget with a `host.name` `exists` filter', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as EnzymeComponentType<{}>, + }); expect( (wrapper.find('Memo(OverviewHostComponent)').first().props() as OverviewHostProps).filterQuery @@ -42,7 +44,9 @@ describe('EventCounts', () => { }); test('it filters the `Network events` widget with a `source.ip` or `destination.ip` `exists` filter', () => { - const wrapper = mount(, { wrappingComponent: TestProviders }); + const wrapper = mount(, { + wrappingComponent: TestProviders as EnzymeComponentType<{}>, + }); expect( (wrapper.find('Memo(OverviewNetworkComponent)').first().props() as OverviewNetworkProps) diff --git a/x-pack/plugins/security_solution/public/resolver/view/generated_text.tsx b/x-pack/plugins/security_solution/public/resolver/view/generated_text.tsx index b53b2da99046d..3a9ef6fdac2e0 100644 --- a/x-pack/plugins/security_solution/public/resolver/view/generated_text.tsx +++ b/x-pack/plugins/security_solution/public/resolver/view/generated_text.tsx @@ -12,7 +12,7 @@ import React from 'react'; * spliced into text children at word boundaries. */ // eslint-disable-next-line react/display-name -export const GeneratedText = React.memo(function ({ children }) { +export const GeneratedText = React.memo>(function ({ children }) { return <>{processedValue()}; function processedValue() { diff --git a/x-pack/plugins/security_solution/public/sourcerer/containers/hooks.test.tsx b/x-pack/plugins/security_solution/public/sourcerer/containers/hooks.test.tsx index 4ed4efb4389a7..8b0150efa6126 100644 --- a/x-pack/plugins/security_solution/public/sourcerer/containers/hooks.test.tsx +++ b/x-pack/plugins/security_solution/public/sourcerer/containers/hooks.test.tsx @@ -160,9 +160,12 @@ describe('Sourcerer Hooks', () => { }); it('initializes loading default and timeline index patterns', async () => { await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); expect(mockDispatch).toBeCalledTimes(3); @@ -205,9 +208,12 @@ describe('Sourcerer Hooks', () => { loading: false, signalIndexName: mockSourcererState.signalIndexName, })); - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -252,7 +258,7 @@ describe('Sourcerer Hooks', () => { }) ); - renderHook(() => useInitSourcerer(), { + renderHook, void>(() => useInitSourcerer(), { wrapper: ({ children }) => {children}, }); @@ -272,7 +278,7 @@ describe('Sourcerer Hooks', () => { onInitialize(null) ); - renderHook(() => useInitSourcerer(), { + renderHook, void>(() => useInitSourcerer(), { wrapper: ({ children }) => {children}, }); @@ -297,7 +303,7 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - renderHook(() => useInitSourcerer(), { + renderHook, void>(() => useInitSourcerer(), { wrapper: ({ children }) => {children}, }); @@ -333,9 +339,12 @@ describe('Sourcerer Hooks', () => { loading: false, signalIndexName: mockSourcererState.signalIndexName, })); - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); @@ -372,9 +381,12 @@ describe('Sourcerer Hooks', () => { loading: false, signalIndexName: mockSourcererState.signalIndexName, })); - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); @@ -392,7 +404,7 @@ describe('Sourcerer Hooks', () => { signalIndexName: mockSourcererState.signalIndexName, isSignalIndexExists: true, })); - const { rerender, waitForNextUpdate } = renderHook( + const { rerender, waitForNextUpdate } = renderHook, void>( () => useInitSourcerer(SourcererScopeName.detections), { wrapper: ({ children }) => {children}, @@ -412,9 +424,12 @@ describe('Sourcerer Hooks', () => { }); it('index field search is not repeated when default and timeline have same dataViewId', async () => { await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -437,9 +452,12 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -459,9 +477,12 @@ describe('Sourcerer Hooks', () => { }); it('does not needToBeInit if scope is default and selectedPatterns/missingPatterns have values', async () => { await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -490,9 +511,12 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -526,9 +550,12 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -563,9 +590,12 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -604,9 +634,12 @@ describe('Sourcerer Hooks', () => { }, }); await act(async () => { - const { rerender, waitForNextUpdate } = renderHook(() => useInitSourcerer(), { - wrapper: ({ children }) => {children}, - }); + const { rerender, waitForNextUpdate } = renderHook, void>( + () => useInitSourcerer(), + { + wrapper: ({ children }) => {children}, + } + ); await waitForNextUpdate(); rerender(); await waitFor(() => { @@ -647,7 +680,7 @@ describe('Sourcerer Hooks', () => { }, }); const { result, rerender, waitForNextUpdate } = renderHook< - SourcererScopeName, + React.PropsWithChildren<{}>, SelectedDataView >(() => useSourcererDataView(), { wrapper: ({ children }) => {children}, @@ -670,7 +703,7 @@ describe('Sourcerer Hooks', () => { }); it('should update the title and name of the data view according to the selected patterns', async () => { - const { result, rerender } = renderHook( + const { result, rerender } = renderHook, SelectedDataView>( () => useSourcererDataView(), { wrapper: ({ children }) => {children}, diff --git a/x-pack/plugins/security_solution/public/sourcerer/containers/use_signal_helpers.test.tsx b/x-pack/plugins/security_solution/public/sourcerer/containers/use_signal_helpers.test.tsx index 8897d20f28e9a..5bb0cc11ebffb 100644 --- a/x-pack/plugins/security_solution/public/sourcerer/containers/use_signal_helpers.test.tsx +++ b/x-pack/plugins/security_solution/public/sourcerer/containers/use_signal_helpers.test.tsx @@ -72,7 +72,9 @@ describe('useSignalHelpers', () => { const store = createMockStore(state); await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useSignalHelpers(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(result.current.signalIndexNeedsInit).toEqual(true); @@ -101,7 +103,9 @@ describe('useSignalHelpers', () => { const store = createMockStore(state); await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useSignalHelpers(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(result.current.signalIndexNeedsInit).toEqual(false); @@ -132,7 +136,9 @@ describe('useSignalHelpers', () => { const store = createMockStore(state); await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useSignalHelpers(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(result.current.signalIndexNeedsInit).toEqual(false); @@ -166,7 +172,9 @@ describe('useSignalHelpers', () => { const store = createMockStore(state); await act(async () => { const { result, waitForNextUpdate } = renderHook(() => useSignalHelpers(), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), }); await waitForNextUpdate(); expect(result.current.signalIndexNeedsInit).toEqual(false); diff --git a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/create_field_button/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/create_field_button/index.test.tsx index a7051882ee881..4c1c72500ae8b 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/create_field_button/index.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/create_field_button/index.test.tsx @@ -17,7 +17,7 @@ const mockOpenFieldEditor = jest.fn(); const mockOnHide = jest.fn(); const renderUseCreateFieldButton = (props: Partial = {}) => - renderHook>( + renderHook, ReturnType>( () => useCreateFieldButton({ isAllowed: true, diff --git a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/field_table_columns/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/field_table_columns/index.test.tsx index acd67666eb178..8d82c3402af7c 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/field_table_columns/index.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/field_table_columns/index.test.tsx @@ -21,7 +21,7 @@ const mockOpenDeleteFieldModal = jest.fn(); // helper function to render the hook const renderUseFieldTableColumns = (props: Partial = {}) => - renderHook>( + renderHook, ReturnType>( () => useFieldTableColumns({ hasFieldEditPermission: true, diff --git a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/index.test.tsx index 0dc8c4367e4fe..67094a18cf327 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/fields_browser/index.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/fields_browser/index.test.tsx @@ -45,7 +45,10 @@ const runAllPromises = () => new Promise(setImmediate); const renderUseFieldBrowserOptions = ( props: Partial = {} ) => - renderHook>( + renderHook< + React.PropsWithChildren, + ReturnType + >( () => useFieldBrowserOptions({ sourcererScope: SourcererScopeName.default, diff --git a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx index 812d59cc1296b..da56cb12b4a00 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/index.test.tsx @@ -165,12 +165,12 @@ describe('StatefulOpenTimeline', () => { describe("Template timelines' tab", () => { test("should land on correct timelines' tab with url timelines/default", () => { - const { result } = renderHook( - () => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseTimelineTypesResult + >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), { + wrapper: ({ children }) => {children}, + }); expect(result.current.timelineType).toBe(TimelineTypeEnum.default); }); @@ -181,12 +181,12 @@ describe('StatefulOpenTimeline', () => { pageName: SecurityPageName.timelines, }); - const { result } = renderHook( - () => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseTimelineTypesResult + >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), { + wrapper: ({ children }) => {children}, + }); expect(result.current.timelineType).toBe(TimelineTypeEnum.template); }); @@ -223,12 +223,12 @@ describe('StatefulOpenTimeline', () => { pageName: SecurityPageName.case, }); - const { result } = renderHook( - () => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), - { - wrapper: ({ children }) => {children}, - } - ); + const { result } = renderHook< + React.PropsWithChildren, + UseTimelineTypesResult + >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 0 }), { + wrapper: ({ children }) => {children}, + }); expect(result.current.timelineType).toBe(TimelineTypeEnum.default); }); diff --git a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.test.tsx index e04ee0f434588..66d3a41bc0d48 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/open_timeline/use_timeline_types.test.tsx @@ -51,7 +51,7 @@ describe('useTimelineTypes', () => { it('init', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -69,7 +69,7 @@ describe('useTimelineTypes', () => { it('render timelineTabs', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -89,7 +89,7 @@ describe('useTimelineTypes', () => { it('set timelineTypes correctly', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -117,7 +117,7 @@ describe('useTimelineTypes', () => { it('stays in the same tab if clicking again on current tab', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -147,7 +147,7 @@ describe('useTimelineTypes', () => { it('render timelineFilters', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -167,7 +167,7 @@ describe('useTimelineTypes', () => { it('set timelineTypes correctly', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, @@ -195,7 +195,7 @@ describe('useTimelineTypes', () => { it('stays in the same tab if clicking again on current tab', async () => { await act(async () => { const { result, waitForNextUpdate } = renderHook< - UseTimelineTypesArgs, + React.PropsWithChildren, UseTimelineTypesResult >(() => useTimelineTypes({ defaultTimelineCount: 0, templateTimelineCount: 3 }), { wrapper: TestProviders, diff --git a/x-pack/plugins/security_solution/public/timelines/components/row_renderers_browser/catalog/index.tsx b/x-pack/plugins/security_solution/public/timelines/components/row_renderers_browser/catalog/index.tsx index f236402fa925b..e52dc87ae7659 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/row_renderers_browser/catalog/index.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/row_renderers_browser/catalog/index.tsx @@ -46,7 +46,7 @@ export interface RowRendererOption { name: string; description: React.ReactNode; searchableDescription: string; - example: React.ReactNode; + example: React.ElementType; } export const renderers: RowRendererOption[] = [ diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/event_column_view.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/event_column_view.test.tsx index 21d74337c4aab..8b49c12eaf73c 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/event_column_view.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/events/event_column_view.test.tsx @@ -5,7 +5,7 @@ * 2.0. */ -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import React from 'react'; import { TestProviders } from '../../../../../common/mock'; @@ -124,7 +124,7 @@ describe('EventColumnView', () => { test('it does NOT render a notes button when isEventsViewer is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="add-note-button-mock"]').exists()).toBe(false); @@ -132,7 +132,7 @@ describe('EventColumnView', () => { test('it does NOT render a notes button when showNotes is false', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="add-note-button-mock"]').exists()).toBe(false); @@ -140,7 +140,7 @@ describe('EventColumnView', () => { test('it does NOT render a pin button when isEventViewer is true', () => { const wrapper = mount(, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, }); expect(wrapper.find('[data-test-subj="pin"]').exists()).toBe(false); @@ -154,7 +154,7 @@ describe('EventColumnView', () => { leadingControlColumns={[testLeadingControlColumn, ...leadingControlColumns]} />, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, } ); diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.test.tsx index 9674b9146ecb0..0c365ae42798d 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/body/index.test.tsx @@ -6,7 +6,7 @@ */ import React from 'react'; -import { mount } from 'enzyme'; +import { mount, type ComponentType as EnzymeComponentType } from 'enzyme'; import { waitFor } from '@testing-library/react'; import { useKibana, useCurrentUser } from '../../../../common/lib/kibana'; @@ -223,7 +223,7 @@ describe('Body', () => { store?: { store: ReturnType } ) => { const wrapper = mount(childrenComponent, { - wrappingComponent: TestProviders, + wrappingComponent: TestProviders as EnzymeComponentType<{}>, wrappingComponentProps: store ?? {}, }); await waitFor(() => wrapper.find('[data-test-subj="suricataRefs"]').exists()); diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/helpers.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/helpers.test.tsx index aa8e0ae5cdede..098ffd170a047 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/helpers.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/helpers.test.tsx @@ -25,7 +25,7 @@ const defaultProps: ComponentProps = { toolTip: 'Sample Tooltip', }; -const TestWrapper: React.FC = ({ children }) => { +const TestWrapper: React.FC> = ({ children }) => { return {children}; }; diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/use_notes_in_flyout.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/use_notes_in_flyout.test.tsx index 1ca417a3f27a3..32b5b8bc3c129 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/use_notes_in_flyout.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/properties/use_notes_in_flyout.test.tsx @@ -86,7 +86,7 @@ const refetchMock = jest.fn(); const renderTestHook = () => { return renderHook( - (props?: Partial) => + (props: React.PropsWithChildren>) => useNotesInFlyout({ eventIdToNoteIds: mockEventIdToNoteIds, timelineId: TimelineId.test, diff --git a/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs/query/query_tab_unified_components.test.tsx b/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs/query/query_tab_unified_components.test.tsx index 973e0626aacc2..bd8a002666aaf 100644 --- a/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs/query/query_tab_unified_components.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/components/timeline/tabs/query/query_tab_unified_components.test.tsx @@ -133,7 +133,7 @@ const mockState = { mockState.timeline.timelineById[TimelineId.test].columns = customColumnOrder; -const TestWrapper: FunctionComponent = ({ children }) => { +const TestWrapper: FunctionComponent> = ({ children }) => { return {children}; }; diff --git a/x-pack/plugins/security_solution/public/timelines/hooks/use_create_timeline.test.tsx b/x-pack/plugins/security_solution/public/timelines/hooks/use_create_timeline.test.tsx index 59a1936465d52..e8e2fe9dbbadf 100644 --- a/x-pack/plugins/security_solution/public/timelines/hooks/use_create_timeline.test.tsx +++ b/x-pack/plugins/security_solution/public/timelines/hooks/use_create_timeline.test.tsx @@ -44,7 +44,9 @@ describe('useCreateTimeline', () => { () => useCreateTimeline({ timelineId: TimelineId.test, timelineType: TimelineTypeEnum.default }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -61,7 +63,9 @@ describe('useCreateTimeline', () => { () => useCreateTimeline({ timelineId: TimelineId.test, timelineType: TimelineTypeEnum.default }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -105,7 +109,9 @@ describe('useCreateTimeline', () => { onClick, }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -123,7 +129,9 @@ describe('useCreateTimeline', () => { () => useCreateTimeline({ timelineId: TimelineId.test, timelineType: TimelineTypeEnum.default }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); @@ -144,7 +152,9 @@ describe('useCreateTimeline', () => { () => useCreateTimeline({ timelineId: TimelineId.test, timelineType: TimelineTypeEnum.default }), { - wrapper: ({ children }) => {children}, + wrapper: ({ children }: React.PropsWithChildren<{}>) => ( + {children} + ), } ); diff --git a/x-pack/plugins/spaces/public/management/components/section_panel/section_panel.tsx b/x-pack/plugins/spaces/public/management/components/section_panel/section_panel.tsx index 8024df2d6e85f..0842638ad58e1 100644 --- a/x-pack/plugins/spaces/public/management/components/section_panel/section_panel.tsx +++ b/x-pack/plugins/spaces/public/management/components/section_panel/section_panel.tsx @@ -16,7 +16,7 @@ interface Props { dataTestSubj?: string; } -export class SectionPanel extends Component { +export class SectionPanel extends Component, {}> { public render() { return ( diff --git a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_get_query_delay_setting.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_get_query_delay_setting.test.tsx index c4e3ec261e6e3..4b65e355b9c86 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_get_query_delay_setting.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_get_query_delay_setting.test.tsx @@ -23,7 +23,7 @@ const queryClient = new QueryClient({ }, }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rule_aggregations.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rule_aggregations.test.tsx index 6ea281765496f..c0e143119f6fa 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rule_aggregations.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rule_aggregations.test.tsx @@ -32,7 +32,7 @@ const queryClient = new QueryClient({ }, }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rules.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rules.test.tsx index 1a2c07eaaa9cf..8cc07c87e2411 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rules.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_rules.test.tsx @@ -36,7 +36,7 @@ const queryClient = new QueryClient({ }, }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_tags_query.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_tags_query.test.tsx index bb2dab67c0d4e..081538d1432ef 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_tags_query.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_load_tags_query.test.tsx @@ -30,7 +30,7 @@ const queryClient = new QueryClient({ }, }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_update_rules_settings.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_update_rules_settings.test.tsx index e431a4c2cf7aa..c5f61885adddc 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_update_rules_settings.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/hooks/use_update_rules_settings.test.tsx @@ -48,7 +48,7 @@ const queryClient = new QueryClient({ }, }, }); -const wrapper = ({ children }: { children: Node }) => ( +const wrapper = ({ children }: { children: React.ReactNode }) => ( {children} ); diff --git a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_table/hooks/use_columns/use_columns.test.tsx b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_table/hooks/use_columns/use_columns.test.tsx index 18db63c44234e..fb79f87162bcb 100644 --- a/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_table/hooks/use_columns/use_columns.test.tsx +++ b/x-pack/plugins/triggers_actions_ui/public/application/sections/alerts_table/hooks/use_columns/use_columns.test.tsx @@ -39,7 +39,7 @@ const mockStorage = { const queryClient = new QueryClient(testQueryClientConfig); -const wrapper: FunctionComponent = ({ children }) => ( +const wrapper: FunctionComponent> = ({ children }) => ( {children} @@ -151,7 +151,10 @@ describe('useColumns', () => { test('onColumnResize', async () => { const localDefaultColumns = [...defaultColumns]; const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(localDefaultColumns); - const { result, rerender } = renderHook( + const { result, rerender } = renderHook< + React.PropsWithChildren, + UseColumnsResp + >( () => useColumns({ defaultColumns, @@ -183,7 +186,7 @@ describe('useColumns', () => { test('check if initial width for the last column does not exist', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -208,7 +211,7 @@ describe('useColumns', () => { const alertsFields = { testField: { name: 'testField', type: 'string', searchable: true, aggregatable: true }, }; - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ alertsFields, @@ -228,7 +231,7 @@ describe('useColumns', () => { describe('visibleColumns', () => { test('hide all columns with onChangeVisibleColumns', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -250,7 +253,7 @@ describe('useColumns', () => { test('show all columns with onChangeVisibleColumns', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -279,7 +282,7 @@ describe('useColumns', () => { test('should populate visibleColumns correctly', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -297,7 +300,10 @@ describe('useColumns', () => { test('should change visibleColumns if provided defaultColumns change', async () => { let localDefaultColumns = [...defaultColumns]; let localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(localDefaultColumns); - const { result, rerender } = renderHook( + const { result, rerender } = renderHook< + React.PropsWithChildren, + UseColumnsResp + >( () => useColumns({ defaultColumns: localDefaultColumns, @@ -334,7 +340,10 @@ describe('useColumns', () => { describe('columns', () => { test('should changes the column list when defaultColumns has been updated', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result, waitFor } = renderHook( + const { result, waitFor } = renderHook< + React.PropsWithChildren, + UseColumnsResp + >( () => useColumns({ defaultColumns, @@ -353,7 +362,7 @@ describe('useColumns', () => { describe('onToggleColumns', () => { test('should update the list of columns when on Toggle Columns is called', () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -374,7 +383,7 @@ describe('useColumns', () => { test('should update the list of visible columns when onToggleColumn is called', async () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -403,7 +412,7 @@ describe('useColumns', () => { test('should update the column details in the storage when onToggleColumn is called', () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns, @@ -436,7 +445,7 @@ describe('useColumns', () => { describe('onResetColumns', () => { test('should restore visible columns defaults', () => { const localStorageAlertsTable = getStorageAlertsTableByDefaultColumns(defaultColumns); - const { result } = renderHook( + const { result } = renderHook, UseColumnsResp>( () => useColumns({ defaultColumns,