Skip to content

Commit 3759ef4

Browse files
update readme
1 parent e63191b commit 3759ef4

1 file changed

Lines changed: 46 additions & 0 deletions

File tree

readme.md

Lines changed: 46 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -23,6 +23,52 @@ Second, you can make use of the different hooks.
2323

2424
### In Memory Pagination
2525

26+
Use this pagination hook if you want to keep track of the pagination in memory. This is very handy for dialogs.
27+
28+
```tsx
29+
import { ReactElement } from "react";
30+
import { useSearchAndPaginationInMemory } from '@aboutbits/react-pagination'
31+
32+
function UsersDialog(): ReactElement {
33+
34+
const {
35+
page,
36+
size,
37+
search,
38+
searchActions,
39+
paginationActions,
40+
} = useSearchAndPaginationInMemory()
41+
42+
return (
43+
<Dialog>
44+
<DialogSelectHeader
45+
title="Users"
46+
search={search}
47+
searchActions={searchActions}
48+
/>
49+
<AsyncView
50+
{...useSearchUsers({
51+
page: page,
52+
size: size,
53+
query: search,
54+
})}
55+
renderSuccess={(data) => (
56+
<DisplayData
57+
data={data}
58+
paginationActions={paginationActions}
59+
/>
60+
)}
61+
renderLoading={<LoadingList />}
62+
renderError={(error) => (
63+
<Error error={error} />
64+
)}
65+
/>
66+
</Dialog>
67+
)
68+
69+
}
70+
```
71+
2672
### Router based pagination
2773

2874
## Build & Publish

0 commit comments

Comments
 (0)