bug: fix pagination double fetch

[sirugh]

Description

Pagination had some bugs that caused a double fetch. Specifically the usePagination hook initialized with a current page of 0, which is just wrong -- it should default to 1, if anything. So I updated the hook to accept an initialPage param which if omitted will default to 1. Now, when we first load, we check the page query param and use it if defined.

I ran into another issue, which is that the apollo client will actually just throw the GQL errors, and we never caught them. So, for example, if you request page=5 and there are only 4 pages, ApolloClient throws an error and we just break. To fix this I added a try-catch and then some retry logic to the category page.

Additional "bonus" fixes:

• Also fixed default page size in gallery items that was causing a visual discrepancy between the "loading" state and the final loaded category page (12 items vs 6 default).
• Also removed some unnecessary cleanup from pagination component and moved it to the category page.

Related Issue

Closes #1297.

Verification Steps

1. Load your local and click on a category. It should only fetch the 6 images for the category once.
2. Click on page 2. It should still only fetch the page 2 images only once.
3. CTRL+R to refresh the page. It should still only fetch the images once.
4. In the url, make the query param page=65 and press enter. It should update to page=1 and it should only fetch one set of images.

Screenshots / Screen Captures (if appropriate)

Proposed Labels for Change Type/Package

• major (e.g x.0.0 - a breaking change)
• minor (e.g 0.x.0 - a backwards compatible addition)
• patch (e.g 0.0.x - a bug fix)

usePagination now defaults to 1 instead of 0 so this is technically a breaking change.

Checklist:

• I have updated the documentation accordingly, if necessary.
• I have added tests to cover my changes, if necessary.

[vercel]

This pull request is automatically deployed with Now.
To access deployments, click Details below or on the icon next to each push.

Latest deployment for this branch: https://venia-git-bug-double-loaded-category-images.magento-research1.now.sh

[sirugh]

One thing that stands out to me in all of this is that I don't know who the page parameter "belongs" to anymore. We need to read it to get the initialPage value for the usePagination hook we initialize here in category.js, but the only place in which we update the query parameter is within pagination.js, a child component.

[zetlen]

That's a really good observation, related to the question in #1305. I think we need to encapsulate the query parameter handling entirely inside usePagination; it should use useSearchParam under the hood.

[sirugh]

I made these changes. I'll wait for feedback before fixing the tests.

[PWAStudioBot]

	Messages
📖	We are currently working on automating the PR metadata checks. Until that time, you may see failures related to labels/description/linked issues/etc even if you have fixed the problem. Failures will persist until the next push (assuming they are fixed).

Generated by 🚫 dangerJS against d45336e

[zetlen]

Excellent change, good debugging, a couple small things. That page URL parameter definitely needs to be abstracted into the hook itself.

[zetlen]

That's a really good observation, related to the question in #1305. I think we need to encapsulate the query parameter handling entirely inside usePagination; it should use useSearchParam under the hood.

[devpatil7]

@sirugh QA pass, good to merge if review is approved.

[sirugh]

This only includes an _ if namespace is provided. It was incorrectly using a param of _page.