@faststore/core 2.2.52 → 2.2.54

package/.turbo/turbo-build.log

@@ -1,6 +1,6 @@
 $ yarn partytown & yarn generate && next build
-$ partytown copylib ./public/~partytown
 $ faststore generate-graphql -c
+$ partytown copylib ./public/~partytown
 Partytown lib copied to: /home/runner/work/faststore/faststore/packages/core/public/~partytown
 success - GraphQL schema, types, and optimizations successfully generated 🎉
 warn  - You have enabled experimental feature (scrollRestoration) in next.config.js.
@@ -38,28 +38,28 @@ info  - Generating static pages (7/7)
 info  - Finalizing page optimization...
 
 Route (pages)                              Size     First Load JS
-┌ ● /                                      2.43 kB         128 kB
-├   └ css/d456bfc64bc489a2.css             5.47 kB
-├   /_app                                  0 B            83.8 kB
-├ ● /[...slug]                             3.57 kB         140 kB
-├   └ css/4e42cc999ad62b57.css             5.9 kB
-├ ● /[slug]/p                              10.9 kB         136 kB
-├   └ css/d7bbfbd552f407e9.css             11.3 kB
-├ ○ /404                                   1.19 kB         113 kB
-├ ● /500                                   1.21 kB         113 kB
-├ ● /account                               677 B           112 kB
-├ λ /api/graphql                           0 B            83.8 kB
-├ λ /api/health/live                       0 B            83.8 kB
-├ λ /api/health/ready                      0 B            83.8 kB
-├ λ /api/preview                           0 B            83.8 kB
-├ ● /checkout                              661 B           112 kB
-├ ● /login                                 1.14 kB         112 kB
-└ ● /s                                     4.57 kB         127 kB
+┌ ● /                                      6.61 kB         127 kB
+├   └ css/cf062feb79245123.css             8.38 kB
+├   /_app                                  0 B            83.7 kB
+├ ● /[...slug]                             7.35 kB         139 kB
+├   └ css/0dc997f9da3027b7.css             8.8 kB
+├ ● /[slug]/p                              14.9 kB         135 kB
+├   └ css/cbccabebb36f7f92.css             13.3 kB
+├ ○ /404                                   1.19 kB         121 kB
+├ ● /500                                   1.21 kB         121 kB
+├ ● /account                               677 B           121 kB
+├ λ /api/graphql                           0 B            83.7 kB
+├ λ /api/health/live                       0 B            83.7 kB
+├ λ /api/health/ready                      0 B            83.7 kB
+├ λ /api/preview                           0 B            83.7 kB
+├ ● /checkout                              662 B           121 kB
+├ ● /login                                 1.14 kB         121 kB
+└ ● /s                                     1.38 kB         133 kB
 + First Load JS shared by all              86.8 kB
   ├ chunks/framework-dfd14d7ce6600b03.js   45.3 kB
   ├ chunks/main-e4e873ee741162eb.js        24.2 kB
   ├ chunks/pages/_app-30b9666307e4b3b1.js  12.1 kB
-  ├ chunks/webpack-590d458bd6727c5b.js     2.25 kB
+  ├ chunks/webpack-422f774fb36da0fb.js     2.23 kB
   └ css/5d1f64b61ea581f4.css               3.05 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,23 +1,23 @@
 $ jest
-PASS test/server/index.test.ts (21.475 s)
+PASS test/server/index.test.ts (20.574 s)
   FastStore GraphQL Layer
     @faststore/api
-      ✓ should return a valid GraphQL schema (5 ms)
-      ✓ should return a valid GraphQL schema contain all expected types (5 ms)
-      ✓ should return a valid GraphQL schema contain all expected queries (1 ms)
-      ✓ should return a valid GraphQL schema contain all expected mutations
+      ✓ should return a valid GraphQL schema (27 ms)
+      ✓ should return a valid GraphQL schema contain all expected types (8 ms)
+      ✓ should return a valid GraphQL schema contain all expected queries (2 ms)
+      ✓ should return a valid GraphQL schema contain all expected mutations (1 ms)
     VTEX API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (5 ms)
+      ✓ getTypeDefsFromFolder function should return an Array (8 ms)
     Third Party API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (9 ms)
+      ✓ getTypeDefsFromFolder function should return an Array (5 ms)
     Final Schema after merging
-      ✓ should return a valid merged GraphQL schema (34 ms)
+      ✓ should return a valid merged GraphQL schema (39 ms)
     Envelop
-      ✓ should exist with its plugins (41 ms)
-      ✓ should handle options and execute (567 ms)
+      ✓ should exist with its plugins (26 ms)
+      ✓ should handle options and execute (198 ms)
 
 Test Suites: 1 passed, 1 total
 Tests:       9 passed, 9 total
 Snapshots:   0 total
-Time:        21.585 s
+Time:        20.712 s
 Ran all test suites.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.2.52",
+  "version": "2.2.54",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -123,5 +123,5 @@
     "node": "18.19.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "ac3400c44c5088f570681217c224a596b0db3e39"
+  "gitHead": "bd49979ef06f4af7632e86a2c552bcef20690f0a"
 }

package/src/components/sections/BannerNewsletter/BannerNewsletter.tsx

@@ -1,4 +1,5 @@
-import BannerText, { BannerTextProps } from 'src/components/sections/BannerText'
+import { BannerTextProps } from 'src/components/sections/BannerText'
+import { OverriddenDefaultBannerText as BannerText } from 'src/components/sections/BannerText/OverriddenDefaultBannerText'
 import Newsletter, { NewsletterProps } from 'src/components/sections/Newsletter'
 import Section from '../Section'
 import styles from './section.module.scss'

package/src/components/sections/BannerText/BannerText.tsx

@@ -3,10 +3,7 @@ import {
   BannerTextContentProps as UIBannerTextContentProps,
 } from '@faststore/ui'
 
-import {
-  BannerText as BannerTextWrapper,
-  BannerTextContent,
-} from 'src/components/sections/BannerText/Overrides'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 import Section from '../Section'
 
 import styles from './section.module.scss'
@@ -27,29 +24,32 @@ export interface BannerTextProps {
 function BannerText({
   title,
   caption,
-  link: {
-    url: linkUrl = BannerTextContent.props.link,
-    text: linkText = BannerTextContent.props.linkText,
-    linkTargetBlank: linkTargetBlank = BannerTextContent.props.linkTargetBlank,
-  },
-  variant = BannerTextWrapper.props.variant ?? 'primary',
-  colorVariant = BannerTextWrapper.props.colorVariant ?? 'main',
+  link: { url: linkUrl, text: linkText, linkTargetBlank },
+  variant,
+  colorVariant,
 }: BannerTextProps) {
+  const { BannerText: BannerTextWrapper, BannerTextContent } =
+    useOverrideComponents<'BannerText'>()
+
   return (
     <Section className={`${styles.section} section-banner layout__section`}>
       <div className="layout__content">
         <BannerTextWrapper.Component
           {...BannerTextWrapper.props}
-          variant={variant}
-          colorVariant={colorVariant}
+          variant={variant ?? BannerTextWrapper.props.variant ?? 'primary'}
+          colorVariant={
+            colorVariant ?? BannerTextWrapper.props.colorVariant ?? 'main'
+          }
         >
           <BannerTextContent.Component
             {...BannerTextContent.props}
             title={title}
             caption={caption}
-            link={linkUrl}
-            linkText={linkText}
-            linkTargetBlank={linkTargetBlank}
+            link={linkUrl ?? BannerTextContent.props.link}
+            linkText={linkText ?? BannerTextContent.props.linkText}
+            linkTargetBlank={
+              linkTargetBlank ?? BannerTextContent.props.linkTargetBlank
+            }
           />
         </BannerTextWrapper.Component>
       </div>

package/src/components/sections/BannerText/DefaultComponents.ts

@@ -0,0 +1,9 @@
+import {
+  BannerText as UIBannerText,
+  BannerTextContent as UIBannerTextContent,
+} from '@faststore/ui'
+
+export const BannerTextDefaultComponents = {
+  BannerText: UIBannerText,
+  BannerTextContent: UIBannerTextContent,
+} as const

package/src/components/sections/BannerText/OverriddenDefaultBannerText.ts

@@ -0,0 +1,12 @@
+import { override } from 'src/customizations/src/components/overrides/BannerText'
+import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+
+/**
+ * This component exists to support overrides 1.0
+ *
+ * This allows users to override the default BannerText section present in the Headless CMS
+ */
+export const OverriddenDefaultBannerText = getOverriddenSection(
+  override as SectionOverrideDefinition<'BannerText'>
+)

package/src/components/sections/ProductShelf/DefaultComponents.ts

@@ -0,0 +1,9 @@
+import { ProductShelf as UIProductShelf } from '@faststore/ui'
+import ProductCard from 'src/components/product/ProductCard'
+import Carousel from 'src/components/ui/Carousel'
+
+export const ProductShelfDefaultComponents = {
+  ProductShelf: UIProductShelf,
+  __experimentalCarousel: Carousel,
+  __experimentalProductCard: ProductCard,
+} as const

package/src/components/sections/ProductShelf/OverriddenDefaultProductShelf.ts

@@ -0,0 +1,12 @@
+import { override } from 'src/customizations/src/components/overrides/ProductShelf'
+import { getOverriddenSection } from 'src/sdk/overrides/getOverriddenSection'
+import type { SectionOverrideDefinition } from 'src/typings/overridesDefinition'
+
+/**
+ * This component exists to support overrides 1.0
+ *
+ * This allows users to override the default ProductShelf section present in the Headless CMS
+ */
+export const OverriddenDefaultProductShelf = getOverriddenSection(
+  override as SectionOverrideDefinition<'ProductShelf'>
+)

package/src/components/templates/LandingPage/LandingPage.tsx

@@ -6,9 +6,9 @@ import MissingContentError from 'src/sdk/error/MissingContentError/MissingConten
 import RenderSections from 'src/components/cms/RenderSections'
 import { OverriddenDefaultHero as Hero } from 'src/components/sections/Hero/OverriddenDefaultHero'
 import Incentives from 'src/components/sections/Incentives'
-import ProductShelf from 'src/components/sections/ProductShelf'
+import { OverriddenDefaultProductShelf as ProductShelf } from 'src/components/sections/ProductShelf/OverriddenDefaultProductShelf'
 import ProductTiles from 'src/components/sections/ProductTiles'
-import BannerText from 'src/components/sections/BannerText'
+import { OverriddenDefaultBannerText as BannerText } from 'src/components/sections/BannerText/OverriddenDefaultBannerText'
 import Newsletter from 'src/components/sections/Newsletter'
 import { getPage } from 'src/server/cms'
 import type { PageContentType } from 'src/server/cms'

package/src/components/templates/ProductListingPage/ProductListing.tsx

@@ -2,7 +2,7 @@ import type { ServerCollectionPageQueryQuery } from '@generated/graphql'
 import Breadcrumb from 'src/components/sections/Breadcrumb'
 import { OverriddenDefaultHero as Hero } from 'src/components/sections/Hero/OverriddenDefaultHero'
 import ProductGallery from 'src/components/sections/ProductGallery'
-import ProductShelf from 'src/components/sections/ProductShelf'
+import { OverriddenDefaultProductShelf as ProductShelf } from 'src/components/sections/ProductShelf/OverriddenDefaultProductShelf'
 import ScrollToTopButton from 'src/components/sections/ScrollToTopButton'
 import { ITEMS_PER_PAGE } from 'src/constants'
 import deepmerge from 'deepmerge'

package/src/components/ui/ProductShelf/ProductShelf.tsx

@@ -2,15 +2,10 @@ import { useEffect, useId, useRef } from 'react'
 
 import ProductShelfSkeleton from 'src/components/skeletons/ProductShelfSkeleton'
 import { useViewItemListEvent } from 'src/sdk/analytics/hooks/useViewItemListEvent'
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 import { useProductsQuery } from 'src/sdk/product/useProductsQuery'
 import { textToKebabCase } from 'src/utils/utilities'
 
-import {
-  ProductShelf as ProductShelfWrapper,
-  __experimentalCarousel as Carousel,
-  __experimentalProductCard as ProductCard,
-} from 'src/components/sections/ProductShelf/Overrides'
-
 type Sort =
   | 'discount_desc'
   | 'name_asc'
@@ -42,14 +37,16 @@ export type ProductShelfProps = {
 function ProductShelf({
   title,
   inView,
-  productCardConfiguration: {
-    bordered = ProductCard.props.bordered,
-    showDiscountBadge = ProductCard.props.showDiscountBadge,
-  } = {},
+  productCardConfiguration: { bordered, showDiscountBadge } = {},
   numberOfItems,
   itemsPerPage = 5,
   ...otherProps
 }: ProductShelfProps) {
+  const {
+    ProductShelf: ProductShelfWrapper,
+    __experimentalCarousel: Carousel,
+    __experimentalProductCard: ProductCard,
+  } = useOverrideComponents<'ProductShelf'>()
   const titleId = textToKebabCase(title)
   const id = useId()
   const viewedOnce = useRef(false)
@@ -100,8 +97,10 @@ function ProductShelf({
                   sizes: '(max-width: 768px) 42vw, 30vw',
                 }}
                 {...ProductCard.props}
-                bordered={bordered}
-                showDiscountBadge={showDiscountBadge}
+                bordered={bordered ?? ProductCard.props.bordered}
+                showDiscountBadge={
+                  showDiscountBadge ?? ProductCard.props.showDiscountBadge
+                }
                 // Dynamic props shouldn't be overridable
                 // This decision can be reviewed later if needed
                 key={`${product.node.id}`}

package/src/pages/[slug]/p.tsx

@@ -12,7 +12,7 @@ import type {
 } from '@generated/graphql'
 import RenderSections from 'src/components/cms/RenderSections'
 import BannerNewsletter from 'src/components/sections/BannerNewsletter/BannerNewsletter'
-import BannerText from 'src/components/sections/BannerText'
+import { OverriddenDefaultBannerText as BannerText } from 'src/components/sections/BannerText/OverriddenDefaultBannerText'
 import Breadcrumb from 'src/components/sections/Breadcrumb'
 import CrossSellingShelf from 'src/components/sections/CrossSellingShelf'
 import ProductDetails from 'src/components/sections/ProductDetails'

package/src/pages/index.tsx

@@ -4,11 +4,11 @@ import { NextSeo, SiteLinksSearchBoxJsonLd } from 'next-seo'
 import type { ComponentType } from 'react'
 
 import RenderSections from 'src/components/cms/RenderSections'
-import BannerText from 'src/components/sections/BannerText'
+import { OverriddenDefaultBannerText as BannerText } from 'src/components/sections/BannerText/OverriddenDefaultBannerText'
 import { OverriddenDefaultHero as Hero } from 'src/components/sections/Hero/OverriddenDefaultHero'
 import Incentives from 'src/components/sections/Incentives'
 import Newsletter from 'src/components/sections/Newsletter'
-import ProductShelf from 'src/components/sections/ProductShelf'
+import { OverriddenDefaultProductShelf as ProductShelf } from 'src/components/sections/ProductShelf/OverriddenDefaultProductShelf'
 import ProductTiles from 'src/components/sections/ProductTiles'
 import CUSTOM_COMPONENTS from 'src/customizations/src/components'
 import { mark } from 'src/sdk/tests/mark'

package/src/sdk/overrides/sections.tsx

@@ -1,14 +1,20 @@
 import Alert from '../../components/sections/Alert'
+import BannerText from '../../components/sections/BannerText'
 import Hero from '../../components/sections/Hero'
+import ProductShelf from '../../components/sections/ProductShelf'
 
 import type { DefaultSectionComponentsDefinitions } from '../../typings/overridesDefinition'
 import type { SectionsOverrides } from '../../typings/overrides'
 import { AlertDefaultComponents } from '../../components/sections/Alert/DefaultComponents'
+import { BannerTextDefaultComponents } from '../../components/sections/BannerText/DefaultComponents'
 import { HeroDefaultComponents } from '../../components/sections/Hero/DefaultComponents'
+import { ProductShelfDefaultComponents } from '../../components/sections/ProductShelf/DefaultComponents'
 
 export const Sections = {
   Alert,
+  BannerText,
   Hero,
+  ProductShelf,
 }
 
 export const DefaultComponents: Partial<
@@ -18,5 +24,7 @@ export const DefaultComponents: Partial<
   >
 > = {
   Alert: AlertDefaultComponents,
+  BannerText: BannerTextDefaultComponents,
   Hero: HeroDefaultComponents,
+  ProductShelf: ProductShelfDefaultComponents,
 }

package/src/typings/overrides.ts

@@ -47,7 +47,10 @@ export type SectionOverride = {
 }[keyof SectionsOverrides]
 
 /** TODO: every use of this type should be replaced by SectionsOverrides after all sections are supported */
-export type SupportedSectionsOverridesV2 = Pick<SectionsOverrides, 'Alert' | 'Hero'>
+export type SupportedSectionsOverridesV2 = Pick<
+  SectionsOverrides,
+  'Alert' | 'BannerText' | 'Hero' | 'ProductShelf'
+>
 
 /**
  * Originally, these types were defined in their respective Overrides file