Merge pull request #659 from vtex-apps/fix/scroll

Yank 3.127.1 changes
vtex-apps · Mar 6, 2024 · 14ff8a5 · 14ff8a5
2 parents 1d7154d + c59d5b4
commit 14ff8a5
Show file tree

Hide file tree

Showing 4 changed files with 16 additions and 55 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -7,6 +7,10 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 ## [Unreleased]
 
+### Fixed
+
+- Yank `3.127.1` changes.
+
 ## [3.129.7] - 2024-03-05
 
 ### Fixed
@@ -65,7 +69,7 @@ and this project adheres to [Semantic Versioning](http://semver.org/spec/v2.0.0.
 
 - Use the advanced setting `fetchSponsoredProductsOnSearch` to determine whether or not to fetch sponsored products.
 
-## [3.127.1] - 2023-10-24
+## [3.127.1] - 2023-10-24 [YANKED]
 
 ### changed
 - Behavior `scrollToElement` added to Gallery component for PLP.

diff --git a/react/Gallery.tsx b/react/Gallery.tsx
@@ -1,4 +1,4 @@
-import React, { Fragment, useEffect } from 'react'
+import React, { Fragment } from 'react'
 import { ProductList as ProductListStructuredData } from 'vtex.structured-data'
 
 import GalleryLayout from './GalleryLayout'
@@ -16,58 +16,17 @@ type GalleryLayoutPropsWithSlots = Omit<GalleryLayoutProps, 'slots'> & Slots
 const Gallery: React.FC<
   GalleryLegacyProps | GalleryLayoutPropsWithSlots
 > = props => {
-  const {
-    layouts,
-    lazyItemsRemaining,
-    products,
-    showingFacets,
-    summary,
-    preferredSKU,
-    ...slots
-  } = props as GalleryLayoutPropsWithSlots
-
-  useEffect(() => {
-    const lastClickedProductId = localStorage.getItem('lastClickedProductId')
-    const isMobile = window.innerWidth <= 768
-
-    const delayedExecution = setTimeout(() => {
-      const scrollToElement = (elementId: string, offset: number) => {
-        const elementToScrollTo = document.getElementById(elementId)
-
-        if (elementToScrollTo) {
-          const rect = elementToScrollTo.getBoundingClientRect()
-          const isElementVisible =
-            rect.top >= 0 &&
-            rect.bottom <=
-              (window.innerHeight || document.documentElement.clientHeight)
-
-          if (!isElementVisible) {
-            elementToScrollTo.scrollIntoView({
-              behavior: 'auto',
-              block: 'center',
-              inline: 'nearest',
-            })
-
-            setTimeout(() => {
-              scrollToElement(elementId, offset)
-            }, 500)
-          }
-        }
-      }
-
-      const recursiveScroll = () => {
-        if (lastClickedProductId) {
-          scrollToElement(lastClickedProductId, isMobile ? -200 : -200)
-        }
-      }
-
-      recursiveScroll()
-    }, 1000)
-
-    return () => clearTimeout(delayedExecution)
-  }, [])
-
   if ('layouts' in props && props.layouts.length > 0) {
+    const {
+      layouts,
+      lazyItemsRemaining,
+      products,
+      showingFacets,
+      summary,
+      preferredSKU,
+      ...slots
+    } = props as GalleryLayoutPropsWithSlots
+
     return (
       <Fragment>
         <ProductListStructuredData products={products} />

diff --git a/react/components/GalleryLayoutItem.tsx b/react/components/GalleryLayoutItem.tsx
@@ -44,7 +44,6 @@ const GalleryLayoutItem: React.FC<GalleryLayoutItemProps> = ({
       position,
       list: listName,
     })
-    localStorage.setItem('lastClickedProductId', product.productId)
   }, [
     product,
     push,

diff --git a/react/components/GalleryLayoutRow.tsx b/react/components/GalleryLayoutRow.tsx
@@ -68,7 +68,6 @@ const GalleryLayoutRow: React.FC<GalleryLayoutRowProps> = ({
               ]),
               'pa4'
             )}
-            id={product.productId}
           >
             <GalleryItem
               GalleryItemComponent={GalleryItemComponent}