Pagination with router params #4698

erral · 2023-04-14T08:23:14Z

netlify · 2023-04-14T08:23:24Z

✅ Deploy Preview for volto canceled.

Name	Link
🔨 Latest commit	`e04278e`
🔍 Latest deploy log	https://app.netlify.com/sites/volto/deploys/64390d761709060008f9ef2e

netlify · 2023-04-14T08:23:50Z

✅ Deploy Preview for volto ready!

Name	Link
🔨 Latest commit	`54e55e1`
🔍 Latest deploy log	https://app.netlify.com/sites/volto/deploys/6482c8f9732df200088e5897
😎 Deploy Preview	https://deploy-preview-4698--volto.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

To edit notification comments on pull requests, go to your Netlify site settings.

cypress · 2023-04-14T08:39:29Z

Passing run #5489 ↗︎

0	503	20	0	0

Details:

Merge branch 'master' into pagination-with-router-params
Project: Volto	Commit: `54e55e16a9`
Status: Passed	Duration: 15:13 💡
Started: Jun 9, 2023 6:42 AM	Ended: Jun 9, 2023 6:57 AM

_{This comment has been generated by cypress-bot as a result of this
project's GitHub integration settings.}

…nd Search block

…ead of '1'

erral · 2023-04-20T13:22:55Z

@sneridagh we have reworked this PR and added cypress tests to show that the ?page=XX functionality is working. We test clicking on the pagination numbers, going back, reloading the page and going to some other page too.

In the meantime we have fixed the withQuerystringResults function, which wasn't checking for the request being loaded, but being "not loading" which created additional queries to the endpoint.

sneridagh · 2023-05-06T09:27:09Z

@erral @ionlizarazu I've found a problem, see video. When I create a page, then go back to the listing, it's still empty :( so the query is not being triggered on route change for some reason. I've tried on demo and works well.

Screen.Recording.2023-05-06.at.11.23.48.mov

…o listing

ionlizarazu · 2023-05-19T11:44:20Z

@erral @ionlizarazu I've found a problem, see video. When I create a page, then go back to the listing, it's still empty :( so the query is not being triggered on route change for some reason. I've tried on demo and works well.

Screen.Recording.2023-05-06.at.11.23.48.mov

I've added a cypress test for this and fixed it.

robgietema · 2023-05-24T09:34:24Z

How does this work when I add multiple listing blocks on 1 page?

ionlizarazu · 2023-05-24T09:57:37Z

How does this work when I add multiple listing blocks on 1 page?

https://cloud.cypress.io/projects/hvviu4/runs/df7a2ee0-472a-456a-8191-814a1b6c3b35/test-results/5fa7949f-3218-4883-a052-3adf784c06d4/video

davisagli · 2023-05-25T00:10:47Z

src/helpers/Utils/usePagination.js

+ * @returns {string} Example: page || page_012345678
+ */
+const useCreatePageQueryStringKey = (id) => {
+  const blockTypesWithPagination = ['search', 'listing'];


Maybe this should come from the config so that addon blocks can use pagination.

You mean the 'blockTypesWithPagination'?

@ionlizarazu Yes. But it can wait for a future PR, rather than delaying this one.

davisagli · 2023-05-25T00:48:48Z

I tried editing a search block and changing the number of items per page, then saving. The items shown per page updated correctly in edit mode, but after I saved, the view mode was still showing the old number of items per page until I reloaded.

davisagli · 2023-05-25T00:53:09Z

src/helpers/Utils/usePagination.js

+        parseInt(
+          qs.parse(location.search)?.[pageQueryStringKey] || defaultPage,
+        ),
+      );


The parsing of the page from the querystring needs to handle a couple edge cases better:

I navigated to ?page=x and the pagination showed NaN

I navigated to ?page=-4 and the block showed no results.

If the value isn't a positive integer, this should probably just use the default page.

ionlizarazu · 2023-05-25T06:29:29Z

I tried editing a search block and changing the number of items per page, then saving. The items shown per page updated correctly in edit mode, but after I saved, the view mode was still showing the old number of items per page until I reloaded.

This is not an issue we are handling in this PR and it happens in the actual Volto version. Can we manage it in another issue or PR?

davisagli · 2023-05-25T14:38:21Z

I tried editing a search block and changing the number of items per page, then saving. The items shown per page updated correctly in edit mode, but after I saved, the view mode was still showing the old number of items per page until I reloaded.

This is not an issue we are handling in this PR and it happens in the actual Volto version. Can we manage it in another issue or PR?

Yes, if it is not a regression from this PR, we can handle it separately.

ionlizarazu · 2023-06-01T07:40:13Z

Can we merge this?

sneridagh · 2023-06-01T08:58:21Z

@ionlizarazu I also think it's ready, I'll try to merge it this week.

Co-authored-by: bipoza <bipoza@gmail.com> Co-authored-by: ionlizarazu <ilizarazu@codesyntax.com> Co-authored-by: Unai <uetxaburu@codesyntax.eus>

Co-authored-by: Mikel Larreategi <mlarreategi@codesyntax.com> Co-authored-by: bipoza <bipoza@gmail.com> Co-authored-by: ionlizarazu <ilizarazu@codesyntax.com> Co-authored-by: Unai <uetxaburu@codesyntax.eus>

* master: Release 17.0.0-alpha.14 Linked headlines (#3540) Release notes for 16.20.8 16.21.0 16.21.1 (#4910) Spanish translation (#4896) Refactor Anontools (#4845) Update to plone-backend 6.0.5 (#4897) Release 17.0.0-alpha.13 Enforce max upload size (#4868) Fix and improve the `addStyling` helper (#4880) Release 17.0.0-alpha.12 Fix regression in horizontal scroll in contents view, add it back (#4872) Configurable Container component from registry for some key route views. (#4871) Allow to deselect color in ColorPickerWidget. (#4839) Release 17.0.0-alpha.11 Pagination with router params (#4698) Release 17.0.0-alpha.10 feat(slate): Add css identifier to slate style menu options (#4847) Update Brazilian Portuguese translations (Fixes #4853) Convert header class to function (#4767)

* master: (29 commits) Remove anonymous function calls. Remove default exports from. (#4917) Release 17.0.0-alpha.14 Linked headlines (#3540) Release notes for 16.20.8 16.21.0 16.21.1 (#4910) Spanish translation (#4896) Refactor Anontools (#4845) Update to plone-backend 6.0.5 (#4897) Release 17.0.0-alpha.13 Enforce max upload size (#4868) Fix and improve the `addStyling` helper (#4880) Release 17.0.0-alpha.12 Fix regression in horizontal scroll in contents view, add it back (#4872) Configurable Container component from registry for some key route views. (#4871) Allow to deselect color in ColorPickerWidget. (#4839) Release 17.0.0-alpha.11 Pagination with router params (#4698) Release 17.0.0-alpha.10 feat(slate): Add css identifier to slate style menu options (#4847) Update Brazilian Portuguese translations (Fixes #4853) Convert header class to function (#4767) ...

bipoza and others added 12 commits April 20, 2023 11:37

Fixes: #3868 - Added the current page parameter in route in Listing a…

fa7250c

…nd Search block

Documentation improvements

f407a6d

Added support for multiple paginations

d98256e

usePagination code refactoring

222e5a0

Added unit test

e197653

Added changelog

f59fc84

fixed the bug when combining the search block with the pagination

6d56e95

usePagination jest tests

9104d66

eslist

1348306

rename the blockId param to id and the defaultPage param to be 1 inst…

998cf8d

…ead of '1'

fix and add tests for usePagination.js

9267346

changelog

b35f5d1

erral force-pushed the pagination-with-router-params branch from c7b9845 to b35f5d1 Compare April 20, 2023 09:37

erral closed this Apr 20, 2023

erral reopened this Apr 20, 2023

ionlizarazu and others added 9 commits April 20, 2023 11:40

update ListingBody test snapshot

c2d3080

update ListingBody test snapshot

52ac58d

cypress test navigating on listings, page reload...

12170bc

usePagination improvements

baa3ef2

fix usePagination tests

1589717

new pagination usage

c3d399f

use id instead of block to get the block id for the pagination

64917a1

two listing tests

d276c1a

update ListingBody.test.jsx snapshot

9e160fd

erral marked this pull request as ready for review April 20, 2023 13:22

erral requested a review from sneridagh April 20, 2023 13:23

sneridagh requested review from reebalazs and robgietema May 6, 2023 09:13

sneridagh removed the 24 status: ready label May 6, 2023

ionlizarazu added 2 commits May 19, 2023 13:41

remove re-request prevention if the content is loaded

7942077

no results listing test; no results -> go to home -> add item -> go t…

f8d7749

…o listing

erral added the 24 status: ready label May 19, 2023

Merge branch 'master' into pagination-with-router-params

a43497a

robgietema approved these changes May 24, 2023

View reviewed changes

sneridagh approved these changes May 24, 2023

View reviewed changes

Merge branch 'master' into pagination-with-router-params

d24dd98

davisagli reviewed May 25, 2023

View reviewed changes

Merge branch 'master' into pagination-with-router-params

ada6a5a

sneridagh mentioned this pull request Jun 1, 2023

Fix search block input clear button doesn't reset the search #4837

Merged

Merge branch 'master' into pagination-with-router-params

54e55e1

sneridagh merged commit b025c50 into master Jun 9, 2023

sneridagh deleted the pagination-with-router-params branch June 9, 2023 10:46

sneridagh pushed a commit that referenced this pull request Jun 23, 2023

Pagination with router params (#4698)

ce92e05

Co-authored-by: bipoza <bipoza@gmail.com> Co-authored-by: ionlizarazu <ilizarazu@codesyntax.com> Co-authored-by: Unai <uetxaburu@codesyntax.eus>

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Pagination with router params #4698

Pagination with router params #4698

erral commented Apr 14, 2023 •

edited

Loading

netlify bot commented Apr 14, 2023 •

edited

Loading

netlify bot commented Apr 14, 2023 •

edited

Loading

cypress bot commented Apr 14, 2023 •

edited

Loading

erral commented Apr 20, 2023

sneridagh commented May 6, 2023 •

edited

Loading

ionlizarazu commented May 19, 2023

robgietema commented May 24, 2023

ionlizarazu commented May 24, 2023

davisagli May 25, 2023

ionlizarazu May 25, 2023

davisagli May 25, 2023

davisagli commented May 25, 2023

davisagli May 25, 2023

ionlizarazu commented May 25, 2023

davisagli commented May 25, 2023

ionlizarazu commented Jun 1, 2023

sneridagh commented Jun 1, 2023

Pagination with router params #4698

Pagination with router params #4698

Conversation

erral commented Apr 14, 2023 • edited Loading

netlify bot commented Apr 14, 2023 • edited Loading

✅ Deploy Preview for volto canceled.

netlify bot commented Apr 14, 2023 • edited Loading

✅ Deploy Preview for volto ready!

cypress bot commented Apr 14, 2023 • edited Loading

Passing run #5489 ↗︎

erral commented Apr 20, 2023

sneridagh commented May 6, 2023 • edited Loading

ionlizarazu commented May 19, 2023

robgietema commented May 24, 2023

ionlizarazu commented May 24, 2023

davisagli May 25, 2023

Choose a reason for hiding this comment

ionlizarazu May 25, 2023

Choose a reason for hiding this comment

davisagli May 25, 2023

Choose a reason for hiding this comment

davisagli commented May 25, 2023

davisagli May 25, 2023

Choose a reason for hiding this comment

ionlizarazu commented May 25, 2023

davisagli commented May 25, 2023

ionlizarazu commented Jun 1, 2023

sneridagh commented Jun 1, 2023

erral commented Apr 14, 2023 •

edited

Loading

netlify bot commented Apr 14, 2023 •

edited

Loading

netlify bot commented Apr 14, 2023 •

edited

Loading

cypress bot commented Apr 14, 2023 •

edited

Loading

sneridagh commented May 6, 2023 •

edited

Loading