paulononato/backstage
1
0
Fork 0
Code Issues Pull Requests Actions 21 Packages Projects Releases Wiki Activity

refactor: change default page limit text

Browse Source 
Signed-off-by: Camila Belo <camilaibs@gmail.com>
This commit is contained in:
Camila Belo
2022-10-10 12:08:16 +02:00
parent 90616bcaa6
commit 270ee83613
3 changed files with 14 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files
plugins/search-react/src/components/SearchPagination/SearchPagination.stories.tsx
+6 -2
View File
@@ -47,11 +47,15 @@ export const Default = () => {
};
export const CustomPageLimitLabel = () => {
return <SearchPagination pageLimitLabel="Page limit:" />;
return <SearchPagination pageLimitLabel="PRows per page:" />;
};
export const CustomPageLimitText = () => {
return <SearchPagination pageLimitText={({ from, to }) => `${from}-${to}`} />;
return (
<SearchPagination
pageLimitText={({ from, to }) => `${from}-${to} of more than ${to}`}
/>
);
};
export const CustomPageLimitOptions = () => {
plugins/search-react/src/components/SearchPagination/SearchPagination.test.tsx
+7 -5
View File
@@ -47,7 +47,7 @@ describe('SearchPagination', () => {
expect(screen.getByText('Results per page:')).toBeInTheDocument();
expect(screen.getByText('25')).toBeInTheDocument();
expect(screen.getByText('1-25 of more than 25')).toBeInTheDocument();
expect(screen.getByText('1-25')).toBeInTheDocument();
expect(screen.getByLabelText('Next page')).toBeEnabled();
expect(screen.getByLabelText('Previous page')).toBeDisabled();
});
@@ -88,12 +88,14 @@ describe('SearchPagination', () => {
await renderWithEffects(
<TestApiProvider apis={[[searchApiRef, { query }]]}>
<SearchContextProvider>
<SearchPagination pageLimitText={({ from, to }) => `${from}-${to}`} />
<SearchPagination
pageLimitText={({ from, to }) => `${from}-${to} of more than ${to}`}
/>
</SearchContextProvider>
</TestApiProvider>,
);
expect(screen.getByText('1-25')).toBeInTheDocument();
expect(screen.getByText('1-25 of more than 25')).toBeInTheDocument();
});
it('Accept custom page limit options', async () => {
@@ -153,7 +155,7 @@ describe('SearchPagination', () => {
await userEvent.click(screen.getByLabelText('Next page'));
expect(screen.getByText('51-75 of more than 75')).toBeInTheDocument();
expect(screen.getByText('51-75')).toBeInTheDocument();
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({
@@ -163,7 +165,7 @@ describe('SearchPagination', () => {
await userEvent.click(screen.getByLabelText('Previous page'));
expect(screen.getByText('26-50 of more than 50')).toBeInTheDocument();
expect(screen.getByText('26-50')).toBeInTheDocument();
expect(query).toHaveBeenLastCalledWith(
expect.objectContaining({
plugins/search-react/src/components/SearchPagination/SearchPagination.tsx
+1 -1
View File
@@ -110,7 +110,7 @@ export const SearchPaginationBase = (props: SearchPaginationBaseProps) => {
onPageCursorChange,
pageLimit: rowsPerPage = 25,
pageLimitLabel: labelRowsPerPage = 'Results per page:',
pageLimitText: labelDisplayedRows,
pageLimitText: labelDisplayedRows = ({ from, to }) => `${from}-${to}`,
pageLimitOptions: rowsPerPageOptions,
onPageLimitChange,
...rest