feat: pagination component #356
Conversation
|
|
|
|
Deploy preview for codeimage ready! ✅ Preview Built with commit e79458a. |
todo: cleanup, style and move as in codeimage ui
| {page: Accessor<number>; setPage: Setter<number>; pageSize: number}, | ||
| ] => { | ||
| const [page, setPage] = createSignal(1), | ||
| pageSize = 9; |
There was a problem hiding this comment.
The page size must be passed as option
export const createPagedData = <T>(
data: Accessor<T[] | undefined>,
options: {
pageSize: number
}
): [
Accessor<T[]>,
{page: Accessor<number>; setPage: Setter<number>; pageSize: number},
]WIP - clening up
trying add inital page to Pagination
| }), | ||
| ); | ||
| console.log('pageSelected', options.pageSelected); | ||
| const [page, setPage] = createSignal(options.pageSelected); |
There was a problem hiding this comment.
@riccardoperra in the dashboard.state I pass as options.pageSelected = 5. In this console.log I've obtained 5 but the page() of the dashboard it's still 1 do you know why?
clean up and centering the buttons
| const handleChange = (direction: 'next' | 'prev') => () => | ||
| merged.onChange(prev => (direction === 'next' ? prev + 1 : prev - 1)); | ||
|
|
There was a problem hiding this comment.
@riccardoperra do you know why in this clousure eslint suggest me to do it in createEffect,? maybe I don't do this?
There was a problem hiding this comment.
handle-change is already a callback that does an action, it must not be return another callback. Also, it should be separated into two function that does increment and decrement action instead of one with a string as parameter
move here pagination component and hook to get paginatedData
| function makeDashboardState(authState = getAuth0State()) { | ||
| const [data, {mutate, refetch}] = createResource(fetchWorkspaceContent, { | ||
| initialValue: [], | ||
| }); | ||
|
|
||
| const [search, setSearch] = createSignal(''); | ||
|
|
||
| const [pageSize] = createSignal(9); |
There was a problem hiding this comment.
Non é necessario che sia un signal
| @@ -0,0 +1,19 @@ | |||
| import {Accessor, createSignal, Setter} from 'solid-js'; | |||
| interface pagedDataOptions { | |||
| pageSize: Accessor<number>; | |||
There was a problem hiding this comment.
questo dovrebbe essere trattato come number piu che accessor
dall'hook poi per non perdere reattivitá si potrebbe chiamare come se lo fosse
const pageSize = () => options.pageSize
| data: Accessor<T[]>, | ||
| pageSize: Accessor<number>, |
There was a problem hiding this comment.
@riccardoperra qui il pageSize lo vogliamo ancora Accesor no? quindi ora che è un const lo passeremo ()=>pageSize
related to #325