diff --git a/eslint.config.mjs b/eslint.config.mjs index d31d9a2dc6f563..a2573f86755cbc 100644 --- a/eslint.config.mjs +++ b/eslint.config.mjs @@ -446,6 +446,7 @@ export default typescript.config([ plugins: {'@sentry': sentryPlugin}, rules: { '@sentry/no-static-translations': 'error', + '@sentry/no-renderHook-arrow-function': 'error', }, }, { diff --git a/static/app/actionCreators/savedSearches.spec.tsx b/static/app/actionCreators/savedSearches.spec.tsx index 4781c141f9dabb..f2d830f2ab7292 100644 --- a/static/app/actionCreators/savedSearches.spec.tsx +++ b/static/app/actionCreators/savedSearches.spec.tsx @@ -35,14 +35,13 @@ describe('useFetchRecentSearches', () => { ], }); - const {result} = renderHookWithProviders( - () => - useFetchRecentSearches({ - savedSearchType: SavedSearchType.TRACEMETRIC, - namespace, - }), - {organization} - ); + const {result} = renderHookWithProviders(useFetchRecentSearches, { + organization, + initialProps: { + savedSearchType: SavedSearchType.TRACEMETRIC, + namespace, + }, + }); await waitFor(() => expect(result.current.isSuccess).toBe(true)); diff --git a/static/app/bootstrap/boostrapRequests.spec.tsx b/static/app/bootstrap/boostrapRequests.spec.tsx index 513364952825a0..81e6946a43d16d 100644 --- a/static/app/bootstrap/boostrapRequests.spec.tsx +++ b/static/app/bootstrap/boostrapRequests.spec.tsx @@ -49,7 +49,10 @@ describe('useBootstrapOrganizationQuery', () => { query: {detailed: 0, include_feature_flags: 1}, }); - const {result} = renderHook(() => useBootstrapOrganizationQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapOrganizationQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.data).toBeDefined()); expect(JSON.stringify(OrganizationStore.get().organization)).toEqual( @@ -64,7 +67,10 @@ describe('useBootstrapOrganizationQuery', () => { body: {}, }); - const {result} = renderHook(() => useBootstrapOrganizationQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapOrganizationQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.error).toBeDefined()); expect(OrganizationStore.get().organization).toBeNull(); @@ -75,7 +81,10 @@ describe('useBootstrapOrganizationQuery', () => { }); it('does not fetch when orgSlug is null', () => { - const {result} = renderHook(() => useBootstrapOrganizationQuery(null), {wrapper}); + const {result} = renderHook(useBootstrapOrganizationQuery, { + wrapper, + initialProps: null, + }); expect(result.current.data).toBeUndefined(); }); @@ -84,7 +93,10 @@ describe('useBootstrapOrganizationQuery', () => { orgSlug: org.slug, organization: Promise.resolve>([org, undefined, undefined]), }; - const {result} = renderHook(() => useBootstrapOrganizationQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapOrganizationQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.data).toBeDefined()); expect(window.__sentry_preload?.organization).toBeUndefined(); }); @@ -105,7 +117,10 @@ describe('useBootstrapOrganizationQuery', () => { query: {detailed: 0, include_feature_flags: 1}, }); - const {result} = renderHook(() => useBootstrapOrganizationQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapOrganizationQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.data).toBeDefined()); expect(JSON.stringify(OrganizationStore.get().organization?.features)).toEqual( JSON.stringify(['enable-issues']) @@ -141,7 +156,7 @@ describe('useBootstrapTeamsQuery', () => { }, }); - const {result} = renderHook(() => useBootstrapTeamsQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapTeamsQuery, {wrapper, initialProps: orgSlug}); await waitFor(() => expect(result.current.data).toBeDefined()); expect(TeamStore.getState().teams).toEqual(mockTeams); @@ -154,14 +169,14 @@ describe('useBootstrapTeamsQuery', () => { statusCode: 500, }); - const {result} = renderHook(() => useBootstrapTeamsQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapTeamsQuery, {wrapper, initialProps: orgSlug}); await waitFor(() => expect(result.current.error).toBeDefined()); expect(TeamStore.getState().teams).toEqual([]); }); it('does not fetch when orgSlug is null', () => { - const {result} = renderHook(() => useBootstrapTeamsQuery(null), {wrapper}); + const {result} = renderHook(useBootstrapTeamsQuery, {wrapper, initialProps: null}); expect(result.current.data).toBeUndefined(); }); }); @@ -186,7 +201,10 @@ describe('useBootstrapProjectsQuery', () => { }, }); - const {result} = renderHook(() => useBootstrapProjectsQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapProjectsQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.data).toBeDefined()); expect(ProjectsStore.getState().projects).toEqual(mockProjects); @@ -198,14 +216,17 @@ describe('useBootstrapProjectsQuery', () => { statusCode: 500, }); - const {result} = renderHook(() => useBootstrapProjectsQuery(orgSlug), {wrapper}); + const {result} = renderHook(useBootstrapProjectsQuery, { + wrapper, + initialProps: orgSlug, + }); await waitFor(() => expect(result.current.error).toBeDefined()); expect(ProjectsStore.getState().projects).toEqual([]); }); it('does not fetch when orgSlug is null', () => { - const {result} = renderHook(() => useBootstrapProjectsQuery(null), {wrapper}); + const {result} = renderHook(useBootstrapProjectsQuery, {wrapper, initialProps: null}); expect(result.current.data).toBeUndefined(); }); }); diff --git a/static/app/components/acl/useRole.spec.tsx b/static/app/components/acl/useRole.spec.tsx index 9b1f7d67ff2b8c..0fb0387580c145 100644 --- a/static/app/components/acl/useRole.spec.tsx +++ b/static/app/components/acl/useRole.spec.tsx @@ -24,8 +24,9 @@ describe('useRole', () => { }); it('has a sufficient role', () => { - const {result} = renderHookWithProviders(() => useRole({role: 'attachmentsRole'}), { + const {result} = renderHookWithProviders(useRole, { organization, + initialProps: {role: 'attachmentsRole'}, }); expect(result.current.hasRole).toBe(true); expect(result.current.roleRequired).toBe('admin'); @@ -37,8 +38,9 @@ describe('useRole', () => { orgRole: 'member', }); OrganizationStore.onUpdate(org, {replace: true}); - const {result} = renderHookWithProviders(() => useRole({role: 'attachmentsRole'}), { + const {result} = renderHookWithProviders(useRole, { organization: org, + initialProps: {role: 'attachmentsRole'}, }); expect(result.current.hasRole).toBe(false); }); @@ -50,8 +52,9 @@ describe('useRole', () => { access: ['org:superuser'], }); OrganizationStore.onUpdate(org, {replace: true}); - const {result} = renderHookWithProviders(() => useRole({role: 'attachmentsRole'}), { + const {result} = renderHookWithProviders(useRole, { organization: org, + initialProps: {role: 'attachmentsRole'}, }); expect(result.current.hasRole).toBe(true); }); @@ -59,8 +62,9 @@ describe('useRole', () => { it('handles no organization.orgRoleList', () => { const org = {...organization, orgRoleList: []}; OrganizationStore.onUpdate(org, {replace: true}); - const {result} = renderHookWithProviders(() => useRole({role: 'attachmentsRole'}), { + const {result} = renderHookWithProviders(useRole, { organization: org, + initialProps: {role: 'attachmentsRole'}, }); expect(result.current.hasRole).toBe(false); }); diff --git a/static/app/components/charts/useChartXRangeSelection.spec.tsx b/static/app/components/charts/useChartXRangeSelection.spec.tsx index 51ae3dd2d2c048..d14bbdebd411cd 100644 --- a/static/app/components/charts/useChartXRangeSelection.spec.tsx +++ b/static/app/components/charts/useChartXRangeSelection.spec.tsx @@ -40,23 +40,23 @@ describe('useChartXRangeSelection', () => { describe('initial state', () => { it('should return brush configuration when not disabled', () => { - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, - }) - ); + }, + }); expect(result.current.brush).toBeDefined(); expect(result.current.toolBox).toBeDefined(); }); it('should return undefined brush when disabled', () => { - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, disabled: true, - }) - ); + }, + }); expect(result.current.brush).toBeUndefined(); expect(result.current.toolBox).toBeUndefined(); @@ -67,12 +67,12 @@ describe('useChartXRangeSelection', () => { it('should hide tooltip when brush starts', () => { const onSelectionStart = jest.fn(); - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onSelectionStart, - }) - ); + }, + }); act(() => { result.current.onBrushStart({} as any, mockChartInstance); @@ -88,12 +88,12 @@ describe('useChartXRangeSelection', () => { const disconnectSpy = jest.fn(); jest.spyOn(require('echarts'), 'disconnect').mockImplementation(disconnectSpy); - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, chartsGroupName: 'test-group', - }) - ); + }, + }); act(() => { result.current.onBrushStart({} as any, mockChartInstance); @@ -144,12 +144,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onSelectionEnd, - }) - ); + }, + }); const mockEvent = { areas: [ @@ -213,12 +213,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onSelectionEnd, - }) - ); + }, + }); const mockEvent = { areas: [ @@ -276,12 +276,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, chartsGroupName: 'test-group', - }) - ); + }, + }); const mockEvent = { areas: [{coordRange: [10, 90], panelId: 'test-panel-id'}], @@ -328,12 +328,12 @@ describe('useChartXRangeSelection', () => {
Action Menu
)); - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, actionMenuRenderer, - }) - ); + }, + }); act(() => { result.current.onBrushEnd( @@ -390,14 +390,14 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, actionMenuRenderer: _params => (
Action Menu
), - }) - ); + }, + }); act(() => { result.current.onBrushEnd( @@ -423,11 +423,11 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - renderHook(() => - useChartXRangeSelection({ + renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, - }) - ); + }, + }); await waitFor(() => { expect(mockEchartsInstance.dispatchAction).toHaveBeenCalledWith({ @@ -508,12 +508,12 @@ describe('useChartXRangeSelection', () => { panelId: 'initial-panel-id', }; - renderHook(() => - useChartXRangeSelection({ + renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, initialSelection, - }) - ); + }, + }); await waitFor(() => { expect(mockEchartsInstance.dispatchAction).toHaveBeenCalledWith({ @@ -713,12 +713,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onInsideSelectionClick, - }) - ); + }, + }); // Create a selection first act(() => { @@ -794,12 +794,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onOutsideSelectionClick, - }) - ); + }, + }); // Create a selection first act(() => { @@ -873,12 +873,12 @@ describe('useChartXRangeSelection', () => { getEchartsInstance: () => mockEchartsInstance, } as unknown as EChartsReact; - const {result} = renderHook(() => - useChartXRangeSelection({ + const {result} = renderHook(useChartXRangeSelection, { + initialProps: { chartRef: mockChartRef, onOutsideSelectionClick, - }) - ); + }, + }); // Create a selection first act(() => { diff --git a/static/app/components/core/layout/styles.spec.tsx b/static/app/components/core/layout/styles.spec.tsx index 3160381d7dac8c..84086f584b7e9d 100644 --- a/static/app/components/core/layout/styles.spec.tsx +++ b/static/app/components/core/layout/styles.spec.tsx @@ -59,8 +59,9 @@ const setupMediaQueries = ( describe('useResponsivePropValue', () => { it('returns identity for non-responsive values', () => { - const {result} = renderHook(() => useResponsivePropValue('hello'), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: 'hello', }); expect(result.current).toBe('hello'); @@ -80,8 +81,9 @@ describe('useResponsivePropValue', () => { md: 'medium', }; - const {result} = renderHook(() => useResponsivePropValue(responsiveValue), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: responsiveValue, }); expect(result.current).toBe('medium'); @@ -100,8 +102,9 @@ describe('useResponsivePropValue', () => { md: 'medium', }; - const {result} = renderHook(() => useResponsivePropValue(responsiveValue), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: responsiveValue, }); expect(result.current).toBe('medium'); @@ -118,8 +121,9 @@ describe('useResponsivePropValue', () => { sm: 'small', }; - const {result} = renderHook(() => useResponsivePropValue(responsiveValue), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: responsiveValue, }); expect(result.current).toBe('small'); @@ -139,8 +143,9 @@ describe('useResponsivePropValue', () => { lg: 'large', }; - const {result} = renderHook(() => useResponsivePropValue(responsiveValue), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: responsiveValue, }); expect(result.current).toBe('small'); @@ -160,8 +165,9 @@ describe('useResponsivePropValue', () => { lg: undefined, }; - const {result} = renderHook(() => useResponsivePropValue(responsiveValue), { + const {result} = renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: responsiveValue, }); expect(result.current).toBe('medium'); @@ -170,8 +176,9 @@ describe('useResponsivePropValue', () => { it('throws an error when no breakpoints are defined in responsive prop', () => { expect(() => - renderHook(() => useResponsivePropValue({}), { + renderHook(useResponsivePropValue, { wrapper: createWrapper(), + initialProps: {}, }) ).toThrow('Responsive prop must contain at least one breakpoint'); }); @@ -190,7 +197,7 @@ describe('useActiveBreakpoint', () => { xl: false, }); - const {result} = renderHook(() => useActiveBreakpoint(), { + const {result} = renderHook(useActiveBreakpoint, { wrapper: createWrapper(), }); @@ -207,7 +214,7 @@ describe('useActiveBreakpoint', () => { xl: false, }); - const {result} = renderHook(() => useActiveBreakpoint(), { + const {result} = renderHook(useActiveBreakpoint, { wrapper: createWrapper(), }); @@ -219,7 +226,7 @@ describe('useActiveBreakpoint', () => { const matchMediaSpy = jest.fn(() => mockMatchMedia(false)); window.matchMedia = matchMediaSpy; - renderHook(() => useActiveBreakpoint(), { + renderHook(useActiveBreakpoint, { wrapper: createWrapper(), }); @@ -244,7 +251,7 @@ describe('useActiveBreakpoint', () => { xl: true, }); - const {result} = renderHook(() => useActiveBreakpoint(), { + const {result} = renderHook(useActiveBreakpoint, { wrapper: createWrapper(), }); @@ -285,12 +292,10 @@ describe('useActiveBreakpoint', () => { return mockQuery; }); - const {result} = renderHook( - () => useResponsivePropValue({xs: 'small', md: 'medium', lg: 'large'}), - { - wrapper: createWrapper(), - } - ); + const {result} = renderHook(useResponsivePropValue, { + wrapper: createWrapper(), + initialProps: {xs: 'small', md: 'medium', lg: 'large'}, + }); // Initially query matches 'medium' expect(result.current).toBe('medium'); @@ -336,12 +341,10 @@ describe('useActiveBreakpoint', () => { dispatchEvent: jest.fn(), })); - const {unmount} = renderHook( - () => useResponsivePropValue({xs: 'small', md: 'medium'}), - { - wrapper: createWrapper(), - } - ); + const {unmount} = renderHook(useResponsivePropValue, { + wrapper: createWrapper(), + initialProps: {xs: 'small', md: 'medium'}, + }); // Sets up listeners for all breakpoints expect(addEventListener).toHaveBeenCalledTimes(Object.keys(theme.breakpoints).length); diff --git a/static/app/components/core/renderToString.spec.tsx b/static/app/components/core/renderToString.spec.tsx index afb90abceb61e9..1ea59650557072 100644 --- a/static/app/components/core/renderToString.spec.tsx +++ b/static/app/components/core/renderToString.spec.tsx @@ -15,7 +15,7 @@ describe('renderToString', () => { return
Hello, World!
; } - const {result} = renderHook(() => useRenderToString()); + const {result} = renderHook(useRenderToString); const string = await act(() => result.current()); @@ -26,7 +26,7 @@ describe('renderToString', () => { return SuccessTag; } - const {result} = renderHook(() => useRenderToString(), { + const {result} = renderHook(useRenderToString, { wrapper: ({children}) => {children}, }); diff --git a/static/app/components/onboarding/useMutateOnboardingTasks.spec.tsx b/static/app/components/onboarding/useMutateOnboardingTasks.spec.tsx index 0664b765e0f89c..61457452b2b256 100644 --- a/static/app/components/onboarding/useMutateOnboardingTasks.spec.tsx +++ b/static/app/components/onboarding/useMutateOnboardingTasks.spec.tsx @@ -29,7 +29,7 @@ describe('useMutateOnboardingTasks', () => { body: testTask, }); - const {result} = renderHookWithProviders(() => useMutateOnboardingTasks(), { + const {result} = renderHookWithProviders(useMutateOnboardingTasks, { organization, }); diff --git a/static/app/components/prevent/summary.spec.tsx b/static/app/components/prevent/summary.spec.tsx index f70ca212aaaea4..0915c583aa4921 100644 --- a/static/app/components/prevent/summary.spec.tsx +++ b/static/app/components/prevent/summary.spec.tsx @@ -17,16 +17,18 @@ function createWrapper(initialEntries: string) { describe('useCreateSummaryFilterLink', () => { describe('when the filter is not applied', () => { it('returns isFiltered as false', () => { - const {result} = renderHook(() => useCreateSummaryFilterLink('slowestTests'), { + const {result} = renderHook(useCreateSummaryFilterLink, { wrapper: createWrapper('/'), + initialProps: 'slowestTests', }); expect(result.current.isFiltered).toBeFalsy(); }); it('returns the link with search param', () => { - const {result} = renderHook(() => useCreateSummaryFilterLink('slowestTests'), { + const {result} = renderHook(useCreateSummaryFilterLink, { wrapper: createWrapper('/'), + initialProps: 'slowestTests', }); expect(result.current.filterLink).toEqual( @@ -37,16 +39,18 @@ describe('useCreateSummaryFilterLink', () => { describe('when the filter is applied', () => { it('returns isFiltered as true', () => { - const {result} = renderHook(() => useCreateSummaryFilterLink('slowestTests'), { + const {result} = renderHook(useCreateSummaryFilterLink, { wrapper: createWrapper('/?filterBy=slowestTests'), + initialProps: 'slowestTests', }); expect(result.current.isFiltered).toBeTruthy(); }); it('returns the link without search param', () => { - const {result} = renderHook(() => useCreateSummaryFilterLink('slowestTests'), { + const {result} = renderHook(useCreateSummaryFilterLink, { wrapper: createWrapper('/?filterBy=slowestTests'), + initialProps: 'slowestTests', }); expect(result.current.filterLink).toEqual(expect.objectContaining({query: {}})); diff --git a/static/app/components/prevent/virtualRenderers/useIsOverflowing.spec.tsx b/static/app/components/prevent/virtualRenderers/useIsOverflowing.spec.tsx index c8c71a1dba834a..c062a176572dc9 100644 --- a/static/app/components/prevent/virtualRenderers/useIsOverflowing.spec.tsx +++ b/static/app/components/prevent/virtualRenderers/useIsOverflowing.spec.tsx @@ -35,7 +35,7 @@ global.window.ResizeObserver = ResizeObserverMock; describe('useIsOverflowing', () => { describe('ref is null', () => { it('returns false if the ref is null', () => { - const {result} = renderHook(() => useIsOverflowing({current: null})); + const {result} = renderHook(useIsOverflowing, {initialProps: {current: null}}); expect(result.current).toBe(false); }); }); @@ -49,7 +49,7 @@ describe('useIsOverflowing', () => { it('returns false', () => { // @ts-expect-error - testing ref not being null - const {result} = renderHook(() => useIsOverflowing({current: {}})); + const {result} = renderHook(useIsOverflowing, {initialProps: {current: {}}}); expect(result.current).toBe(false); }); }); @@ -62,7 +62,7 @@ describe('useIsOverflowing', () => { it('returns true', () => { // @ts-expect-error - testing ref not being null - const {result} = renderHook(() => useIsOverflowing({current: {}})); + const {result} = renderHook(useIsOverflowing, {initialProps: {current: {}}}); expect(result.current).toBe(true); }); }); diff --git a/static/app/components/prevent/virtualRenderers/useSyncScrollMargin.spec.ts b/static/app/components/prevent/virtualRenderers/useSyncScrollMargin.spec.ts index c4c53e4cc81e4f..6b5fcd2456c0bc 100644 --- a/static/app/components/prevent/virtualRenderers/useSyncScrollMargin.spec.ts +++ b/static/app/components/prevent/virtualRenderers/useSyncScrollMargin.spec.ts @@ -24,7 +24,7 @@ global.window.ResizeObserver = ResizeObserverMock; describe('useSyncScrollMargin', () => { describe('overlayRef is null', () => { it('returns undefined', () => { - const {result} = renderHook(() => useSyncScrollMargin({current: null})); + const {result} = renderHook(useSyncScrollMargin, {initialProps: {current: null}}); expect(result.current).toBeUndefined(); }); @@ -32,9 +32,9 @@ describe('useSyncScrollMargin', () => { describe('overlayRef is set', () => { it('returns the scroll margin', () => { - const {result} = renderHook(() => - useSyncScrollMargin({current: {} as HTMLDivElement}) - ); + const {result} = renderHook(useSyncScrollMargin, { + initialProps: {current: {} as HTMLDivElement}, + }); expect(result.current).toBe(100); }); diff --git a/static/app/components/prevent/virtualRenderers/useSyncWrapperWidth.spec.ts b/static/app/components/prevent/virtualRenderers/useSyncWrapperWidth.spec.ts index 5e5eeef72f5db7..5fe10b8a31f55e 100644 --- a/static/app/components/prevent/virtualRenderers/useSyncWrapperWidth.spec.ts +++ b/static/app/components/prevent/virtualRenderers/useSyncWrapperWidth.spec.ts @@ -24,7 +24,7 @@ global.window.ResizeObserver = ResizeObserverMock; describe('useSyncWrapperWidth', () => { describe('wrapperRefState is null', () => { it('returns the wrapper width as 100%', () => { - const {result} = renderHook(() => useSyncWrapperWidth()); + const {result} = renderHook(useSyncWrapperWidth); expect(result.current.wrapperWidth).toBe('100%'); }); @@ -32,7 +32,7 @@ describe('useSyncWrapperWidth', () => { describe('wrapperRefState is set', () => { it('returns the wrapper width from the ResizeObserver entry', () => { - const {result} = renderHook(() => useSyncWrapperWidth()); + const {result} = renderHook(useSyncWrapperWidth); act(() => { result.current.setWrapperRefState({} as HTMLDivElement); diff --git a/static/app/components/replays/replayLiveIndicator.spec.tsx b/static/app/components/replays/replayLiveIndicator.spec.tsx index 25e21426dd50d6..f9b9db07d410de 100644 --- a/static/app/components/replays/replayLiveIndicator.spec.tsx +++ b/static/app/components/replays/replayLiveIndicator.spec.tsx @@ -28,12 +28,12 @@ describe('useLiveBadge', () => { const startedAt = new Date(now - 60_000); // 1 minute ago const finishedAt = new Date(now); // just now - const {result} = renderHook(() => - useLiveBadge({ + const {result} = renderHook(useLiveBadge, { + initialProps: { startedAt, finishedAt, - }) - ); + }, + }); expect(result.current.isLive).toBe(true); }); @@ -43,12 +43,12 @@ describe('useLiveBadge', () => { const startedAt = new Date(now - 10 * 60_000); // 10 minutes ago const finishedAt = new Date(now - 6 * 60_000); // 6 minutes ago (more than 5 min threshold) - const {result} = renderHook(() => - useLiveBadge({ + const {result} = renderHook(useLiveBadge, { + initialProps: { startedAt, finishedAt, - }) - ); + }, + }); expect(result.current.isLive).toBe(false); }); @@ -58,12 +58,12 @@ describe('useLiveBadge', () => { const startedAt = new Date(now - 2 * 60 * 60_000); // 2 hours ago const finishedAt = new Date(now); // just now - const {result} = renderHook(() => - useLiveBadge({ + const {result} = renderHook(useLiveBadge, { + initialProps: { startedAt, finishedAt, - }) - ); + }, + }); expect(result.current.isLive).toBe(false); }); @@ -73,12 +73,12 @@ describe('useLiveBadge', () => { const startedAt = new Date(now - 60_000); // 1 minute ago const finishedAt = new Date(now); // just now - const {result} = renderHook(() => - useLiveBadge({ + const {result} = renderHook(useLiveBadge, { + initialProps: { startedAt, finishedAt, - }) - ); + }, + }); expect(result.current.isLive).toBe(true); @@ -94,12 +94,12 @@ describe('useLiveBadge', () => { const now = Date.now(); const startedAt = new Date(now - 60_000); - const {result} = renderHook(() => - useLiveBadge({ + const {result} = renderHook(useLiveBadge, { + initialProps: { startedAt, finishedAt: null, - }) - ); + }, + }); expect(result.current.isLive).toBe(false); }); @@ -124,8 +124,9 @@ describe('useLiveRefresh', () => { }); it('should not show refresh button when replay is undefined', () => { - const {result} = renderHook(() => useLiveRefresh({replay: undefined}), { + const {result} = renderHook(useLiveRefresh, { wrapper: createWrapper(), + initialProps: {replay: undefined}, }); expect(result.current.shouldShowRefreshButton).toBe(false); @@ -142,8 +143,9 @@ describe('useLiveRefresh', () => { body: {data: replay}, }); - const {result} = renderHook(() => useLiveRefresh({replay}), { + const {result} = renderHook(useLiveRefresh, { wrapper: createWrapper(), + initialProps: {replay}, }); // Initial state - no refresh button since polled and current are equal @@ -168,8 +170,9 @@ describe('useLiveRefresh', () => { body: {data: updatedReplay}, }); - const {result} = renderHook(() => useLiveRefresh({replay}), { + const {result} = renderHook(useLiveRefresh, { wrapper: createWrapper(), + initialProps: {replay}, }); // Wait for the API call to complete and state to update @@ -190,8 +193,9 @@ describe('useLiveRefresh', () => { body: {data: {...replay, count_segments: 10}}, }); - renderHook(() => useLiveRefresh({replay}), { + renderHook(useLiveRefresh, { wrapper: createWrapper(), + initialProps: {replay}, }); // Advance time past polling interval @@ -215,8 +219,9 @@ describe('useLiveRefresh', () => { body: {data: replay}, }); - const {result} = renderHook(() => useLiveRefresh({replay}), { + const {result} = renderHook(useLiveRefresh, { wrapper: createWrapper(), + initialProps: {replay}, }); result.current.doRefresh(); diff --git a/static/app/components/searchQueryBuilder/hooks.spec.tsx b/static/app/components/searchQueryBuilder/hooks.spec.tsx index 69675522c17516..2da9320ab6be03 100644 --- a/static/app/components/searchQueryBuilder/hooks.spec.tsx +++ b/static/app/components/searchQueryBuilder/hooks.spec.tsx @@ -4,30 +4,24 @@ import {useCaseInsensitivity} from 'sentry/components/searchQueryBuilder/hooks'; describe('useCaseSensitivity', () => { it('should return the correct case sensitivity', () => { - const {result: noCaseSensitivity} = renderHookWithProviders(() => - useCaseInsensitivity() - ); + const {result: noCaseSensitivity} = renderHookWithProviders(useCaseInsensitivity); expect(noCaseSensitivity.current[0]).toBeNull(); - const {result: caseSensitivityFalse} = renderHookWithProviders( - () => useCaseInsensitivity(), - { - initialRouterConfig: { - location: {pathname: '/', query: {}}, - }, - } - ); + const {result: caseSensitivityFalse} = renderHookWithProviders(useCaseInsensitivity, { + initialRouterConfig: { + location: {pathname: '/', query: {}}, + }, + }); expect(caseSensitivityFalse.current[0]).toBeNull(); - const {result: caseSensitivityTrue} = renderHookWithProviders( - () => useCaseInsensitivity(), - {initialRouterConfig: {location: {pathname: '/', query: {caseInsensitive: '1'}}}} - ); + const {result: caseSensitivityTrue} = renderHookWithProviders(useCaseInsensitivity, { + initialRouterConfig: {location: {pathname: '/', query: {caseInsensitive: '1'}}}, + }); expect(caseSensitivityTrue.current[0]).toBe(true); }); it('should set the case sensitivity', async () => { - const {router, result} = renderHookWithProviders(() => useCaseInsensitivity()); + const {router, result} = renderHookWithProviders(useCaseInsensitivity); expect(router.location.query.caseInsensitive).toBeUndefined(); diff --git a/static/app/components/tours/tourContext.spec.tsx b/static/app/components/tours/tourContext.spec.tsx index cf75fbc8e07297..b2b15b996847cb 100644 --- a/static/app/components/tours/tourContext.spec.tsx +++ b/static/app/components/tours/tourContext.spec.tsx @@ -13,7 +13,7 @@ describe('useTourReducer', () => { orderedStepIds: ORDERED_TEST_TOUR, }; function registerAllSteps() { - const {result} = renderHook(() => useTourReducer(initialState, {})); + const {result} = renderHook(useTourReducer, {initialProps: initialState}); const {handleStepRegistration} = result.current; act(() => { ORDERED_TEST_TOUR.forEach(stepId => handleStepRegistration({id: stepId})); @@ -22,7 +22,7 @@ describe('useTourReducer', () => { } it('handles step registration correctly', () => { - const {result} = renderHook(() => useTourReducer(initialState, {})); + const {result} = renderHook(useTourReducer, {initialProps: initialState}); const {handleStepRegistration} = result.current; let unregister = () => {}; // Should be false before any steps are registered diff --git a/static/app/components/tours/tourContext.tsx b/static/app/components/tours/tourContext.tsx index 869c88778af87c..1dcc84fa276c42 100644 --- a/static/app/components/tours/tourContext.tsx +++ b/static/app/components/tours/tourContext.tsx @@ -170,7 +170,7 @@ function tourReducer( export function useTourReducer( initialState: TourState, - options: TourOptions + options?: TourOptions ): TourContextType { const {orderedStepIds} = initialState; diff --git a/static/app/components/workflowEngine/form/useFormField.spec.tsx b/static/app/components/workflowEngine/form/useFormField.spec.tsx index f19810054a4777..bf50034b576e05 100644 --- a/static/app/components/workflowEngine/form/useFormField.spec.tsx +++ b/static/app/components/workflowEngine/form/useFormField.spec.tsx @@ -19,8 +19,9 @@ describe('useFormField', () => { it('returns field values and handles updates correctly', () => { model.setInitialData({targetField: 'initial', otherField: 'other'}); - const {result} = renderHook(() => useFormField('targetField'), { + const {result} = renderHook(useFormField, { wrapper: withFormContext, + initialProps: 'targetField', }); expect(result.current).toBe('initial'); @@ -37,14 +38,16 @@ describe('useFormField', () => { }); it('handles undefined values and type parameters', () => { - const {result: undefinedResult} = renderHook(() => useFormField('nonexistent'), { + const {result: undefinedResult} = renderHook(useFormField, { wrapper: withFormContext, + initialProps: 'nonexistent', }); expect(undefinedResult.current).toBe(''); model.setInitialData({numberField: 42}); - const {result: typedResult} = renderHook(() => useFormField('numberField'), { + const {result: typedResult} = renderHook(useFormField, { wrapper: withFormContext, + initialProps: 'numberField', }); expect(typedResult.current).toBe(42); expect(typeof typedResult.current).toBe('number'); @@ -52,8 +55,9 @@ describe('useFormField', () => { it('handles fields that are added after subscription', () => { // Start with a hook subscribed to a field that doesn't exist yet - const {result} = renderHook(() => useFormField('laterField'), { + const {result} = renderHook(useFormField, { wrapper: withFormContext, + initialProps: 'laterField', }); // Initially should return empty string for non-existent field @@ -78,8 +82,9 @@ describe('useFormField', () => { it('handles fields that are removed after subscription', () => { model.setInitialData({targetField: 'initial'}); - const {result} = renderHook(() => useFormField('targetField'), { + const {result} = renderHook(useFormField, { wrapper: withFormContext, + initialProps: 'targetField', }); expect(result.current).toBe('initial'); diff --git a/static/app/utils/api/apiOptions.spec.tsx b/static/app/utils/api/apiOptions.spec.tsx index 215b566aa7513b..dc92a03f39147e 100644 --- a/static/app/utils/api/apiOptions.spec.tsx +++ b/static/app/utils/api/apiOptions.spec.tsx @@ -88,7 +88,8 @@ describe('apiOptions', () => { body: ['Project 1', 'Project 2'], }); - const {result} = renderHook(() => useQuery(options), {wrapper}); + // @ts-expect-error initialProps is not typed correctly + const {result} = renderHook(useQuery, {wrapper, initialProps: options}); await waitFor(() => result.current.isSuccess); @@ -109,11 +110,11 @@ describe('apiOptions', () => { }, }); - const {result} = renderHook( - () => - useQuery({...options, select: selectWithHeaders(['Link', 'X-Hits'] as const)}), - {wrapper} - ); + const {result} = renderHook(useQuery, { + wrapper, + // @ts-expect-error select is not typed correctly + initialProps: {...options, select: selectWithHeaders(['Link', 'X-Hits'] as const)}, + }); await waitFor(() => result.current.isSuccess); @@ -122,7 +123,7 @@ describe('apiOptions', () => { headers: {Link: 'my-link', 'X-Hits': 'some-hits'}, }); - // headers should be narrowly typed + // @ts-expect-error headers should be narrowly typed expectTypeOf(result.current.data!.headers).toEqualTypeOf<{ Link: string | undefined; 'X-Hits': string | undefined; diff --git a/static/app/utils/demoMode/demoTours.spec.tsx b/static/app/utils/demoMode/demoTours.spec.tsx index 68556d1e4a19ea..74975a01c5e472 100644 --- a/static/app/utils/demoMode/demoTours.spec.tsx +++ b/static/app/utils/demoMode/demoTours.spec.tsx @@ -105,7 +105,9 @@ describe('DemoTours', () => { it('returns null when used outside provider', () => { jest.spyOn(console, 'error').mockImplementation(() => {}); - const {result} = renderHookWithProviders(() => useDemoTour(DemoTour.RELEASES)); + const {result} = renderHookWithProviders(useDemoTour, { + initialProps: DemoTour.RELEASES, + }); expect(result.current).toBeNull(); @@ -113,8 +115,9 @@ describe('DemoTours', () => { }); it('provides tour context when used inside provider', () => { - const {result} = renderHookWithProviders(() => useDemoTour(DemoTour.RELEASES), { + const {result} = renderHookWithProviders(useDemoTour, { additionalWrapper: createWrapper(), + initialProps: DemoTour.RELEASES, }); const tour = result.current; @@ -128,8 +131,9 @@ describe('DemoTours', () => { }); it('handles tour actions', () => { - const {result} = renderHookWithProviders(() => useDemoTour(DemoTour.RELEASES), { + const {result} = renderHookWithProviders(useDemoTour, { additionalWrapper: createWrapper(), + initialProps: DemoTour.RELEASES, }); const tour = result.current; @@ -159,21 +163,17 @@ describe('DemoTours', () => { }); it('maintains separate state for different tours', () => { - const {result: sideBarResult} = renderHookWithProviders( - () => useDemoTour(DemoTour.RELEASES), - { - additionalWrapper: createWrapper(), - } - ); + const {result: sideBarResult} = renderHookWithProviders(useDemoTour, { + additionalWrapper: createWrapper(), + initialProps: DemoTour.RELEASES, + }); const sidebarTour = sideBarResult.current; - const {result: issuesResult} = renderHookWithProviders( - () => useDemoTour(DemoTour.ISSUES), - { - additionalWrapper: createWrapper(), - } - ); + const {result: issuesResult} = renderHookWithProviders(useDemoTour, { + additionalWrapper: createWrapper(), + initialProps: DemoTour.ISSUES, + }); const issuesTour = issuesResult.current; @@ -213,8 +213,9 @@ describe('DemoTours', () => { }); it('correctly advances through tour steps', () => { - const {result} = renderHookWithProviders(() => useDemoTour(DemoTour.RELEASES), { + const {result} = renderHookWithProviders(useDemoTour, { additionalWrapper: createWrapper(), + initialProps: DemoTour.RELEASES, }); const sidebarTour = result.current; diff --git a/static/app/utils/list/useListItemCheckboxState.spec.ts b/static/app/utils/list/useListItemCheckboxState.spec.ts index 8039ed0f0013ea..a58d2eac0b4f55 100644 --- a/static/app/utils/list/useListItemCheckboxState.spec.ts +++ b/static/app/utils/list/useListItemCheckboxState.spec.ts @@ -9,9 +9,9 @@ const queryKey: ApiQueryKey = [getApiUrl('/api-tokens/')]; describe('useListItemCheckboxContext', () => { describe('All hits are already known', () => { it('should return the correct initial state', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 3, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 3, knownIds: ['1', '2', '3'], queryKey}, + }); expect(result.current).toEqual({ countSelected: 0, deselectAll: expect.any(Function), @@ -28,9 +28,9 @@ describe('useListItemCheckboxContext', () => { }); it('should allow selecting an individual item when all hits are known', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 3, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 3, knownIds: ['1', '2', '3'], queryKey}, + }); // Initially nothing is selected expect(result.current.isSelected('1')).toBe(false); @@ -84,9 +84,9 @@ describe('useListItemCheckboxContext', () => { }); it('sets isAllSelected to true when all items are selected', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 3, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 3, knownIds: ['1', '2', '3'], queryKey}, + }); // Initially nothing is selected expect(result.current.isSelected('1')).toBe(false); @@ -108,9 +108,9 @@ describe('useListItemCheckboxContext', () => { }); it('should allow selecting all items with selectAll', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 3, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 3, knownIds: ['1', '2', '3'], queryKey}, + }); // Initially nothing is selected expect(result.current.isSelected('1')).toBe(false); @@ -152,9 +152,9 @@ describe('useListItemCheckboxContext', () => { describe('More hits to load', () => { it('should return the correct initial state', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 10, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 10, knownIds: ['1', '2', '3'], queryKey}, + }); expect(result.current).toEqual({ countSelected: 0, deselectAll: expect.any(Function), @@ -171,9 +171,9 @@ describe('useListItemCheckboxContext', () => { }); it('should allow selecting individual items when there are more hits to load', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 10, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 10, knownIds: ['1', '2', '3'], queryKey}, + }); // Initially nothing is selected expect(result.current.isSelected('1')).toBe(false); @@ -241,9 +241,9 @@ describe('useListItemCheckboxContext', () => { }); it('should allow selecting all items with selectAll', () => { - const {result} = renderHook(() => - useListItemCheckboxContext({hits: 10, knownIds: ['1', '2', '3'], queryKey}) - ); + const {result} = renderHook(useListItemCheckboxContext, { + initialProps: {hits: 10, knownIds: ['1', '2', '3'], queryKey}, + }); // Initially nothing is selected expect(result.current.isSelected('1')).toBe(false); diff --git a/static/app/utils/profiling/hooks/useProfileFunctionTrends.spec.tsx b/static/app/utils/profiling/hooks/useProfileFunctionTrends.spec.tsx index 4ec3f6b033bfdd..61043b106ba9b8 100644 --- a/static/app/utils/profiling/hooks/useProfileFunctionTrends.spec.tsx +++ b/static/app/utils/profiling/hooks/useProfileFunctionTrends.spec.tsx @@ -29,14 +29,13 @@ describe('useProfileFunctionTrendss', () => { body: {data: []}, }); - const hook = renderHook( - () => - useProfileFunctionTrends({ - trendFunction: 'p95()', - trendType: 'regression', - }), - {wrapper: TestContext} - ); + const hook = renderHook(useProfileFunctionTrends, { + wrapper: TestContext, + initialProps: { + trendFunction: 'p95()', + trendType: 'regression', + }, + }); expect(hook.result.current).toMatchObject( expect.objectContaining({ isInitialLoading: true, @@ -50,14 +49,13 @@ describe('useProfileFunctionTrendss', () => { body: {data: []}, }); - const hook = renderHook( - () => - useProfileFunctionTrends({ - trendFunction: 'p95()', - trendType: 'regression', - }), - {wrapper: TestContext} - ); + const hook = renderHook(useProfileFunctionTrends, { + wrapper: TestContext, + initialProps: { + trendFunction: 'p95()', + trendType: 'regression', + }, + }); expect(hook.result.current.isPending).toBe(true); expect(hook.result.current.isFetched).toBe(false); await waitFor(() => diff --git a/static/app/utils/profiling/hooks/useProfileFunctions.spec.tsx b/static/app/utils/profiling/hooks/useProfileFunctions.spec.tsx index 12356011977695..d308787e9748c9 100644 --- a/static/app/utils/profiling/hooks/useProfileFunctions.spec.tsx +++ b/static/app/utils/profiling/hooks/useProfileFunctions.spec.tsx @@ -13,16 +13,16 @@ describe('useProfileFunctions', () => { body: {data: []}, }); - const hook = renderHookWithProviders(() => - useProfileFunctions({ + const hook = renderHookWithProviders(useProfileFunctions, { + initialProps: { fields: ['count()'], referrer: '', sort: { key: 'count()', order: 'desc', }, - }) - ); + }, + }); expect(hook.result.current).toMatchObject( expect.objectContaining({ isInitialLoading: true, @@ -36,16 +36,16 @@ describe('useProfileFunctions', () => { body: {data: []}, }); - const hook = renderHookWithProviders(() => - useProfileFunctions({ + const hook = renderHookWithProviders(useProfileFunctions, { + initialProps: { fields: ['count()'], referrer: '', sort: { key: 'count()', order: 'desc', }, - }) - ); + }, + }); expect(hook.result.current.isPending).toBe(true); expect(hook.result.current.isFetched).toBe(false); await waitFor(() => diff --git a/static/app/utils/timeSeries/useFetchEventsTimeSeries.spec.tsx b/static/app/utils/timeSeries/useFetchEventsTimeSeries.spec.tsx index 7ea4e744ab65e7..428d1e3f429716 100644 --- a/static/app/utils/timeSeries/useFetchEventsTimeSeries.spec.tsx +++ b/static/app/utils/timeSeries/useFetchEventsTimeSeries.spec.tsx @@ -42,6 +42,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -71,6 +72,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -90,6 +92,7 @@ describe('useFetchEventsTimeSeries', () => { it('requires a referrer', () => { expect(() => { + // eslint-disable-next-line @sentry/no-renderHook-arrow-function renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -110,6 +113,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -153,6 +157,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -207,6 +212,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, @@ -257,6 +263,7 @@ describe('useFetchEventsTimeSeries', () => { body: [], }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHookWithProviders(() => useFetchEventsTimeSeries( DiscoverDatasets.SPANS, diff --git a/static/app/utils/url/urlParamBatchContext.spec.tsx b/static/app/utils/url/urlParamBatchContext.spec.tsx index e16659281ec12d..e47d3e3a4e9f23 100644 --- a/static/app/utils/url/urlParamBatchContext.spec.tsx +++ b/static/app/utils/url/urlParamBatchContext.spec.tsx @@ -33,7 +33,7 @@ describe('UrlParamBatchProvider', () => { it('should batch updates to the URL query params', () => { setWindowLocation('http://localhost/'); - const {result} = renderHook(() => useUrlBatchContext(), { + const {result} = renderHook(useUrlBatchContext, { wrapper: UrlParamBatchProvider, }); const {batchUrlParamUpdates} = result.current; diff --git a/static/app/utils/url/useQueryParamState.spec.tsx b/static/app/utils/url/useQueryParamState.spec.tsx index c1fc8237617afa..47ab022d561d98 100644 --- a/static/app/utils/url/useQueryParamState.spec.tsx +++ b/static/app/utils/url/useQueryParamState.spec.tsx @@ -30,8 +30,9 @@ describe('useQueryParamState', () => { LocationFixture({query: {testField: 'initial state'}}) ); - const {result} = renderHook(() => useQueryParamState({fieldName: 'testField'}), { + const {result} = renderHook(useQueryParamState, { wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField'}, }); expect(result.current[0]).toBe('initial state'); @@ -41,8 +42,9 @@ describe('useQueryParamState', () => { const mockedNavigate = jest.fn(); mockedUseNavigate.mockReturnValue(mockedNavigate); - const {result} = renderHook(() => useQueryParamState({fieldName: 'testField'}), { + const {result} = renderHook(useQueryParamState, { wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField'}, }); act(() => { @@ -84,12 +86,10 @@ describe('useQueryParamState', () => { const testDeserializer = (value: string) => `${value.toUpperCase()} - decoded`; - const {result} = renderHook( - () => useQueryParamState({fieldName: 'testField', deserializer: testDeserializer}), - { - wrapper: UrlParamBatchProvider, - } - ); + const {result} = renderHook(useQueryParamState, { + wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField', deserializer: testDeserializer}, + }); expect(result.current[0]).toBe('INITIAL STATE - decoded'); }); @@ -107,12 +107,10 @@ describe('useQueryParamState', () => { const testSerializer = (value: TestType) => `${value.value} - ${value.count} - ${value.isActive}`; - const {result} = renderHook( - () => useQueryParamState({fieldName: 'testField', serializer: testSerializer}), - { - wrapper: UrlParamBatchProvider, - } - ); + const {result} = renderHook(useQueryParamState, { + wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField', serializer: testSerializer}, + }); act(() => { result.current[1]({value: 'newValue', count: 2, isActive: true}); @@ -133,17 +131,14 @@ describe('useQueryParamState', () => { const mockedNavigate = jest.fn(); mockedUseNavigate.mockReturnValue(mockedNavigate); - const {result} = renderHook( - () => - useQueryParamState({ - fieldName: 'sort', - decoder: decodeSorts, - serializer: value => value.map(formatSort), - }), - { - wrapper: UrlParamBatchProvider, - } - ); + const {result} = renderHook(useQueryParamState, { + wrapper: UrlParamBatchProvider, + initialProps: { + fieldName: 'sort', + decoder: decodeSorts, + serializer: value => value.map(formatSort), + }, + }); expect(result.current[0]).toEqual([{field: 'testField', kind: 'desc'}]); @@ -165,12 +160,10 @@ describe('useQueryParamState', () => { LocationFixture({query: {testField: 'initial state'}}) ); - const {result, rerender} = renderHook( - () => useQueryParamState({fieldName: 'testField', syncStateWithUrl: false}), - { - wrapper: UrlParamBatchProvider, - } - ); + const {result, rerender} = renderHook(useQueryParamState, { + wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField', syncStateWithUrl: false}, + }); expect(result.current[0]).toBe('initial state'); @@ -190,12 +183,10 @@ describe('useQueryParamState', () => { LocationFixture({query: {testField: 'initial state'}}) ); - const {result, rerender} = renderHook( - () => useQueryParamState({fieldName: 'testField', syncStateWithUrl: true}), - { - wrapper: UrlParamBatchProvider, - } - ); + const {result, rerender} = renderHook(useQueryParamState, { + wrapper: UrlParamBatchProvider, + initialProps: {fieldName: 'testField', syncStateWithUrl: true}, + }); expect(result.current[0]).toBe('initial state'); diff --git a/static/app/utils/useDispatchingReducer.spec.tsx b/static/app/utils/useDispatchingReducer.spec.tsx index 5b4ca0f84267f8..d328126e867a27 100644 --- a/static/app/utils/useDispatchingReducer.spec.tsx +++ b/static/app/utils/useDispatchingReducer.spec.tsx @@ -19,6 +19,7 @@ describe('useDispatchingReducer', () => { it('initializes state with initializer', () => { const reducer = jest.fn().mockImplementation(s => s); const initialState = {type: 'initial'}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, initialState)); expect(result.current[0]).toBe(initialState); @@ -26,6 +27,7 @@ describe('useDispatchingReducer', () => { it('initializes state with fn initializer arg', () => { const reducer = jest.fn().mockImplementation(s => s); const initialState = {type: 'initial'}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, undefined, () => initialState) ); @@ -43,6 +45,7 @@ describe('useDispatchingReducer', () => { }); it('calls reducer and updates state', async () => { const initialState = {type: 'initial'}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, initialState)); act(() => result.current[1]('action')); @@ -57,6 +60,7 @@ describe('useDispatchingReducer', () => { }); it('calls before action with state and action args', () => { const initialState = {type: 'initial'}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, initialState)); const beforeAction = jest.fn(); @@ -72,6 +76,7 @@ describe('useDispatchingReducer', () => { }); it('calls after action with previous, new state and action args', () => { const initialState = {type: 'initial'}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, initialState)); const beforeNextState = jest.fn(); @@ -103,6 +108,7 @@ describe('useDispatchingReducer', () => { }; } }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(action_storing_reducer, initialState) ); @@ -140,6 +146,7 @@ describe('useDispatchingReducer', () => { }); const initialState = {a: {}, b: {}}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(finalReducer, initialState)); act(() => { @@ -164,6 +171,7 @@ describe('useDispatchingReducer', () => { }); const initialState = {}; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useDispatchingReducer(reducer, initialState)); result.current[2].on('before action', (_state: any, action: any) => { diff --git a/static/app/utils/useIsMountedRef.spec.tsx b/static/app/utils/useIsMountedRef.spec.tsx index 9a76c76e6e17bc..85468c06f85016 100644 --- a/static/app/utils/useIsMountedRef.spec.tsx +++ b/static/app/utils/useIsMountedRef.spec.tsx @@ -4,12 +4,13 @@ import {useIsMountedRef} from './useIsMountedRef'; describe('useIsMounted', () => { it('should return a ref', () => { - const {result} = renderHook(() => useIsMountedRef()); + const {result} = renderHook(useIsMountedRef); expect(result.current).toBeInstanceOf(Object); }); it('should return false within first render', () => { + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => { const isMountedRef = useIsMountedRef(); return isMountedRef.current; @@ -19,13 +20,13 @@ describe('useIsMounted', () => { }); it('should return true after mount', () => { - const {result} = renderHook(() => useIsMountedRef()); + const {result} = renderHook(useIsMountedRef); expect(result.current.current).toBe(true); }); it('should return same function on each render', () => { - const {result, rerender} = renderHook(() => useIsMountedRef()); + const {result, rerender} = renderHook(useIsMountedRef); const fn1 = result.current; rerender(); @@ -38,7 +39,7 @@ describe('useIsMounted', () => { }); it('should return false after component unmount', () => { - const {result, unmount} = renderHook(() => useIsMountedRef()); + const {result, unmount} = renderHook(useIsMountedRef); expect(result.current.current).toBe(true); diff --git a/static/app/utils/useIsSentryEmployee.spec.tsx b/static/app/utils/useIsSentryEmployee.spec.tsx index 7a9d8482f9cc32..3cfba6dce79554 100644 --- a/static/app/utils/useIsSentryEmployee.spec.tsx +++ b/static/app/utils/useIsSentryEmployee.spec.tsx @@ -22,7 +22,7 @@ describe('useIsSentryEmployee', () => { }) ); - const {result} = renderHook(() => useIsSentryEmployee()); + const {result} = renderHook(useIsSentryEmployee); expect(result.current).toBe(true); }); @@ -43,7 +43,7 @@ describe('useIsSentryEmployee', () => { }) ); - const {result} = renderHook(() => useIsSentryEmployee()); + const {result} = renderHook(useIsSentryEmployee); expect(result.current).toBe(false); }); @@ -63,7 +63,7 @@ describe('useIsSentryEmployee', () => { }) ); - const {result} = renderHook(() => useIsSentryEmployee()); + const {result} = renderHook(useIsSentryEmployee); expect(result.current).toBe(false); }); diff --git a/static/app/utils/useLocalStorageState.spec.tsx b/static/app/utils/useLocalStorageState.spec.tsx index 696108aa20b727..da3fb3df9fe534 100644 --- a/static/app/utils/useLocalStorageState.spec.tsx +++ b/static/app/utils/useLocalStorageState.spec.tsx @@ -1,4 +1,4 @@ -import {act, renderHook, waitFor} from 'sentry-test/reactTestingLibrary'; +import {act, render, renderHook, waitFor} from 'sentry-test/reactTestingLibrary'; import localStorageWrapper from 'sentry/utils/localStorage'; import {useLocalStorageState} from 'sentry/utils/useLocalStorageState'; @@ -14,10 +14,12 @@ describe('useLocalStorageState', () => { it('throws if key is not a string', () => { expect(() => { - renderHook(() => { + function TestComponent() { // @ts-expect-error force incorrect usage useLocalStorageState({}, 'default value'); - }); + return null; + } + render(); }).toThrow('useLocalStorage: key must be a string'); }); diff --git a/static/app/utils/useMaxPickableDays.spec.tsx b/static/app/utils/useMaxPickableDays.spec.tsx index b2abdb03ed48d0..ab50c750cf49ed 100644 --- a/static/app/utils/useMaxPickableDays.spec.tsx +++ b/static/app/utils/useMaxPickableDays.spec.tsx @@ -8,11 +8,11 @@ import {useMaxPickableDays} from './useMaxPickableDays'; describe('useMaxPickableDays', () => { it('returns 90/90 for transactions', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.TRANSACTIONS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -21,11 +21,11 @@ describe('useMaxPickableDays', () => { }); it('returns 90/90 for replays', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.REPLAYS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -34,11 +34,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for spans without flag', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.SPANS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, @@ -48,15 +48,12 @@ describe('useMaxPickableDays', () => { }); it('returns 90/90 for spans with flag', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.SPANS], - }), - { - organization: OrganizationFixture({features: ['visibility-explore-range-high']}), - } - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization: OrganizationFixture({features: ['visibility-explore-range-high']}), + initialProps: { + dataCategories: [DataCategory.SPANS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -66,11 +63,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for tracemetrics', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.TRACE_METRICS], - }) - ); + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -80,11 +77,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for logs', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.LOG_BYTE, DataCategory.LOG_ITEM], - }) - ); + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -94,8 +91,8 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for many without flag', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [ DataCategory.SPANS, DataCategory.SPANS_INDEXED, @@ -103,8 +100,8 @@ describe('useMaxPickableDays', () => { DataCategory.LOG_BYTE, DataCategory.LOG_ITEM, ], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, diff --git a/static/app/utils/useMemoWithPrevious.spec.tsx b/static/app/utils/useMemoWithPrevious.spec.tsx index f85aef4ddf1ff8..83e2c9bce42e03 100644 --- a/static/app/utils/useMemoWithPrevious.spec.tsx +++ b/static/app/utils/useMemoWithPrevious.spec.tsx @@ -8,6 +8,7 @@ describe('useMemoWithPrevious', () => { const factory = jest.fn().mockImplementation(() => 'foo'); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useMemoWithPrevious(factory, [dep])); expect(factory).toHaveBeenCalledWith(null); expect(result.current).toBe('foo'); diff --git a/static/app/utils/useUndoableReducer.spec.tsx b/static/app/utils/useUndoableReducer.spec.tsx index 346c6cd840b8d2..766b8c2e6e8113 100644 --- a/static/app/utils/useUndoableReducer.spec.tsx +++ b/static/app/utils/useUndoableReducer.spec.tsx @@ -153,6 +153,7 @@ describe('makeUndoableReducer', () => { const simpleReducer = (state: number, action: {type: 'add'} | {type: 'subtract'}) => action.type === 'add' ? state + 1 : state - 1; + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useReducer(makeUndoableReducer(makeCombinedReducers({simple: simpleReducer})), { previous: undefined, @@ -178,6 +179,7 @@ describe('makeUndoableReducer', () => { math: (state: number, action: {type: 'add'} | {type: 'subtract'}) => action.type === 'add' ? state + 1 : state - 1, }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useReducer(makeUndoableReducer(combinedReducers), { previous: undefined, diff --git a/static/app/utils/useUpdateOrganization.spec.tsx b/static/app/utils/useUpdateOrganization.spec.tsx index cbdff4e09681af..e251c6ea6305f7 100644 --- a/static/app/utils/useUpdateOrganization.spec.tsx +++ b/static/app/utils/useUpdateOrganization.spec.tsx @@ -37,10 +37,11 @@ describe('useUpdateOrganization', () => { body: updatedOrganization, }); - const {result} = renderHook(() => useUpdateOrganization(organization), { + const {result} = renderHook(useUpdateOrganization, { wrapper: ({children}) => ( {children} ), + initialProps: organization, }); // Verify initial state @@ -81,10 +82,11 @@ describe('useUpdateOrganization', () => { body: {detail: 'Internal Server Error'}, }); - const {result} = renderHook(() => useUpdateOrganization(organization), { + const {result} = renderHook(useUpdateOrganization, { wrapper: ({children}) => ( {children} ), + initialProps: organization, }); // Verify initial state diff --git a/static/app/utils/useUserTeams.spec.tsx b/static/app/utils/useUserTeams.spec.tsx index f6319a17b308d9..eb45305231446c 100644 --- a/static/app/utils/useUserTeams.spec.tsx +++ b/static/app/utils/useUserTeams.spec.tsx @@ -89,7 +89,7 @@ describe('useUserTeams', () => { }); OrganizationStore.onUpdate(organization, {replace: true}); - const {result} = renderHookWithProviders(() => useUserTeams(), {organization: org}); + const {result} = renderHookWithProviders(useUserTeams, {organization: org}); const {teams} = result.current; expect(teams).toHaveLength(2); diff --git a/static/app/views/dashboards/widgetBuilder/hooks/useCacheBuilderState.spec.tsx b/static/app/views/dashboards/widgetBuilder/hooks/useCacheBuilderState.spec.tsx index 43a0bb07b73b15..5a8962147fab70 100644 --- a/static/app/views/dashboards/widgetBuilder/hooks/useCacheBuilderState.spec.tsx +++ b/static/app/views/dashboards/widgetBuilder/hooks/useCacheBuilderState.spec.tsx @@ -76,7 +76,7 @@ describe('useCacheBuilderState', () => { dispatch: jest.fn(), }); - const {result} = renderHook(() => useCacheBuilderState(), { + const {result} = renderHook(useCacheBuilderState, { wrapper: Wrapper, }); @@ -133,7 +133,7 @@ describe('useCacheBuilderState', () => { JSON.stringify(convertBuilderStateToWidget(cachedWidget)) ); - const {result} = renderHook(() => useCacheBuilderState(), { + const {result} = renderHook(useCacheBuilderState, { wrapper: Wrapper, }); @@ -189,7 +189,7 @@ describe('useCacheBuilderState', () => { JSON.stringify(convertBuilderStateToWidget(cachedWidget)) ); - const {result} = renderHook(() => useCacheBuilderState(), { + const {result} = renderHook(useCacheBuilderState, { wrapper: Wrapper, }); diff --git a/static/app/views/dashboards/widgetBuilder/hooks/useWidgetBuilderState.spec.tsx b/static/app/views/dashboards/widgetBuilder/hooks/useWidgetBuilderState.spec.tsx index 111d528f5d6faf..6f49af488bf982 100644 --- a/static/app/views/dashboards/widgetBuilder/hooks/useWidgetBuilderState.spec.tsx +++ b/static/app/views/dashboards/widgetBuilder/hooks/useWidgetBuilderState.spec.tsx @@ -42,7 +42,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -51,7 +51,7 @@ describe('useWidgetBuilderState', () => { }); it('sets the new title and description in the query params', () => { - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); act(() => { @@ -85,7 +85,7 @@ describe('useWidgetBuilderState', () => { }); it('does not update the url when the updateUrl option is false', () => { - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -110,7 +110,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -124,7 +124,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -132,7 +132,7 @@ describe('useWidgetBuilderState', () => { }); it('sets the display type in the query params', () => { - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -164,7 +164,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -221,7 +221,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -283,7 +283,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -355,7 +355,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -410,7 +410,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -465,7 +465,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -520,7 +520,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -560,7 +560,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -581,7 +581,7 @@ describe('useWidgetBuilderState', () => { LocationFixture({query: {selectedAggregate: '0'}}) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -608,7 +608,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -638,7 +638,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -665,7 +665,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -690,7 +690,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -719,7 +719,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -745,7 +745,7 @@ describe('useWidgetBuilderState', () => { it('resets limit when the display type is switched to table', () => { mockedUsedLocation.mockReturnValue(LocationFixture({query: {limit: '3'}})); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -777,7 +777,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -805,7 +805,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -828,7 +828,7 @@ describe('useWidgetBuilderState', () => { LocationFixture({query: {dataset: WidgetType.ISSUE}}) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -836,7 +836,7 @@ describe('useWidgetBuilderState', () => { }); it('sets the dataset in the query params', () => { - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -860,7 +860,7 @@ describe('useWidgetBuilderState', () => { it('returns errors as the default dataset', () => { mockedUsedLocation.mockReturnValue(LocationFixture({query: {dataset: 'invalid'}})); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -874,7 +874,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -897,7 +897,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -929,7 +929,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -970,7 +970,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1008,7 +1008,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1040,7 +1040,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1072,7 +1072,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1099,7 +1099,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1126,7 +1126,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1156,7 +1156,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1179,7 +1179,7 @@ describe('useWidgetBuilderState', () => { LocationFixture({query: {field: ['event.type', 'potato', 'count()']}}) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1206,7 +1206,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1243,7 +1243,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1277,7 +1277,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1308,7 +1308,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1331,7 +1331,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1361,7 +1361,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1388,7 +1388,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1417,7 +1417,7 @@ describe('useWidgetBuilderState', () => { }, }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1444,7 +1444,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1480,7 +1480,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1513,7 +1513,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1547,7 +1547,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1586,7 +1586,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1632,7 +1632,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1671,7 +1671,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1699,7 +1699,7 @@ describe('useWidgetBuilderState', () => { }, }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1731,7 +1731,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1757,7 +1757,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1786,7 +1786,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1813,7 +1813,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1842,7 +1842,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1869,7 +1869,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1907,7 +1907,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -1960,7 +1960,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -2003,7 +2003,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -2046,7 +2046,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); @@ -2108,7 +2108,7 @@ describe('useWidgetBuilderState', () => { }) ); - const {result} = renderHook(() => useWidgetBuilderState(), { + const {result} = renderHook(useWidgetBuilderState, { wrapper: WidgetBuilderProvider, }); diff --git a/static/app/views/dashboards/widgetCard/hooks/useErrorsWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useErrorsWidgetQuery.spec.tsx index 2a8e1cd362de1b..b167a96992a631 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useErrorsWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useErrorsWidgetQuery.spec.tsx @@ -64,16 +64,15 @@ describe('useErrorsSeriesQuery', () => { }, }); - renderHook( - () => - useErrorsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -126,16 +125,15 @@ describe('useErrorsSeriesQuery', () => { }, }); - renderHook( - () => - useErrorsSeriesQuery({ - widget, - organization, - pageFilters: pageFiltersWithDates, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters: pageFiltersWithDates, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -172,19 +170,18 @@ describe('useErrorsSeriesQuery', () => { }, }); - renderHook( - () => - useErrorsSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -251,16 +248,15 @@ describe('useErrorsSeriesQuery', () => { ], }); - renderHook( - () => - useErrorsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest1).toHaveBeenCalled(); @@ -301,16 +297,15 @@ describe('useErrorsTableQuery', () => { }, }); - renderHook( - () => - useErrorsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -346,16 +341,15 @@ describe('useErrorsTableQuery', () => { }, }); - renderHook( - () => - useErrorsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -391,19 +385,18 @@ describe('useErrorsTableQuery', () => { }, }); - renderHook( - () => - useErrorsTableQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -439,18 +432,17 @@ describe('useErrorsTableQuery', () => { }, }); - renderHook( - () => - useErrorsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - cursor: '0:10:0', - limit: 50, - }), - {wrapper: createWrapper()} - ); + renderHook(useErrorsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + cursor: '0:10:0', + limit: 50, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useIssuesWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useIssuesWidgetQuery.spec.tsx index e6093d3ae9c78a..a4b3ae467cecc0 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useIssuesWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useIssuesWidgetQuery.spec.tsx @@ -66,16 +66,15 @@ describe('useIssuesSeriesQuery', () => { }, }); - renderHook( - () => - useIssuesSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useIssuesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -117,19 +116,18 @@ describe('useIssuesSeriesQuery', () => { }, }); - renderHook( - () => - useIssuesSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useIssuesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -183,16 +181,15 @@ describe('useIssuesTableQuery', () => { ], }); - renderHook( - () => - useIssuesTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useIssuesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -236,18 +233,17 @@ describe('useIssuesTableQuery', () => { ], }); - renderHook( - () => - useIssuesTableQuery({ - widget, - organization, - pageFilters, - limit: 50, - cursor: 'test-cursor', - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useIssuesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + limit: 50, + cursor: 'test-cursor', + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useLogsWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useLogsWidgetQuery.spec.tsx index fc928b5546eb06..cffa5b05b4582b 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useLogsWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useLogsWidgetQuery.spec.tsx @@ -60,16 +60,15 @@ describe('useLogsSeriesQuery', () => { }, }); - renderHook( - () => - useLogsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useLogsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -106,19 +105,18 @@ describe('useLogsSeriesQuery', () => { }, }); - renderHook( - () => - useLogsSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useLogsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -165,16 +163,15 @@ describe('useLogsTableQuery', () => { }, }); - renderHook( - () => - useLogsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useLogsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -210,18 +207,17 @@ describe('useLogsTableQuery', () => { }, }); - renderHook( - () => - useLogsTableQuery({ - widget, - organization, - pageFilters, - limit: 50, - cursor: 'test-cursor', - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useLogsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + limit: 50, + cursor: 'test-cursor', + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useReleasesWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useReleasesWidgetQuery.spec.tsx index 4373c1d14b4edf..2ec56467575868 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useReleasesWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useReleasesWidgetQuery.spec.tsx @@ -60,16 +60,15 @@ describe('useReleasesSeriesQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -104,19 +103,18 @@ describe('useReleasesSeriesQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['2.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['2.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -150,16 +148,15 @@ describe('useReleasesSeriesQuery', () => { body: SessionsFieldFixture(`sum(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -194,16 +191,15 @@ describe('useReleasesSeriesQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -249,16 +245,15 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -294,18 +289,17 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - limit: 50, - cursor: 'test-cursor', - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + limit: 50, + cursor: 'test-cursor', + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -340,19 +334,18 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -386,16 +379,15 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`sum(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -431,16 +423,15 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`crash_free_rate(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -475,16 +466,15 @@ describe('useReleasesTableQuery', () => { body: SessionsFieldFixture(`sum(${SessionField.SESSION})`), }); - renderHook( - () => - useReleasesTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useReleasesTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useSpansWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useSpansWidgetQuery.spec.tsx index 7dbe178cd6fafe..895c8e87590d00 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useSpansWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useSpansWidgetQuery.spec.tsx @@ -77,16 +77,15 @@ describe('useSpansSeriesQuery', () => { }, }); - renderHook( - () => - useSpansSeriesQuery({ - widget, - organization, - pageFilters: pageFiltersWithDates, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters: pageFiltersWithDates, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -123,19 +122,18 @@ describe('useSpansSeriesQuery', () => { }, }); - renderHook( - () => - useSpansSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -202,16 +200,15 @@ describe('useSpansSeriesQuery', () => { ], }); - renderHook( - () => - useSpansSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest1).toHaveBeenCalled(); @@ -241,16 +238,15 @@ describe('useSpansSeriesQuery', () => { }, }); - const {result} = renderHook( - () => - useSpansSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSpansSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); expect(result.current.loading).toBe(true); }); @@ -278,16 +274,15 @@ describe('useSpansSeriesQuery', () => { statusCode: 500, }); - const {result} = renderHook( - () => - useSpansSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSpansSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(result.current.errorMessage).toBeDefined(); @@ -342,16 +337,15 @@ describe('useSpansTableQuery', () => { }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters: pageFiltersWithDates, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters: pageFiltersWithDates, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -388,16 +382,15 @@ describe('useSpansTableQuery', () => { }, }); - const {result} = renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(result.current.loading).toBe(false); @@ -426,19 +419,18 @@ describe('useSpansTableQuery', () => { }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -474,18 +466,17 @@ describe('useSpansTableQuery', () => { }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - limit: 50, - cursor: 'test-cursor', - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + limit: 50, + cursor: 'test-cursor', + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -522,16 +513,15 @@ describe('useSpansTableQuery', () => { }, }); - const {result} = renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); expect(result.current.loading).toBe(true); }); @@ -559,16 +549,15 @@ describe('useSpansTableQuery', () => { statusCode: 500, }); - const {result} = renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(result.current.errorMessage).toBeDefined(); @@ -601,16 +590,15 @@ describe('useSpansTableQuery', () => { }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -644,16 +632,15 @@ describe('useSpansTableQuery', () => { data: [{transaction: '/api/test', 'count()': 100}], }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( '/organizations/org-slug/events/', @@ -688,16 +675,15 @@ describe('useSpansTableQuery', () => { }, }); - renderHook( - () => - useSpansTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useSpansTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useTraceMetricsWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useTraceMetricsWidgetQuery.spec.tsx index 3396d065bb2d10..ff93d543a0c8f2 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useTraceMetricsWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useTraceMetricsWidgetQuery.spec.tsx @@ -74,16 +74,15 @@ describe('useTraceMetricsSeriesQuery', () => { }, }); - renderHook( - () => - useTraceMetricsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTraceMetricsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -130,19 +129,18 @@ describe('useTraceMetricsSeriesQuery', () => { }, }); - renderHook( - () => - useTraceMetricsSeriesQuery({ - widget, - organization, - pageFilters, - dashboardFilters: { - release: ['1.0.0'], - }, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTraceMetricsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + dashboardFilters: { + release: ['1.0.0'], + }, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -178,16 +176,15 @@ describe('useTraceMetricsSeriesQuery', () => { }, }); - renderHook( - () => - useTraceMetricsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTraceMetricsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -239,16 +236,15 @@ describe('useTraceMetricsTableQuery', () => { }, }); - renderHook( - () => - useTraceMetricsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTraceMetricsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -289,18 +285,17 @@ describe('useTraceMetricsTableQuery', () => { }, }); - renderHook( - () => - useTraceMetricsTableQuery({ - widget, - organization, - pageFilters, - limit: 25, - cursor: 'test-cursor', - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTraceMetricsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + limit: 25, + cursor: 'test-cursor', + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/dashboards/widgetCard/hooks/useTransactionsWidgetQuery.spec.tsx b/static/app/views/dashboards/widgetCard/hooks/useTransactionsWidgetQuery.spec.tsx index da175084ea4f2a..b00a2e9c7b8d54 100644 --- a/static/app/views/dashboards/widgetCard/hooks/useTransactionsWidgetQuery.spec.tsx +++ b/static/app/views/dashboards/widgetCard/hooks/useTransactionsWidgetQuery.spec.tsx @@ -67,16 +67,15 @@ describe('useTransactionsSeriesQuery', () => { }, }); - renderHook( - () => - useTransactionsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTransactionsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -113,17 +112,16 @@ describe('useTransactionsSeriesQuery', () => { }, }); - renderHook( - () => - useTransactionsSeriesQuery({ - widget, - organization, - pageFilters, - enabled: true, - mepSetting: MEPState.AUTO, - }), - {wrapper: createWrapper()} - ); + renderHook(useTransactionsSeriesQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + mepSetting: MEPState.AUTO, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -172,16 +170,15 @@ describe('useTransactionsTableQuery', () => { }, }); - renderHook( - () => - useTransactionsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - }), - {wrapper: createWrapper()} - ); + renderHook(useTransactionsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( @@ -217,17 +214,16 @@ describe('useTransactionsTableQuery', () => { }, }); - renderHook( - () => - useTransactionsTableQuery({ - widget, - organization, - pageFilters, - enabled: true, - mepSetting: MEPState.AUTO, - }), - {wrapper: createWrapper()} - ); + renderHook(useTransactionsTableQuery, { + wrapper: createWrapper(), + initialProps: { + widget, + organization, + pageFilters, + enabled: true, + mepSetting: MEPState.AUTO, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledWith( diff --git a/static/app/views/detectors/hooks/useMetricDetectorAnomalies.spec.tsx b/static/app/views/detectors/hooks/useMetricDetectorAnomalies.spec.tsx index 74bab682b9a1dd..d282c59254b0d8 100644 --- a/static/app/views/detectors/hooks/useMetricDetectorAnomalies.spec.tsx +++ b/static/app/views/detectors/hooks/useMetricDetectorAnomalies.spec.tsx @@ -56,8 +56,8 @@ describe('useMetricDetectorAnomalies', () => { }, ]; - const {result} = renderHookWithProviders(() => - useMetricDetectorAnomalies({ + const {result} = renderHookWithProviders(useMetricDetectorAnomalies, { + initialProps: { series, historicalSeries, thresholdType: AlertRuleThresholdType.ABOVE, @@ -65,8 +65,8 @@ describe('useMetricDetectorAnomalies', () => { interval: 900, // 15 minutes projectId: '1', enabled: true, - }) - ); + }, + }); await waitFor(() => { expect(anomalyRequest).toHaveBeenCalledWith( diff --git a/static/app/views/detectors/hooks/useMetricDetectorAnomalyPeriods.spec.tsx b/static/app/views/detectors/hooks/useMetricDetectorAnomalyPeriods.spec.tsx index 1f56ffc51f5b03..22ca285262cc6d 100644 --- a/static/app/views/detectors/hooks/useMetricDetectorAnomalyPeriods.spec.tsx +++ b/static/app/views/detectors/hooks/useMetricDetectorAnomalyPeriods.spec.tsx @@ -74,8 +74,8 @@ describe('useMetricDetectorAnomalyPeriods', () => { }, ]; - const {result} = renderHookWithProviders(() => - useMetricDetectorAnomalyPeriods({ + const {result} = renderHookWithProviders(useMetricDetectorAnomalyPeriods, { + initialProps: { series, detectorDataset: DetectorDataset.ERRORS, dataset: Dataset.ERRORS, @@ -90,8 +90,8 @@ describe('useMetricDetectorAnomalyPeriods', () => { sensitivity: AlertRuleSensitivity.MEDIUM, isLoadingSeries: false, enabled: true, - }) - ); + }, + }); await waitFor(() => { expect(anomalyRequest).toHaveBeenCalled(); diff --git a/static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.spec.tsx b/static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.spec.tsx index 32ec7c05c570e1..558a34e2fcb2c0 100644 --- a/static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.spec.tsx +++ b/static/app/views/detectors/hooks/useMetricDetectorAnomalyThresholds.spec.tsx @@ -26,17 +26,16 @@ describe('useMetricDetectorAnomalyThresholds', () => { }, ]; - renderHookWithProviders( - () => - useMetricDetectorAnomalyThresholds({ - detectorId: '123', - detectionType: 'static', - startTimestamp: 1609459200, - endTimestamp: 1609545600, - series, - }), - {organization} - ); + renderHookWithProviders(useMetricDetectorAnomalyThresholds, { + organization, + initialProps: { + detectorId: '123', + detectionType: 'static', + startTimestamp: 1609459200, + endTimestamp: 1609545600, + series, + }, + }); expect(anomalyDataRequest).not.toHaveBeenCalled(); }); @@ -68,17 +67,16 @@ describe('useMetricDetectorAnomalyThresholds', () => { }, ]; - renderHookWithProviders( - () => - useMetricDetectorAnomalyThresholds({ - detectorId: '123', - detectionType: 'dynamic', - startTimestamp: 1609459200, - endTimestamp: 1609545600, - series, - }), - {organization} - ); + renderHookWithProviders(useMetricDetectorAnomalyThresholds, { + organization, + initialProps: { + detectorId: '123', + detectionType: 'dynamic', + startTimestamp: 1609459200, + endTimestamp: 1609545600, + series, + }, + }); await waitFor(() => { expect(anomalyDataRequest).toHaveBeenCalled(); @@ -102,17 +100,16 @@ describe('useMetricDetectorAnomalyThresholds', () => { }, ]; - renderHookWithProviders( - () => - useMetricDetectorAnomalyThresholds({ - detectorId: '123', - detectionType: undefined, - startTimestamp: 1609459200, - endTimestamp: 1609545600, - series, - }), - {organization} - ); + renderHookWithProviders(useMetricDetectorAnomalyThresholds, { + organization, + initialProps: { + detectorId: '123', + detectionType: undefined, + startTimestamp: 1609459200, + endTimestamp: 1609545600, + series, + }, + }); expect(anomalyDataRequest).not.toHaveBeenCalled(); }); @@ -145,18 +142,17 @@ describe('useMetricDetectorAnomalyThresholds', () => { }, ]; - renderHookWithProviders( - () => - useMetricDetectorAnomalyThresholds({ - detectorId: '123', - detectionType: 'dynamic', - startTimestamp: 1609459200, - endTimestamp: 1609545600, - series, - isLegacyAlert: true, - }), - {organization} - ); + renderHookWithProviders(useMetricDetectorAnomalyThresholds, { + organization, + initialProps: { + detectorId: '123', + detectionType: 'dynamic', + startTimestamp: 1609459200, + endTimestamp: 1609545600, + series, + isLegacyAlert: true, + }, + }); await waitFor(() => { expect(anomalyDataRequest).toHaveBeenCalled(); diff --git a/static/app/views/explore/components/traceItemSearchQueryBuilder.spec.tsx b/static/app/views/explore/components/traceItemSearchQueryBuilder.spec.tsx index e52db35601eb50..ecb6102c6b6c93 100644 --- a/static/app/views/explore/components/traceItemSearchQueryBuilder.spec.tsx +++ b/static/app/views/explore/components/traceItemSearchQueryBuilder.spec.tsx @@ -36,25 +36,22 @@ describe('useTraceItemSearchQueryBuilderProps', () => { }, }; - const {result} = renderHookWithProviders( - () => - useTraceItemSearchQueryBuilderProps({ - itemType: TraceItemDataset.SPANS, - booleanAttributes, - booleanSecondaryAliases, - numberAttributes: {}, - numberSecondaryAliases: {}, - stringAttributes: {}, - stringSecondaryAliases: {}, - initialQuery: '', - searchSource: 'test', - }), - { - organization: { - features: ['search-query-builder-explicit-boolean-filters'], - }, - } - ); + const {result} = renderHookWithProviders(useTraceItemSearchQueryBuilderProps, { + organization: { + features: ['search-query-builder-explicit-boolean-filters'], + }, + initialProps: { + itemType: TraceItemDataset.SPANS, + booleanAttributes, + booleanSecondaryAliases, + numberAttributes: {}, + numberSecondaryAliases: {}, + stringAttributes: {}, + stringSecondaryAliases: {}, + initialQuery: '', + searchSource: 'test', + }, + }); expect(result.current.filterKeys['feature.enabled']).toBeDefined(); expect(result.current.filterKeyAliases?.['feature.enabled_alias']).toBeDefined(); diff --git a/static/app/views/explore/hooks/useCrossEventQueries.spec.tsx b/static/app/views/explore/hooks/useCrossEventQueries.spec.tsx index 1a7e2a00b1091e..3cdbd61a605632 100644 --- a/static/app/views/explore/hooks/useCrossEventQueries.spec.tsx +++ b/static/app/views/explore/hooks/useCrossEventQueries.spec.tsx @@ -57,7 +57,7 @@ function Wrapper(crossEvents?: CrossEvent[]) { describe('useCrossEventQueries', () => { it('returns undefined if there are no cross event queries', () => { - const {result} = renderHookWithProviders(() => useCrossEventQueries(), { + const {result} = renderHookWithProviders(useCrossEventQueries, { additionalWrapper: Wrapper(), }); @@ -65,7 +65,7 @@ describe('useCrossEventQueries', () => { }); it('returns undefined if cross event queries array is empty', () => { - const {result} = renderHookWithProviders(() => useCrossEventQueries(), { + const {result} = renderHookWithProviders(useCrossEventQueries, { additionalWrapper: Wrapper([]), }); @@ -73,7 +73,7 @@ describe('useCrossEventQueries', () => { }); it('returns object of array of queries', () => { - const {result} = renderHookWithProviders(() => useCrossEventQueries(), { + const {result} = renderHookWithProviders(useCrossEventQueries, { additionalWrapper: Wrapper([ {type: 'logs', query: 'test:a'}, {type: 'spans', query: 'test:b'}, @@ -89,7 +89,7 @@ describe('useCrossEventQueries', () => { }); it('appends queries with the same types', () => { - const {result} = renderHookWithProviders(() => useCrossEventQueries(), { + const {result} = renderHookWithProviders(useCrossEventQueries, { additionalWrapper: Wrapper([ {type: 'spans', query: 'test:a'}, {type: 'spans', query: 'test:b'}, @@ -105,7 +105,7 @@ describe('useCrossEventQueries', () => { }); it('ignores queries with invalid types', () => { - const {result} = renderHookWithProviders(() => useCrossEventQueries(), { + const {result} = renderHookWithProviders(useCrossEventQueries, { additionalWrapper: Wrapper([ {type: 'logs', query: 'test:a'}, {type: 'invalid' as any, query: 'test:b'}, diff --git a/static/app/views/explore/hooks/useExploreAggregatesTable.spec.tsx b/static/app/views/explore/hooks/useExploreAggregatesTable.spec.tsx index 1ace82f0062c0b..b45e217fa2ef2b 100644 --- a/static/app/views/explore/hooks/useExploreAggregatesTable.spec.tsx +++ b/static/app/views/explore/hooks/useExploreAggregatesTable.spec.tsx @@ -45,17 +45,14 @@ describe('useExploreAggregatesTable', () => { ], method: 'GET', }); - renderHookWithProviders( - () => - useExploreAggregatesTable({ - query: 'test value', - enabled: true, - limit: 100, - }), - { - additionalWrapper: Wrapper, - } - ); + renderHookWithProviders(useExploreAggregatesTable, { + additionalWrapper: Wrapper, + initialProps: { + query: 'test value', + enabled: true, + limit: 100, + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( @@ -96,25 +93,22 @@ describe('useExploreAggregatesTable', () => { method: 'GET', }); - renderHookWithProviders( - () => - useExploreAggregatesTable({ - query: 'test value', - enabled: true, - limit: 100, - }), - { - additionalWrapper: Wrapper, - initialRouterConfig: { - location: { - pathname: '/organizations/org-slug/explore/traces/', - query: { - extrapolate: '0', - }, + renderHookWithProviders(useExploreAggregatesTable, { + additionalWrapper: Wrapper, + initialRouterConfig: { + location: { + pathname: '/organizations/org-slug/explore/traces/', + query: { + extrapolate: '0', }, }, - } - ); + }, + initialProps: { + query: 'test value', + enabled: true, + limit: 100, + }, + }); await waitFor(() => expect(mockNonExtrapolatedRequest).toHaveBeenCalledTimes(1)); expect(mockNonExtrapolatedRequest).toHaveBeenCalledWith( diff --git a/static/app/views/explore/hooks/useExploreSpansTable.spec.tsx b/static/app/views/explore/hooks/useExploreSpansTable.spec.tsx index 18d30f3249c946..d94d8f401cd4f0 100644 --- a/static/app/views/explore/hooks/useExploreSpansTable.spec.tsx +++ b/static/app/views/explore/hooks/useExploreSpansTable.spec.tsx @@ -46,15 +46,14 @@ describe('useExploreSpansTable', () => { ], method: 'GET', }); - renderHookWithProviders( - () => - useExploreSpansTable({ - query: 'test value', - enabled: true, - limit: 10, - }), - {additionalWrapper: Wrapper} - ); + renderHookWithProviders(useExploreSpansTable, { + additionalWrapper: Wrapper, + initialProps: { + query: 'test value', + enabled: true, + limit: 10, + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( @@ -103,25 +102,22 @@ describe('useExploreSpansTable', () => { method: 'GET', }); - renderHookWithProviders( - () => - useExploreSpansTable({ - query: 'test value', - enabled: true, - limit: 10, - }), - { - additionalWrapper: Wrapper, - initialRouterConfig: { - location: { - pathname: '/organizations/org-slug/explore/traces/', - query: { - extrapolate: '0', - }, + renderHookWithProviders(useExploreSpansTable, { + additionalWrapper: Wrapper, + initialRouterConfig: { + location: { + pathname: '/organizations/org-slug/explore/traces/', + query: { + extrapolate: '0', }, }, - } - ); + }, + initialProps: { + query: 'test value', + enabled: true, + limit: 10, + }, + }); await waitFor(() => expect(mockNonExtrapolatedRequest).toHaveBeenCalledTimes(1)); expect(mockNonExtrapolatedRequest).toHaveBeenCalledWith( diff --git a/static/app/views/explore/hooks/useExploreTimeseries.spec.tsx b/static/app/views/explore/hooks/useExploreTimeseries.spec.tsx index 0cf47f25d7abb7..65eb138750a38d 100644 --- a/static/app/views/explore/hooks/useExploreTimeseries.spec.tsx +++ b/static/app/views/explore/hooks/useExploreTimeseries.spec.tsx @@ -60,16 +60,13 @@ describe('useExploreTimeseries', () => { ], method: 'GET', }); - renderHookWithProviders( - () => - useExploreTimeseries({ - query: 'test value', - enabled: true, - }), - { - additionalWrapper: Wrapper, - } - ); + renderHookWithProviders(useExploreTimeseries, { + additionalWrapper: Wrapper, + initialProps: { + query: 'test value', + enabled: true, + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( @@ -110,24 +107,21 @@ describe('useExploreTimeseries', () => { method: 'GET', }); - renderHookWithProviders( - () => - useExploreTimeseries({ - query: 'test value', - enabled: true, - }), - { - additionalWrapper: Wrapper, - initialRouterConfig: { - location: { - pathname: '/organizations/org-slug/explore/traces/', - query: { - extrapolate: '0', - }, + renderHookWithProviders(useExploreTimeseries, { + additionalWrapper: Wrapper, + initialRouterConfig: { + location: { + pathname: '/organizations/org-slug/explore/traces/', + query: { + extrapolate: '0', }, }, - } - ); + }, + initialProps: { + query: 'test value', + enabled: true, + }, + }); await waitFor(() => expect(mockNonExtrapolatedRequest).toHaveBeenCalledTimes(1)); expect(mockNonExtrapolatedRequest).toHaveBeenCalledWith( diff --git a/static/app/views/explore/hooks/useGetTraceItemAttributeValues.spec.tsx b/static/app/views/explore/hooks/useGetTraceItemAttributeValues.spec.tsx index 3f5e3f01efdf1d..452b63d1530de7 100644 --- a/static/app/views/explore/hooks/useGetTraceItemAttributeValues.spec.tsx +++ b/static/app/views/explore/hooks/useGetTraceItemAttributeValues.spec.tsx @@ -45,12 +45,12 @@ describe('useGetTraceItemAttributeValues', () => { ], }); - const {result} = renderHookWithProviders(() => - useGetTraceItemAttributeValues({ + const {result} = renderHookWithProviders(useGetTraceItemAttributeValues, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'string', - }) - ); + }, + }); const tag = { key: attributeKey, @@ -88,12 +88,12 @@ describe('useGetTraceItemAttributeValues', () => { ], }); - const {result} = renderHookWithProviders(() => - useGetTraceItemAttributeValues({ + const {result} = renderHookWithProviders(useGetTraceItemAttributeValues, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'number', - }) - ); + }, + }); const tag = { key: attributeKey, @@ -130,12 +130,12 @@ describe('useGetTraceItemAttributeValues', () => { ], }); - const {result} = renderHookWithProviders(() => - useGetTraceItemAttributeValues({ + const {result} = renderHookWithProviders(useGetTraceItemAttributeValues, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'boolean', - }) - ); + }, + }); const tag = { key: attributeKey, diff --git a/static/app/views/explore/hooks/useProgressiveQuery.spec.tsx b/static/app/views/explore/hooks/useProgressiveQuery.spec.tsx index 6b7ed822b47b00..9ab561522f326a 100644 --- a/static/app/views/explore/hooks/useProgressiveQuery.spec.tsx +++ b/static/app/views/explore/hooks/useProgressiveQuery.spec.tsx @@ -82,18 +82,18 @@ describe('useProgressiveQuery', () => { }, ], }); - renderHookWithProviders(() => - useProgressiveQuery({ + renderHookWithProviders(useProgressiveQuery, { + initialProps: { queryHookImplementation: useMockHookImpl, queryHookArgs: {enabled: true, query: 'test value'}, queryOptions: { - canTriggerHighAccuracy: results => { + canTriggerHighAccuracy: (results: any) => { // Simulate checking if there is data and more data is available return defined(results.data) && results.data.meta.dataScanned === 'partial'; }, }, - }) - ); + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( @@ -133,8 +133,8 @@ describe('useProgressiveQuery', () => { }, ], }); - renderHookWithProviders(() => - useProgressiveQuery({ + renderHookWithProviders(useProgressiveQuery, { + initialProps: { queryHookImplementation: useMockHookImpl, queryHookArgs: {enabled: true, query: 'test value'}, queryOptions: { @@ -143,8 +143,8 @@ describe('useProgressiveQuery', () => { return false; }, }, - }) - ); + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( diff --git a/static/app/views/explore/hooks/useSortByFields.spec.tsx b/static/app/views/explore/hooks/useSortByFields.spec.tsx index d5543347b3d706..8c06e776cd30f2 100644 --- a/static/app/views/explore/hooks/useSortByFields.spec.tsx +++ b/static/app/views/explore/hooks/useSortByFields.spec.tsx @@ -45,25 +45,22 @@ describe('useSortByFields', () => { }); it('returns a valid list of field options in samples mode', () => { - const {result} = renderHook( - () => - useSortByFields({ - fields: [ - 'id', - 'span.op', - 'span.description', - 'span.duration', - 'transaction', - 'timestamp', - ], - groupBys: [], - yAxes: ['avg(span.duration)'], - mode: Mode.SAMPLES, - }), - { - wrapper: createWrapper(organization), - } - ); + const {result} = renderHook(useSortByFields, { + wrapper: createWrapper(organization), + initialProps: { + fields: [ + 'id', + 'span.op', + 'span.description', + 'span.duration', + 'transaction', + 'timestamp', + ], + groupBys: [], + yAxes: ['avg(span.duration)'], + mode: Mode.SAMPLES, + }, + }); expect(result.current.map(field => field.value)).toEqual([ 'id', @@ -76,18 +73,15 @@ describe('useSortByFields', () => { }); it('returns a valid list of field options in aggregate mode', () => { - const {result} = renderHook( - () => - useSortByFields({ - fields: ['span.op', 'span.description'], - groupBys: ['span.op'], - yAxes: ['avg(span.duration)'], - mode: Mode.AGGREGATE, - }), - { - wrapper: createWrapper(organization), - } - ); + const {result} = renderHook(useSortByFields, { + wrapper: createWrapper(organization), + initialProps: { + fields: ['span.op', 'span.description'], + groupBys: ['span.op'], + yAxes: ['avg(span.duration)'], + mode: Mode.AGGREGATE, + }, + }); expect(result.current.map(field => field.value)).toEqual([ 'avg(span.duration)', diff --git a/static/app/views/explore/hooks/useTraceItemAttributeKeys.spec.tsx b/static/app/views/explore/hooks/useTraceItemAttributeKeys.spec.tsx index 7b1ec259009490..bd589ecb62e440 100644 --- a/static/app/views/explore/hooks/useTraceItemAttributeKeys.spec.tsx +++ b/static/app/views/explore/hooks/useTraceItemAttributeKeys.spec.tsx @@ -64,12 +64,12 @@ describe('useTraceItemAttributeKeys', () => { mockAttributeKeys ); - const {result} = renderHookWithProviders(() => - useTraceItemAttributeKeys({ + const {result} = renderHookWithProviders(useTraceItemAttributeKeys, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'string', - }) - ); + }, + }); await waitFor(() => expect(result.current.isLoading).toBe(false)); expect(mockResponse).toHaveBeenCalled(); @@ -119,12 +119,12 @@ describe('useTraceItemAttributeKeys', () => { 'number' ); - const {result} = renderHookWithProviders(() => - useTraceItemAttributeKeys({ + const {result} = renderHookWithProviders(useTraceItemAttributeKeys, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'number', - }) - ); + }, + }); await waitFor(() => expect(result.current.isLoading).toBe(false)); expect(mockResponse).toHaveBeenCalled(); @@ -173,12 +173,12 @@ describe('useTraceItemAttributeKeys', () => { mockTraceItemAttributeKeysApi(organization.slug, attributesWithInvalidChars); - const {result} = renderHookWithProviders(() => - useTraceItemAttributeKeys({ + const {result} = renderHookWithProviders(useTraceItemAttributeKeys, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'string', - }) - ); + }, + }); await waitFor(() => expect(result.current.isLoading).toBe(false)); @@ -227,12 +227,12 @@ describe('useTraceItemAttributeKeys', () => { testAttributeKeys ); - const {result} = renderHookWithProviders(() => - useTraceItemAttributeKeys({ + const {result} = renderHookWithProviders(useTraceItemAttributeKeys, { + initialProps: { traceItemType: TraceItemDataset.LOGS, type: 'string', - }) - ); + }, + }); await waitFor(() => expect(result.current.isLoading).toBe(false)); expect(mockResponse).toHaveBeenCalled(); diff --git a/static/app/views/explore/hooks/useVisualizeFields.spec.tsx b/static/app/views/explore/hooks/useVisualizeFields.spec.tsx index 3a18049ace4309..04958c587704f1 100644 --- a/static/app/views/explore/hooks/useVisualizeFields.spec.tsx +++ b/static/app/views/explore/hooks/useVisualizeFields.spec.tsx @@ -59,8 +59,9 @@ describe('useVisualizeFields', () => { }); it('returns numeric fields', () => { - const {result} = renderHook(() => useWrapper('avg(score.ttfb)'), { + const {result} = renderHook(useWrapper, { wrapper: createWrapper(organization), + initialProps: 'avg(score.ttfb)', }); expect(result.current.map(field => field.value)).toEqual([ @@ -71,16 +72,18 @@ describe('useVisualizeFields', () => { }); it('returns numeric fields for count', () => { - const {result} = renderHook(() => useWrapper('count(span.duration)'), { + const {result} = renderHook(useWrapper, { wrapper: createWrapper(organization), + initialProps: 'count(span.duration)', }); expect(result.current.map(field => field.value)).toEqual(['span.duration']); }); it('returns string fields for count_unique', () => { - const {result} = renderHook(() => useWrapper('count_unique(foobar)'), { + const {result} = renderHook(useWrapper, { wrapper: createWrapper(organization), + initialProps: 'count_unique(foobar)', }); expect(result.current.map(field => field.value)).toEqual( diff --git a/static/app/views/explore/logs/useLogsAggregatesTable.spec.tsx b/static/app/views/explore/logs/useLogsAggregatesTable.spec.tsx index 59eee3a3967c05..1e86edb08c5846 100644 --- a/static/app/views/explore/logs/useLogsAggregatesTable.spec.tsx +++ b/static/app/views/explore/logs/useLogsAggregatesTable.spec.tsx @@ -58,14 +58,13 @@ describe('useLogsAggregatesTable', () => { ], }); - renderHookWithProviders( - () => - useLogsAggregatesTable({ - enabled: true, - limit: 100, - }), - {additionalWrapper: Wrapper} - ); + renderHookWithProviders(useLogsAggregatesTable, { + additionalWrapper: Wrapper, + initialProps: { + enabled: true, + limit: 100, + }, + }); expect(mockNormalRequest).toHaveBeenCalledTimes(1); expect(mockNormalRequest).toHaveBeenCalledWith( diff --git a/static/app/views/explore/logs/useLogsQuery.spec.tsx b/static/app/views/explore/logs/useLogsQuery.spec.tsx index 1c61c4d9e51286..94076801c4b7d7 100644 --- a/static/app/views/explore/logs/useLogsQuery.spec.tsx +++ b/static/app/views/explore/logs/useLogsQuery.spec.tsx @@ -115,7 +115,7 @@ describe('useInfiniteLogsQuery', () => { ); } - const {result, rerender} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result, rerender} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper(), organization, }); @@ -205,7 +205,7 @@ describe('useInfiniteLogsQuery', () => { headers: linkHeaders, }); - const {result, rerender} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result, rerender} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper(), organization, }); @@ -288,8 +288,9 @@ describe('useInfiniteLogsQuery', () => { ], }); - renderHookWithProviders(() => useInfiniteLogsQuery({}), { + renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper(), + initialProps: {}, }); expect(mockNormalRequest).toHaveBeenCalledTimes(1); @@ -380,12 +381,10 @@ describe('useInfiniteLogsQuery', () => { makeMockEventsResponse({cursor: 'page6', nextCursor: 'page7', hasNext: false}), ].map(response => MockApiClient.addMockResponse(response)); - const {result} = renderHookWithProviders( - () => useInfiniteLogsQuery({highFidelity: true, maxAutoFetches: 3}), - { - additionalWrapper: createWrapper(), - } - ); + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { + additionalWrapper: createWrapper(), + initialProps: {highFidelity: true, maxAutoFetches: 3}, + }); // the first 3 requests should have been called await waitFor(() => expect(mockFlextTimeRequests[0]).toHaveBeenCalledTimes(1)); @@ -433,12 +432,10 @@ describe('useInfiniteLogsQuery', () => { }), ].map(response => MockApiClient.addMockResponse(response)); - const {result} = renderHookWithProviders( - () => useInfiniteLogsQuery({highFidelity: true, maxAutoFetches: 3}), - { - additionalWrapper: createWrapper(), - } - ); + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { + additionalWrapper: createWrapper(), + initialProps: {highFidelity: true, maxAutoFetches: 3}, + }); // the first 2 requests should have been called and stop because it totals 1000 results await waitFor(() => expect(mockFlextTimeRequests[0]).toHaveBeenCalledTimes(1)); @@ -682,7 +679,7 @@ describe('Virtual Streaming Integration (Auto Refresh Behaviour)', () => { headers: linkHeaders, }); - const {result} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper({autoRefresh: 'enabled'}), organization, }); @@ -710,7 +707,7 @@ describe('Virtual Streaming Integration (Auto Refresh Behaviour)', () => { headers: linkHeaders, }); - const {result} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper({autoRefresh: 'idle'}), organization, }); @@ -767,7 +764,7 @@ describe('Virtual Streaming Integration (Auto Refresh Behaviour)', () => { headers: linkHeaders, }); - const {result} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper({autoRefresh: 'enabled'}), organization, }); @@ -829,7 +826,7 @@ describe('Virtual Streaming Integration (Auto Refresh Behaviour)', () => { headers: linkHeaders, }); - const {result} = renderHookWithProviders(() => useInfiniteLogsQuery(), { + const {result} = renderHookWithProviders(useInfiniteLogsQuery, { additionalWrapper: createWrapper({autoRefresh: 'idle'}), // Disable auto refresh to avoid virtual streaming filtering organization, }); diff --git a/static/app/views/explore/logs/useLogsTimeseries.spec.tsx b/static/app/views/explore/logs/useLogsTimeseries.spec.tsx index 2686e72567be38..b0ecb7367e854f 100644 --- a/static/app/views/explore/logs/useLogsTimeseries.spec.tsx +++ b/static/app/views/explore/logs/useLogsTimeseries.spec.tsx @@ -73,40 +73,39 @@ describe('useLogsTimeseries', () => { ], }); - renderHookWithProviders( - () => - useLogsTimeseries({ - enabled: true, - timeseriesIngestDelay: 0n, - tableData: { - error: null, - isError: false, - isFetching: false, - isPending: false, - data: [], - meta: { - fields: {}, - units: {}, - }, - isRefetching: false, - isEmpty: true, - fetchNextPage: () => Promise.resolve({} as any), - fetchPreviousPage: () => Promise.resolve({} as any), - refetch: () => Promise.resolve({} as any), - hasNextPage: false, - queryKey: [] as any, - hasPreviousPage: false, - isFetchingNextPage: false, - isFetchingPreviousPage: false, - lastPageLength: 0, - bytesScanned: 0, - dataScanned: undefined, - canResumeAutoFetch: false, - resumeAutoFetch: () => {}, + renderHookWithProviders(useLogsTimeseries, { + additionalWrapper: Wrapper, + initialProps: { + enabled: true, + timeseriesIngestDelay: 0n, + tableData: { + error: null, + isError: false, + isFetching: false, + isPending: false, + data: [], + meta: { + fields: {}, + units: {}, }, - }), - {additionalWrapper: Wrapper} - ); + isRefetching: false, + isEmpty: true, + fetchNextPage: () => Promise.resolve({} as any), + fetchPreviousPage: () => Promise.resolve({} as any), + refetch: () => Promise.resolve({} as any), + hasNextPage: false, + queryKey: [] as any, + hasPreviousPage: false, + isFetchingNextPage: false, + isFetchingPreviousPage: false, + lastPageLength: 0, + bytesScanned: 0, + dataScanned: undefined, + canResumeAutoFetch: false, + resumeAutoFetch: () => {}, + }, + }, + }); expect(mockNormalRequest).toHaveBeenCalledTimes(1); expect(mockNormalRequest).toHaveBeenCalledWith( diff --git a/static/app/views/explore/logs/useSaveAsItems.spec.tsx b/static/app/views/explore/logs/useSaveAsItems.spec.tsx index a14f03761582f6..c1c9c4d053e745 100644 --- a/static/app/views/explore/logs/useSaveAsItems.spec.tsx +++ b/static/app/views/explore/logs/useSaveAsItems.spec.tsx @@ -104,18 +104,17 @@ describe('useSaveAsItems', () => { }); it('should open save query modal when save as new query is clicked', () => { - const {result} = renderHookWithProviders( - () => - useSaveAsItems({ - visualizes: [new VisualizeFunction('count()')], - groupBys: ['message.template'], - interval: '5m', - mode: Mode.AGGREGATE, - search: new MutableSearch('message:"test error"'), - sortBys: [{field: 'timestamp', kind: 'desc'}], - }), - {additionalWrapper: createWrapper()} - ); + const {result} = renderHookWithProviders(useSaveAsItems, { + additionalWrapper: createWrapper(), + initialProps: { + visualizes: [new VisualizeFunction('count()')], + groupBys: ['message.template'], + interval: '5m', + mode: Mode.AGGREGATE, + search: new MutableSearch('message:"test error"'), + sortBys: [{field: 'timestamp', kind: 'desc'}], + }, + }); const saveAsItems = result.current; const saveAsQuery = saveAsItems.find(item => item.key === 'save-query') as { @@ -162,18 +161,17 @@ describe('useSaveAsItems', () => { }) ); - const {result} = renderHookWithProviders( - () => - useSaveAsItems({ - visualizes: [new VisualizeFunction('count()')], - groupBys: ['message.template'], - interval: '5m', - mode: Mode.AGGREGATE, - search: new MutableSearch('message:"test"'), - sortBys: [{field: 'timestamp', kind: 'desc'}], - }), - {additionalWrapper: createWrapper()} - ); + const {result} = renderHookWithProviders(useSaveAsItems, { + additionalWrapper: createWrapper(), + initialProps: { + visualizes: [new VisualizeFunction('count()')], + groupBys: ['message.template'], + interval: '5m', + mode: Mode.AGGREGATE, + search: new MutableSearch('message:"test"'), + sortBys: [{field: 'timestamp', kind: 'desc'}], + }, + }); await waitFor(() => { expect(result.current.some(item => item.key === 'update-query')).toBe(true); @@ -194,18 +192,17 @@ describe('useSaveAsItems', () => { }) ); - const {result} = renderHookWithProviders( - () => - useSaveAsItems({ - visualizes: [new VisualizeFunction('count()')], - groupBys: ['message.template'], - interval: '5m', - mode: Mode.AGGREGATE, - search: new MutableSearch('message:"test"'), - sortBys: [{field: 'timestamp', kind: 'desc'}], - }), - {additionalWrapper: createWrapper()} - ); + const {result} = renderHookWithProviders(useSaveAsItems, { + additionalWrapper: createWrapper(), + initialProps: { + visualizes: [new VisualizeFunction('count()')], + groupBys: ['message.template'], + interval: '5m', + mode: Mode.AGGREGATE, + search: new MutableSearch('message:"test"'), + sortBys: [{field: 'timestamp', kind: 'desc'}], + }, + }); const saveAsItems = result.current; @@ -214,20 +211,19 @@ describe('useSaveAsItems', () => { }); it('should call saveQuery with correct parameters when modal saves', async () => { - const {result} = renderHookWithProviders( - () => - useSaveAsItems({ - visualizes: [new VisualizeFunction('count()')], - groupBys: ['message.template'], - // Note: useSaveQuery uses the value returned by useChartInterval() - // not the interval passed in as options. - interval: '5m', - mode: Mode.AGGREGATE, - search: new MutableSearch('message:"test error"'), - sortBys: [{field: 'timestamp', kind: 'desc'}], - }), - {additionalWrapper: createWrapper()} - ); + const {result} = renderHookWithProviders(useSaveAsItems, { + additionalWrapper: createWrapper(), + initialProps: { + visualizes: [new VisualizeFunction('count()')], + groupBys: ['message.template'], + // Note: useSaveQuery uses the value returned by useChartInterval() + // not the interval passed in as options. + interval: '5m', + mode: Mode.AGGREGATE, + search: new MutableSearch('message:"test error"'), + sortBys: [{field: 'timestamp', kind: 'desc'}], + }, + }); const saveAsItems = result.current; const saveAsQuery = saveAsItems.find(item => item.key === 'save-query') as { diff --git a/static/app/views/explore/logs/useStreamingTimeseriesResult.spec.tsx b/static/app/views/explore/logs/useStreamingTimeseriesResult.spec.tsx index 221185047f5ccd..4fd0b35f08af95 100644 --- a/static/app/views/explore/logs/useStreamingTimeseriesResult.spec.tsx +++ b/static/app/views/explore/logs/useStreamingTimeseriesResult.spec.tsx @@ -456,6 +456,7 @@ describe('useStreamingTimeseriesResult', () => { const mockTimeseriesData = getMockSingleAxisTimeseries(); const {result} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useStreamingTimeseriesResult(mockTableData, mockTimeseriesData, 0n), { wrapper: createWrapper({autoRefresh: 'enabled', organization: logsOrganization}), @@ -470,6 +471,7 @@ describe('useStreamingTimeseriesResult', () => { const mockTimeseriesData = getMockSingleAxisTimeseries(); const {result} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useStreamingTimeseriesResult(mockTableData, mockTimeseriesData, 0n), { wrapper: createWrapper({autoRefresh: 'idle'}), @@ -484,6 +486,7 @@ describe('useStreamingTimeseriesResult', () => { const mockTimeseriesData = getMockMultiAxisTimeseries(); const {result} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useStreamingTimeseriesResult(mockTableData, mockTimeseriesData, 0n), { wrapper: createWrapper({autoRefresh: 'idle'}), @@ -498,6 +501,7 @@ describe('useStreamingTimeseriesResult', () => { const mockTimeseriesData = getMockMultiGroupTimeseries(); const {result} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useStreamingTimeseriesResult(mockTableData, mockTimeseriesData, 0n), { wrapper: createWrapper({autoRefresh: 'idle'}), @@ -512,6 +516,7 @@ describe('useStreamingTimeseriesResult', () => { const mockTimeseriesData = getMockMultiAxisGroupTimeseries(); const {result} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useStreamingTimeseriesResult(mockTableData, mockTimeseriesData, 0n), { wrapper: createWrapper({autoRefresh: 'idle'}), diff --git a/static/app/views/explore/logs/useVirtualStreaming.spec.tsx b/static/app/views/explore/logs/useVirtualStreaming.spec.tsx index bb56977454cc03..f34c99f6c40c77 100644 --- a/static/app/views/explore/logs/useVirtualStreaming.spec.tsx +++ b/static/app/views/explore/logs/useVirtualStreaming.spec.tsx @@ -102,10 +102,11 @@ describe('useVirtualStreaming', () => { }), ]); - const {result} = renderHookWithProviders( - () => useVirtualStreaming({data: mockData}), - {additionalWrapper: createWrapper({autoRefresh: 'enabled'}), organization} - ); + const {result} = renderHookWithProviders(useVirtualStreaming, { + additionalWrapper: createWrapper({autoRefresh: 'enabled'}), + organization, + initialProps: {data: mockData}, + }); await waitFor(() => { expect(result.current.virtualStreamedTimestamp).toBeDefined(); @@ -127,10 +128,11 @@ describe('useVirtualStreaming', () => { }), ]); - const {result} = renderHookWithProviders( - () => useVirtualStreaming({data: mockData}), - {additionalWrapper: createWrapper({autoRefresh: 'idle'}), organization} - ); + const {result} = renderHookWithProviders(useVirtualStreaming, { + additionalWrapper: createWrapper({autoRefresh: 'idle'}), + organization, + initialProps: {data: mockData}, + }); expect(result.current.virtualStreamedTimestamp).toBeUndefined(); }); @@ -145,9 +147,10 @@ describe('useVirtualStreaming', () => { }), ]); - renderHookWithProviders(() => useVirtualStreaming({data: mockData}), { + renderHookWithProviders(useVirtualStreaming, { additionalWrapper: createWrapper({autoRefresh: 'enabled'}), organization, + initialProps: {data: mockData}, }); await waitFor(() => { @@ -165,10 +168,10 @@ describe('useVirtualStreaming', () => { }), ]); - const {unmount} = renderHookWithProviders( - () => useVirtualStreaming({data: mockData}), - {additionalWrapper: createWrapper({autoRefresh: 'enabled'})} - ); + const {unmount} = renderHookWithProviders(useVirtualStreaming, { + additionalWrapper: createWrapper({autoRefresh: 'enabled'}), + initialProps: {data: mockData}, + }); await waitFor(() => { expect(requestAnimationFrameSpy).toHaveBeenCalled(); @@ -177,9 +180,10 @@ describe('useVirtualStreaming', () => { unmount(); // Re-render with disabled autorefresh - renderHookWithProviders(() => useVirtualStreaming({data: mockData}), { + renderHookWithProviders(useVirtualStreaming, { additionalWrapper: createWrapper({autoRefresh: 'idle'}), organization, + initialProps: {data: mockData}, }); await waitFor(() => { diff --git a/static/app/views/explore/metrics/hooks/useMetricSamplesTable.spec.tsx b/static/app/views/explore/metrics/hooks/useMetricSamplesTable.spec.tsx index 9a431f99822af8..6cef387880baa2 100644 --- a/static/app/views/explore/metrics/hooks/useMetricSamplesTable.spec.tsx +++ b/static/app/views/explore/metrics/hooks/useMetricSamplesTable.spec.tsx @@ -54,21 +54,18 @@ describe('useMetricSamplesTable', () => { ], method: 'GET', }); - renderHookWithProviders( - () => - useMetricSamplesTable({ - traceMetric: { - name: 'test metric', - type: 'counter', - }, - fields: [], - limit: 100, - ingestionDelaySeconds: 0, - }), - { - additionalWrapper: MockMetricQueryParamsContext, - } - ); + renderHookWithProviders(useMetricSamplesTable, { + additionalWrapper: MockMetricQueryParamsContext, + initialProps: { + traceMetric: { + name: 'test metric', + type: 'counter', + }, + fields: [], + limit: 100, + ingestionDelaySeconds: 0, + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( @@ -105,21 +102,18 @@ describe('useMetricSamplesTable', () => { method: 'GET', }); - renderHookWithProviders( - () => - useMetricSamplesTable({ - traceMetric: { - name: 'test.metric', - type: 'counter', - }, - fields: ['trace', 'timestamp'], - limit: 50, - ingestionDelaySeconds: 0, - }), - { - additionalWrapper: MockMetricQueryParamsContext, - } - ); + renderHookWithProviders(useMetricSamplesTable, { + additionalWrapper: MockMetricQueryParamsContext, + initialProps: { + traceMetric: { + name: 'test.metric', + type: 'counter', + }, + fields: ['trace', 'timestamp'], + limit: 50, + ingestionDelaySeconds: 0, + }, + }); await waitFor(() => { expect(mockRequest).toHaveBeenCalledTimes(1); diff --git a/static/app/views/explore/metrics/useSaveAsMetricItems.spec.tsx b/static/app/views/explore/metrics/useSaveAsMetricItems.spec.tsx index 03f8667d566e02..80b60820a0d8a8 100644 --- a/static/app/views/explore/metrics/useSaveAsMetricItems.spec.tsx +++ b/static/app/views/explore/metrics/useSaveAsMetricItems.spec.tsx @@ -64,13 +64,12 @@ describe('useSaveAsMetricItems', () => { }); it('should open save query modal when save as new query is clicked', () => { - const {result} = renderHook( - () => - useSaveAsMetricItems({ - interval: '5m', - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSaveAsMetricItems, { + wrapper: createWrapper(), + initialProps: { + interval: '5m', + }, + }); const saveAsItems = result.current; const saveAsQuery = saveAsItems.find(item => item.key === 'save-query') as { @@ -115,13 +114,12 @@ describe('useSaveAsMetricItems', () => { }) ); - const {result} = renderHook( - () => - useSaveAsMetricItems({ - interval: '5m', - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSaveAsMetricItems, { + wrapper: createWrapper(), + initialProps: { + interval: '5m', + }, + }); await waitFor(() => { expect(result.current.some(item => item.key === 'update-query')).toBe(true); @@ -140,13 +138,12 @@ describe('useSaveAsMetricItems', () => { }) ); - const {result} = renderHook( - () => - useSaveAsMetricItems({ - interval: '5m', - }), - {wrapper: createWrapper()} - ); + const {result} = renderHook(useSaveAsMetricItems, { + wrapper: createWrapper(), + initialProps: { + interval: '5m', + }, + }); const saveAsItems = result.current; @@ -159,23 +156,20 @@ describe('useSaveAsMetricItems', () => { features: [], }); - const {result} = renderHook( - () => - useSaveAsMetricItems({ - interval: '5m', - }), - { - wrapper: function ({children}: {children?: React.ReactNode}) { - return ( - - - {children} - - - ); - }, - } - ); + const {result} = renderHook(useSaveAsMetricItems, { + wrapper: function ({children}: {children?: React.ReactNode}) { + return ( + + + {children} + + + ); + }, + initialProps: { + interval: '5m', + }, + }); const saveAsItems = result.current; expect(saveAsItems).toEqual([]); diff --git a/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTable.spec.tsx b/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTable.spec.tsx index 218ac42488e359..ce08e4059101fd 100644 --- a/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTable.spec.tsx +++ b/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTable.spec.tsx @@ -88,15 +88,15 @@ describe('useMultiQueryTable', () => { ], method: 'GET', }); - renderHookWithProviders(() => - hook({ + renderHookWithProviders(hook, { + initialProps: { enabled: true, groupBys: [], query: 'test value', sortBys: [], yAxes: [], - }) - ); + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( diff --git a/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTimeseries.spec.tsx b/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTimeseries.spec.tsx index d1fdddfbd5bbe5..f7f0813d3b4e44 100644 --- a/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTimeseries.spec.tsx +++ b/static/app/views/explore/multiQueryMode/hooks/useMultiQueryTimeseries.spec.tsx @@ -70,12 +70,12 @@ describe('useMultiQueryTimeseries', () => { ], method: 'GET', }); - renderHookWithProviders(() => - useMultiQueryTimeseries({ + renderHookWithProviders(useMultiQueryTimeseries, { + initialProps: { enabled: true, index: 0, - }) - ); + }, + }); expect(mockNormalRequestUrl).toHaveBeenCalledTimes(1); expect(mockNormalRequestUrl).toHaveBeenCalledWith( diff --git a/static/app/views/explore/queryParams/context.spec.tsx b/static/app/views/explore/queryParams/context.spec.tsx index 9f5e0ef389342c..f96040e8aeab1b 100644 --- a/static/app/views/explore/queryParams/context.spec.tsx +++ b/static/app/views/explore/queryParams/context.spec.tsx @@ -57,7 +57,7 @@ describe('QueryParamsContext', () => { describe('crossEvents', () => { describe('useQueryParamsCrossEvents', () => { it('should return the crossEvents', () => { - const {result} = renderHookWithProviders(() => useQueryParamsCrossEvents(), { + const {result} = renderHookWithProviders(useQueryParamsCrossEvents, { additionalWrapper: Wrapper, }); @@ -68,6 +68,7 @@ describe('QueryParamsContext', () => { describe('useSetQueryParamsCrossEvents', () => { it('should set the crossEvents', () => { renderHookWithProviders( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => { const setCrossEvents = useSetQueryParamsCrossEvents(); setCrossEvents([{query: 'bar', type: 'logs'}]); diff --git a/static/app/views/insights/pages/agents/hooks/useTableCursor.spec.tsx b/static/app/views/insights/pages/agents/hooks/useTableCursor.spec.tsx index 3f1ef6f59d2b40..434e98a649009e 100644 --- a/static/app/views/insights/pages/agents/hooks/useTableCursor.spec.tsx +++ b/static/app/views/insights/pages/agents/hooks/useTableCursor.spec.tsx @@ -4,7 +4,7 @@ import {useTableCursor} from 'sentry/views/insights/pages/agents/hooks/useTableC describe('useTableCursor', () => { it('should return undefined cursor when query param is not present', () => { - const {result} = renderHookWithProviders(() => useTableCursor(), { + const {result} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', @@ -17,7 +17,7 @@ describe('useTableCursor', () => { }); it('should return cursor value from query params', () => { - const {result} = renderHookWithProviders(() => useTableCursor(), { + const {result} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', @@ -30,7 +30,7 @@ describe('useTableCursor', () => { }); it('should update cursor value when setCursor is called', async () => { - const {result, router} = renderHookWithProviders(() => useTableCursor(), { + const {result, router} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', @@ -53,7 +53,7 @@ describe('useTableCursor', () => { }); it('should replace old cursor with new cursor value', async () => { - const {result, router} = renderHookWithProviders(() => useTableCursor(), { + const {result, router} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', @@ -76,7 +76,7 @@ describe('useTableCursor', () => { }); it('should clear cursor when unsetCursor is called', async () => { - const {result, router} = renderHookWithProviders(() => useTableCursor(), { + const {result, router} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', @@ -99,7 +99,7 @@ describe('useTableCursor', () => { }); it('should handle undefined cursor in setCursor (e.g., navigating to first page)', async () => { - const {result, router} = renderHookWithProviders(() => useTableCursor(), { + const {result, router} = renderHookWithProviders(useTableCursor, { initialRouterConfig: { location: { pathname: '/', diff --git a/static/app/views/insights/pages/conversations/hooks/useConversation.spec.tsx b/static/app/views/insights/pages/conversations/hooks/useConversation.spec.tsx index 7753b62e39e0b2..a0c0be1e453e89 100644 --- a/static/app/views/insights/pages/conversations/hooks/useConversation.spec.tsx +++ b/static/app/views/insights/pages/conversations/hooks/useConversation.spec.tsx @@ -14,10 +14,10 @@ describe('useConversation', () => { }); it('returns empty nodes when conversationId is empty', () => { - const {result} = renderHookWithProviders( - () => useConversation({conversationId: ''}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: ''}, + }); expect(result.current.nodes).toEqual([]); expect(result.current.isLoading).toBe(false); @@ -50,10 +50,10 @@ describe('useConversation', () => { ], }); - const {result} = renderHookWithProviders( - () => useConversation({conversationId: 'conv-123'}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: 'conv-123'}, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); @@ -92,10 +92,10 @@ describe('useConversation', () => { ], }); - const {result} = renderHookWithProviders( - () => useConversation({conversationId: 'conv-output'}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: 'conv-output'}, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); @@ -134,10 +134,10 @@ describe('useConversation', () => { ], }); - const {result} = renderHookWithProviders( - () => useConversation({conversationId: 'conv-456'}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: 'conv-456'}, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); @@ -172,10 +172,10 @@ describe('useConversation', () => { ], }); - const {result} = renderHookWithProviders( - () => useConversation({conversationId: 'conv-789'}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: 'conv-789'}, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); @@ -214,15 +214,14 @@ describe('useConversation', () => { const startTimestamp = 1700000000000; // Nov 14, 2023 const endTimestamp = 1700100000000; // ~1.16 days later - const {result} = renderHookWithProviders( - () => - useConversation({ - conversationId: 'conv-timestamps', - startTimestamp, - endTimestamp, - }), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: { + conversationId: 'conv-timestamps', + startTimestamp, + endTimestamp, + }, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); @@ -275,10 +274,10 @@ describe('useConversation', () => { ], }); - const {result} = renderHookWithProviders( - () => useConversation({conversationId: 'conv-filter'}), - {organization} - ); + const {result} = renderHookWithProviders(useConversation, { + organization, + initialProps: {conversationId: 'conv-filter'}, + }); await waitFor(() => { expect(result.current.isLoading).toBe(false); diff --git a/static/app/views/issueDetails/streamline/eventList.spec.tsx b/static/app/views/issueDetails/streamline/eventList.spec.tsx index 9790b57bff8405..e738a15f3748d9 100644 --- a/static/app/views/issueDetails/streamline/eventList.spec.tsx +++ b/static/app/views/issueDetails/streamline/eventList.spec.tsx @@ -84,6 +84,7 @@ describe('EventList', () => { it('renders the list using a discover event query', async () => { renderAllEvents(); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function const {result} = renderHook(() => useEventColumns(group, organization)); expect(await screen.findByText('All Events')).toBeInTheDocument(); diff --git a/static/app/views/issueDetails/streamline/hooks/useCopyIssueDetails.spec.tsx b/static/app/views/issueDetails/streamline/hooks/useCopyIssueDetails.spec.tsx index 0b95933b75f7dc..1278352af85083 100644 --- a/static/app/views/issueDetails/streamline/hooks/useCopyIssueDetails.spec.tsx +++ b/static/app/views/issueDetails/streamline/hooks/useCopyIssueDetails.spec.tsx @@ -390,6 +390,7 @@ describe('useCopyIssueDetails', () => { }); it('calls useCopyToClipboard hook', () => { + // eslint-disable-next-line @sentry/no-renderHook-arrow-function renderHook(() => useCopyIssueDetails(group, event)); // Check that the hook was called @@ -399,6 +400,7 @@ describe('useCopyIssueDetails', () => { it('sets up hotkeys with the correct callbacks', () => { const useHotkeysMock = jest.spyOn(require('sentry/utils/useHotkeys'), 'useHotkeys'); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function renderHook(() => useCopyIssueDetails(group, event)); expect(useHotkeysMock).toHaveBeenCalledWith([ @@ -423,6 +425,7 @@ describe('useCopyIssueDetails', () => { return Promise.resolve(text); }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function renderHook(() => useCopyIssueDetails(group, undefined)); // Trigger the keyboard event (command+alt+c) @@ -451,6 +454,7 @@ describe('useCopyIssueDetails', () => { return Promise.resolve(text); }); + // eslint-disable-next-line @sentry/no-renderHook-arrow-function renderHook(() => useCopyIssueDetails(group, event)); // Trigger the keyboard event (command+alt+c) diff --git a/static/app/views/issueDetails/streamline/hooks/useEventQuery.spec.tsx b/static/app/views/issueDetails/streamline/hooks/useEventQuery.spec.tsx index 207006f94c94ca..c07625ecc63b69 100644 --- a/static/app/views/issueDetails/streamline/hooks/useEventQuery.spec.tsx +++ b/static/app/views/issueDetails/streamline/hooks/useEventQuery.spec.tsx @@ -11,7 +11,7 @@ describe('useEventQuery', () => { it('filters issue tokens from event queries', () => { const validQuery = `${tagKey}:${tagValue} device.family:[iphone,pixel]`; - const {result: onlyIssueTokens} = renderHookWithProviders(() => useEventQuery(), { + const {result: onlyIssueTokens} = renderHookWithProviders(useEventQuery, { initialRouterConfig: { location: { pathname: '/issues/1234/', @@ -22,7 +22,7 @@ describe('useEventQuery', () => { }); expect(onlyIssueTokens.current).toBe(''); - const {result: combinedTokens} = renderHookWithProviders(() => useEventQuery(), { + const {result: combinedTokens} = renderHookWithProviders(useEventQuery, { initialRouterConfig: { location: { pathname: '/issues/1234/', @@ -33,7 +33,7 @@ describe('useEventQuery', () => { }); expect(combinedTokens.current).toBe(validQuery); - const {result: onlyEventTokens} = renderHookWithProviders(() => useEventQuery(), { + const {result: onlyEventTokens} = renderHookWithProviders(useEventQuery, { initialRouterConfig: { location: { pathname: '/issues/1234/', diff --git a/static/app/views/onboarding/useConfigureSdk.spec.tsx b/static/app/views/onboarding/useConfigureSdk.spec.tsx index 2d439987de32e5..ae84b850a12f30 100644 --- a/static/app/views/onboarding/useConfigureSdk.spec.tsx +++ b/static/app/views/onboarding/useConfigureSdk.spec.tsx @@ -79,13 +79,17 @@ describe('useConfigureSdk', () => { }); it('returns loading state correctly', () => { - const {result} = renderHookWithProviders(() => useConfigureSdk({onComplete})); + const {result} = renderHookWithProviders(useConfigureSdk, { + initialProps: {onComplete}, + }); expect(result.current.isLoadingData).toBe(true); }); it('opens the framework suggestion modal if platform is supported', async () => { - const {result} = renderHookWithProviders(() => useConfigureSdk({onComplete})); + const {result} = renderHookWithProviders(useConfigureSdk, { + initialProps: {onComplete}, + }); await act(async () => { await result.current.configureSdk(frameworkModalSupportedPlatform); @@ -95,7 +99,9 @@ describe('useConfigureSdk', () => { }); it('does not open the framework suggestion modal if platform is not supported', async () => { - const {result} = renderHookWithProviders(() => useConfigureSdk({onComplete})); + const {result} = renderHookWithProviders(useConfigureSdk, { + initialProps: {onComplete}, + }); await act(async () => { await result.current.configureSdk(notFrameworkModalSupportedPlatform); @@ -106,7 +112,9 @@ describe('useConfigureSdk', () => { }); it('creates project only once even if called multiple times', async () => { - const {result} = renderHookWithProviders(() => useConfigureSdk({onComplete})); + const {result} = renderHookWithProviders(useConfigureSdk, { + initialProps: {onComplete}, + }); mockCreateProject.mockImplementation( () => new Promise(resolve => setTimeout(resolve, 10)) diff --git a/static/app/views/performance/newTraceDetails/traceApi/useTrace.spec.tsx b/static/app/views/performance/newTraceDetails/traceApi/useTrace.spec.tsx index 9361fc6a4681e1..79fe294bcd0e1d 100644 --- a/static/app/views/performance/newTraceDetails/traceApi/useTrace.spec.tsx +++ b/static/app/views/performance/newTraceDetails/traceApi/useTrace.spec.tsx @@ -48,11 +48,11 @@ describe('useTrace', () => { body: [], }); - renderHookWithProviders(() => - useTrace({ + renderHookWithProviders(useTrace, { + initialProps: { traceSlug: 'test-trace-id', - }) - ); + }, + }); // Wait for the hook to make the API call await waitFor(() => { @@ -134,11 +134,11 @@ describe('useTrace', () => { body: [], }); - renderHookWithProviders(() => - useTrace({ + renderHookWithProviders(useTrace, { + initialProps: { traceSlug: 'trace-test-id', - }) - ); + }, + }); await waitFor(() => { expect(eapTraceMock).toHaveBeenCalled(); diff --git a/static/app/views/performance/newTraceDetails/traceApi/useTraceMeta.spec.tsx b/static/app/views/performance/newTraceDetails/traceApi/useTraceMeta.spec.tsx index 2835ab1e8fd105..6dba871e310d49 100644 --- a/static/app/views/performance/newTraceDetails/traceApi/useTraceMeta.spec.tsx +++ b/static/app/views/performance/newTraceDetails/traceApi/useTraceMeta.spec.tsx @@ -82,8 +82,9 @@ describe('useTraceMeta', () => { }, }); - const {result} = renderHookWithProviders(() => useTraceMeta(mockedReplayTraces), { + const {result} = renderHookWithProviders(useTraceMeta, { organization, + initialProps: mockedReplayTraces, }); expect(result.current).toEqual({ @@ -170,8 +171,9 @@ describe('useTraceMeta', () => { }, }); - const {result} = renderHookWithProviders(() => useTraceMeta(mockedReplayTraces), { + const {result} = renderHookWithProviders(useTraceMeta, { organization: org, + initialProps: mockedReplayTraces, }); expect(result.current).toEqual({ @@ -222,8 +224,9 @@ describe('useTraceMeta', () => { statusCode: 400, }); - const {result} = renderHookWithProviders(() => useTraceMeta(mockedReplayTraces), { + const {result} = renderHookWithProviders(useTraceMeta, { organization, + initialProps: mockedReplayTraces, }); expect(result.current).toEqual({ @@ -290,8 +293,9 @@ describe('useTraceMeta', () => { }, }); - const {result} = renderHookWithProviders(() => useTraceMeta(mockedReplayTraces), { + const {result} = renderHookWithProviders(useTraceMeta, { organization, + initialProps: mockedReplayTraces, }); expect(result.current).toEqual({ diff --git a/static/app/views/performance/newTraceDetails/traceApi/useTraceTree.spec.tsx b/static/app/views/performance/newTraceDetails/traceApi/useTraceTree.spec.tsx index 51189c27276c57..281599a698346d 100644 --- a/static/app/views/performance/newTraceDetails/traceApi/useTraceTree.spec.tsx +++ b/static/app/views/performance/newTraceDetails/traceApi/useTraceTree.spec.tsx @@ -33,15 +33,14 @@ const contextWrapper = () => { describe('useTraceTree', () => { it('returns tree for error case', async () => { - const {result} = renderHookWithProviders( - () => - useTraceTree({ - trace: getMockedTraceResults('error'), - traceSlug: 'test-trace', - replay: null, - }), - {additionalWrapper: contextWrapper()} - ); + const {result} = renderHookWithProviders(useTraceTree, { + additionalWrapper: contextWrapper(), + initialProps: { + trace: getMockedTraceResults('error'), + traceSlug: 'test-trace', + replay: null, + }, + }); await waitFor(() => { expect(result.current.type).toBe('error'); @@ -49,15 +48,14 @@ describe('useTraceTree', () => { }); it('returns tree for loading case', async () => { - const {result} = renderHookWithProviders( - () => - useTraceTree({ - trace: getMockedTraceResults('pending'), - traceSlug: 'test-trace', - replay: null, - }), - {additionalWrapper: contextWrapper()} - ); + const {result} = renderHookWithProviders(useTraceTree, { + additionalWrapper: contextWrapper(), + initialProps: { + trace: getMockedTraceResults('pending'), + traceSlug: 'test-trace', + replay: null, + }, + }); await waitFor(() => { expect(result.current.type).toBe('loading'); @@ -65,18 +63,17 @@ describe('useTraceTree', () => { }); it('returns tree for empty success case', async () => { - const {result} = renderHookWithProviders( - () => - useTraceTree({ - trace: getMockedTraceResults('success', { - transactions: [], - orphan_errors: [], - }), - traceSlug: 'test-trace', - replay: null, + const {result} = renderHookWithProviders(useTraceTree, { + additionalWrapper: contextWrapper(), + initialProps: { + trace: getMockedTraceResults('success', { + transactions: [], + orphan_errors: [], }), - {additionalWrapper: contextWrapper()} - ); + traceSlug: 'test-trace', + replay: null, + }, + }); await waitFor(() => { expect(result.current.type).toBe('empty'); @@ -119,15 +116,14 @@ describe('useTraceTree', () => { ], }; - const {result} = renderHookWithProviders( - () => - useTraceTree({ - trace: getMockedTraceResults('success', mockedTrace), - traceSlug: 'test-trace', - replay: null, - }), - {additionalWrapper: contextWrapper()} - ); + const {result} = renderHookWithProviders(useTraceTree, { + additionalWrapper: contextWrapper(), + initialProps: { + trace: getMockedTraceResults('success', mockedTrace), + traceSlug: 'test-trace', + replay: null, + }, + }); await waitFor(() => { expect(result.current.type).toBe('trace'); diff --git a/static/app/views/prevent/tests/queries/useGetActiveIntegratedOrgs.spec.tsx b/static/app/views/prevent/tests/queries/useGetActiveIntegratedOrgs.spec.tsx index 5b13e9dbb48e8f..ad0ad2be7b60af 100644 --- a/static/app/views/prevent/tests/queries/useGetActiveIntegratedOrgs.spec.tsx +++ b/static/app/views/prevent/tests/queries/useGetActiveIntegratedOrgs.spec.tsx @@ -30,10 +30,10 @@ describe('useGetActiveIntegratedOrgs', () => { body: mockIntegrations, }); - const {result} = renderHookWithProviders( - () => useGetActiveIntegratedOrgs({organization}), - {organization} - ); + const {result} = renderHookWithProviders(useGetActiveIntegratedOrgs, { + organization, + initialProps: {organization}, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -70,10 +70,10 @@ describe('useGetActiveIntegratedOrgs', () => { body: mockIntegrations, }); - const {result} = renderHookWithProviders( - () => useGetActiveIntegratedOrgs({organization}), - {organization} - ); + const {result} = renderHookWithProviders(useGetActiveIntegratedOrgs, { + organization, + initialProps: {organization}, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -91,10 +91,10 @@ describe('useGetActiveIntegratedOrgs', () => { body: {detail: 'Repository not found'}, }); - const {result} = renderHookWithProviders( - () => useGetActiveIntegratedOrgs({organization}), - {organization} - ); + const {result} = renderHookWithProviders(useGetActiveIntegratedOrgs, { + organization, + initialProps: {organization}, + }); await waitFor(() => { expect(result.current.isError).toBe(true); diff --git a/static/app/views/prevent/tests/queries/useGetTestResults.spec.tsx b/static/app/views/prevent/tests/queries/useGetTestResults.spec.tsx index 9479d0a577a0b5..0032f427758844 100644 --- a/static/app/views/prevent/tests/queries/useGetTestResults.spec.tsx +++ b/static/app/views/prevent/tests/queries/useGetTestResults.spec.tsx @@ -98,9 +98,10 @@ describe('useInfiniteTestResults', () => { ); - const {result} = renderHookWithProviders(() => useInfiniteTestResults({}), { + const {result} = renderHookWithProviders(useInfiniteTestResults, { additionalWrapper, organization, + initialProps: {}, }); await waitFor(() => { @@ -152,17 +153,14 @@ describe('useInfiniteTestResults', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteTestResults({ - cursor: 'next-cursor', - navigation: 'next', - }), - { - additionalWrapper, - organization, - } - ); + const {result} = renderHookWithProviders(useInfiniteTestResults, { + additionalWrapper, + organization, + initialProps: { + cursor: 'next-cursor', + navigation: 'next', + }, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -194,9 +192,10 @@ describe('useInfiniteTestResults', () => { ); - const {result} = renderHookWithProviders(() => useInfiniteTestResults({}), { + const {result} = renderHookWithProviders(useInfiniteTestResults, { additionalWrapper, organization, + initialProps: {}, }); await waitFor(() => { @@ -226,9 +225,10 @@ describe('useInfiniteTestResults', () => { ); - const {result} = renderHookWithProviders(() => useInfiniteTestResults({}), { + const {result} = renderHookWithProviders(useInfiniteTestResults, { additionalWrapper, organization, + initialProps: {}, }); await waitFor(() => { @@ -277,9 +277,10 @@ describe('useInfiniteTestResults', () => { ); - const {result} = renderHookWithProviders(() => useInfiniteTestResults({}), { + const {result} = renderHookWithProviders(useInfiniteTestResults, { additionalWrapper, organization, + initialProps: {}, }); await waitFor(() => { diff --git a/static/app/views/prevent/tests/queries/useRepo.spec.tsx b/static/app/views/prevent/tests/queries/useRepo.spec.tsx index ee1f6680187705..c4f6573211d7af 100644 --- a/static/app/views/prevent/tests/queries/useRepo.spec.tsx +++ b/static/app/views/prevent/tests/queries/useRepo.spec.tsx @@ -37,7 +37,7 @@ describe('useRepo', () => { ); - const {result} = renderHookWithProviders(() => useRepo(), { + const {result} = renderHookWithProviders(useRepo, { additionalWrapper, organization, }); @@ -66,7 +66,7 @@ describe('useRepo', () => { ); - const {result} = renderHookWithProviders(() => useRepo(), { + const {result} = renderHookWithProviders(useRepo, { additionalWrapper, organization, }); diff --git a/static/app/views/prevent/tokens/repoTokenTable/hooks/useInfiniteRepositoryTokens.spec.tsx b/static/app/views/prevent/tokens/repoTokenTable/hooks/useInfiniteRepositoryTokens.spec.tsx index ba2454bc7cec69..99b5617cb9d481 100644 --- a/static/app/views/prevent/tokens/repoTokenTable/hooks/useInfiniteRepositoryTokens.spec.tsx +++ b/static/app/views/prevent/tokens/repoTokenTable/hooks/useInfiniteRepositoryTokens.spec.tsx @@ -68,17 +68,14 @@ describe('useInfiniteRepositoryTokens', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteRepositoryTokens({ - cursor: undefined, - navigation: undefined, - }), - { - organization, - additionalWrapper, - } - ); + const {result} = renderHookWithProviders(useInfiniteRepositoryTokens, { + organization, + additionalWrapper, + initialProps: { + cursor: undefined, + navigation: undefined, + }, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -120,17 +117,14 @@ describe('useInfiniteRepositoryTokens', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteRepositoryTokens({ - cursor: 'next-cursor', - navigation: 'next', - }), - { - organization, - additionalWrapper, - } - ); + const {result} = renderHookWithProviders(useInfiniteRepositoryTokens, { + organization, + additionalWrapper, + initialProps: { + cursor: 'next-cursor', + navigation: 'next', + }, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -155,17 +149,14 @@ describe('useInfiniteRepositoryTokens', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteRepositoryTokens({ - cursor: undefined, - navigation: undefined, - }), - { - organization, - additionalWrapper, - } - ); + const {result} = renderHookWithProviders(useInfiniteRepositoryTokens, { + organization, + additionalWrapper, + initialProps: { + cursor: undefined, + navigation: undefined, + }, + }); await waitFor(() => { expect(result.current.isSuccess).toBe(true); @@ -194,17 +185,14 @@ describe('useInfiniteRepositoryTokens', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteRepositoryTokens({ - cursor: undefined, - navigation: undefined, - }), - { - additionalWrapper, - organization, - } - ); + const {result} = renderHookWithProviders(useInfiniteRepositoryTokens, { + additionalWrapper, + organization, + initialProps: { + cursor: undefined, + navigation: undefined, + }, + }); await waitFor(() => { expect(result.current.isError).toBe(true); @@ -229,17 +217,14 @@ describe('useInfiniteRepositoryTokens', () => { ); - const {result} = renderHookWithProviders( - () => - useInfiniteRepositoryTokens({ - cursor: undefined, - navigation: undefined, - }), - { - additionalWrapper, - organization, - } - ); + const {result} = renderHookWithProviders(useInfiniteRepositoryTokens, { + additionalWrapper, + organization, + initialProps: { + cursor: undefined, + navigation: undefined, + }, + }); expect(result.current.data).toHaveLength(0); expect(result.current.totalCount).toBe(0); diff --git a/static/app/views/prevent/tokens/repoTokenTable/hooks/useRegenerateRepositoryToken.spec.tsx b/static/app/views/prevent/tokens/repoTokenTable/hooks/useRegenerateRepositoryToken.spec.tsx index 9a084ece9df39e..d8c7190fa64ebb 100644 --- a/static/app/views/prevent/tokens/repoTokenTable/hooks/useRegenerateRepositoryToken.spec.tsx +++ b/static/app/views/prevent/tokens/repoTokenTable/hooks/useRegenerateRepositoryToken.spec.tsx @@ -43,7 +43,7 @@ describe('useRegenerateRepositoryToken', () => { body: {token: mockToken}, }); - const {result} = renderHook(() => useRegenerateRepositoryToken(), {wrapper}); + const {result} = renderHook(useRegenerateRepositoryToken, {wrapper}); result.current.mutate(mockVariables); @@ -70,7 +70,7 @@ describe('useRegenerateRepositoryToken', () => { body: {detail: 'Internal server error'}, }); - const {result} = renderHook(() => useRegenerateRepositoryToken(), {wrapper}); + const {result} = renderHook(useRegenerateRepositoryToken, {wrapper}); result.current.mutate(mockVariables); @@ -93,7 +93,7 @@ describe('useRegenerateRepositoryToken', () => { const invalidateQueriesSpy = jest.spyOn(queryClient, 'invalidateQueries'); - const {result} = renderHook(() => useRegenerateRepositoryToken(), {wrapper}); + const {result} = renderHook(useRegenerateRepositoryToken, {wrapper}); result.current.mutate(mockVariables); diff --git a/static/app/views/replays/detail/ai/useReplaySummary.spec.tsx b/static/app/views/replays/detail/ai/useReplaySummary.spec.tsx index a0269f96ba9c97..e45da89be4cf45 100644 --- a/static/app/views/replays/detail/ai/useReplaySummary.spec.tsx +++ b/static/app/views/replays/detail/ai/useReplaySummary.spec.tsx @@ -55,8 +55,9 @@ describe('useReplaySummary', () => { body: mockSummaryData, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); await waitFor(() => { @@ -73,8 +74,9 @@ describe('useReplaySummary', () => { statusCode: 500, body: {detail: 'Internal server error'}, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); await waitFor(() => { @@ -96,6 +98,7 @@ describe('useReplaySummary', () => { }); const {result} = renderHookWithProviders( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useReplaySummary(mockReplay, {enabled: false, staleTime: 0}), { organization: mockOrganization, @@ -118,6 +121,7 @@ describe('useReplaySummary', () => { }); const {result} = renderHookWithProviders( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => useReplaySummary(mockReplay, {enabled: true, staleTime: 0}), { organization: mockOrganization, @@ -142,8 +146,9 @@ describe('useReplaySummary', () => { body: responsePromise, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); // Wait for the return value to be in pending state @@ -165,8 +170,9 @@ describe('useReplaySummary', () => { body: {status: ReplaySummaryStatus.PROCESSING, data: undefined}, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); await waitFor(() => { @@ -184,8 +190,9 @@ describe('useReplaySummary', () => { }, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); await waitFor(() => { @@ -200,8 +207,9 @@ describe('useReplaySummary', () => { body: {status: ReplaySummaryStatus.ERROR, data: undefined}, }); - const {result} = renderHookWithProviders(() => useReplaySummary(mockReplay), { + const {result} = renderHookWithProviders(useReplaySummary, { organization: mockOrganization, + initialProps: mockReplay, }); await waitFor(() => { @@ -227,12 +235,10 @@ describe('useReplaySummary', () => { method: 'POST', }); - const {result, rerender} = renderHookWithProviders( - () => useReplaySummary(mockReplay), - { - organization: mockOrganization, - } - ); + const {result, rerender} = renderHookWithProviders(useReplaySummary, { + organization: mockOrganization, + initialProps: mockReplay, + }); await waitFor(() => { expect(result.current.isPending).toBe(false); @@ -243,7 +249,7 @@ describe('useReplaySummary', () => { // Update the segment count and expect a POST. mockReplayRecord.count_segments = 2; mockReplay.getReplay = jest.fn().mockReturnValue(mockReplayRecord); - rerender(); + rerender(mockReplay); await waitFor(() => { expect(mockPostRequest).toHaveBeenCalledWith( diff --git a/static/app/views/replays/detail/trace/useReplayTraces.spec.tsx b/static/app/views/replays/detail/trace/useReplayTraces.spec.tsx index dceed74b97687f..d6f3dd5075b0ff 100644 --- a/static/app/views/replays/detail/trace/useReplayTraces.spec.tsx +++ b/static/app/views/replays/detail/trace/useReplayTraces.spec.tsx @@ -35,7 +35,9 @@ describe('useTraceMeta', () => { }, }); - const {result} = renderHookWithProviders(() => useReplayTraces({replayRecord})); + const {result} = renderHookWithProviders(useReplayTraces, { + initialProps: {replayRecord}, + }); expect(result.current.indexComplete).toBe(false); @@ -61,7 +63,9 @@ describe('useTraceMeta', () => { statusCode: 400, }); - const {result} = renderHookWithProviders(() => useReplayTraces({replayRecord})); + const {result} = renderHookWithProviders(useReplayTraces, { + initialProps: {replayRecord}, + }); expect(result.current.indexComplete).toBe(false); diff --git a/static/app/views/seerExplorer/hooks/useBlockNavigation.spec.tsx b/static/app/views/seerExplorer/hooks/useBlockNavigation.spec.tsx index 7fa4c26d5269a4..3d9cbc6b0adcb0 100644 --- a/static/app/views/seerExplorer/hooks/useBlockNavigation.spec.tsx +++ b/static/app/views/seerExplorer/hooks/useBlockNavigation.spec.tsx @@ -86,7 +86,7 @@ describe('useBlockNavigation', () => { describe('Arrow Key Navigation', () => { it('moves from input to last block on ArrowUp', () => { - renderHook(() => useBlockNavigation(defaultProps)); + renderHook(useBlockNavigation, {initialProps: defaultProps}); // Simulate ArrowUp keydown const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); @@ -102,7 +102,7 @@ describe('useBlockNavigation', () => { it('moves up through blocks on ArrowUp', () => { const props = {...defaultProps, focusedBlockIndex: 2}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); document.dispatchEvent(event); @@ -116,7 +116,7 @@ describe('useBlockNavigation', () => { it('does not move up from first block', () => { const props = {...defaultProps, focusedBlockIndex: 0}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); document.dispatchEvent(event); @@ -127,7 +127,7 @@ describe('useBlockNavigation', () => { it('moves down through blocks on ArrowDown', () => { const props = {...defaultProps, focusedBlockIndex: 0}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowDown'}); document.dispatchEvent(event); @@ -141,7 +141,7 @@ describe('useBlockNavigation', () => { it('moves from last block to input on ArrowDown', () => { const props = {...defaultProps, focusedBlockIndex: 2}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowDown'}); document.dispatchEvent(event); @@ -155,7 +155,7 @@ describe('useBlockNavigation', () => { }); it('does nothing on ArrowDown when already at input', () => { - renderHook(() => useBlockNavigation(defaultProps)); + renderHook(useBlockNavigation, {initialProps: defaultProps}); const event = new KeyboardEvent('keydown', {key: 'ArrowDown'}); document.dispatchEvent(event); @@ -167,7 +167,7 @@ describe('useBlockNavigation', () => { describe('Tab Navigation', () => { it('always returns to input on Tab', () => { const props = {...defaultProps, focusedBlockIndex: 1}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'Tab'}); document.dispatchEvent(event); @@ -181,7 +181,7 @@ describe('useBlockNavigation', () => { }); it('focuses textarea even when already at input', () => { - renderHook(() => useBlockNavigation(defaultProps)); + renderHook(useBlockNavigation, {initialProps: defaultProps}); const event = new KeyboardEvent('keydown', {key: 'Tab'}); document.dispatchEvent(event); @@ -194,7 +194,7 @@ describe('useBlockNavigation', () => { describe('Panel State Control', () => { it('ignores keyboard events when panel is closed', () => { const props = {...defaultProps, isOpen: false}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); document.dispatchEvent(event); @@ -204,7 +204,7 @@ describe('useBlockNavigation', () => { it('responds to keyboard events when panel is open', () => { const props = {...defaultProps, isOpen: true}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'Tab'}); document.dispatchEvent(event); @@ -220,7 +220,7 @@ describe('useBlockNavigation', () => { blocks: [], blockRefs: {current: []}, }; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); document.dispatchEvent(event); @@ -237,7 +237,7 @@ describe('useBlockNavigation', () => { blocks: singleBlock, blockRefs: {current: [createMockElement()]}, }; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); // ArrowUp from input should go to block 0 const arrowUpEvent = new KeyboardEvent('keydown', {key: 'ArrowUp'}); @@ -246,7 +246,7 @@ describe('useBlockNavigation', () => { // ArrowDown from block 0 should go to input const propsAtBlock0 = {...props, focusedBlockIndex: 0}; - renderHook(() => useBlockNavigation(propsAtBlock0)); + renderHook(useBlockNavigation, {initialProps: propsAtBlock0}); const arrowDownEvent = new KeyboardEvent('keydown', {key: 'ArrowDown'}); document.dispatchEvent(arrowDownEvent); @@ -257,7 +257,7 @@ describe('useBlockNavigation', () => { describe('Event Cleanup', () => { it('removes event listener on unmount', () => { const removeEventListenerSpy = jest.spyOn(document, 'removeEventListener'); - const {unmount} = renderHook(() => useBlockNavigation(defaultProps)); + const {unmount} = renderHook(useBlockNavigation, {initialProps: defaultProps}); unmount(); @@ -298,7 +298,7 @@ describe('useBlockNavigation', () => { ...defaultProps, blockRefs: {current: [null, testElement2, testElement3]}, }; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'ArrowUp'}); document.dispatchEvent(event); @@ -313,7 +313,7 @@ describe('useBlockNavigation', () => { it('handles null textarea ref gracefully', () => { const props = {...defaultProps, textareaRef: {current: null}}; - renderHook(() => useBlockNavigation(props)); + renderHook(useBlockNavigation, {initialProps: props}); const event = new KeyboardEvent('keydown', {key: 'Tab'}); document.dispatchEvent(event); diff --git a/static/app/views/seerExplorer/hooks/useSeerExplorer.spec.tsx b/static/app/views/seerExplorer/hooks/useSeerExplorer.spec.tsx index d49fbf08eb5432..bf52a97ee5b03f 100644 --- a/static/app/views/seerExplorer/hooks/useSeerExplorer.spec.tsx +++ b/static/app/views/seerExplorer/hooks/useSeerExplorer.spec.tsx @@ -17,7 +17,7 @@ describe('useSeerExplorer', () => { describe('Initial State', () => { it('returns initial state with no session data', () => { - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -77,7 +77,7 @@ describe('useSeerExplorer', () => { }, }); - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -111,7 +111,7 @@ describe('useSeerExplorer', () => { body: {detail: 'Server error'}, }); - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -130,7 +130,7 @@ describe('useSeerExplorer', () => { body: {session: null}, }); - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -151,7 +151,7 @@ describe('useSeerExplorer', () => { body: {session: null}, }); - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -163,7 +163,7 @@ describe('useSeerExplorer', () => { }); it('filters messages based on deleted index', () => { - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); @@ -177,7 +177,7 @@ describe('useSeerExplorer', () => { describe('Polling Logic', () => { it('returns false for polling when no session exists', () => { - const {result} = renderHookWithProviders(() => useSeerExplorer(), { + const {result} = renderHookWithProviders(useSeerExplorer, { organization, }); diff --git a/static/eslint/eslintPluginSentry/index.mjs b/static/eslint/eslintPluginSentry/index.mjs index 9e5723c7672da3..ee2abb246472e4 100644 --- a/static/eslint/eslintPluginSentry/index.mjs +++ b/static/eslint/eslintPluginSentry/index.mjs @@ -1,5 +1,7 @@ +import noRenderHookArrowFunction from './no-renderHook-arrow-function.mjs'; import noStaticTranslations from './no-static-translations.mjs'; export const rules = { + 'no-renderHook-arrow-function': noRenderHookArrowFunction, 'no-static-translations': noStaticTranslations, }; diff --git a/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.mjs b/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.mjs new file mode 100644 index 00000000000000..f458ee48282b6c --- /dev/null +++ b/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.mjs @@ -0,0 +1,550 @@ +const RENDER_HOOK_FNS = ['renderHook', 'renderHookWithProviders']; + +/** + * Type guard to check if a node is an Identifier + * @param {import('estree').Node | null | undefined} node + * @returns {node is import('estree').Identifier} + */ +function isIdentifier(node) { + return node?.type === 'Identifier'; +} + +/** + * Type guard to check if a node is a CallExpression + * @param {import('estree').Node | null | undefined} node + * @returns {node is import('estree').CallExpression} + */ +function isCallExpression(node) { + return node?.type === 'CallExpression'; +} + +/** + * Type guard to check if a node is an ObjectExpression + * @param {import('estree').Node | null | undefined} node + * @returns {node is import('estree').ObjectExpression} + */ +function isObjectExpression(node) { + return node?.type === 'ObjectExpression'; +} + +/** + * Type guard to check if a node is a BlockStatement + * @param {import('estree').Node | null | undefined} node + * @returns {node is import('estree').BlockStatement} + */ +function isBlockStatement(node) { + return node?.type === 'BlockStatement'; +} + +/** + * Type guard to check if a node is a ReturnStatement + * @param {import('estree').Statement} node + * @returns {node is import('estree').ReturnStatement} + */ +function isReturnStatement(node) { + return node.type === 'ReturnStatement'; +} + +/** + * Type guard to check if a node is a MemberExpression + * @param {import('estree').Node | null | undefined} node + * @returns {node is import('estree').MemberExpression} + */ +function isMemberExpression(node) { + return node?.type === 'MemberExpression'; +} + +/** + * Type guard to check if a Property has an Identifier key + * @param {import('estree').Property | import('estree').SpreadElement} prop + * @returns {prop is import('estree').Property & {key: import('estree').Identifier}} + */ +function isPropertyWithIdentifierKey(prop) { + return prop.type === 'Property' && prop.key.type === 'Identifier'; +} + +/** + * Type guard to check if a node is an ImportDeclaration + * @param {import('estree').ModuleDeclaration | import('estree').Statement | import('estree').Directive} node + * @returns {node is import('estree').ImportDeclaration} + */ +function isImportDeclaration(node) { + return node.type === 'ImportDeclaration'; +} + +/** + * Type guard to check if an import specifier is an ImportSpecifier with Identifier imported name + * @param {import('estree').ImportSpecifier | import('estree').ImportDefaultSpecifier | import('estree').ImportNamespaceSpecifier} spec + * @returns {spec is import('estree').ImportSpecifier & {imported: import('estree').Identifier}} + */ +function isImportSpecifierWithIdentifier(spec) { + return spec.type === 'ImportSpecifier' && spec.imported.type === 'Identifier'; +} + +/** + * @type {import('eslint').Rule.RuleModule} + */ +const noRenderHookArrowFunction = { + meta: { + type: 'problem', + docs: { + description: + 'Disallow passing anonymous arrow functions to renderHook() when initialProps should be used instead', + recommended: true, + }, + schema: [], + messages: { + unnecessaryArrowFunction: + 'Pass the hook directly and use initialProps for arguments: renderHook({{hookName}}, {initialProps: {{props}}})', + arrowFunctionWithoutParams: + 'Pass the hook directly instead of wrapping it in an arrow function: renderHook({{hookName}})', + useComponentRenderInstead: + 'Convert to a component render() test instead of using renderHook() with multiple statements', + }, + fixable: 'code', + }, + + /** + * @param {import('eslint').Rule.RuleContext} context + * @returns {import('eslint').Rule.RuleListener} + */ + create(context) { + return { + /** + * @param {import('estree').CallExpression} node + */ + // @ts-expect-error - Type mismatch between estree versions (ESLint adds NodeParentExtension) + CallExpression(node) { + const callee = node.callee; + + // Check if it's renderHook or renderHookWithProviders + if (!isIdentifier(callee)) return; + if (!RENDER_HOOK_FNS.includes(callee.name)) return; + if (node.arguments.length === 0) return; + + const firstArg = node.arguments[0]; + if (!firstArg) return; + + // Check if the first argument is an arrow function + if (firstArg.type !== 'ArrowFunctionExpression') return; + + const arrowFn = firstArg; + const arrowParams = arrowFn.params; + + // Get the body of the arrow function + let body = arrowFn.body; + + // If body is a block statement, check for multiple statements + if (isBlockStatement(body)) { + // Count non-return statements + const nonReturnStatements = body.body.filter(stmt => !isReturnStatement(stmt)); + + // If there are multiple statements (besides the return), suggest component render + if (nonReturnStatements.length > 0) { + context.report({ + node: firstArg, + messageId: 'useComponentRenderInstead', + /** + * @param {import('eslint').Rule.RuleFixer} fixer + * @returns {import('eslint').Rule.Fix[]} + */ + fix(fixer) { + // Generate a unique component name based on the hook name if we can find it + // @ts-expect-error - body is narrowed to BlockStatement but TS doesn't recognize it + const returnStatement = body.body.find(isReturnStatement); + let componentName = 'TestComponent'; + + if (isCallExpression(returnStatement?.argument)) { + const hookCallee = returnStatement.argument.callee; + if (isIdentifier(hookCallee)) { + // Convert useMyHook -> MyHook + componentName = hookCallee.name.replace(/^use/, ''); + } + } + + // Get the entire renderHook call statement for proper indentation + const renderHookCallNode = node; + const sourceCode = context.sourceCode; + + // Find the statement node that contains the renderHook call + let statementNode = renderHookCallNode; + // @ts-expect-error - parent property exists on ESLint AST nodes + while (statementNode.parent && statementNode.parent.type !== 'Program') { + // @ts-expect-error - parent property exists on ESLint AST nodes + if (statementNode.parent.type === 'ExpressionStatement') { + // @ts-expect-error - parent property exists on ESLint AST nodes + statementNode = statementNode.parent; + break; + } + // @ts-expect-error - parent property exists on ESLint AST nodes + statementNode = statementNode.parent; + } + + // Get the indentation of the current line + const lineStart = sourceCode.getIndexFromLoc({ + // @ts-expect-error - statementNode.loc could be null but we verify it exists + line: statementNode.loc.start.line, + column: 0, + }); + // @ts-expect-error - statementNode.range could be undefined but we verify it exists + const statementStart = statementNode.range[0]; + const indentation = sourceCode.text.slice(lineStart, statementStart); + + // Extract statements from the body and rebuild with correct indentation + // @ts-expect-error - body is narrowed to BlockStatement but TS doesn't recognize it + const bodyStatements = body.body.map(stmt => { + const stmtText = sourceCode.getText(stmt); + return `${indentation} ${stmtText}`; + }); + + // Build the component function + const componentDef = `function ${componentName}() {\n${bodyStatements.join('\n')}\n${indentation}}\n${indentation}`; + + // Replace the entire renderHook call with render call + const renderCall = `render(<${componentName} />)`; + + const fixes = [ + // @ts-expect-error - Type mismatch between estree versions + fixer.insertTextBefore(statementNode, componentDef), + // @ts-expect-error - Type mismatch between estree versions + fixer.replaceText(renderHookCallNode, renderCall), + ]; + + // Check if we need to add the render import + const importFix = ensureRenderImport(context, sourceCode, fixer); + if (importFix) { + fixes.unshift(importFix); + } + + return fixes; + }, + }); + return; + } + + // Single statement block - get the return statement + const returnStatement = body.body.find(isReturnStatement); + if (!returnStatement?.argument) return; + body = returnStatement.argument; + } + + // Check if the body is a call expression (calling a hook) + if (!isCallExpression(body)) return; + + const hookCall = body; + const hookCallee = hookCall.callee; + + // Get the hook name + let hookName = ''; + if (isIdentifier(hookCallee)) { + hookName = hookCallee.name; + } else if (isMemberExpression(hookCallee) && isIdentifier(hookCallee.property)) { + // @ts-expect-error - Type mismatch between estree versions + hookName = context.sourceCode.getText(hookCallee); + } else { + return; + } + + // Check if the arrow function doesn't use its parameters + // If it has no parameters, it's definitely unnecessary + if (arrowParams.length === 0) { + context.report({ + node: firstArg, + messageId: 'arrowFunctionWithoutParams', + data: { + hookName, + }, + /** + * @param {import('eslint').Rule.RuleFixer} fixer + * @returns {import('eslint').Rule.Fix | import('eslint').Rule.Fix[] | null} + */ + fix(fixer) { + // Auto-fix when hook has zero arguments + if (hookCall.arguments.length === 0) { + // @ts-expect-error - Type mismatch between estree versions + return fixer.replaceText(firstArg, hookName); + } + + // Auto-fix when hook has exactly one argument + if (hookCall.arguments.length === 1) { + // @ts-expect-error - Type mismatch between estree versions + const hookArg = context.sourceCode.getText(hookCall.arguments[0]); + const secondArg = node.arguments[1]; + + if (!secondArg) { + // No second argument exists, create one + return [ + // @ts-expect-error - Type mismatch between estree versions + fixer.replaceText(firstArg, hookName), + // @ts-expect-error - Type mismatch between estree versions + fixer.insertTextAfter(firstArg, `, {initialProps: ${hookArg}}`), + ]; + } + + if (isObjectExpression(secondArg)) { + // Second argument is an object, check if initialProps already exists + const hasInitialProps = secondArg.properties.some( + prop => + isPropertyWithIdentifierKey(prop) && + prop.key.name === 'initialProps' + ); + + if (!hasInitialProps) { + // Add initialProps to the object + const lastProp = + secondArg.properties[secondArg.properties.length - 1]; + return [ + // @ts-expect-error - Type mismatch between estree versions + fixer.replaceText(firstArg, hookName), + lastProp + ? // @ts-expect-error - Type mismatch between estree versions + fixer.insertTextAfter(lastProp, `, initialProps: ${hookArg}`) + : fixer.insertTextAfterRange( + // @ts-expect-error - range could be undefined but we verify it exists + [secondArg.range[0], secondArg.range[0] + 1], + `initialProps: ${hookArg}, ` + ), + ]; + } + } + } + + // Don't auto-fix for multiple arguments - requires manual intervention + return null; + }, + }); + return; + } + + // If the arrow function has parameters, check if they're actually used + /** @type {string[]} */ + const arrowParamNames = []; + for (const param of arrowParams) { + extractIdentifierNames(param, arrowParamNames); + } + + // Check if any of the arrow function parameters are used in the hook call + const usesArrowParams = hookCall.arguments.some(arg => { + return containsIdentifier(arg, arrowParamNames); + }); + + // If the arrow function parameters are used in the hook call, this is the correct pattern + // e.g., renderHook(p => useHotkeys(p), {initialProps: [...]}) + if (usesArrowParams) { + return; + } + + // If we get here, the arrow function has parameters but doesn't use them + // This is the incorrect pattern + const hookArgs = hookCall.arguments.map(arg => + // @ts-expect-error - Type mismatch between estree versions + context.sourceCode.getText(arg) + ); + const propsText = hookArgs.length > 0 ? hookArgs.join(', ') : '...'; + + context.report({ + node: firstArg, + messageId: 'unnecessaryArrowFunction', + data: { + hookName, + props: propsText, + }, + /** + * @param {import('eslint').Rule.RuleFixer} fixer + * @returns {import('eslint').Rule.Fix | import('eslint').Rule.Fix[] | null} + */ + fix(fixer) { + // Auto-fix when hook has zero arguments + if (hookCall.arguments.length === 0) { + // @ts-expect-error - Type mismatch between estree versions + return fixer.replaceText(firstArg, hookName); + } + + // Auto-fix when hook has exactly one argument + if (hookCall.arguments.length === 1) { + // @ts-expect-error - Type mismatch between estree versions + const hookArg = context.sourceCode.getText(hookCall.arguments[0]); + const secondArg = node.arguments[1]; + + if (!secondArg) { + // No second argument exists, create one + return [ + // @ts-expect-error - Type mismatch between estree versions + fixer.replaceText(firstArg, hookName), + // @ts-expect-error - Type mismatch between estree versions + fixer.insertTextAfter(firstArg, `, {initialProps: ${hookArg}}`), + ]; + } + + if (isObjectExpression(secondArg)) { + // Second argument is an object, check if initialProps already exists + const hasInitialProps = secondArg.properties.some( + prop => + isPropertyWithIdentifierKey(prop) && prop.key.name === 'initialProps' + ); + + if (!hasInitialProps) { + // Add initialProps to the object + const lastProp = secondArg.properties[secondArg.properties.length - 1]; + return [ + // @ts-expect-error - Type mismatch between estree versions + fixer.replaceText(firstArg, hookName), + lastProp + ? // @ts-expect-error - Type mismatch between estree versions + fixer.insertTextAfter(lastProp, `, initialProps: ${hookArg}`) + : fixer.insertTextAfterRange( + // @ts-expect-error - range could be undefined but we verify it exists + [secondArg.range[0], secondArg.range[0] + 1], + `initialProps: ${hookArg}, ` + ), + ]; + } + } + } + + // Don't auto-fix for multiple arguments - requires manual intervention + return null; + }, + }); + }, + }; + }, +}; + +/** + * Extract all identifier names from a parameter pattern + * Handles simple identifiers, object destructuring, and array destructuring + * @param {import('estree').Pattern | null | undefined} param - The parameter pattern to extract from + * @param {string[]} names - Array to collect identifier names into + * @returns {void} + */ +function extractIdentifierNames(param, names) { + if (!param) return; + + if (param.type === 'Identifier') { + names.push(param.name); + } else if (param.type === 'ObjectPattern') { + // Handle object destructuring like {fact, dep} or {a: b, c} + for (const prop of param.properties) { + if (prop.type === 'Property') { + extractIdentifierNames(prop.value, names); + } else if (prop.type === 'RestElement') { + extractIdentifierNames(prop.argument, names); + } + } + } else if (param.type === 'ArrayPattern') { + // Handle array destructuring like [a, b] + for (const element of param.elements) { + if (element) { + extractIdentifierNames(element, names); + } + } + } else if (param.type === 'RestElement') { + // Handle rest parameters like ...rest + extractIdentifierNames(param.argument, names); + } else if (param.type === 'AssignmentPattern') { + // Handle default parameters like a = 5 + extractIdentifierNames(param.left, names); + } +} + +/** + * Check if an AST node contains an identifier with one of the given names + * @param {import('estree').Node | null | undefined} node - The AST node to check + * @param {string[]} names - Array of identifier names to look for + * @returns {boolean} True if any of the names are found in the node tree + */ +function containsIdentifier(node, names) { + if (!node) return false; + + if (node.type === 'Identifier') { + return names.includes(node.name); + } + + // Recursively check all properties of the node + for (const key in node) { + if (key === 'parent' || key === 'loc' || key === 'range') continue; + + // @ts-expect-error - Dynamic property access on AST node + const value = node[key]; + + if (Array.isArray(value)) { + if (value.some(item => containsIdentifier(item, names))) { + return true; + } + } else if (value && typeof value === 'object') { + if (containsIdentifier(value, names)) { + return true; + } + } + } + + return false; +} + +/** + * Ensure that 'render' is imported from 'sentry-test/reactTestingLibrary' + * Returns a Fix object if an import needs to be added, null otherwise + * @param {import('eslint').Rule.RuleContext} _context - The rule context + * @param {import('eslint').SourceCode} sourceCode - The source code object + * @param {import('eslint').Rule.RuleFixer} fixer - The fixer object + * @returns {import('eslint').Rule.Fix | null} A fix to add the import, or null if not needed + */ +function ensureRenderImport(_context, sourceCode, fixer) { + const TESTING_LIBRARY_MODULE = 'sentry-test/reactTestingLibrary'; + const ast = sourceCode.ast; + + // Find all import declarations + // @ts-expect-error - Type guard should narrow but type system doesn't recognize it + const imports = ast.body.filter(isImportDeclaration); + + // Check if there's already an import from sentry-test/reactTestingLibrary + const testingLibraryImport = imports.find( + node => node.source.value === TESTING_LIBRARY_MODULE + ); + + if (testingLibraryImport) { + // Check if 'render' is already imported + const hasRenderImport = testingLibraryImport.specifiers.some( + spec => isImportSpecifierWithIdentifier(spec) && spec.imported.name === 'render' + ); + + if (hasRenderImport) { + // Already imported, no fix needed + return null; + } + + // Add 'render' to the existing import + // Find the last specifier to add after it + const lastSpecifier = + testingLibraryImport.specifiers[testingLibraryImport.specifiers.length - 1]; + + if (lastSpecifier) { + return fixer.insertTextAfter(lastSpecifier, ', render'); + } + } + + // No import from sentry-test/reactTestingLibrary exists, create a new one + // Find the position to insert (after the last import, or at the beginning) + const lastImport = imports[imports.length - 1]; + + if (lastImport) { + return fixer.insertTextAfter( + lastImport, + `\nimport {render} from '${TESTING_LIBRARY_MODULE}';` + ); + } + + // No imports at all, insert at the beginning of the file + const firstNode = ast.body[0]; + if (firstNode) { + return fixer.insertTextBefore( + firstNode, + `import {render} from '${TESTING_LIBRARY_MODULE}';\n\n` + ); + } + + return null; +} + +export default noRenderHookArrowFunction; diff --git a/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.spec.ts b/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.spec.ts new file mode 100644 index 00000000000000..4e3bd28afae0f6 --- /dev/null +++ b/static/eslint/eslintPluginSentry/no-renderHook-arrow-function.spec.ts @@ -0,0 +1,258 @@ +import {RuleTester} from 'eslint'; + +import noRenderHookArrowFunction from './no-renderHook-arrow-function.mjs'; + +const ruleTester = new RuleTester({ + languageOptions: { + ecmaVersion: 2022, + sourceType: 'module', + parserOptions: { + ecmaFeatures: { + jsx: true, + }, + }, + }, +}); + +ruleTester.run('no-renderHook-arrow-function', noRenderHookArrowFunction, { + valid: [ + { + code: 'renderHook(useMyHook)', + name: 'Hook passed directly without arguments', + }, + { + code: 'renderHook(useMyHook, {initialProps: props})', + name: 'Hook passed directly with initialProps', + }, + { + code: 'renderHook(p => useMyHook(p), {initialProps: props})', + name: 'Arrow function that uses its parameter (correct pattern)', + }, + { + code: 'renderHook((p) => useMyHook(p.foo), {initialProps: {foo: "bar"}})', + name: 'Arrow function that uses destructured parameter', + }, + { + code: 'renderHookWithProviders(useMyHook)', + name: 'renderHookWithProviders with hook passed directly', + }, + { + code: 'renderHookWithProviders(p => useMyHook(p), {initialProps: props})', + name: 'renderHookWithProviders with arrow function using parameter', + }, + { + code: 'renderHook(({fact, dep}) => useMemoWithPrevious(fact, [dep]), {initialProps: {fact: factory, dep: firstDep}})', + name: 'Arrow function with destructured object parameters that are used', + }, + { + code: 'renderHook(([a, b]) => useMyHook(a, b), {initialProps: [1, 2]})', + name: 'Arrow function with destructured array parameters that are used', + }, + { + code: 'renderHook(({a: renamed}) => useMyHook(renamed), {initialProps: {a: value}})', + name: 'Arrow function with renamed destructured parameter that is used', + }, + ], + invalid: [ + { + code: 'renderHook(() => useMyHook())', + output: 'renderHook(useMyHook)', + errors: [ + { + messageId: 'arrowFunctionWithoutParams', + data: {hookName: 'useMyHook'}, + }, + ], + name: 'Arrow function with no parameters calling hook with no args (auto-fixable)', + }, + { + code: 'renderHook(() => useMyHook(props))', + output: 'renderHook(useMyHook, {initialProps: props})', + errors: [ + { + messageId: 'arrowFunctionWithoutParams', + data: {hookName: 'useMyHook'}, + }, + ], + name: 'Arrow function with no parameters calling hook with single arg', + }, + { + code: 'renderHook(() => useMyHook(orgSlug), {wrapper})', + output: 'renderHook(useMyHook, {wrapper, initialProps: orgSlug})', + errors: [ + { + messageId: 'arrowFunctionWithoutParams', + data: {hookName: 'useMyHook'}, + }, + ], + name: 'Arrow function with hook call and existing options object', + }, + { + code: 'renderHookWithProviders(() => useMyHook(DemoTour.RELEASES))', + output: 'renderHookWithProviders(useMyHook, {initialProps: DemoTour.RELEASES})', + errors: [ + { + messageId: 'arrowFunctionWithoutParams', + data: {hookName: 'useMyHook'}, + }, + ], + name: 'renderHookWithProviders with arrow function', + }, + { + code: 'renderHook((props) => useMyHook(staticValue))', + output: 'renderHook(useMyHook, {initialProps: staticValue})', + errors: [ + { + messageId: 'unnecessaryArrowFunction', + data: {hookName: 'useMyHook', props: 'staticValue'}, + }, + ], + name: 'Arrow function with parameter but not using it', + }, + { + code: 'renderHook((_unused) => useMyHook(foo, bar))', + output: null, // Can't auto-fix multiple arguments + errors: [ + { + messageId: 'unnecessaryArrowFunction', + data: {hookName: 'useMyHook', props: 'foo, bar'}, + }, + ], + name: 'Arrow function with unused parameter and multiple hook args (no auto-fix)', + }, + { + code: 'renderHook((props) => useMyHook(value), {wrapper})', + output: 'renderHook(useMyHook, {wrapper, initialProps: value})', + errors: [ + { + messageId: 'unnecessaryArrowFunction', + data: {hookName: 'useMyHook', props: 'value'}, + }, + ], + name: 'Arrow function with unused parameter and existing options object', + }, + { + code: 'renderHook((p) => useMyHook(a, b), {wrapper, otherOption: true})', + output: null, // Can't auto-fix multiple arguments + errors: [ + { + messageId: 'unnecessaryArrowFunction', + data: {hookName: 'useMyHook', props: 'a, b'}, + }, + ], + name: 'Arrow function with unused parameter, multiple args, and existing options (no auto-fix)', + }, + { + code: 'renderHook(() => useMyHook(a, b))', + output: null, // Can't auto-fix multiple arguments + errors: [ + { + messageId: 'arrowFunctionWithoutParams', + data: {hookName: 'useMyHook'}, + }, + ], + name: 'Arrow function with no params calling hook with multiple args (no auto-fix)', + }, + { + code: `renderHook(() => { + const x = 1; + const y = 2; + return useMyHook(x + y); +})`, + output: `import {render} from 'sentry-test/reactTestingLibrary'; + +function MyHook() { + const x = 1; + const y = 2; + return useMyHook(x + y); +} +render()`, + errors: [ + { + messageId: 'useComponentRenderInstead', + }, + ], + name: 'Arrow function with multiple statements should convert to component render', + }, + { + code: `renderHook(() => { + const value = 123; + return useMyHook(value); +})`, + output: `import {render} from 'sentry-test/reactTestingLibrary'; + +function MyHook() { + const value = 123; + return useMyHook(value); +} +render()`, + errors: [ + { + messageId: 'useComponentRenderInstead', + }, + ], + name: 'Arrow function with single variable declaration should convert to component render', + }, + { + code: `renderHookWithProviders(() => { + const state = useState(); + return useMyHook(state); +})`, + output: `import {render} from 'sentry-test/reactTestingLibrary'; + +function MyHook() { + const state = useState(); + return useMyHook(state); +} +render()`, + errors: [ + { + messageId: 'useComponentRenderInstead', + }, + ], + name: 'renderHookWithProviders with multiple statements should convert to component render', + }, + { + code: `import {screen, userEvent} from 'sentry-test/reactTestingLibrary'; + +renderHook(() => { + const value = 123; + return useMyHook(value); +})`, + output: `import {screen, userEvent, render} from 'sentry-test/reactTestingLibrary'; + +function MyHook() { + const value = 123; + return useMyHook(value); +} +render()`, + errors: [ + { + messageId: 'useComponentRenderInstead', + }, + ], + name: 'Should add render to existing import from sentry-test/reactTestingLibrary', + }, + { + code: `import {render} from 'sentry-test/reactTestingLibrary'; + +renderHook(() => { + const value = 123; + return useMyHook(value); +})`, + output: `import {render} from 'sentry-test/reactTestingLibrary'; + +function MyHook() { + const value = 123; + return useMyHook(value); +} +render()`, + errors: [ + { + messageId: 'useComponentRenderInstead', + }, + ], + name: 'Should not duplicate render import if already present', + }, + ], +}); diff --git a/static/gsAdmin/views/customerDetails.spec.tsx b/static/gsAdmin/views/customerDetails.spec.tsx index a8bf012a247609..ed6448d190d707 100644 --- a/static/gsAdmin/views/customerDetails.spec.tsx +++ b/static/gsAdmin/views/customerDetails.spec.tsx @@ -696,6 +696,7 @@ describe('Customer Details', () => { const data = StatsBillingPeriodFixture(); const {result: chartData} = renderHook( + // eslint-disable-next-line @sentry/no-renderHook-arrow-function () => { const series = useSeries(); return populateChartData(data.intervals, data.groups, series); diff --git a/static/gsApp/hooks/dashboardsLimit.spec.tsx b/static/gsApp/hooks/dashboardsLimit.spec.tsx index 6d34b16a9d6cc2..e6bd04b339d738 100644 --- a/static/gsApp/hooks/dashboardsLimit.spec.tsx +++ b/static/gsApp/hooks/dashboardsLimit.spec.tsx @@ -39,7 +39,7 @@ describe('useDashboardsLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -66,7 +66,7 @@ describe('useDashboardsLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -110,7 +110,7 @@ describe('useDashboardsLimit', () => { match: [MockApiClient.matchQuery({per_page: 10, filter: 'excludePrebuilt'})], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -152,7 +152,7 @@ describe('useDashboardsLimit', () => { match: [MockApiClient.matchQuery({per_page: 3, filter: 'excludePrebuilt'})], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -198,7 +198,7 @@ describe('useDashboardsLimit', () => { match: [MockApiClient.matchQuery({per_page: 2, filter: 'excludePrebuilt'})], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -240,7 +240,7 @@ describe('useDashboardsLimit', () => { match: [MockApiClient.matchQuery({per_page: 10, filter: 'excludePrebuilt'})], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -274,7 +274,7 @@ describe('useDashboardsLimit', () => { match: [MockApiClient.matchQuery({per_page: 10, filter: 'excludePrebuilt'})], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); @@ -306,7 +306,7 @@ describe('useDashboardsLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useDashboardsLimit(), { + const {result} = renderHookWithProviders(useDashboardsLimit, { organization: mockOrganization, }); diff --git a/static/gsApp/hooks/genAiAccess.spec.tsx b/static/gsApp/hooks/genAiAccess.spec.tsx index 83d5364ba6e96d..ad21bdfc21c5c8 100644 --- a/static/gsApp/hooks/genAiAccess.spec.tsx +++ b/static/gsApp/hooks/genAiAccess.spec.tsx @@ -52,8 +52,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: false})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( @@ -83,8 +84,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: false})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( @@ -114,8 +116,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: true})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( @@ -145,8 +148,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: false})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( @@ -179,8 +183,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: false})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( @@ -210,8 +215,9 @@ describe('useGenAiConsentButtonAccess', () => { }); mockUseUser.mockReturnValue(UserFixture({isSuperuser: false})); - const {result} = renderHook(() => useGenAiConsentButtonAccess({subscription}), { + const {result} = renderHook(useGenAiConsentButtonAccess, { wrapper: contextWrapper(organization), + initialProps: {subscription}, }); expect(result.current).toEqual( diff --git a/static/gsApp/hooks/useMaxPickableDays.spec.tsx b/static/gsApp/hooks/useMaxPickableDays.spec.tsx index 8e3672cd2d94ed..46cd1d5d0a9a36 100644 --- a/static/gsApp/hooks/useMaxPickableDays.spec.tsx +++ b/static/gsApp/hooks/useMaxPickableDays.spec.tsx @@ -12,11 +12,11 @@ import {useMaxPickableDays} from './useMaxPickableDays'; describe('useMaxPickableDays', () => { describe('without downsampled-date-page-filter', () => { it('returns 90/90 for transactions', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.TRANSACTIONS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -25,11 +25,11 @@ describe('useMaxPickableDays', () => { }); it('returns 90/90 for replays', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.REPLAYS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -38,11 +38,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for spans without flag', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.SPANS], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, @@ -52,17 +52,14 @@ describe('useMaxPickableDays', () => { }); it('returns 90/90 for spans with flag', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.SPANS], - }), - { - organization: OrganizationFixture({ - features: ['visibility-explore-range-high'], - }), - } - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization: OrganizationFixture({ + features: ['visibility-explore-range-high'], + }), + initialProps: { + dataCategories: [DataCategory.SPANS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -72,11 +69,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for tracemetrics', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.TRACE_METRICS], - }) - ); + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -86,11 +83,11 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for logs', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [DataCategory.LOG_BYTE, DataCategory.LOG_ITEM], - }) - ); + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -100,8 +97,8 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for many without flag', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [ DataCategory.SPANS, DataCategory.SPANS_INDEXED, @@ -109,8 +106,8 @@ describe('useMaxPickableDays', () => { DataCategory.LOG_BYTE, DataCategory.LOG_ITEM, ], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, @@ -120,16 +117,16 @@ describe('useMaxPickableDays', () => { }); it('returns 90/90 for profiles', () => { - const {result} = renderHookWithProviders(() => - useMaxPickableDays({ + const {result} = renderHookWithProviders(useMaxPickableDays, { + initialProps: { dataCategories: [ DataCategory.PROFILE_CHUNKS, DataCategory.PROFILE_CHUNKS_UI, DataCategory.PROFILE_DURATION, DataCategory.PROFILE_DURATION_UI, ], - }) - ); + }, + }); expect(result.current).toEqual({ maxPickableDays: 90, @@ -162,13 +159,12 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for transactions', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.TRANSACTIONS], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.TRANSACTIONS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, @@ -177,13 +173,12 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for replays', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.REPLAYS], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.REPLAYS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, @@ -193,13 +188,12 @@ describe('useMaxPickableDays', () => { it('returns 121/121 for spans on 2025/12/31', () => { jest.useFakeTimers().setSystemTime(new Date(2025, 11, 31)); - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.SPANS], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.SPANS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 121, @@ -210,13 +204,12 @@ describe('useMaxPickableDays', () => { it('returns 396/396 for spans on 2027/01/01', () => { jest.useFakeTimers().setSystemTime(new Date(2027, 0, 1)); - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.SPANS], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.SPANS], + }, + }); expect(result.current).toEqual({ maxPickableDays: 396, @@ -226,13 +219,12 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for tracemetrics', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.TRACE_METRICS], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.TRACE_METRICS], + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -242,13 +234,12 @@ describe('useMaxPickableDays', () => { }); it('returns 30/30 days for logs', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [DataCategory.LOG_BYTE, DataCategory.LOG_ITEM], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [DataCategory.LOG_BYTE, DataCategory.LOG_ITEM], + }, + }); expect(result.current).toEqual({ defaultPeriod: '24h', @@ -259,19 +250,18 @@ describe('useMaxPickableDays', () => { it('returns 396/396 for many without flag', () => { jest.useFakeTimers().setSystemTime(new Date(2027, 0, 1)); - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [ - DataCategory.SPANS, - DataCategory.SPANS_INDEXED, - DataCategory.TRACE_METRICS, - DataCategory.LOG_BYTE, - DataCategory.LOG_ITEM, - ], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [ + DataCategory.SPANS, + DataCategory.SPANS_INDEXED, + DataCategory.TRACE_METRICS, + DataCategory.LOG_BYTE, + DataCategory.LOG_ITEM, + ], + }, + }); expect(result.current).toEqual({ maxPickableDays: 396, @@ -281,18 +271,17 @@ describe('useMaxPickableDays', () => { }); it('returns 30/90 for profiles', () => { - const {result} = renderHookWithProviders( - () => - useMaxPickableDays({ - dataCategories: [ - DataCategory.PROFILE_CHUNKS, - DataCategory.PROFILE_CHUNKS_UI, - DataCategory.PROFILE_DURATION, - DataCategory.PROFILE_DURATION_UI, - ], - }), - {organization} - ); + const {result} = renderHookWithProviders(useMaxPickableDays, { + organization, + initialProps: { + dataCategories: [ + DataCategory.PROFILE_CHUNKS, + DataCategory.PROFILE_CHUNKS_UI, + DataCategory.PROFILE_DURATION, + DataCategory.PROFILE_DURATION_UI, + ], + }, + }); expect(result.current).toEqual({ maxPickableDays: 30, diff --git a/static/gsApp/hooks/useMetricDetectorLimit.spec.tsx b/static/gsApp/hooks/useMetricDetectorLimit.spec.tsx index 75124d16bfeafc..8e79f294ae9f31 100644 --- a/static/gsApp/hooks/useMetricDetectorLimit.spec.tsx +++ b/static/gsApp/hooks/useMetricDetectorLimit.spec.tsx @@ -34,7 +34,7 @@ describe('useMetricDetectorLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganizationWithoutFeature, }); @@ -57,7 +57,7 @@ describe('useMetricDetectorLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganization, }); @@ -95,7 +95,7 @@ describe('useMetricDetectorLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganization, }); @@ -141,7 +141,7 @@ describe('useMetricDetectorLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganization, }); @@ -177,7 +177,7 @@ describe('useMetricDetectorLimit', () => { body: [], }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganization, }); @@ -214,7 +214,7 @@ describe('useMetricDetectorLimit', () => { statusCode: 500, }); - const {result} = renderHookWithProviders(() => useMetricDetectorLimit(), { + const {result} = renderHookWithProviders(useMetricDetectorLimit, { organization: mockOrganization, }); diff --git a/static/gsApp/hooks/useProductBillingAccess.spec.tsx b/static/gsApp/hooks/useProductBillingAccess.spec.tsx index 8383e6395ac98a..b515507d94f663 100644 --- a/static/gsApp/hooks/useProductBillingAccess.spec.tsx +++ b/static/gsApp/hooks/useProductBillingAccess.spec.tsx @@ -18,32 +18,26 @@ describe('useProductBillingAccess', () => { SubscriptionStore.set(organization.slug, subscription); }); it('returns true if the org has billing access to the given product', () => { - const {result} = renderHookWithProviders( - () => useProductBillingAccess(DataCategory.ERRORS), - { - organization, - } - ); + const {result} = renderHookWithProviders(useProductBillingAccess, { + organization, + initialProps: DataCategory.ERRORS, + }); expect(result.current).toBe(true); }); it('returns false if the org does not have billing access to the given product', () => { - const {result} = renderHookWithProviders( - () => useProductBillingAccess(DataCategory.TRANSACTIONS), - { - organization, - } - ); + const {result} = renderHookWithProviders(useProductBillingAccess, { + organization, + initialProps: DataCategory.TRANSACTIONS, + }); expect(result.current).toBe(false); }); it('uses parent add-on context when appropriate', () => { - const {result: result1} = renderHookWithProviders( - () => useProductBillingAccess(DataCategory.SEER_USER), - { - organization, - } - ); + const {result: result1} = renderHookWithProviders(useProductBillingAccess, { + organization, + initialProps: DataCategory.SEER_USER, + }); expect(result1.current).toBe(false); act(() => { @@ -55,12 +49,10 @@ describe('useProductBillingAccess', () => { SubscriptionStore.set(organization.slug, subscription); }); - const {result: result2} = renderHookWithProviders( - () => useProductBillingAccess(DataCategory.SEER_USER), - { - organization, - } - ); + const {result: result2} = renderHookWithProviders(useProductBillingAccess, { + organization, + initialProps: DataCategory.SEER_USER, + }); expect(result2.current).toBe(false); // still false because add-on parent is not enabled act(() => { @@ -71,12 +63,10 @@ describe('useProductBillingAccess', () => { SubscriptionStore.set(organization.slug, subscription); }); - const {result: result3} = renderHookWithProviders( - () => useProductBillingAccess(DataCategory.SEER_USER), - { - organization, - } - ); + const {result: result3} = renderHookWithProviders(useProductBillingAccess, { + organization, + initialProps: DataCategory.SEER_USER, + }); expect(result3.current).toBe(true); // now true because add-on parent is enabled }); });