@faststore/core 3.95.1-dev.0 → 3.96.0-dev.17

package/cms/faststore/sections.json

@@ -959,7 +959,7 @@
         "after": {
           "type": "integer",
           "title": "After",
-          "default": "0",
+          "default": 0,
           "description": "Initial pagination item"
         },
         "sort": {
@@ -1122,7 +1122,7 @@
         "after": {
           "title": "After",
           "type": "integer",
-          "default": "0",
+          "default": 0,
           "description": "Initial pagination item"
         },
         "sort": {

package/package.json

@@ -1,8 +1,12 @@
 {
   "name": "@faststore/core",
-  "version": "3.95.1-dev.0",
+  "version": "3.96.0-dev.17",
   "license": "MIT",
-  "repository": "vtex/faststore",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/vtex/faststore",
+    "directory": "packages/core"
+  },
   "browserslist": "supports es6-module and not dead",
   "exports": {
     ".": "./index.ts",
@@ -36,6 +40,9 @@
     "pnpm": "9.15.1",
     "yarn": "1.22.22"
   },
+  "publishConfig": {
+    "access": "public"
+  },
   "sideEffects": false,
   "dependencies": {
     "@antfu/ni": "^0.21.12",
@@ -44,11 +51,11 @@
     "@envelop/graphql-jit": "^8.0.3",
     "@envelop/parser-cache": "^6.0.2",
     "@envelop/validation-cache": "^6.0.2",
-    "@faststore/api": "3.95.1-dev.0",
-    "@faststore/graphql-utils": "^3.95.1-dev.0",
-    "@faststore/lighthouse": "3.95.1-dev.0",
-    "@faststore/sdk": "3.95.1-dev.0",
-    "@faststore/ui": "3.95.1-dev.0",
+    "@faststore/api": "3.96.0-dev.17",
+    "@faststore/graphql-utils": "^3.96.0-dev.17",
+    "@faststore/lighthouse": "3.96.0-dev.17",
+    "@faststore/sdk": "3.96.0-dev.17",
+    "@faststore/ui": "3.96.0-dev.17",
     "@graphql-codegen/cli": "5.0.2",
     "@graphql-codegen/client-preset": "4.2.6",
     "@graphql-codegen/typescript": "4.0.7",
@@ -116,5 +123,5 @@
     "ts-jest": "29.1.1",
     "typescript": "5.3.2"
   },
-  "gitHead": "4088c3db2a97323b70823dee221cc299663eb275"
+  "gitHead": "303ea1a81126ab23f136c241a18f00c681c574d8"
 }

package/src/components/account/orders/MyAccountOrderDetails/MyAccountDeliveryOptionAccordion/MyAccountDeliveryOptionAccordion.tsx

@@ -69,21 +69,24 @@ function MyAccountDeliveryOptionAccordion({
             contact={contact}
           />
           <MyAccountDeliveryOptionAccordionProducts>
-            {deliveryOption.items?.map((item, index) => (
-              <MyAccountDeliveryOptionAccordionProduct
-                key={index}
-                image={item.imageUrl || ''}
-                quantity={item.quantity}
-                name={item.name}
-                field={
-                  customFields?.find((cf) => cf.id === item.uniqueId)
-                    ?.fields?.[0]
-                }
-                price={formatPrice(item.price ?? 0, currencyCode)}
-                tax={formatPrice(item.tax ?? 0, currencyCode)}
-                total={formatPrice(item.total ?? 0, currencyCode)}
-              />
-            ))}
+            {deliveryOption.items?.map((item, index) => {
+              const tax = (item.tax ?? 0) + (item.taxPriceTagsTotal ?? 0)
+              return (
+                <MyAccountDeliveryOptionAccordionProduct
+                  key={index}
+                  image={item.imageUrl || ''}
+                  quantity={item.quantity}
+                  name={item.name}
+                  field={
+                    customFields?.find((cf) => cf.id === item.uniqueId)
+                      ?.fields?.[0]
+                  }
+                  price={formatPrice(item.sellingPrice ?? 0, currencyCode)}
+                  tax={formatPrice(tax, currencyCode)}
+                  total={formatPrice(item.total ?? 0, currencyCode)}
+                />
+              )
+            })}
           </MyAccountDeliveryOptionAccordionProducts>
         </MyAccountAccordionPanel>
       </MyAccountAccordionItem>

package/src/components/account/orders/MyAccountOrderDetails/MyAccountOrderDetails.tsx

@@ -8,7 +8,11 @@ import MyAccountOrderedByCard from './MyAccountOrderedByCard'
 import MyAccountPaymentCard from './MyAccountPaymentCard'
 import MyAccountSummaryCard from './MyAccountSummaryCard'
 
-import type { ServerOrderDetailsQueryQuery } from '@generated/graphql'
+import type {
+  ServerOrderDetailsQueryQuery,
+  UserOrderDeliveryOption,
+  UserOrderDeliveryOptionsData,
+} from '@generated/graphql'
 import type { OrderStatusKey } from 'src/utils/userOrderStatus'
 import MyAccountStatusBadge from '../../components/MyAccountStatusBadge'
 import MyAccountMoreInformationCard from './MyAccountMoreInformationCard'
@@ -72,7 +76,9 @@ export default function MyAccountOrderDetails({
         />
 
         <MyAccountDeliveryCard
-          deliveryOptionsData={order.deliveryOptionsData}
+          deliveryOptionsData={
+            order.deliveryOptionsData as UserOrderDeliveryOptionsData
+          }
           fields={
             order?.customFields?.find((field) => field.type === 'address')
               ?.fields || []
@@ -99,7 +105,7 @@ export default function MyAccountOrderDetails({
         {order.deliveryOptionsData.deliveryOptions.map((option) => (
           <MyAccountDeliveryOptionAccordion
             key={option.friendlyDeliveryOptionName}
-            deliveryOption={option}
+            deliveryOption={option as UserOrderDeliveryOption}
             contact={order.deliveryOptionsData.contact}
             currencyCode={order.storePreferencesData.currencyCode}
             customFields={order.customFields.filter(

package/src/components/account/orders/MyAccountOrderDetails/MyAccountSummaryCard/MyAccountSummaryCard.tsx

@@ -1,6 +1,5 @@
 import MyAccountCard from 'src/components/account/components/MyAccountCard'
 import { useFormatPrice } from 'src/components/account/utils/useFormatPrice'
-import { useSession } from 'src/sdk/session'
 
 // Interface for order totals (items, shipping, discounts)
 // TODO: Use type from API

package/src/pages/api/graphql.ts

@@ -4,6 +4,7 @@ import {
   isFastStoreError,
   stringifyCacheControl,
 } from '@faststore/api'
+import { parse } from 'cookie'
 import type { NextApiHandler, NextApiRequest } from 'next'
 
 import discoveryConfig from 'discovery.config'
@@ -34,7 +35,7 @@ const replaceSetCookieDomain = (request: NextApiRequest, setCookie: string) => {
 
 const parseRequest = (request: NextApiRequest) => {
   try {
-    const { operationName, operationHash, variables, query } =
+    const { operationName, operationHash, variables, query, v } =
       request.method === 'POST'
         ? request.body
         : {
@@ -45,6 +46,7 @@ const parseRequest = (request: NextApiRequest) => {
                 ? request.query.variables
                 : ''
             ),
+            v: request.query.v,
             query: undefined,
           }
 
@@ -56,6 +58,7 @@ const parseRequest = (request: NextApiRequest) => {
         },
       },
       variables,
+      v,
       // Do not allow queries in production, only for devMode so we can use graphql tools
       // like introspection etc. In production, we only accept known queries for better
       // security
@@ -68,6 +71,17 @@ const parseRequest = (request: NextApiRequest) => {
   }
 }
 
+/**
+ * Checks if there is any cookie that starts with 'VtexIdclientAutCookie'
+ * in the request headers
+ */
+const hasVtexIdclientAutCookie = (request: NextApiRequest): boolean => {
+  const cookies = parse(request.headers.cookie ?? '')
+  return Object.keys(cookies).some((cookieName) =>
+    cookieName.startsWith('VtexIdclientAutCookie')
+  )
+}
+
 const handler: NextApiHandler = async (request, response) => {
   if (request.method !== 'POST' && request.method !== 'GET') {
     response.status(405).end()
@@ -76,7 +90,8 @@ const handler: NextApiHandler = async (request, response) => {
   }
 
   try {
-    const { operation, variables, query } = parseRequest(request)
+    // value is used to cache bust the request if there is a VtexIdclientAutCookie
+    const { operation, variables, query, v: value } = parseRequest(request)
 
     if (
       operation.__meta__.operationName === 'ValidateSession' &&
@@ -129,7 +144,7 @@ const handler: NextApiHandler = async (request, response) => {
     const { data, errors, extensions } = await execute(
       {
         operation,
-        variables,
+        variables: { ...variables, ...(value ? { v: value } : {}) },
         query,
       },
       { headers: request.headers }
@@ -145,8 +160,13 @@ const handler: NextApiHandler = async (request, response) => {
       return
     }
 
+    const hasAuthCookie = hasVtexIdclientAutCookie(request)
+
     if (extensions.cacheControl) {
-      const cacheControl = stringifyCacheControl(extensions.cacheControl)
+      const cacheControl = stringifyCacheControl(
+        extensions.cacheControl,
+        hasAuthCookie
+      )
       response.setHeader('cache-control', cacheControl)
     } else if (
       request.method === 'GET' &&
@@ -167,9 +187,10 @@ const handler: NextApiHandler = async (request, response) => {
               .staleWhileRevalidate
           : DEFAULT_STALE_WHILE_REVALIDATE // 1 hour
 
+      const scope = hasAuthCookie ? 'private' : 'public'
       response.setHeader(
         'cache-control',
-        `public, s-maxage=${maxAge}, stale-while-revalidate=${staleWhileRevalidate}`
+        `${scope}, s-maxage=${maxAge}, stale-while-revalidate=${staleWhileRevalidate}`
       )
     } else {
       response.setHeader('cache-control', 'no-cache, no-store')

package/src/pages/pvt/account/orders/[id].tsx

@@ -211,8 +211,10 @@ const query = gql(`
             name
             quantity
             price
+            sellingPrice
             imageUrl
             tax
+            taxPriceTagsTotal
             total
           }
         }

package/src/sdk/graphql/request.ts

@@ -1,3 +1,5 @@
+import { getClientCacheBustingValue } from 'src/utils/cookieCacheBusting'
+
 export type RequestOptions = Omit<BaseRequestOptions, 'operation' | 'variables'>
 export type Operation = {
   __meta__?: Record<string, any>
@@ -12,6 +14,8 @@ export interface BaseRequestOptions<V = any> {
   operation: Operation
   variables: V
   fetchOptions?: RequestInit
+  cacheBusting?: boolean
+  value?: string | null
 }
 
 const DEFAULT_HEADERS_BY_VERB: Record<string, Record<string, string>> = {
@@ -25,10 +29,14 @@ export const request = async <Query = unknown, Variables = unknown>(
   variables: Variables,
   options?: RequestOptions
 ) => {
+  // Get cache busting value based on cookie changes
+  const value = getClientCacheBustingValue()
+
   const { data, errors } = await baseRequest<Variables, Query>('/api/graphql', {
     ...options,
     variables,
     operation,
+    value,
   })
 
   if (errors?.length) {
@@ -41,7 +49,7 @@ export const request = async <Query = unknown, Variables = unknown>(
 /* This piece of code was taken out of @faststore/graphql-utils */
 const baseRequest = async <V = any, D = any>(
   endpoint: string,
-  { operation, variables, fetchOptions }: BaseRequestOptions<V>
+  { operation, variables, fetchOptions, value }: BaseRequestOptions<V>
 ): Promise<GraphQLResponse<D>> => {
   const { operationName, operationHash } = operation['__meta__']
 
@@ -58,6 +66,7 @@ const baseRequest = async <V = any, D = any>(
     operationName,
     operationHash,
     ...(method === 'GET' && { variables: JSON.stringify(variables) }),
+    ...(method === 'GET' && value && { v: value }),
   })
 
   const body =

package/src/utils/cookieCacheBusting.ts

@@ -0,0 +1,141 @@
+import discoveryConfig from 'discovery.config'
+
+export const STORAGE_KEY_AUTH_COOKIE_VALUE = 'faststore_auth_cookie_value'
+export const STORAGE_KEY_CACHE_BUST_LAST_VALUE =
+  'faststore_cache_bust_last_value'
+
+/**
+ * Gets the VtexIdclientAutCookie value from browser
+ * Note: vtex_segment is httpOnly and cannot be accessed via JavaScript,
+ * so we only monitor VtexIdclientAutCookie_<account>
+ */
+const getAuthCookieValue = (): string | null => {
+  if (typeof document === 'undefined') {
+    return null
+  }
+
+  const account = discoveryConfig.api.storeId
+  const authCookieName = `VtexIdclientAutCookie_${account}`
+  const cookies = document.cookie.split(';').map((cookie) => cookie.trim())
+  const authCookie = cookies.find((c) => c.startsWith(`${authCookieName}=`))
+
+  if (!authCookie) {
+    return null
+  }
+
+  return authCookie.split('=').slice(1).join('=')
+}
+
+/**
+ * Gets the stored auth cookie value from sessionStorage (client-side only)
+ */
+const getStoredAuthCookieValue = (): string | null => {
+  if (typeof sessionStorage === 'undefined') {
+    return null
+  }
+
+  try {
+    return sessionStorage.getItem(STORAGE_KEY_AUTH_COOKIE_VALUE)
+  } catch {
+    return null
+  }
+}
+
+/**
+ * Stores the auth cookie value in sessionStorage (client-side only)
+ */
+const storeAuthCookieValue = (value: string | null): void => {
+  if (typeof sessionStorage === 'undefined') {
+    return
+  }
+
+  try {
+    if (value === null) {
+      sessionStorage.removeItem(STORAGE_KEY_AUTH_COOKIE_VALUE)
+    } else {
+      sessionStorage.setItem(STORAGE_KEY_AUTH_COOKIE_VALUE, value)
+    }
+  } catch {
+    // Ignore storage errors
+  }
+}
+
+/**
+ * Gets the last cache busting value from sessionStorage (client-side only)
+ */
+const getLastValue = (): string | null => {
+  if (typeof sessionStorage === 'undefined') {
+    return null
+  }
+
+  try {
+    return sessionStorage.getItem(STORAGE_KEY_CACHE_BUST_LAST_VALUE)
+  } catch {
+    return null
+  }
+}
+
+/**
+ * Stores the last cache busting value in sessionStorage (client-side only)
+ */
+const storeLastValue = (value: string): void => {
+  if (typeof sessionStorage === 'undefined') {
+    return
+  }
+
+  try {
+    sessionStorage.setItem(STORAGE_KEY_CACHE_BUST_LAST_VALUE, value)
+  } catch {
+    // Ignore storage errors
+  }
+}
+
+/**
+ * Clears all cache busting related data from sessionStorage (client-side only)
+ */
+const clearStorage = (): void => {
+  if (typeof sessionStorage === 'undefined') {
+    return
+  }
+
+  try {
+    sessionStorage.removeItem(STORAGE_KEY_AUTH_COOKIE_VALUE)
+    sessionStorage.removeItem(STORAGE_KEY_CACHE_BUST_LAST_VALUE)
+  } catch {
+    // Ignore storage errors
+  }
+}
+
+/**
+ * Gets cache busting value for client-side based on auth cookie changes
+ */
+export const getClientCacheBustingValue = (): string | null => {
+  const currentAuthCookieValue = getAuthCookieValue()
+
+  // Guard clause: if auth cookie doesn't exist, clear storage and don't proceed with cache busting logic
+  if (currentAuthCookieValue === null) {
+    clearStorage()
+    return null
+  }
+
+  const storedAuthCookieValue = getStoredAuthCookieValue()
+
+  // If auth cookie changed, update stored value and return new timestamp
+  if (currentAuthCookieValue !== storedAuthCookieValue) {
+    storeAuthCookieValue(currentAuthCookieValue)
+    const timestamp = Date.now().toString()
+    storeLastValue(timestamp)
+    return timestamp
+  }
+
+  // Auth cookie hasn't changed, return last value or create one if it doesn't exist
+  const lastValue = getLastValue()
+  if (lastValue) {
+    return lastValue
+  }
+
+  // Fallback: if no last value, create one
+  const timestamp = Date.now().toString()
+  storeLastValue(timestamp)
+  return timestamp
+}

package/test/utils/cookieCacheBusting.test.ts

@@ -0,0 +1,121 @@
+/**
+ * @jest-environment jsdom
+ */
+
+jest.mock('discovery.config', () => ({
+  __esModule: true,
+  default: {
+    api: {
+      storeId: 'store',
+    },
+  },
+}))
+
+import {
+  getClientCacheBustingValue,
+  STORAGE_KEY_AUTH_COOKIE_VALUE,
+  STORAGE_KEY_CACHE_BUST_LAST_VALUE,
+} from '../../src/utils/cookieCacheBusting'
+
+const setAuthCookie = (value: string) => {
+  document.cookie = `VtexIdclientAutCookie_store=${value}; path=/`
+}
+
+const clearAllCookies = () => {
+  const cookies = document.cookie
+    .split(';')
+    .map((c) => c.trim())
+    .filter(Boolean)
+
+  for (const cookie of cookies) {
+    const [name] = cookie.split('=')
+    document.cookie = `${name}=; expires=Thu, 01 Jan 1970 00:00:00 GMT; path=/`
+  }
+}
+
+describe('cookieCacheBusting', () => {
+  beforeEach(() => {
+    clearAllCookies()
+    sessionStorage.clear()
+    jest.restoreAllMocks()
+  })
+
+  it('should clear storage and return null when auth cookie is missing', () => {
+    const removeItemSpy = jest.spyOn(Storage.prototype, 'removeItem')
+
+    const result = getClientCacheBustingValue()
+
+    expect(result).toBeNull()
+    expect(removeItemSpy).toHaveBeenCalledWith(STORAGE_KEY_AUTH_COOKIE_VALUE)
+    expect(removeItemSpy).toHaveBeenCalledWith(
+      STORAGE_KEY_CACHE_BUST_LAST_VALUE
+    )
+  })
+
+  it('should return a new timestamp and persist values when auth cookie changed', () => {
+    setAuthCookie('token-1')
+
+    const nowSpy = jest.spyOn(Date, 'now').mockReturnValue(1700000000000)
+    const setItemSpy = jest.spyOn(Storage.prototype, 'setItem')
+
+    const result = getClientCacheBustingValue()
+
+    expect(result).toBe('1700000000000')
+    expect(nowSpy).toHaveBeenCalled()
+    expect(setItemSpy).toHaveBeenCalledWith(
+      STORAGE_KEY_AUTH_COOKIE_VALUE,
+      'token-1'
+    )
+    expect(setItemSpy).toHaveBeenCalledWith(
+      STORAGE_KEY_CACHE_BUST_LAST_VALUE,
+      '1700000000000'
+    )
+  })
+
+  it('should return last cached value when auth cookie is the same and last value exists', () => {
+    setAuthCookie('token-1')
+    sessionStorage.setItem(STORAGE_KEY_AUTH_COOKIE_VALUE, 'token-1')
+    sessionStorage.setItem(STORAGE_KEY_CACHE_BUST_LAST_VALUE, 'prev')
+
+    const nowSpy = jest.spyOn(Date, 'now')
+    const setItemSpy = jest.spyOn(Storage.prototype, 'setItem')
+
+    const result = getClientCacheBustingValue()
+
+    expect(result).toBe('prev')
+    expect(nowSpy).not.toHaveBeenCalled()
+    expect(setItemSpy).not.toHaveBeenCalled()
+  })
+
+  it('should create and persist a new last value when auth cookie is the same but last value is missing', () => {
+    setAuthCookie('token-1')
+    sessionStorage.setItem(STORAGE_KEY_AUTH_COOKIE_VALUE, 'token-1')
+
+    const nowSpy = jest.spyOn(Date, 'now').mockReturnValue(1700000000123)
+    const setItemSpy = jest.spyOn(Storage.prototype, 'setItem')
+
+    const result = getClientCacheBustingValue()
+
+    expect(result).toBe('1700000000123')
+    expect(nowSpy).toHaveBeenCalled()
+    expect(setItemSpy).toHaveBeenCalledWith(
+      STORAGE_KEY_CACHE_BUST_LAST_VALUE,
+      '1700000000123'
+    )
+    expect(setItemSpy).not.toHaveBeenCalledWith(
+      STORAGE_KEY_AUTH_COOKIE_VALUE,
+      'token-1'
+    )
+  })
+
+  it('should keep "=" characters in cookie value', () => {
+    setAuthCookie('a=b=c')
+
+    jest.spyOn(Date, 'now').mockReturnValue(1700000000456)
+
+    const result = getClientCacheBustingValue()
+
+    expect(result).toBe('1700000000456')
+    expect(sessionStorage.getItem(STORAGE_KEY_AUTH_COOKIE_VALUE)).toBe('a=b=c')
+  })
+})

package/.next/static/xPZqGftdSs0H8UD6M_H3H/_buildManifest.js

@@ -1 +0,0 @@
-self.__BUILD_MANIFEST=function(s,c,t,a,e,u,n){return{__rewrites:{afterFiles:[],beforeFiles:[],fallback:[]},"/":[s,c,t,e,"static/css/02259c549b2179f2.css","static/chunks/pages/index-1f8bf0fb351b90f4.js"],"/404":[s,c,t,a,"static/chunks/pages/404-4b3f1e22c77f849a.js"],"/500":[s,c,t,a,"static/chunks/pages/500-bb2de0c11524b2b8.js"],"/_error":["static/chunks/pages/_error-2b0148be56a716e9.js"],"/checkout":[s,c,t,"static/chunks/pages/checkout-dc07d72b3514c83d.js"],"/login":[s,c,t,a,"static/chunks/pages/login-e97ef92769456bf6.js"],"/pvt/account":["static/chunks/pages/pvt/account-65fefcc699344bdb.js"],"/pvt/account/403":[s,c,t,"static/css/0fae3d432331aae9.css","static/chunks/pages/pvt/account/403-91597100f8956385.js"],"/pvt/account/404":[s,c,t,"static/css/0fc6b2ff69142c6a.css","static/chunks/pages/pvt/account/404-c68124bed7cb7c48.js"],"/pvt/account/orders":[s,c,t,"static/css/40a294d0a24ad01d.css","static/chunks/pages/pvt/account/orders-12a215899ae6f3eb.js"],"/pvt/account/orders/[id]":[s,c,t,"static/css/5eecefd2c6deeee4.css","static/chunks/pages/pvt/account/orders/[id]-68bbe8db444fd60a.js"],"/pvt/account/profile":[s,c,t,"static/css/47f1b4e8de15d314.css","static/chunks/pages/pvt/account/profile-b6cdbf02d4682544.js"],"/pvt/account/security":[s,c,t,"static/css/973dd40d4773e8cd.css","static/chunks/pages/pvt/account/security-e6289a40e745d3c4.js"],"/pvt/account/user-details":[s,c,t,"static/css/05c399956ff24b77.css","static/chunks/pages/pvt/account/user-details-fba1822e52e7de26.js"],"/pvt/account/[...unknown]":["static/chunks/pages/pvt/account/[...unknown]-f80f645594d2740c.js"],"/s":[s,c,t,u,n,a,"static/chunks/pages/s-41cffb20de1d2617.js"],"/[slug]/p":[s,"static/chunks/1208-9118a8f14ecf05c8.js",c,t,"static/chunks/7522-9010743f5d7e8aca.js",e,"static/css/a6a4ebbe01adbbad.css","static/chunks/pages/[slug]/p-cf620759e25940f8.js"],"/[...slug]":[s,c,t,u,n,"static/chunks/pages/[...slug]-3579b3b8b8309552.js"],sortedPages:["/","/404","/500","/_app","/_error","/checkout","/login","/pvt/account","/pvt/account/403","/pvt/account/404","/pvt/account/orders","/pvt/account/orders/[id]","/pvt/account/profile","/pvt/account/security","/pvt/account/user-details","/pvt/account/[...unknown]","/s","/[slug]/p","/[...slug]"]}}("static/chunks/6031-b0b111f48a7d504d.js","static/css/9d403a1bee48c9fc.css","static/chunks/9173-49a05f6f96710bd1.js","static/css/2980acad3f8e1028.css","static/css/837662922091162f.css","static/css/31380ebc6e671486.css","static/chunks/7191-5aa417081c97d46a.js"),self.__BUILD_MANIFEST_CB&&self.__BUILD_MANIFEST_CB();