@faststore/core 3.0.126 → 3.0.127

package/.turbo/turbo-build.log

@@ -50,7 +50,7 @@ Route (pages)                              Size     First Load JS
 ├   /_app                                  0 B            90.7 kB
 ├ ● /[...slug]                             2.79 kB         155 kB
 ├   └ css/e47f1a002bdcf76f.css             2.38 kB
-├ ● /[slug]/p                              11.1 kB         152 kB
+├ ● /[slug]/p                              11.2 kB         152 kB
 ├   └ css/9b6bba2472d272ec.css             10.5 kB
 ├ ○ /404                                   1.28 kB         126 kB
 ├ ● /500                                   1.29 kB         126 kB
@@ -61,12 +61,12 @@ Route (pages)                              Size     First Load JS
 ├ λ /api/preview                           0 B            90.7 kB
 ├ ● /checkout                              661 B           126 kB
 ├ ● /login                                 1.4 kB          126 kB
-└ ● /s                                     2.22 kB         154 kB
-+ First Load JS shared by all              93.7 kB
+└ ● /s                                     2.22 kB         155 kB
++ First Load JS shared by all              93.8 kB
   ├ chunks/framework-8e279965036b6169.js   45.4 kB
   ├ chunks/main-029f1328cfee9686.js        33.1 kB
-  ├ chunks/pages/_app-68b16ab75cae8271.js  9.87 kB
-  ├ chunks/webpack-abe9adb7914f7244.js     2.38 kB
+  ├ chunks/pages/_app-ed807a0c1aebeb38.js  9.87 kB
+  ├ chunks/webpack-904b033805de64d4.js     2.45 kB
   └ css/ee0556daedda6306.css               3.07 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,10 +1,10 @@
 $ jest
-PASS test/utils/multipleTemplates.test.ts (36.561 s)
-PASS test/server/cms/index.test.ts (37.334 s)
-PASS test/server/index.test.ts (40.724 s)
+PASS test/server/cms/index.test.ts (35.638 s)
+PASS test/utils/multipleTemplates.test.ts (36.258 s)
+PASS test/server/index.test.ts (39.429 s)
 
 Test Suites: 3 passed, 3 total
 Tests:       19 passed, 19 total
 Snapshots:   0 total
-Time:        41.89 s
+Time:        40.695 s
 Ran all test suites.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "3.0.126",
+  "version": "3.0.127",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -128,5 +128,5 @@
     "node": "18.19.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "52d1483dfafce7ca625e0b37116ee8e72c57a39e"
+  "gitHead": "7d804304162f7611bfa338edeb0cc1b5934f0d4d"
 }

package/src/components/cart/CartItem/CartItem.tsx

@@ -1,23 +1,22 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
+import type {
+  AddToCartEvent,
+  CurrencyCode,
+  RemoveFromCartEvent,
+} from '@faststore/sdk'
 import {
   CartItem as UICartItem,
   CartItemImage as UICartItemImage,
   CartItemSummary as UICartItemSummary,
 } from '@faststore/ui'
 import { useCallback, useMemo } from 'react'
-import type {
-  AddToCartEvent,
-  CurrencyCode,
-  RemoveFromCartEvent,
-} from '@faststore/sdk'
 
 import { Image } from 'src/components/ui/Image'
+import type { AnalyticsItem } from 'src/sdk/analytics/types'
+import type { CartItem as ICartItem } from 'src/sdk/cart'
 import { cartStore } from 'src/sdk/cart'
+import { useRemoveButton } from 'src/sdk/cart/useRemoveButton'
 import { useFormattedPrice } from 'src/sdk/product/useFormattedPrice'
 import { useSession } from 'src/sdk/session'
-import { useRemoveButton } from 'src/sdk/cart/useRemoveButton'
-import type { CartItem as ICartItem } from 'src/sdk/cart'
-import type { AnalyticsItem } from 'src/sdk/analytics/types'
 
 function useCartItemEvent() {
   const {
@@ -28,30 +27,32 @@ function useCartItemEvent() {
     (item: Props['item'], quantity: number) => {
       const quantityDelta = quantity - item.quantity
 
-      return sendAnalyticsEvent<
-        AddToCartEvent<AnalyticsItem> | RemoveFromCartEvent<AnalyticsItem>
-      >({
-        name: quantityDelta > 0 ? 'add_to_cart' : 'remove_from_cart',
-        params: {
-          currency: code as CurrencyCode,
-          // TODO: In the future, we can explore more robust ways of
-          // calculating the value (gift items, discounts, etc.).
-          value: item.price * Math.abs(quantityDelta),
-          items: [
-            {
-              item_id: item.itemOffered.isVariantOf.productGroupID,
-              item_name: item.itemOffered.isVariantOf.name,
-              item_brand: item.itemOffered.brand.name,
-              item_variant: item.itemOffered.sku,
-              quantity: Math.abs(quantityDelta),
-              price: item.price,
-              discount: item.listPrice - item.price,
-              currency: code as CurrencyCode,
-              item_variant_name: item.itemOffered.name,
-              product_reference_id: item.itemOffered.gtin,
-            },
-          ],
-        },
+      import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+        return sendAnalyticsEvent<
+          AddToCartEvent<AnalyticsItem> | RemoveFromCartEvent<AnalyticsItem>
+        >({
+          name: quantityDelta > 0 ? 'add_to_cart' : 'remove_from_cart',
+          params: {
+            currency: code as CurrencyCode,
+            // TODO: In the future, we can explore more robust ways of
+            // calculating the value (gift items, discounts, etc.).
+            value: item.price * Math.abs(quantityDelta),
+            items: [
+              {
+                item_id: item.itemOffered.isVariantOf.productGroupID,
+                item_name: item.itemOffered.isVariantOf.name,
+                item_brand: item.itemOffered.brand.name,
+                item_variant: item.itemOffered.sku,
+                quantity: Math.abs(quantityDelta),
+                price: item.price,
+                discount: item.listPrice - item.price,
+                currency: code as CurrencyCode,
+                item_variant_name: item.itemOffered.name,
+                product_reference_id: item.itemOffered.gtin,
+              },
+            ],
+          },
+        })
       })
     },
     [code]

package/src/components/cart/CartSidebar/CartSidebar.tsx

@@ -1,4 +1,3 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
 import {
   Button as UIButton,
   CartSidebar as UICartSidebar,
@@ -28,24 +27,26 @@ function useViewCartEvent() {
   const { items, gifts, total } = useCart()
 
   const sendViewCartEvent = useCallback(() => {
-    return sendAnalyticsEvent<ViewCartEvent>({
-      name: 'view_cart',
-      params: {
-        currency: code as CurrencyCode,
-        value: total,
-        items: items.concat(gifts).map((item) => ({
-          item_id: item.itemOffered.isVariantOf.productGroupID,
-          item_name: item.itemOffered.isVariantOf.name,
-          item_brand: item.itemOffered.brand.name,
-          item_variant: item.itemOffered.sku,
-          quantity: item.quantity,
-          price: item.price,
-          discount: item.listPrice - item.price,
+    import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+      return sendAnalyticsEvent<ViewCartEvent>({
+        name: 'view_cart',
+        params: {
           currency: code as CurrencyCode,
-          item_variant_name: item.itemOffered.name,
-          product_reference_id: item.itemOffered.gtin,
-        })),
-      },
+          value: total,
+          items: items.concat(gifts).map((item) => ({
+            item_id: item.itemOffered.isVariantOf.productGroupID,
+            item_name: item.itemOffered.isVariantOf.name,
+            item_brand: item.itemOffered.brand.name,
+            item_variant: item.itemOffered.sku,
+            quantity: item.quantity,
+            price: item.price,
+            discount: item.listPrice - item.price,
+            currency: code as CurrencyCode,
+            item_variant_name: item.itemOffered.name,
+            product_reference_id: item.itemOffered.gtin,
+          })),
+        },
+      })
     })
   }, [code, gifts, items, total])
 

package/src/components/search/SearchInput/SearchInput.tsx

@@ -1,5 +1,4 @@
 import type { SearchEvent, SearchState } from '@faststore/sdk'
-import { sendAnalyticsEvent } from '@faststore/sdk'
 
 import type {
   SearchInputFieldProps as UISearchInputFieldProps,
@@ -22,7 +21,6 @@ import {
   useState,
 } from 'react'
 
-import { formatSearchPath } from 'src/sdk/search/formatSearchPath'
 import useSearchHistory from 'src/sdk/search/useSearchHistory'
 import useSuggestions from 'src/sdk/search/useSuggestions'
 import useOnClickOutside from 'src/sdk/ui/useOnClickOutside'
@@ -46,9 +44,11 @@ export type SearchInputRef = UISearchInputFieldRef & {
 }
 
 const sendAnalytics = async (term: string) => {
-  sendAnalyticsEvent<SearchEvent>({
-    name: 'search',
-    params: { search_term: term },
+  import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+    sendAnalyticsEvent<SearchEvent>({
+      name: 'search',
+      params: { search_term: term },
+    })
   })
 }
 
@@ -119,13 +119,17 @@ const SearchInput = forwardRef<SearchInputRef, SearchInputProps>(
           placeholder={placeholder}
           onChange={(e) => setSearchQuery(e.target.value)}
           onSubmit={(term) => {
-            const path = formatSearchPath({
-              term,
-              sort: sort as SearchState['sort'],
-            })
-
-            onSearchSelection(term, path)
-            router.push(path)
+            import('src/sdk/search/formatSearchPath').then(
+              ({ formatSearchPath }) => {
+                const path = formatSearchPath({
+                  term,
+                  sort: sort as SearchState['sort'],
+                })
+
+                onSearchSelection(term, path)
+                router.push(path)
+              }
+            )
           }}
           onFocus={() => setSearchDropdownVisible(true)}
           value={searchQuery}

package/src/components/sections/ProductDetails/ProductDetails.tsx

@@ -1,7 +1,6 @@
-import { useEffect, useState, useMemo } from 'react'
+import { useEffect, useMemo, useState } from 'react'
 
 import type { CurrencyCode, ViewItemEvent } from '@faststore/sdk'
-import { sendAnalyticsEvent } from '@faststore/sdk'
 
 import { gql } from '@generated'
 import type { AnalyticsItem } from 'src/sdk/analytics/types'
@@ -12,10 +11,10 @@ import Section from '../Section'
 
 import styles from './section.module.scss'
 
-import { usePDP } from '../../../sdk/overrides/PageProvider'
+import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 import { useOverrideComponents } from '../../../sdk/overrides/OverrideContext'
+import { usePDP } from '../../../sdk/overrides/PageProvider'
 import { ProductDetailsDefaultComponents } from './DefaultComponents'
-import { getOverridableSection } from '../../../sdk/overrides/getOverriddenSection'
 
 export interface ProductDetailsProps {
   productTitle: {
@@ -115,25 +114,27 @@ function ProductDetails({
   } = product
 
   useEffect(() => {
-    sendAnalyticsEvent<ViewItemEvent<AnalyticsItem>>({
-      name: 'view_item',
-      params: {
-        currency: currency.code as CurrencyCode,
-        value: price,
-        items: [
-          {
-            item_id: isVariantOf.productGroupID,
-            item_name: isVariantOf.name,
-            item_brand: brand.name,
-            item_variant: sku,
-            price,
-            discount: listPrice - price,
-            currency: currency.code as CurrencyCode,
-            item_variant_name: variantName,
-            product_reference_id: gtin,
-          },
-        ],
-      },
+    import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+      sendAnalyticsEvent<ViewItemEvent<AnalyticsItem>>({
+        name: 'view_item',
+        params: {
+          currency: currency.code as CurrencyCode,
+          value: price,
+          items: [
+            {
+              item_id: isVariantOf.productGroupID,
+              item_name: isVariantOf.name,
+              item_brand: brand.name,
+              item_variant: sku,
+              price,
+              discount: listPrice - price,
+              currency: currency.code as CurrencyCode,
+              item_variant_name: variantName,
+              product_reference_id: gtin,
+            },
+          ],
+        },
+      })
     })
   }, [
     isVariantOf.productGroupID,

package/src/sdk/analytics/hooks/usePageViewEvent.ts

@@ -1,17 +1,18 @@
-import { useCallback, useEffect } from 'react'
-import { useRouter } from 'next/router'
-import { sendAnalyticsEvent } from '@faststore/sdk'
 import type { PageViewEvent } from '@faststore/sdk'
+import { useRouter } from 'next/router'
+import { useCallback, useEffect } from 'react'
 
 export const usePageViewEvent = () => {
   const sendPageViewEvent = useCallback(() => {
-    sendAnalyticsEvent<PageViewEvent>({
-      name: 'page_view',
-      params: {
-        page_title: document.title,
-        page_location: location.href,
-        send_page_view: true,
-      },
+    import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+      sendAnalyticsEvent<PageViewEvent>({
+        name: 'page_view',
+        params: {
+          page_title: document.title,
+          page_location: location.href,
+          send_page_view: true,
+        },
+      })
     })
   }, [])
 

package/src/sdk/analytics/hooks/useViewItemListEvent.ts

@@ -1,4 +1,3 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
 import { useCallback } from 'react'
 import type { CurrencyCode, ViewItemListEvent } from '@faststore/sdk'
 
@@ -25,25 +24,28 @@ export const useViewItemListEvent = ({
   } = useSession()
 
   const sendViewItemListEvent = useCallback(() => {
-    sendAnalyticsEvent<ViewItemListEvent<AnalyticsItem>>({
-      name: 'view_item_list',
-      params: {
-        item_list_name: title,
-        item_list_id: title,
-        items: products.map(({ node: product }, index) => ({
-          item_id: product.isVariantOf.productGroupID,
-          item_name: product.isVariantOf.name,
-          item_brand: product.brand.name,
-          item_variant: product.sku,
-          price: product.offers.offers[0].price,
-          index: page * pageSize + index + 1,
-          discount:
-            product.offers.offers[0].listPrice - product.offers.offers[0].price,
-          currency: code as CurrencyCode,
-          item_variant_name: product.name,
-          product_reference_id: product.gtin,
-        })),
-      },
+    import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+      sendAnalyticsEvent<ViewItemListEvent<AnalyticsItem>>({
+        name: 'view_item_list',
+        params: {
+          item_list_name: title,
+          item_list_id: title,
+          items: products.map(({ node: product }, index) => ({
+            item_id: product.isVariantOf.productGroupID,
+            item_name: product.isVariantOf.name,
+            item_brand: product.brand.name,
+            item_variant: product.sku,
+            price: product.offers.offers[0].price,
+            index: page * pageSize + index + 1,
+            discount:
+              product.offers.offers[0].listPrice -
+              product.offers.offers[0].price,
+            currency: code as CurrencyCode,
+            item_variant_name: product.name,
+            product_reference_id: product.gtin,
+          })),
+        },
+      })
     })
   }, [code, products, title, page, pageSize])
 

package/src/sdk/cart/useBuyButton.ts

@@ -1,12 +1,11 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
+import type { AddToCartEvent, CurrencyCode } from '@faststore/sdk'
 import { useCallback } from 'react'
-import type { CurrencyCode, AddToCartEvent } from '@faststore/sdk'
 
 import type { AnalyticsItem } from 'src/sdk/analytics/types'
 import type { CartItem } from 'src/sdk/cart'
 
-import { useSession } from '../session'
 import { useUI } from '@faststore/ui'
+import { useSession } from '../session'
 import { cartStore } from './index'
 
 export const useBuyButton = (item: CartItem | null) => {
@@ -23,28 +22,30 @@ export const useBuyButton = (item: CartItem | null) => {
         return
       }
 
-      sendAnalyticsEvent<AddToCartEvent<AnalyticsItem>>({
-        name: 'add_to_cart',
-        params: {
-          currency: code as CurrencyCode,
-          // TODO: In the future, we can explore more robust ways of
-          // calculating the value (gift items, discounts, etc.).
-          value: item.price * item.quantity,
-          items: [
-            {
-              item_id: item.itemOffered.isVariantOf.productGroupID,
-              item_name: item.itemOffered.isVariantOf.name,
-              item_brand: item.itemOffered.brand.name,
-              item_variant: item.itemOffered.sku,
-              quantity: item.quantity,
-              price: item.price,
-              discount: item.listPrice - item.price,
-              currency: code as CurrencyCode,
-              item_variant_name: item.itemOffered.name,
-              product_reference_id: item.itemOffered.gtin,
-            },
-          ],
-        },
+      import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+        sendAnalyticsEvent<AddToCartEvent<AnalyticsItem>>({
+          name: 'add_to_cart',
+          params: {
+            currency: code as CurrencyCode,
+            // TODO: In the future, we can explore more robust ways of
+            // calculating the value (gift items, discounts, etc.).
+            value: item.price * item.quantity,
+            items: [
+              {
+                item_id: item.itemOffered.isVariantOf.productGroupID,
+                item_name: item.itemOffered.isVariantOf.name,
+                item_brand: item.itemOffered.brand.name,
+                item_variant: item.itemOffered.sku,
+                quantity: item.quantity,
+                price: item.price,
+                discount: item.listPrice - item.price,
+                currency: code as CurrencyCode,
+                item_variant_name: item.itemOffered.name,
+                product_reference_id: item.itemOffered.gtin,
+              },
+            ],
+          },
+        })
       })
 
       cartStore.addItem(item)

package/src/sdk/cart/useRemoveButton.ts

@@ -1,12 +1,11 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
-import { useCallback } from 'react'
 import type { CurrencyCode, RemoveFromCartEvent } from '@faststore/sdk'
+import { useCallback } from 'react'
 
 import type { AnalyticsItem } from 'src/sdk/analytics/types'
 
+import type { CartItem } from '.'
 import { useSession } from '../session'
 import { cartStore } from './index'
-import type { CartItem } from '.'
 
 export const useRemoveButton = (item: CartItem | null) => {
   const {
@@ -21,26 +20,28 @@ export const useRemoveButton = (item: CartItem | null) => {
         return
       }
 
-      sendAnalyticsEvent<RemoveFromCartEvent<AnalyticsItem>>({
-        name: 'remove_from_cart',
-        params: {
-          currency: code as CurrencyCode,
-          value: item.price * item.quantity, // TODO: In the future, we can explore more robust ways of calculating the value (gift items, discounts, etc.).
-          items: [
-            {
-              item_id: item.itemOffered.isVariantOf.productGroupID,
-              item_name: item.itemOffered.isVariantOf.name,
-              item_brand: item.itemOffered.brand.name,
-              item_variant: item.itemOffered.sku,
-              quantity: item.quantity,
-              price: item.price,
-              discount: item.listPrice - item.price,
-              currency: code as CurrencyCode,
-              item_variant_name: item.itemOffered.name,
-              product_reference_id: item.itemOffered.gtin,
-            },
-          ],
-        },
+      import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+        sendAnalyticsEvent<RemoveFromCartEvent<AnalyticsItem>>({
+          name: 'remove_from_cart',
+          params: {
+            currency: code as CurrencyCode,
+            value: item.price * item.quantity, // TODO: In the future, we can explore more robust ways of calculating the value (gift items, discounts, etc.).
+            items: [
+              {
+                item_id: item.itemOffered.isVariantOf.productGroupID,
+                item_name: item.itemOffered.isVariantOf.name,
+                item_brand: item.itemOffered.brand.name,
+                item_variant: item.itemOffered.sku,
+                quantity: item.quantity,
+                price: item.price,
+                discount: item.listPrice - item.price,
+                currency: code as CurrencyCode,
+                item_variant_name: item.itemOffered.name,
+                product_reference_id: item.itemOffered.gtin,
+              },
+            ],
+          },
+        })
       })
 
       cartStore.removeItem(item.id)

package/src/sdk/product/useProductGalleryQuery.ts

@@ -1,5 +1,3 @@
-import { sendAnalyticsEvent } from '@faststore/sdk'
-
 import { gql } from '@generated'
 import { useQuery } from 'src/sdk/graphql/useQuery'
 import { useSession } from 'src/sdk/session'
@@ -83,16 +81,18 @@ export const useProductGalleryQuery = ({
   return useQuery<Query, Variables>(query, localizedVariables, {
     onSuccess: (data) => {
       if (data && term) {
-        sendAnalyticsEvent<IntelligentSearchQueryEvent>({
-          name: 'intelligent_search_query',
-          params: {
-            locale,
-            term,
-            url: window.location.href,
-            logicalOperator: data.search.metadata?.logicalOperator ?? 'and',
-            isTermMisspelled: data.search.metadata?.isTermMisspelled ?? false,
-            totalCount: data.search.products.pageInfo.totalCount,
-          },
+        import('@faststore/sdk').then(({ sendAnalyticsEvent }) => {
+          sendAnalyticsEvent<IntelligentSearchQueryEvent>({
+            name: 'intelligent_search_query',
+            params: {
+              locale,
+              term,
+              url: window.location.href,
+              logicalOperator: data.search.metadata?.logicalOperator ?? 'and',
+              isTermMisspelled: data.search.metadata?.isTermMisspelled ?? false,
+              totalCount: data.search.products.pageInfo.totalCount,
+            },
+          })
         })
       }
     },