@faststore/core 2.2.51 → 2.2.52

package/.turbo/turbo-build.log

@@ -38,27 +38,28 @@ info  - Generating static pages (7/7)
 info  - Finalizing page optimization...
 
 Route (pages)                              Size     First Load JS
-┌ ● /                                      3.2 kB          128 kB
+┌ ● /                                      2.43 kB         128 kB
+├   └ css/d456bfc64bc489a2.css             5.47 kB
 ├   /_app                                  0 B            83.8 kB
-├ ● /[...slug]                             4.32 kB         140 kB
-├   └ css/527e334fa69cf40a.css             1.85 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         112 kB
-├ ● /500                                   1.21 kB         112 kB
-├ ● /account                               676 B           111 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           111 kB
+├ ● /checkout                              661 B           112 kB
 ├ ● /login                                 1.14 kB         112 kB
-└ ● /s                                     4.57 kB         126 kB
+└ ● /s                                     4.57 kB         127 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-86d49ac4b093b8cf.js     2.27 kB
+  ├ chunks/webpack-590d458bd6727c5b.js     2.25 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 (20.951 s)
+PASS test/server/index.test.ts (21.475 s)
   FastStore GraphQL Layer
     @faststore/api
-      ✓ should return a valid GraphQL schema (6 ms)
-      ✓ should return a valid GraphQL schema contain all expected types (9 ms)
+      ✓ 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
     VTEX API Extension
       ✓ getTypeDefsFromFolder function should return an Array (5 ms)
     Third Party API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (4 ms)
+      ✓ getTypeDefsFromFolder function should return an Array (9 ms)
     Final Schema after merging
-      ✓ should return a valid merged GraphQL schema (36 ms)
+      ✓ should return a valid merged GraphQL schema (34 ms)
     Envelop
-      ✓ should exist with its plugins (43 ms)
-      ✓ should handle options and execute (545 ms)
+      ✓ should exist with its plugins (41 ms)
+      ✓ should handle options and execute (567 ms)
 
 Test Suites: 1 passed, 1 total
 Tests:       9 passed, 9 total
 Snapshots:   0 total
-Time:        21.022 s
+Time:        21.585 s
 Ran all test suites.

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.2.51",
+  "version": "2.2.52",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -37,11 +37,11 @@
     "@envelop/graphql-jit": "^1.1.1",
     "@envelop/parser-cache": "^2.2.0",
     "@envelop/validation-cache": "^2.2.0",
-    "@faststore/api": "^2.2.50",
-    "@faststore/components": "^2.2.45",
-    "@faststore/graphql-utils": "^2.2.45",
-    "@faststore/sdk": "^2.2.45",
-    "@faststore/ui": "^2.2.45",
+    "@faststore/api": "^2.2.52",
+    "@faststore/components": "^2.2.52",
+    "@faststore/graphql-utils": "^2.2.52",
+    "@faststore/sdk": "^2.2.52",
+    "@faststore/ui": "^2.2.52",
     "@graphql-codegen/cli": "^3.3.1",
     "@graphql-codegen/typescript": "^3.0.4",
     "@graphql-codegen/typescript-operations": "^3.0.4",
@@ -78,8 +78,8 @@
   "devDependencies": {
     "@cypress/code-coverage": "^3.12.1",
     "@envelop/testing": "^6.0.0",
-    "@faststore/cli": "^2.2.45",
-    "@faststore/eslint-config": "^2.2.45",
+    "@faststore/cli": "^2.2.52",
+    "@faststore/eslint-config": "^2.2.52",
     "@faststore/lighthouse": "^1.12.32",
     "@lhci/cli": "^0.9.0",
     "@testing-library/cypress": "^10.0.1",
@@ -123,5 +123,5 @@
     "node": "18.19.0",
     "yarn": "1.19.1"
   },
-  "gitHead": "bda804eedeae69d9ab0929eb160a730548ba0f45"
+  "gitHead": "ac3400c44c5088f570681217c224a596b0db3e39"
 }

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

@@ -0,0 +1,11 @@
+import {
+  Hero as UIHero,
+  HeroImage as UIHeroImage,
+  HeroHeader as UIHeroHeader,
+} from '@faststore/ui'
+
+export const HeroDefaultComponents = {
+  Hero: UIHero,
+  HeroImage: UIHeroImage,
+  HeroHeader: UIHeroHeader,
+}

package/src/components/sections/Hero/Hero.tsx

@@ -4,11 +4,8 @@ import {
 } from '@faststore/ui'
 import { ReactNode } from 'react'
 import { Image } from 'src/components/ui/Image'
-import {
-  Hero as HeroWrapper,
-  HeroImage,
-  HeroHeader,
-} from 'src/components/sections/Hero/Overrides'
+
+import { useOverrideComponents } from 'src/sdk/overrides/OverrideContext'
 
 import Section from '../Section'
 
@@ -36,16 +33,22 @@ const Hero = ({
   title,
   subtitle,
   image,
-  variant = HeroWrapper.props.variant ?? 'primary',
-  colorVariant = HeroWrapper.props.colorVariant ?? 'main',
+  variant,
+  colorVariant,
   icon,
 }: HeroProps) => {
+  const {
+    Hero: HeroWrapper,
+    HeroImage,
+    HeroHeader,
+  } = useOverrideComponents<'Hero'>()
+
   return (
     <Section className={`${styles.section} section-hero`}>
       <HeroWrapper.Component
         {...HeroWrapper.props}
-        variant={variant}
-        colorVariant={colorVariant}
+        variant={variant ?? HeroWrapper.props.variant ?? 'primary'}
+        colorVariant={colorVariant ?? HeroWrapper.props.colorVariant ?? 'main'}
       >
         <HeroImage.Component {...HeroImage.props}>
           <Image

package/src/components/sections/Hero/OverriddenDefaultHero.ts

@@ -0,0 +1,12 @@
+import { override } from 'src/customizations/src/components/overrides/Hero'
+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 Hero section present in the Headless CMS
+ */
+export const OverriddenDefaultHero = getOverriddenSection(
+  override as SectionOverrideDefinition<'Hero'>
+)

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

@@ -4,7 +4,7 @@ import type { Locator } from '@vtex/client-cms'
 
 import MissingContentError from 'src/sdk/error/MissingContentError/MissingContentError'
 import RenderSections from 'src/components/cms/RenderSections'
-import Hero from 'src/components/sections/Hero'
+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 ProductTiles from 'src/components/sections/ProductTiles'

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

@@ -1,6 +1,6 @@
 import type { ServerCollectionPageQueryQuery } from '@generated/graphql'
 import Breadcrumb from 'src/components/sections/Breadcrumb'
-import Hero from 'src/components/sections/Hero'
+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 ScrollToTopButton from 'src/components/sections/ScrollToTopButton'

package/src/pages/index.tsx

@@ -5,7 +5,7 @@ import type { ComponentType } from 'react'
 
 import RenderSections from 'src/components/cms/RenderSections'
 import BannerText from 'src/components/sections/BannerText'
-import Hero from 'src/components/sections/Hero'
+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'

package/src/sdk/overrides/getOverriddenSection.tsx

@@ -21,8 +21,7 @@ function createOverriddenSection<
   sectionOverrides,
   className,
 }: {
-  /** This type wizardry is here because the props won't behave correctly if done directly: (typeof Sections)[SectionName] */
-  Section: ComponentType<ComponentProps<(typeof Sections)[SectionName]>>
+  Section: (typeof Sections)[SectionName]
   sectionOverrides: OverriddenComponents<SectionName>
   className?: string
 }) {
@@ -31,9 +30,12 @@ function createOverriddenSection<
   return function OverriddenSection(
     props: React.ComponentProps<typeof Section>
   ) {
+    /** This type wizardry is here because the props won't behave correctly if nothing is done */
+    const SectionComponent = Section as ComponentType<typeof props>
+
     return (
       <OverrideProvider value={overrideContextValue}>
-        <Section {...props} />
+        <SectionComponent {...props} />
       </OverrideProvider>
     )
   }

package/src/sdk/overrides/sections.tsx

@@ -1,11 +1,14 @@
 import Alert from '../../components/sections/Alert'
+import Hero from '../../components/sections/Hero'
 
 import type { DefaultSectionComponentsDefinitions } from '../../typings/overridesDefinition'
 import type { SectionsOverrides } from '../../typings/overrides'
 import { AlertDefaultComponents } from '../../components/sections/Alert/DefaultComponents'
+import { HeroDefaultComponents } from '../../components/sections/Hero/DefaultComponents'
 
 export const Sections = {
   Alert,
+  Hero,
 }
 
 export const DefaultComponents: Partial<
@@ -15,4 +18,5 @@ export const DefaultComponents: Partial<
   >
 > = {
   Alert: AlertDefaultComponents,
+  Hero: HeroDefaultComponents,
 }

package/src/typings/overrides.ts

@@ -47,7 +47,7 @@ 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'>
+export type SupportedSectionsOverridesV2 = Pick<SectionsOverrides, 'Alert' | 'Hero'>
 
 /**
  * Originally, these types were defined in their respective Overrides file