primefaces / primereact

The Most Complete React UI Component Library
https://primereact.org
MIT License
6.77k stars 1.03k forks source link

DataTable: options object passed to paginator templates does not match typescript interface #7225

Open NothingFiner opened 3 weeks ago

NothingFiner commented 3 weeks ago

Describe the bug

it's quite easy to work around this issue by using any or writing one's own interface. However, I noticed that the options object passed to paginator templates from a data table does not match the interface provided. options object:

Screen Shot 2024-09-19 at 11 03 12 AM

interface provided:

Screen Shot 2024-09-19 at 11 04 50 AM

Specifically, a lot of the keys that are supposed to be at root level are nested inside of props object. My best guess is that this is an oversight, but I don't know to what else it might relate. It could be that there's some sort of bifurcation between the pagination component and its use here. I would be happy to work up a PR for this if there is not an issue.

This is also the case with other template options--ie the other elements of the paginator.

Reproducer

No response

System Information

"primereact": "^10.6.5",
"react": "18.2.0",

Steps to reproduce the behavior

  1. in an app with primereact render a datatable component with something like the following attributes ref={dt} loading={isFetching} value={data?.products || []} dataKey='id' paginator={data?.products?.length > 12} rows={12} onSort={sortHandler} sortField={dataTableSort.sortField} sortOrder={dataTableSort.tableSortOrder as 1 | 0 | -1} rowsPerPageOptions={[12, 24, 36]} paginatorTemplate={{ LastPageLink: LastPageLinkTemplate, layout: 'RowsPerPageDropdown PrevPageLink FirstPageLink PageLinks LastPageLink NextPageLink', }} pageLinkSize={3} emptyMessage='No products found.' sortIcon={SortIconTemplate}

and a template something like this

`const LastPageLinkTemplate = (options: any) => { debugger;

return ( <button type='button' onClick={options.onClick} className='text-gray-500'

... {options.props.totalPages} ); }; `

  1. observe discrepency between options object passed and the PaginatorLastPageLinkOption interface.

Expected behavior

the options object passed to the template should match the provided interface

melloware commented 3 weeks ago

@NothingFiner interested in submitting a PR?

NothingFiner commented 3 weeks ago

@melloware I would be, but I would also like to know if there's a preference for if it would be better to update the interface, add a new interface, or look into why it might be different more.

If it's the last option, I will need some time! I could also update the docs to show how to use template in this manner.

I'm not sure if this kind of functionality is supposed to be deprecated or what, but this is not accurate.

Screen Shot 2024-09-19 at 11 30 00 AM

in reality it takes a string or an options object

melloware commented 3 weeks ago

If you update the .d.ts files it automatically updates the website docs you pointed to. So if you modify to PaginatorTemple | string it will just show up.

melloware commented 1 week ago

@NothingFiner another user just reported this in #7319 ?