From c8450e511f0b5a679af6ba9efd163756c939bbea Mon Sep 17 00:00:00 2001 From: Chris Fang Date: Sun, 17 Nov 2024 15:37:18 -0800 Subject: [PATCH] chore(storage-browser): Add control hooks for consistency --- .../controls/PaginationControl.tsx | 6 +-- .../StorageBrowser/controls/SearchControl.tsx | 30 ----------- .../controls/SearchFieldControl.tsx | 13 +++++ .../__tests__/PaginationControl.spec.tsx | 50 +++++-------------- .../controls/__tests__/SearchControl.spec.tsx | 40 --------------- .../__tests__/SearchFieldControl.spec.tsx | 34 +++++++++++++ .../hooks/__tests__/usePagination.spec.ts | 35 +++++++++++++ .../hooks/__tests__/useSearchField.spec.ts | 46 +++++++++++++++++ .../controls/hooks/usePagination.tsx | 9 ++++ .../controls/hooks/useSearchField.tsx | 23 +++++++++ .../StorageBrowser/controls/types.ts | 2 +- .../LocationActionView/CopyView/CopyView.tsx | 6 +-- .../CopyView/__tests__/CopyView.spec.tsx | 10 ++-- .../LocationDetailView/LocationDetailView.tsx | 6 +-- .../LocationDetailViewProvider.tsx | 2 +- .../views/LocationsView/LocationsView.tsx | 6 +-- .../LocationsView/LocationsViewProvider.tsx | 4 +- 17 files changed, 193 insertions(+), 129 deletions(-) delete mode 100644 packages/react-storage/src/components/StorageBrowser/controls/SearchControl.tsx create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/SearchFieldControl.tsx delete mode 100644 packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchControl.spec.tsx create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchFieldControl.spec.tsx create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/usePagination.spec.ts create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/useSearchField.spec.ts create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/hooks/usePagination.tsx create mode 100644 packages/react-storage/src/components/StorageBrowser/controls/hooks/useSearchField.tsx diff --git a/packages/react-storage/src/components/StorageBrowser/controls/PaginationControl.tsx b/packages/react-storage/src/components/StorageBrowser/controls/PaginationControl.tsx index dc9cd66b5de..a9e3dfd93a0 100644 --- a/packages/react-storage/src/components/StorageBrowser/controls/PaginationControl.tsx +++ b/packages/react-storage/src/components/StorageBrowser/controls/PaginationControl.tsx @@ -2,12 +2,12 @@ import React from 'react'; import { Pagination } from '../composables/Pagination'; import { useResolvedComposable } from './hooks/useResolvedComposable'; -import { useControlsContext } from './context'; +import { usePagination } from './hooks/usePagination'; export const PaginationControl = (): React.JSX.Element => { - const { data } = useControlsContext(); + const props = usePagination(); const Resolved = useResolvedComposable(Pagination, 'Pagination'); - return ; + return ; }; diff --git a/packages/react-storage/src/components/StorageBrowser/controls/SearchControl.tsx b/packages/react-storage/src/components/StorageBrowser/controls/SearchControl.tsx deleted file mode 100644 index 22c8e75a434..00000000000 --- a/packages/react-storage/src/components/StorageBrowser/controls/SearchControl.tsx +++ /dev/null @@ -1,30 +0,0 @@ -import React from 'react'; - -import { SearchField } from '../composables/SearchField'; - -import { useControlsContext } from './context'; -import { useResolvedComposable } from './hooks/useResolvedComposable'; - -export const SearchControl = (): React.JSX.Element => { - const { data, onSearch, onSearchQueryChange, onSearchClear } = - useControlsContext(); - const { - searchPlaceholder, - searchClearLabel, - searchQuery, - searchSubmitLabel, - } = data; - const Resolved = useResolvedComposable(SearchField, 'SearchField'); - - return ( - - ); -}; diff --git a/packages/react-storage/src/components/StorageBrowser/controls/SearchFieldControl.tsx b/packages/react-storage/src/components/StorageBrowser/controls/SearchFieldControl.tsx new file mode 100644 index 00000000000..fd3527441e8 --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/SearchFieldControl.tsx @@ -0,0 +1,13 @@ +import React from 'react'; + +import { SearchField } from '../composables/SearchField'; + +import { useResolvedComposable } from './hooks/useResolvedComposable'; +import { useSearchField } from './hooks/useSearchField'; + +export const SearchFieldControl = (): React.JSX.Element => { + const props = useSearchField(); + const Resolved = useResolvedComposable(SearchField, 'SearchField'); + + return ; +}; diff --git a/packages/react-storage/src/components/StorageBrowser/controls/__tests__/PaginationControl.spec.tsx b/packages/react-storage/src/components/StorageBrowser/controls/__tests__/PaginationControl.spec.tsx index 137255fff58..5bcd6653567 100644 --- a/packages/react-storage/src/components/StorageBrowser/controls/__tests__/PaginationControl.spec.tsx +++ b/packages/react-storage/src/components/StorageBrowser/controls/__tests__/PaginationControl.spec.tsx @@ -1,60 +1,34 @@ import React from 'react'; import { render, screen } from '@testing-library/react'; import { PaginationControl } from '../PaginationControl'; -import { useControlsContext } from '../context'; +import { usePagination } from '../hooks/usePagination'; import { useResolvedComposable } from '../hooks/useResolvedComposable'; -jest.mock('../context'); +jest.mock('../hooks/usePagination'); jest.mock('../hooks/useResolvedComposable'); +jest.mock('../../composables/Pagination', () => ({ + Pagination: () =>
, +})); describe('PaginationControl', () => { - // assert mocks - const mockUseControlsContext = useControlsContext as jest.Mock; - const mockUseResolvedComposable = useResolvedComposable as jest.Mock; + const mockUsePagination = jest.mocked(usePagination); + const mockUseResolvedComposable = jest.mocked(useResolvedComposable); beforeAll(() => { mockUseResolvedComposable.mockImplementation( - (component: React.JSX.Element) => component + (component) => component as () => React.JSX.Element ); }); afterEach(() => { - mockUseControlsContext.mockReset(); - mockUseResolvedComposable.mockReset(); + mockUsePagination.mockClear(); }); - it('renders the PaginationControl', async () => { - mockUseControlsContext.mockReturnValue({ - data: { - paginationData: { - hasNextPage: true, - highestPageVisited: 1, - onPaginate: jest.fn(), - page: 1, - }, - }, - }); - + it('renders', () => { render(); - const nav = screen.getByRole('navigation'); - const list = screen.getByRole('list'); - const listItems = await screen.findAllByRole('listitem'); - const nextButton = screen.getByRole('button', { name: 'Go to next page' }); - const prevButton = screen.getByRole('button', { - name: 'Go to previous page', - }); - const nextIcon = nextButton.querySelector('svg'); - const prevIcon = nextButton.querySelector('svg'); + const pagination = screen.getByTestId('pagination'); - expect(nextButton).toBeInTheDocument(); - expect(prevButton).toBeInTheDocument(); - expect(nextIcon).toBeInTheDocument(); - expect(prevIcon).toBeInTheDocument(); - expect(nextIcon).toHaveAttribute('aria-hidden', 'true'); - expect(prevIcon).toHaveAttribute('aria-hidden', 'true'); - expect(nav).toBeInTheDocument(); - expect(list).toBeInTheDocument(); - expect(listItems).toHaveLength(3); + expect(pagination).toBeInTheDocument(); }); }); diff --git a/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchControl.spec.tsx b/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchControl.spec.tsx deleted file mode 100644 index e9fdcf5d5e1..00000000000 --- a/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchControl.spec.tsx +++ /dev/null @@ -1,40 +0,0 @@ -import React from 'react'; -import { render, screen } from '@testing-library/react'; -import { SearchControl } from '../SearchControl'; -import { useResolvedComposable } from '../hooks/useResolvedComposable'; -import { useControlsContext } from '../context'; - -jest.mock('../context'); -jest.mock('../hooks/useResolvedComposable'); - -describe('SearchControl', () => { - // assert mocks - const mockUseControlsContext = useControlsContext as jest.Mock; - const mockUseResolvedComposable = useResolvedComposable as jest.Mock; - - beforeAll(() => { - mockUseResolvedComposable.mockImplementation( - (component: React.JSX.Element) => component - ); - }); - - afterEach(() => { - mockUseControlsContext.mockReset(); - mockUseResolvedComposable.mockReset(); - }); - - it('renders the SearchControl', () => { - mockUseControlsContext.mockReturnValue({ - data: { searchPlaceholder: 'Placeholder', searchSubmitLabel: 'Submit' }, - onSearch: jest.fn(), - }); - - render(); - - const field = screen.getByPlaceholderText('Placeholder'); - const button = screen.getByRole('button', { name: 'Submit' }); - - expect(button).toBeInTheDocument(); - expect(field).toBeInTheDocument(); - }); -}); diff --git a/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchFieldControl.spec.tsx b/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchFieldControl.spec.tsx new file mode 100644 index 00000000000..bf4c7d5deea --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/__tests__/SearchFieldControl.spec.tsx @@ -0,0 +1,34 @@ +import React from 'react'; +import { render, screen } from '@testing-library/react'; +import { SearchFieldControl } from '../SearchFieldControl'; +import { useSearchField } from '../hooks/useSearchField'; +import { useResolvedComposable } from '../hooks/useResolvedComposable'; + +jest.mock('../hooks/useSearchField'); +jest.mock('../hooks/useResolvedComposable'); +jest.mock('../../composables/SearchField', () => ({ + SearchField: () =>
, +})); + +describe('SearchFieldControl', () => { + const mockUseSearchField = jest.mocked(useSearchField); + const mockUseResolvedComposable = jest.mocked(useResolvedComposable); + + beforeAll(() => { + mockUseResolvedComposable.mockImplementation( + (component) => component as () => React.JSX.Element + ); + }); + + afterEach(() => { + mockUseSearchField.mockClear(); + }); + + it('renders', () => { + render(); + + const searchField = screen.getByTestId('search-field'); + + expect(searchField).toBeInTheDocument(); + }); +}); diff --git a/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/usePagination.spec.ts b/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/usePagination.spec.ts new file mode 100644 index 00000000000..2e4334ef4eb --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/usePagination.spec.ts @@ -0,0 +1,35 @@ +import { renderHook } from '@testing-library/react'; +import { PaginationProps } from '../../../composables/Pagination'; +import { useControlsContext } from '../../../controls/context'; +import { usePagination } from '../usePagination'; + +jest.mock('../../../controls/context'); + +describe('usePagination', () => { + const data = { + paginationData: { hasNextPage: true, highestPageVisited: 1, page: 1 }, + }; + + const mockUseControlsContext = jest.mocked(useControlsContext); + + beforeEach(() => { + mockUseControlsContext.mockReturnValue({ data, onPaginate: jest.fn() }); + }); + + afterEach(() => { + mockUseControlsContext.mockReset(); + }); + + it('returns Pagination props', () => { + const { result } = renderHook(() => usePagination()); + + const expected: PaginationProps = { + hasNextPage: data.paginationData.hasNextPage, + highestPageVisited: data.paginationData.highestPageVisited, + page: data.paginationData.page, + onPaginate: expect.any(Function), + }; + + expect(result.current).toStrictEqual(expected); + }); +}); diff --git a/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/useSearchField.spec.ts b/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/useSearchField.spec.ts new file mode 100644 index 00000000000..9f72c16f2e3 --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/hooks/__tests__/useSearchField.spec.ts @@ -0,0 +1,46 @@ +import { renderHook } from '@testing-library/react'; +import { SearchFieldProps } from '../../../composables/SearchField'; +import { useControlsContext } from '../../../controls/context'; +import { useSearchField } from '../useSearchField'; + +jest.mock('../../../controls/context'); + +describe('useSearchField', () => { + const data = { + searchClearLabel: 'search-clear-label', + searchPlaceholder: 'search-placeholder', + searchSubmitLabel: 'search-submit-label', + searchQuery: 'search-query', + }; + + const mockUseControlsContext = jest.mocked(useControlsContext); + + beforeEach(() => { + mockUseControlsContext.mockReturnValue({ + data, + onSearch: jest.fn(), + onSearchClear: jest.fn(), + onSearchQueryChange: jest.fn(), + }); + }); + + afterEach(() => { + mockUseControlsContext.mockReset(); + }); + + it('returns useSearchField data', () => { + const { result } = renderHook(() => useSearchField()); + + const expected: SearchFieldProps = { + clearLabel: data.searchClearLabel, + placeholder: data.searchPlaceholder, + query: data.searchQuery, + submitLabel: data.searchSubmitLabel, + onClear: expect.any(Function), + onQueryChange: expect.any(Function), + onSearch: expect.any(Function), + }; + + expect(result.current).toStrictEqual(expected); + }); +}); diff --git a/packages/react-storage/src/components/StorageBrowser/controls/hooks/usePagination.tsx b/packages/react-storage/src/components/StorageBrowser/controls/hooks/usePagination.tsx new file mode 100644 index 00000000000..b7407e6ffb6 --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/hooks/usePagination.tsx @@ -0,0 +1,9 @@ +import { PaginationProps } from '../../composables/Pagination'; +import { useControlsContext } from '../../controls/context'; + +export const usePagination = (): PaginationProps => { + const { data, onPaginate } = useControlsContext(); + const { paginationData } = data; + + return { ...paginationData, onPaginate }; +}; diff --git a/packages/react-storage/src/components/StorageBrowser/controls/hooks/useSearchField.tsx b/packages/react-storage/src/components/StorageBrowser/controls/hooks/useSearchField.tsx new file mode 100644 index 00000000000..cac5961d850 --- /dev/null +++ b/packages/react-storage/src/components/StorageBrowser/controls/hooks/useSearchField.tsx @@ -0,0 +1,23 @@ +import { SearchFieldProps } from '../../composables/SearchField'; +import { useControlsContext } from '../../controls/context'; + +export const useSearchField = (): SearchFieldProps => { + const { data, onSearch, onSearchClear, onSearchQueryChange } = + useControlsContext(); + const { + searchPlaceholder, + searchClearLabel, + searchQuery, + searchSubmitLabel, + } = data; + + return { + clearLabel: searchClearLabel, + placeholder: searchPlaceholder, + query: searchQuery, + submitLabel: searchSubmitLabel, + onClear: onSearchClear, + onQueryChange: onSearchQueryChange, + onSearch, + }; +}; diff --git a/packages/react-storage/src/components/StorageBrowser/controls/types.ts b/packages/react-storage/src/components/StorageBrowser/controls/types.ts index 1ebd86acb75..9cda3ac6af9 100644 --- a/packages/react-storage/src/components/StorageBrowser/controls/types.ts +++ b/packages/react-storage/src/components/StorageBrowser/controls/types.ts @@ -31,7 +31,6 @@ interface TableData { interface PaginationData { hasNextPage: boolean; highestPageVisited: number; - onPaginate: (page: number) => void; page: number; } @@ -90,6 +89,7 @@ export interface ControlsContext { onFolderNameChange?: (value: string) => void; onNavigate?: (location: LocationData, path?: string) => void; onNavigateHome?: () => void; + onPaginate?: (page: number) => void; onRefresh?: () => void; onSearch?: () => void; onSearchClear?: () => void; diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/CopyView.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/CopyView.tsx index 01ee8580843..be3db0d2610 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/CopyView.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/CopyView.tsx @@ -10,7 +10,7 @@ import { ActionStartControl } from '../../../controls/ActionStartControl'; import { DataTableControl } from '../../../controls/DataTableControl'; import { LoadingIndicatorControl } from '../../../controls/LoadingIndicatorControl'; import { MessageControl } from '../../../controls/MessageControl'; -import { SearchControl } from '../../../controls/SearchControl'; +import { SearchFieldControl } from '../../../controls/SearchFieldControl'; import { StatusDisplayControl } from '../../../controls/StatusDisplayControl'; import { TitleControl } from '../../../controls/TitleControl'; @@ -40,7 +40,7 @@ export const CopyView: CopyViewType = ({ className, ...props }) => { <> - + @@ -77,7 +77,7 @@ CopyView.Exit = ActionExitControl; CopyView.FoldersLoadingIndicator = LoadingIndicatorControl; CopyView.FoldersMessage = FoldersMessageControl; CopyView.FoldersPagination = FoldersPaginationControl; -CopyView.FoldersSearch = SearchControl; +CopyView.FoldersSearch = SearchFieldControl; CopyView.FoldersTable = FoldersTableControl; CopyView.Message = MessageControl; CopyView.Start = ActionStartControl; diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/__tests__/CopyView.spec.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/__tests__/CopyView.spec.tsx index 7c34aa19cb4..e431de16cf5 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/__tests__/CopyView.spec.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationActionView/CopyView/__tests__/CopyView.spec.tsx @@ -35,8 +35,8 @@ jest.mock('../../../../controls/LoadingIndicatorControl', () => ({ jest.mock('../../../../controls/MessageControl', () => ({ MessageControl: () =>
, })); -jest.mock('../../../../controls/SearchControl', () => ({ - SearchControl: () =>
, +jest.mock('../../../../controls/SearchFieldControl', () => ({ + SearchFieldControl: () =>
, })); jest.mock('../../../../controls/StatusDisplayControl', () => ({ StatusDisplayControl: () =>
, @@ -106,7 +106,7 @@ describe('CopyView', () => { expect(screen.queryByTestId('FoldersTableControl')).toBeInTheDocument(); expect(screen.queryByTestId('LoadingIndicatorControl')).toBeInTheDocument(); expect(screen.queryByTestId('MessageControl')).toBeInTheDocument(); - expect(screen.queryByTestId('SearchControl')).toBeInTheDocument(); + expect(screen.queryByTestId('SearchFieldControl')).toBeInTheDocument(); expect(screen.queryByTestId('TitleControl')).toBeInTheDocument(); }); @@ -136,7 +136,7 @@ describe('CopyView', () => { expect( screen.queryByTestId('FoldersPaginationControl') ).not.toBeInTheDocument(); - expect(screen.queryByTestId('SearchControl')).not.toBeInTheDocument(); + expect(screen.queryByTestId('SearchFieldControl')).not.toBeInTheDocument(); expect( screen.queryByTestId('FoldersMessageControl') ).not.toBeInTheDocument(); @@ -172,7 +172,7 @@ describe('CopyView', () => { expect( screen.queryByTestId('FoldersPaginationControl') ).not.toBeInTheDocument(); - expect(screen.queryByTestId('SearchControl')).not.toBeInTheDocument(); + expect(screen.queryByTestId('SearchFieldControl')).not.toBeInTheDocument(); expect( screen.queryByTestId('FoldersMessageControl') ).not.toBeInTheDocument(); diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailView.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailView.tsx index 2f8947edece..0c8b792e8e6 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailView.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailView.tsx @@ -10,7 +10,7 @@ import { LoadingIndicatorControl } from '../../controls/LoadingIndicatorControl' import { MessageControl } from '../../controls/MessageControl'; import { NavigationControl } from '../../controls/NavigationControl'; import { PaginationControl } from '../../controls/PaginationControl'; -import { SearchControl } from '../../controls/SearchControl'; +import { SearchFieldControl } from '../../controls/SearchFieldControl'; import { SearchSubfoldersToggleControl } from '../../controls/SearchSubfoldersToggleControl'; import { TitleControl } from '../../controls/TitleControl'; @@ -42,7 +42,7 @@ export const LocationDetailView: LocationDetailViewType = ({ - + @@ -77,6 +77,6 @@ LocationDetailView.Message = MessageControl; LocationDetailView.Navigation = NavigationControl; LocationDetailView.Pagination = PaginationControl; LocationDetailView.Refresh = DataRefreshControl; -LocationDetailView.Search = SearchControl; +LocationDetailView.Search = SearchFieldControl; LocationDetailView.SearchSubfoldersToggle = SearchSubfoldersToggleControl; LocationDetailView.Title = TitleControl; diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailViewProvider.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailViewProvider.tsx index c165b57e219..dcd291f08e4 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailViewProvider.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationDetailView/LocationDetailViewProvider.tsx @@ -89,7 +89,6 @@ export function LocationDetailViewProvider({ page, hasNextPage, highestPageVisited, - onPaginate, }, searchPlaceholder, searchSubfoldersToggleLabel, @@ -117,6 +116,7 @@ export function LocationDetailViewProvider({ onDropFiles={onDropFiles} onNavigate={onNavigate} onNavigateHome={onNavigateHome} + onPaginate={onPaginate} onRefresh={onRefresh} onSearch={onSearch} onSearchQueryChange={onSearchQueryChange} diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsView.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsView.tsx index f3337089b1b..c9082e875d6 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsView.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsView.tsx @@ -7,7 +7,7 @@ import { DataTableControl } from '../../controls/DataTableControl'; import { LoadingIndicatorControl } from '../../controls/LoadingIndicatorControl'; import { MessageControl } from '../../controls/MessageControl'; import { PaginationControl } from '../../controls/PaginationControl'; -import { SearchControl } from '../../controls/SearchControl'; +import { SearchFieldControl } from '../../controls/SearchFieldControl'; import { TitleControl } from '../../controls/TitleControl'; import { LocationsViewProvider } from './LocationsViewProvider'; @@ -28,7 +28,7 @@ export const LocationsView: LocationsViewType = ({ className, ...props }) => { - + @@ -54,5 +54,5 @@ LocationsView.LocationsTable = DataTableControl; LocationsView.Message = MessageControl; LocationsView.Pagination = PaginationControl; LocationsView.Refresh = DataRefreshControl; -LocationsView.Search = SearchControl; +LocationsView.Search = SearchFieldControl; LocationsView.Title = TitleControl; diff --git a/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsViewProvider.tsx b/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsViewProvider.tsx index ef661e0b7ca..e1be11e3aa7 100644 --- a/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsViewProvider.tsx +++ b/packages/react-storage/src/components/StorageBrowser/views/LocationsView/LocationsViewProvider.tsx @@ -62,7 +62,6 @@ export function LocationsViewProvider({ page, hasNextPage, highestPageVisited, - onPaginate, }, title, searchPlaceholder, @@ -72,8 +71,9 @@ export function LocationsViewProvider({ message: messageControlContent, isLoading, }} - onSearch={onSearch} + onPaginate={onPaginate} onRefresh={onRefresh} + onSearch={onSearch} onSearchQueryChange={onSearchQueryChange} onSearchClear={onSearchClear} >