@faststore/core 2.2.0-alpha.0 → 2.2.0-alpha.2

package/.turbo/turbo-build.log

@@ -28,7 +28,7 @@ Route (pages)                              Size     First Load JS
 ├ ● /[...slug]                             4.83 kB         210 kB
 ├   └ css/527e334fa69cf40a.css             1.85 kB
 ├ ● /[slug]/p                              11.3 kB         205 kB
-├   └ css/c110411bf3c3f5d1.css             11.3 kB
+├   └ css/4b7138899cd07c63.css             11.3 kB
 ├ ○ /404                                   1.19 kB         114 kB
 ├ ● /500                                   1.21 kB         114 kB
 ├ ● /account                               670 B           113 kB
@@ -42,8 +42,8 @@ Route (pages)                              Size     First Load JS
 + First Load JS shared by all              81 kB
   ├ chunks/framework-dfd14d7ce6600b03.js   45.3 kB
   ├ chunks/main-fd466221927468fd.js        23.9 kB
-  ├ chunks/pages/_app-895781b1c7b5bf56.js  6.45 kB
-  ├ chunks/webpack-54eb777fd3680e08.js     2.29 kB
+  ├ chunks/pages/_app-6d0e6ab9a4dd8106.js  6.45 kB
+  ├ chunks/webpack-2e9da2bb669ad415.js     2.29 kB
   └ css/9e76fef1c9ca89af.css               3.06 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,25 +1,25 @@
 $ tsdx test
 ts-jest[versions] (WARN) Version 29.1.0 of jest installed has not been tested with ts-jest. If you're experiencing issues, consider using a supported version (>=25.0.0 <26.0.0). Please do not report issues in ts-jest if you are using unsupported versions.
 ts-jest[versions] (WARN) Version 4.9.4 of typescript installed has not been tested with ts-jest. If you're experiencing issues, consider using a supported version (>=3.4.0 <4.0.0). Please do not report issues in ts-jest if you are using unsupported versions.
-PASS test/server/index.test.ts (11.119s)
+PASS test/server/index.test.ts (17.219s)
   FastStore GraphQL Layer
     @faststore/api
-      ✓ should return a valid GraphQL schema (8ms)
-      ✓ should return a valid GraphQL schema contain all expected types (20ms)
-      ✓ should return a valid GraphQL schema contain all expected queries (2ms)
-      ✓ should return a valid GraphQL schema contain all expected mutations (1ms)
+      ✓ should return a valid GraphQL schema (7ms)
+      ✓ should return a valid GraphQL schema contain all expected types (53ms)
+      ✓ should return a valid GraphQL schema contain all expected queries (1ms)
+      ✓ should return a valid GraphQL schema contain all expected mutations
     VTEX API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (9ms)
+      ✓ getTypeDefsFromFolder function should return an Array (14ms)
     Third Party API Extension
-      ✓ getTypeDefsFromFolder function should return an Array (8ms)
+      ✓ getTypeDefsFromFolder function should return an Array (6ms)
     Final Schema after merging
-      ✓ should return a valid merged GraphQL schema (42ms)
+      ✓ should return a valid merged GraphQL schema (111ms)
     Envelop
-      ✓ should exist with its plugins (45ms)
-      ✓ should handle options and execute (355ms)
+      ✓ should exist with its plugins (65ms)
+      ✓ should handle options and execute (226ms)
 
 Test Suites: 1 passed, 1 total
 Tests:       9 passed, 9 total
 Snapshots:   0 total
-Time:        11.909s
+Time:        18.262s
 Ran all test suites.

package/cms/faststore/sections.json

@@ -166,6 +166,21 @@
             "alt": {
               "title": "Alternative Label",
               "type": "string"
+            },
+            "link": {
+              "title": "Logo Link",
+              "type": "object",
+              "required": ["url", "title"],
+              "properties": {
+                "url": {
+                  "title": "Link URL",
+                  "type": "string"
+                },
+                "title": {
+                  "title": "Link Title",
+                  "type": "string"
+                }
+              }
             }
           }
         },
@@ -556,8 +571,23 @@
               }
             },
             "alt": {
-              "type": "string",
-              "title": "Alternative Label"
+              "title": "Alternative Label",
+              "type": "string"
+            },
+            "link": {
+              "title": "Logo Link",
+              "type": "object",
+              "required": ["url", "title"],
+              "properties": {
+                "url": {
+                  "title": "Link URL",
+                  "type": "string"
+                },
+                "title": {
+                  "title": "Link Title",
+                  "type": "string"
+                }
+              }
             }
           }
         },

package/faststore.config.js

@@ -1,6 +1,6 @@
 module.exports = {
   seo: {
-    title: 'NextJSStore',
+    title: 'FastStore Starter',
     description: 'Fast Demo Store',
     titleTemplate: '%s | FastStore',
     author: 'Store Framework',

package/generate.sh

@@ -62,8 +62,8 @@ run_command() {
 # Run "yarn generate:schema" without outputting logs and errors
 run_command "yarn generate:schema" "Failed to run 'yarn generate:schema'. Please check your setup." "false"
 
-# Run graphql-codegen and capture the output
-run_command "graphql-codegen" "GraphQL was not optimized and TS files were not updated. Changes in the GraphQL layer did not take effect" "false"
+# Run "yarn graphql-codegen" and capture the output
+run_command "yarn graphql-codegen" "GraphQL was not optimized and TS files were not updated. Changes in the GraphQL layer did not take effect" "false"
 
 # Run "yarn format:generated" and display a warning if it produces output
 run_command "yarn format:generated" "Failed to format generated files. 'yarn format:generated' thrown errors" "true"

package/index.ts

@@ -13,3 +13,5 @@ export type {
   PLPContext,
   SearchPageContext,
 } from './src/sdk/overrides/PageProvider'
+
+export { useProductsQuery } from './src/sdk/product/useProductsQuery'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "2.2.0-alpha.0",
+  "version": "2.2.0-alpha.2",
   "license": "MIT",
   "browserslist": "supports es6-module and not dead",
   "exports": {
@@ -35,11 +35,11 @@
     "@envelop/graphql-jit": "^1.1.1",
     "@envelop/parser-cache": "^2.2.0",
     "@envelop/validation-cache": "^2.2.0",
-    "@faststore/api": "^2.2.0-alpha.0",
-    "@faststore/components": "^2.2.0-alpha.0",
-    "@faststore/graphql-utils": "^2.2.0-alpha.0",
-    "@faststore/sdk": "^2.2.0-alpha.0",
-    "@faststore/ui": "^2.2.0-alpha.0",
+    "@faststore/api": "^2.2.0-alpha.1",
+    "@faststore/components": "^2.2.0-alpha.1",
+    "@faststore/graphql-utils": "^2.2.0-alpha.1",
+    "@faststore/sdk": "^2.2.0-alpha.1",
+    "@faststore/ui": "^2.2.0-alpha.1",
     "@graphql-codegen/cli": "^3.3.1",
     "@graphql-codegen/typescript": "^3.0.4",
     "@graphql-codegen/typescript-operations": "^3.0.4",
@@ -78,7 +78,7 @@
   "devDependencies": {
     "@cypress/code-coverage": "^3.9.10",
     "@envelop/testing": "^6.0.0",
-    "@faststore/eslint-config": "^2.2.0-alpha.0",
+    "@faststore/eslint-config": "^2.2.0-alpha.1",
     "@faststore/lighthouse": "^1.12.32",
     "@lhci/cli": "^0.9.0",
     "@storybook/addon-a11y": "^6.5.9",
@@ -125,5 +125,5 @@
   "msw": {
     "workerDirectory": "public"
   },
-  "gitHead": "356e52b6eae13cc4000c6915985009d45e7ae0c6"
+  "gitHead": "e7c49e9acbd86b8501badc384476a10d4f39054f"
 }

package/src/components/ThirdPartyScripts/ThirdPartyScripts.tsx

@@ -1,5 +1,5 @@
 import { Partytown } from '@builder.io/partytown/react'
-
+import OverrideComponents from 'src/customizations/GlobalOverrides'
 import storeConfig from '../../../faststore.config'
 import GoogleTagManager from './GoogleTagManager'
 import VTEX from './vtex'
@@ -26,6 +26,7 @@ function ThirdPartyScripts() {
     <>
       {includeGTM && <GoogleTagManager containerId={gtmContainerId} />}
       {includeVTEX && <VTEX />}
+      <OverrideComponents.ThirdPartyScripts />
       <Partytown
         key="partytown"
         // Variables to forward to from main to worker

package/src/components/navigation/Navbar/Navbar.tsx

@@ -110,13 +110,12 @@ function Navbar({
                 aria-label={menuIconAlt}
               />
               <Link
-                href="/"
                 data-fs-navbar-logo
+                href={logo.link ? logo.link.url : '/'}
+                title={logo.link ? logo.link.title : homeLabel}
                 prefetch={false}
-                title={homeLabel}
-                aria-label={homeLabel}
               >
-                <Logo {...logo} />
+                <Logo src={logo.src} alt={logo.alt} />
               </Link>
             </>
           )}

package/src/components/navigation/NavbarSlider/NavbarSlider.tsx

@@ -51,13 +51,12 @@ function NavbarSlider({
         {...NavbarSliderWrapper.props}
       >
         <Link
-          href="/"
-          onClick={fadeOut}
-          title={homeLabel}
-          aria-label={homeLabel}
           data-fs-navbar-slider-logo
+          href={logo.link ? logo.link.url : '/'}
+          title={logo.link ? logo.link.title : homeLabel}
+          onClick={fadeOut}
         >
-          <Logo {...logo} />
+          <Logo alt={logo.alt} src={logo.src} />
         </Link>
       </NavbarSliderHeader.Component>
       <NavbarSliderContent.Component {...NavbarSliderContent.props}>

package/src/components/sections/CrossSellingShelf/CrossSellingShelf.tsx

@@ -2,7 +2,6 @@ import { useMemo } from 'react'
 
 import UIProductShelf from 'src/components/ui/ProductShelf'
 import { useInView } from 'react-intersection-observer'
-import { useProductsQuery } from 'src/sdk/product/useProductsQuery'
 import { usePDP } from 'src/sdk/overrides/PageProvider'
 import styles from '../ProductShelf/section.module.scss'
 import Section from '../Section'

package/src/components/sections/Footer/Footer.tsx

@@ -11,6 +11,7 @@ import UIFooter, {
 import type { FooterLinksProps, FooterSocialProps } from '../../common/Footer'
 
 import Logo from 'src/components/ui/Logo'
+import Link from 'src/components/ui/Link'
 import UIIncentives from '../../ui/Incentives'
 import type { Incentive } from '../../ui/Incentives'
 
@@ -26,6 +27,10 @@ export type FooterProps = {
   logo: {
     src: string
     alt: string
+    link: {
+      url: string
+      title: string
+    }
   }
   copyrightInfo: string
   acceptedPaymentMethods: {
@@ -40,7 +45,7 @@ const Footer = ({
   footerLinks,
   footerSocial,
   footerSocial: { title: footerSocialTitle },
-  logo: { src: logoSrc, alt: logoAlt },
+  logo: { src: logoSrc, alt: logoAlt, link: logoLink },
   copyrightInfo,
   acceptedPaymentMethods: {
     showPaymentMethods,
@@ -48,6 +53,7 @@ const Footer = ({
     paymentMethods,
   },
 }: FooterProps) => {
+  const homeLabel = 'Go to Home'
   return (
     <Section className={`section ${styles.section} section-footer`}>
       <UIFooter>
@@ -60,7 +66,13 @@ const Footer = ({
           />
         </UIFooterNavigation>
         <UIFooterInfo>
-          <Logo alt={logoAlt} src={logoSrc} />
+          <Link
+            href={logoLink ? logoLink.url : '/'}
+            title={logoLink ? logoLink.title : homeLabel}
+          >
+            <Logo alt={logoAlt} src={logoSrc} />
+          </Link>
+
           {showPaymentMethods && (
             <UIPaymentMethods
               flagList={paymentMethods}

package/src/components/sections/Navbar/Navbar.tsx

@@ -13,6 +13,10 @@ export interface NavbarProps {
   logo: {
     alt: string
     src: string
+    link: {
+      url: string
+      title: string
+    }
   }
   searchInput: {
     sort: string

package/src/customizations/GlobalOverrides.tsx

@@ -1,9 +1,11 @@
 import WebFontsOverrides from 'src/customizations/components/overrides/WebFonts'
 import { default as CoreWebFonts } from 'src/fonts/WebFonts'
+import ThirdPartyScriptsOverrides from 'src/customizations/components/overrides/ThirdPartyScripts'
 
 const Components = {
   WebFonts: CoreWebFonts,
   ...WebFontsOverrides.components,
+  ...ThirdPartyScriptsOverrides.components,
 }
 
 export const WebFonts = Components.WebFonts

package/src/customizations/components/overrides/ThirdPartyScripts.tsx

@@ -0,0 +1,9 @@
+import { default as ThirdPartyScripts } from 'src/customizations/scripts/ThirdPartyScripts'
+
+const overrides = {
+  components: {
+    ThirdPartyScripts,
+  },
+}
+
+export default overrides

package/src/customizations/scripts/ThirdPartyScripts.tsx

@@ -0,0 +1,8 @@
+/**
+ * Place holder function to return component to mount it on the header
+ * @returns react component */
+
+const ThirdPartyScripts = () => {
+  return <></>
+}
+export default ThirdPartyScripts

package/src/sdk/analytics/platform/vtex/search.ts

@@ -2,9 +2,10 @@
  * More info at: https://www.notion.so/vtexhandbook/Event-API-Documentation-48eee26730cf4d7f80f8fd7262231f84
  */
 import type { AnalyticsEvent } from '@faststore/sdk'
+import type { SearchSelectItemEvent } from '../../types'
 
 import config from '../../../../../faststore.config'
-import type { SearchSelectItemEvent } from '../../types'
+import { getCookie } from '../../../../utils/getCookie'
 
 const THIRTY_MINUTES_S = 30 * 60
 const ONE_YEAR_S = 365 * 24 * 3600
@@ -14,27 +15,30 @@ const randomUUID = () =>
     ? crypto.randomUUID()
     : (Math.random() * 1e6).toFixed(0)
 
-const createStorage = (key: string, expiresSecond: number) => {
-  const timelapsed = (past: number) => (Date.now() - past) / 1e3
+const createCookie = (key: string, expiresSecond: number) => {
+  // Setting the domain attribute specifies which host can receive it; we need it to make the cookies available on the `secure` subdomain.
+  // Although https://developer.mozilla.org/en-US/docs/Web/API/Document/cookie mentioned leading dot (.) is not needed and ignored. I couldn't set the cookies without it.
+  const urlDomain = `.${new URL(config.storeUrl).hostname}`
 
   return () => {
-    const item = JSON.parse(localStorage.getItem(key) ?? 'null')
-    const isExpired = !item || timelapsed(item.createdAt) > expiresSecond
-    const payload: string = isExpired ? randomUUID() : item.payload
+    const isExpired = getCookie(key) === undefined
 
     if (isExpired) {
-      const data = { payload, createdAt: Date.now() }
+      const value = randomUUID()
+
+      document.cookie = `${key}=${value}; max-age=${expiresSecond}; domain=${urlDomain}; path=/;`
+      // Setting the `path=/` makes the cookie accessible on any path of the domain/subdomain
 
-      localStorage.setItem(key, JSON.stringify(data))
+      return value
     }
 
-    return payload
+    return getCookie(key)
   }
 }
 
 const user = {
-  anonymous: createStorage('vtex.search.anonymous', ONE_YEAR_S),
-  session: createStorage('vtex.search.session', THIRTY_MINUTES_S),
+  anonymous: createCookie('vtex-faststore-anonymous', ONE_YEAR_S),
+  session: createCookie('vtex-faststore-session', THIRTY_MINUTES_S),
 }
 
 type SearchEvent =

package/src/utils/getCookie.ts

@@ -0,0 +1,14 @@
+export function getCookie(name: string): string | undefined {
+  const cookieString = decodeURIComponent(document.cookie)
+  const cookies = cookieString.split(';')
+
+  for (const cookie of cookies) {
+    const [cookieName, cookieValue] = cookie.trim().split('=')
+
+    if (cookieName === name) {
+      return cookieValue
+    }
+  }
+
+  return undefined // Cookie not found
+}