feat: add gallery elementToScrollTo behavior

[Susanlotuss]

What problem is this solving?

The change made involves adding the 'scrollToElement' behavior to the Gallery component, removing the prop 'lazyItemsRemaining' in both the Gallery component and GalleryLayout. Additionally, 'lazyRender' has been removed from the GalleryLayoutRow component. This modification addresses a request wherein, when a user is in the PLP and clicks on a product to move to the PDP, then returns to the PLP, the user remains at the initial position. This ensures that the user does not need to scroll to find the position they were in before navigating to the PDP.

How to test it?

This behavior can be tested at: https://renwtesting--renwil.myvtex.com

Screenshots or example usage:

Related to / Depends on

It is important to mention that the removal of lazyRender and lazyItemsRemaining from the initially mentioned components is due to the need to position the scroll in the PLP at the correct location where the user was before moving to the PDP. An ID is assigned to each item (GalleryLayoutRow component) for this purpose. This ID is captured during the click event to the PDP and retrieved upon returning to the PLP to locate the corresponding ID and scroll to that position. Therefore, it is necessary for these IDs to have already loaded; otherwise, the ID won't be found until manual scrolling is performed. Hence, the removal of lazy rendering.

How does this PR make you feel? 🔗

[vtex-io-ci-cd]

Hi! I'm VTEX IO CI/CD Bot and I'll be helping you to publish your app! 🤖

Please select which version do you want to release:

• Patch (backwards-compatible bug fixes)

• Minor (backwards-compatible functionality)

• Major (incompatible API changes)

And then you just need to merge your PR when you are ready! There is no need to create a release commit/tag.

• No thanks, I would rather do it manually 😞

[vtex-io-docs-bot]

Beep boop 🤖

I noticed you didn't make any changes at the docs/ folder

• There's nothing new to document 🤔
• I'll do it later 😞

In order to keep track, I'll create an issue if you decide now is not a good time

• I just updated 🎉🎉

[thalytafabrine]

lgtm, but I have some questions before approving:

1. have you tested what can happen in stores that currently use the search rendering optimization option?
2. we also have the lady render in the GalleryLegacy component, shouldn't we remove it from there as well?
3. will the "search rendering optimization" option be removed from the admin as we will no longer have this feature?

[Susanlotuss]

lgtm, but I have some questions before approving:

1. have you tested what can happen in stores that currently use the search rendering optimization option?
2. we also have the lady render in the GalleryLegacy component, shouldn't we remove it from there as well?
3. will the "search rendering optimization" option be removed from the admin as we will no longer have this feature?

Hello! I've been analyzing the questions you posed, and I observed that it's possible to avoid the change related to the removal of the lazy rendering. Since each store already has the option to enable or disable 'Enable lazy rendering of search results and facets' from the admin panel under the path Store Settings > Storefront > Store > Advanced, enabling this option will maintain the current behavior, with no automatic scrolling on the PLP. On the other hand, disabling it will allow the automatic scrolling on the PLP to work. In light of this, I have already implemented the necessary changes in the last commit.

This behavior can be tested at: https://renwtesting--renwil.myvtex.com as the option 'Enable lazy rendering of search results and facets' has already been disabled in the admin for this store.

[thalytafabrine]

thanks for the great contribution @Susanlotuss 🤗

[vtex-io-ci-cd]

Your PR has been merged! App is being published. 🚀
Version 3.129.3 → 3.129.4

After the publishing process has been completed (check #vtex-io-releases) and doing A/B tests with the new version, you can deploy your release by running:

vtex deploy [email protected]

After that your app will be updated on all accounts.

For more information on the deployment process check the docs. 📖

[thalytafabrine]

hey @Susanlotuss we had to revert this changes since it generated a bug on our stores.
we will try to think about the use case you mentioned here and implement a different solution later :)

[Susanlotuss]

hey @Susanlotuss we had to revert this changes since it generated a bug on our stores. we will try to think about the use case you mentioned here and implement a different solution later :)

Hello, I understand, may I ask what the bug is? Thank you for letting me know!