how to use '3' as a new number prop to customise pagination range display

[ManousakisGS]

https://github.com/imballinst/react-bs-datatable/blob/6a490618905aa1eb215b1ddabfa0501b8ffb44e7/src/components/Pagination.tsx#L145

[imballinst]

heya @ManousakisGS! At the moment I think there's no way to do it, but this should be a simple change (I think...). Something like this, what do you think?

<Pagination paginationRange={5} /* defaults to 3 */ />

[ManousakisG]

Hey @imballinst ! I also thought about this by looking at the code! I already finished one implementation of this specific issue if you wish to check. Best regards:)

[imballinst]

@ManousakisG oof, apologies, I didn't know! I already opened a PR for this: https://github.com/imballinst/react-bs-datatable/pull/176 🤦 if I had known, I would have given you the chance. Perhaps next time? 😄

[ManousakisGS]

yes maybe next time! Thanks for being there for this specific issue ! Have a nice day 😄

[imballinst]

I have released the latest version 3.11.0 but apparently I had some holes in the implementation 🤦 https://codesandbox.io/s/react-bs-datatable-3-11-0-pagination-range-p4p0pn?file=/src/App.tsx

The currently active page isn't located at the center of the buttons so it's being weird and that. Will fix it in a bit for 3.11.1.

[imballinst]

I have updated the sandbox here with 3.11.1 @ManousakisG, could you verify if they are working as intended? Thanks! https://codesandbox.io/s/react-bs-datatable-3-11-0-pagination-range-p4p0pn?file=/package.json

[ManousakisGS]

Hello, I tried it but is still not displaying the active page in the center of the buttons.

[imballinst]

@ManousakisG hmmm, so I guess this is the expected behavior?

• For odd value of paginationRange, then the active page is centered
• For even value of paginationRange, the current behavior is expected

Or not?

[ManousakisGS]

hmm i am thinking that it looks better if in both cases the active page is 'almost' centered.

In odd values it can be perfectly centered. In even values there can be one more button from the right side of the active button.

Like the image of this example:

What do you think?

[imballinst]

ah, got it! Yeah, I think I can work that out tomorrow, I have already thought on the logic, just need to write it down. I'll publish a beta version now and after you've confirmed it's working accordingly, I'll publish the official version.

Thanks for the feedback @ManousakisG!

[imballinst]

hi @ManousakisG, I have published 3.11.2-beta.0, when you have the time, could you help try it out in this sandbox and see if there are holes that I'm missing from my test cases? https://codesandbox.io/s/react-bs-datatable-3-11-2-beta-0-pagination-range-n3ygh8?file=/src/App.tsx

Thanks!

[ManousakisGS]

Hi @imballinst! I think that it works fine and your implementation right now solved the issue! Thank youu!

[imballinst]

Cool! I'll publish 3.11.2, then. Thanks for the confirmation and feedback @ManousakisG!

[imballinst]

https://www.npmjs.com/package/react-bs-datatable/v/3.11.2 should now be available through npm. Thanks!