@faststore/core 3.32.0 → 3.33.0

package/.turbo/turbo-build.log

@@ -1,23 +1,23 @@
 
-> @faststore/core@3.31.0 prebuild /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 prebuild /home/runner/work/faststore/faststore/packages/core
 > na run partytown && na run generate
 
 
-> @faststore/core@3.31.0 partytown /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 partytown /home/runner/work/faststore/faststore/packages/core
 > partytown copylib ./public/~partytown
 
 Partytown lib copied to: /home/runner/work/faststore/faststore/packages/core/public/~partytown
 
-> @faststore/core@3.31.0 generate /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 generate /home/runner/work/faststore/faststore/packages/core
 > na run generate:schema && na run generate:codegen && na run format:generated
 
 
-> @faststore/core@3.31.0 generate:schema /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 generate:schema /home/runner/work/faststore/faststore/packages/core
 > tsx src/server/generator/generateGraphQLSchemaFile.ts
 
 Schema GraphQL file generated successfully
 
-> @faststore/core@3.31.0 generate:codegen /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 generate:codegen /home/runner/work/faststore/faststore/packages/core
 > graphql-codegen
 
 [STARTED] Parse Configuration
@@ -37,11 +37,11 @@ Running lifecycle hook "afterStart" scripts...
 [CLI] Loading Documents
 [CLI] Generating output
 
-> @faststore/core@3.31.0 format:generated /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 format:generated /home/runner/work/faststore/faststore/packages/core
 > prettier --write "@generated/**/*.{ts,js,tsx,jsx,json}" --loglevel error
 
 
-> @faststore/core@3.31.0 build /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 build /home/runner/work/faststore/faststore/packages/core
 > next build
 
 ⚠ No build cache found. Please configure build caching for faster rebuilds. Read more: https://nextjs.org/docs/messages/no-cache
@@ -62,7 +62,6 @@ https://nextjs.org/telemetry
 Warning: Dynamic Content not found for the page: home. Refer to the Dynamic Content documentation at https://developers.vtex.com/docs/guides/faststore/dynamic-content-overview for mapping the page and the corresponding data-fetching function.
 
   Generating static pages (3/7) 
 
   Generating static pages (5/7) 
-CustomModalFooterSection not found. Add a new component for this section or remove it from the CMS
 
 ✓ Generating static pages (7/7) 
    Finalizing page optimization ...
    Collecting build traces ...
@@ -71,7 +70,7 @@ Route (pages)                              Size     First Load JS
 ┌ ● /                                      3.86 kB         124 kB
 ├   └ css/b1806cbafd0c1f81.css             3.06 kB
 ├   /_app                                  0 B            92.3 kB
-├ ● /[...slug]                             2.14 kB         132 kB
+├ ● /[...slug]                             2.34 kB         133 kB
 ├ ● /[slug]/p                              35.5 kB         156 kB
 ├   ├ css/a3ca6a9b63f657be.css             5.75 kB
 ├   ├ css/62a5153ac7061286.css             6.11 kB
@@ -85,12 +84,12 @@ Route (pages)                              Size     First Load JS
 ├ λ /api/preview                           0 B            92.3 kB
 ├ ● /checkout                              694 B           121 kB
 ├ ● /login                                 1.59 kB         122 kB
-└ ● /s                                     3.18 kB         133 kB
+└ ● /s                                     3.18 kB         134 kB
 + First Load JS shared by all              95.8 kB
   ├ chunks/framework-807b0f81cbc129f0.js   45.4 kB
   ├ chunks/main-5569625b3fdd6741.js        33.1 kB
-  ├ chunks/pages/_app-ac95c1e9f24267d5.js  10.3 kB
-  ├ chunks/webpack-505ab169c34dcfac.js     3.58 kB
+  ├ chunks/pages/_app-e03902a5f8bdaf99.js  10.3 kB
+  ├ chunks/webpack-1965210fb17803bd.js     3.58 kB
   └ css/0a57ee6c7a57788c.css               3.49 kB
 
 λ  (Server)  server-side renders at runtime (uses getInitialProps or getServerSideProps)

package/.turbo/turbo-test.log

@@ -1,15 +1,14 @@
 
-> @faststore/core@3.31.0 test /home/runner/work/faststore/faststore/packages/core
+> @faststore/core@3.32.1 test /home/runner/work/faststore/faststore/packages/core
 > jest
 
-PASS test/server/cms/global.test.ts (23.995 s)
-PASS test/utils/multipleTemplates.test.ts (24.181 s)
+PASS test/utils/multipleTemplates.test.ts (24.455 s)
+PASS test/server/cms/global.test.ts (24.572 s)
 PASS test/server/cms/index.test.ts
-PASS test/server/index.test.ts (28.653 s)
-A worker process has failed to exit gracefully and has been force exited. This is likely caused by tests leaking due to improper teardown. Try running with --detectOpenHandles to find leaks. Active timers can also cause this, ensure that .unref() was called on them.
+PASS test/server/index.test.ts (29.791 s)
 
 Test Suites: 4 passed, 4 total
 Tests:       22 passed, 22 total
 Snapshots:   0 total
-Time:        30.014 s
+Time:        31.107 s
 Ran all test suites.

package/@generated/gql.ts

@@ -60,6 +60,8 @@ const documents = {
     types.ValidateSessionDocument,
   '\n  query ClientShippingSimulationQuery(\n    $postalCode: String!\n    $country: String!\n    $items: [IShippingItem!]!\n  ) {\n    ...ClientShippingSimulation\n    shipping(items: $items, postalCode: $postalCode, country: $country) {\n      logisticsInfo {\n        slas {\n          carrier\n          price\n          availableDeliveryWindows {\n            startDateUtc\n            endDateUtc\n            price\n            listPrice\n          }\n          shippingEstimate\n          localizedEstimates\n          deliveryChannel\n        }\n      }\n      address {\n        city\n        neighborhood\n        state\n      }\n    }\n  }\n':
     types.ClientShippingSimulationQueryDocument,
+  '\n  query ServerManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n      metadata {\n        ...SearchEvent_metadata\n      }\n    }\n  }\n':
+    types.ServerManyProductsQueryDocument,
 }
 
 /**
@@ -206,6 +208,12 @@ export function gql(
 export function gql(
   source: '\n  query ClientShippingSimulationQuery(\n    $postalCode: String!\n    $country: String!\n    $items: [IShippingItem!]!\n  ) {\n    ...ClientShippingSimulation\n    shipping(items: $items, postalCode: $postalCode, country: $country) {\n      logisticsInfo {\n        slas {\n          carrier\n          price\n          availableDeliveryWindows {\n            startDateUtc\n            endDateUtc\n            price\n            listPrice\n          }\n          shippingEstimate\n          localizedEstimates\n          deliveryChannel\n        }\n      }\n      address {\n        city\n        neighborhood\n        state\n      }\n    }\n  }\n'
 ): typeof import('./graphql').ClientShippingSimulationQueryDocument
+/**
+ * The gql function is used to parse GraphQL queries into a document that can be used by GraphQL clients.
+ */
+export function gql(
+  source: '\n  query ServerManyProductsQuery(\n    $first: Int!\n    $after: String\n    $sort: StoreSort!\n    $term: String!\n    $selectedFacets: [IStoreSelectedFacet!]!\n    $sponsoredCount: Int\n  ) {\n    ...ClientManyProducts\n    search(\n      first: $first\n      after: $after\n      sort: $sort\n      term: $term\n      selectedFacets: $selectedFacets\n      sponsoredCount: $sponsoredCount\n    ) {\n      products {\n        pageInfo {\n          totalCount\n        }\n        edges {\n          node {\n            ...ProductSummary_product\n          }\n        }\n      }\n      metadata {\n        ...SearchEvent_metadata\n      }\n    }\n  }\n'
+): typeof import('./graphql').ServerManyProductsQueryDocument
 
 export function gql(source: string) {
   return (documents as any)[source] ?? {}

package/@generated/graphql.ts

@@ -1848,6 +1848,59 @@ export type ClientShippingSimulationQueryQuery = {
   } | null
 }
 
+export type ServerManyProductsQueryQueryVariables = Exact<{
+  first: Scalars['Int']['input']
+  after: InputMaybe<Scalars['String']['input']>
+  sort: StoreSort
+  term: Scalars['String']['input']
+  selectedFacets: Array<IStoreSelectedFacet> | IStoreSelectedFacet
+  sponsoredCount: InputMaybe<Scalars['Int']['input']>
+}>
+
+export type ServerManyProductsQueryQuery = {
+  search: {
+    products: {
+      pageInfo: { totalCount: number }
+      edges: Array<{
+        node: {
+          slug: string
+          sku: string
+          name: string
+          gtin: string
+          id: string
+          brand: { name: string; brandName: string }
+          isVariantOf: { productGroupID: string; name: string }
+          image: Array<{ url: string; alternateName: string }>
+          offers: {
+            lowPrice: number
+            lowPriceWithTaxes: number
+            offers: Array<{
+              availability: string
+              price: number
+              listPrice: number
+              listPriceWithTaxes: number
+              quantity: number
+              seller: { identifier: string }
+            }>
+          }
+          additionalProperty: Array<{
+            propertyID: string
+            name: string
+            value: any
+            valueReference: any
+          }>
+          advertisement: { adId: string; adResponseId: string } | null
+        }
+      }>
+    }
+    metadata: {
+      isTermMisspelled: boolean
+      logicalOperator: string
+      fuzzy: string | null
+    } | null
+  }
+}
+
 export class TypedDocumentString<TResult, TVariables>
   extends String
   implements DocumentTypeDecoration<TResult, TVariables>
@@ -2394,3 +2447,12 @@ export const ClientShippingSimulationQueryDocument = {
   ClientShippingSimulationQueryQuery,
   ClientShippingSimulationQueryQueryVariables
 >
+export const ServerManyProductsQueryDocument = {
+  __meta__: {
+    operationName: 'ServerManyProductsQuery',
+    operationHash: '4fa4dfd1233e2ed5b0b3f662e8866a901d481a52',
+  },
+} as unknown as TypedDocumentString<
+  ServerManyProductsQueryQuery,
+  ServerManyProductsQueryQueryVariables
+>

package/@generated/persisted-documents.json

@@ -10,5 +10,6 @@
   "47e48eaee91d16a4237eb2c1241bc2ed3e2ad9bb": "fragment ClientSearchSuggestions on Query { search(first: 5, term: $term, selectedFacets: $selectedFacets) { suggestions { terms { value } } } } fragment ProductSummary_product on StoreProduct { additionalProperty { name propertyID value valueReference } advertisement { adId adResponseId } brand { brandName: name } brand { name } gtin image { alternateName url } isVariantOf { name productGroupID } name offers { lowPrice lowPriceWithTaxes offers { availability listPrice listPriceWithTaxes price quantity seller { identifier } } } id: productID sku slug } fragment SearchEvent_metadata on SearchMetadata { fuzzy isTermMisspelled logicalOperator } query ClientSearchSuggestionsQuery($selectedFacets: [IStoreSelectedFacet!], $term: String!) { search(first: 5, term: $term, selectedFacets: $selectedFacets) { metadata { ...SearchEvent_metadata } products { pageInfo { totalCount } } suggestions { products { ...ProductSummary_product } terms { value } } } ...ClientSearchSuggestions }",
   "e2385b0f11726d0068f96548f57a8dd441c064e3": "fragment ClientTopSearchSuggestions on Query { search(first: 5, term: $term, selectedFacets: $selectedFacets) { suggestions { terms { value } } } } query ClientTopSearchSuggestionsQuery($selectedFacets: [IStoreSelectedFacet!], $term: String!) { search(first: 5, term: $term, selectedFacets: $selectedFacets) { suggestions { terms { value } } } ...ClientTopSearchSuggestions }",
   "2c6e94b978eb50647873082daebcc5b332154cb1": "mutation ValidateSession($search: String!, $session: IStoreSession!) { validateSession(session: $session, search: $search) { addressType b2b { customerId } channel country currency { code symbol } deliveryMode { deliveryChannel deliveryMethod deliveryWindow { endDate startDate } } geoCoordinates { latitude longitude } locale marketingData { utmCampaign utmMedium utmSource utmiCampaign utmiPage utmiPart } person { email familyName givenName id } postalCode } }",
-  "c35bad22f67f3eb34fea52bb49efa6b1da6b728d": "fragment ClientShippingSimulation on Query { shipping(items: $items, postalCode: $postalCode, country: $country) { address { city } } } query ClientShippingSimulationQuery($country: String!, $items: [IShippingItem!]!, $postalCode: String!) { shipping(items: $items, postalCode: $postalCode, country: $country) { address { city neighborhood state } logisticsInfo { slas { availableDeliveryWindows { endDateUtc listPrice price startDateUtc } carrier deliveryChannel localizedEstimates price shippingEstimate } } } ...ClientShippingSimulation }"
+  "c35bad22f67f3eb34fea52bb49efa6b1da6b728d": "fragment ClientShippingSimulation on Query { shipping(items: $items, postalCode: $postalCode, country: $country) { address { city } } } query ClientShippingSimulationQuery($country: String!, $items: [IShippingItem!]!, $postalCode: String!) { shipping(items: $items, postalCode: $postalCode, country: $country) { address { city neighborhood state } logisticsInfo { slas { availableDeliveryWindows { endDateUtc listPrice price startDateUtc } carrier deliveryChannel localizedEstimates price shippingEstimate } } } ...ClientShippingSimulation }",
+  "4fa4dfd1233e2ed5b0b3f662e8866a901d481a52": "fragment ClientManyProducts on Query { search( first: $first after: $after sort: $sort term: $term selectedFacets: $selectedFacets sponsoredCount: $sponsoredCount ) { products { pageInfo { totalCount } } } } fragment ProductSummary_product on StoreProduct { additionalProperty { name propertyID value valueReference } advertisement { adId adResponseId } brand { brandName: name } brand { name } gtin image { alternateName url } isVariantOf { name productGroupID } name offers { lowPrice lowPriceWithTaxes offers { availability listPrice listPriceWithTaxes price quantity seller { identifier } } } id: productID sku slug } fragment SearchEvent_metadata on SearchMetadata { fuzzy isTermMisspelled logicalOperator } query ServerManyProductsQuery($after: String, $first: Int!, $selectedFacets: [IStoreSelectedFacet!]!, $sort: StoreSort!, $sponsoredCount: Int, $term: String!) { search( first: $first after: $after sort: $sort term: $term selectedFacets: $selectedFacets sponsoredCount: $sponsoredCount ) { metadata { ...SearchEvent_metadata } products { edges { node { ...ProductSummary_product } } pageInfo { totalCount } } } ...ClientManyProducts }"
 }

package/CHANGELOG.md

@@ -3,6 +3,18 @@
 All notable changes to this project will be documented in this file.
 See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
 
+# [3.33.0](https://github.com/vtex/faststore/compare/v3.32.1...v3.33.0) (2025-03-31)
+
+### Features
+
+- loads first page product gallery from Build Time (getStaticProps) + improve number of requests (+) ([#2721](https://github.com/vtex/faststore/issues/2721)) ([9a74405](https://github.com/vtex/faststore/commit/9a74405b53ce31211e2d5a2c61874a535e47d654)), closes [/github.com/vtex/faststore/blob/47fd98ef2e3380bc2b84f5ff7922068d75077d45/packages/core/src/sdk/product/useShouldFetchFirstPage.ts#L3](https://github.com//github.com/vtex/faststore/blob/47fd98ef2e3380bc2b84f5ff7922068d75077d45/packages/core/src/sdk/product/useShouldFetchFirstPage.ts/issues/L3)
+
+## [3.32.1](https://github.com/vtex/faststore/compare/v3.32.0...v3.32.1) (2025-03-28)
+
+### Bug Fixes
+
+- call redirect-evaluate only for pages ([#2748](https://github.com/vtex/faststore/issues/2748)) ([cc5bde1](https://github.com/vtex/faststore/commit/cc5bde1334a4eb1924a645a3587c2b66dd51fb84))
+
 # [3.32.0](https://github.com/vtex/faststore/compare/v3.31.0...v3.32.0) (2025-03-27)
 
 **Note:** Version bump only for package @faststore/core

package/next-seo.config.ts

@@ -2,6 +2,7 @@ import type { DefaultSeoProps } from 'next-seo'
 import storeConfig from './discovery.config'
 
 const buildTime = new Date().toISOString()
+const buildTimeInMS = Date.now()
 
 const config: DefaultSeoProps = {
   norobots: storeConfig.experimental.noRobots,
@@ -16,3 +17,5 @@ const config: DefaultSeoProps = {
 }
 
 export default config
+
+export const generatedBuildTime = buildTimeInMS

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@faststore/core",
-  "version": "3.32.0",
+  "version": "3.33.0",
   "license": "MIT",
   "repository": "vtex/faststore",
   "browserslist": "supports es6-module and not dead",
@@ -67,6 +67,7 @@
     "css-loader": "^6.7.1",
     "deepmerge": "^4.3.1",
     "draftjs-to-html": "^0.9.1",
+    "fast-deep-equal": "^3.1.3",
     "fs-extra": "^10.1.0",
     "graphql": "^15.6.0",
     "include-media": "^1.4.10",
@@ -104,5 +105,5 @@
     "ts-jest": "29.1.1",
     "typescript": "5.3.2"
   },
-  "gitHead": "f4ece9782501b7caf26932199e53fd5019fc127e"
+  "gitHead": "e68051d8fca8e35ef16d00b94fbd39f7cb4a4856"
 }

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

@@ -1,5 +1,9 @@
-import { useSearch } from '@faststore/sdk'
-import type { ServerCollectionPageQueryQuery } from '@generated/graphql'
+import { formatSearchState, useSearch } from '@faststore/sdk'
+import type {
+  ServerCollectionPageQueryQuery,
+  ServerManyProductsQueryQuery,
+  ServerManyProductsQueryQueryVariables,
+} from '@generated/graphql'
 import deepmerge from 'deepmerge'
 import { ITEMS_PER_PAGE } from 'src/constants'
 
@@ -11,12 +15,14 @@ import RenderSections, {
 } from 'src/components/cms/RenderSections'
 import type { PLPContentType } from 'src/server/cms/plp'
 
+import { useEffect } from 'react'
 import PageProvider, { type PLPContext } from 'src/sdk/overrides/PageProvider'
 import {
   useCreateUseGalleryPage,
   UseGalleryPageContext,
 } from 'src/sdk/product/usePageProductsQuery'
 import { useProductGalleryQuery } from 'src/sdk/product/useProductGalleryQuery'
+import { useApplySearchState } from 'src/sdk/search/state'
 
 const ScrollToTopButton = dynamic(
   () =>
@@ -27,7 +33,8 @@ const ScrollToTopButton = dynamic(
 )
 
 export type ProductListingPageProps = {
-  data: ServerCollectionPageQueryQuery
+  data: ServerCollectionPageQueryQuery & ServerManyProductsQueryQuery
+  serverManyProductsVariables: ServerManyProductsQueryQueryVariables
   page: PLPContentType
   globalSections?: Array<{ name: string; data: any }>
 }
@@ -39,13 +46,19 @@ const overwriteMerge = (_: any[], sourceArray: any[]) => sourceArray
 export default function ProductListing({
   page: { sections, settings },
   data: server,
+  serverManyProductsVariables,
   globalSections,
 }: ProductListingPageProps) {
-  const {
-    state: { sort, term, selectedFacets },
-  } = useSearch()
+  const { state } = useSearch()
+  const { sort, term, selectedFacets } = state
+
   const itemsPerPage = settings?.productGallery?.itemsPerPage ?? ITEMS_PER_PAGE
 
+  const applySearchState = useApplySearchState()
+  useEffect(() => {
+    applySearchState(formatSearchState(state))
+  }, [])
+
   const { data: pageProductGalleryData } = useProductGalleryQuery({
     term,
     sort,
@@ -53,7 +66,11 @@ export default function ProductListing({
     itemsPerPage,
   })
 
-  const { pages, useGalleryPage } = useCreateUseGalleryPage()
+  const initialPages = { search: server?.search }
+  const { pages, useGalleryPage } = useCreateUseGalleryPage({
+    initialPages,
+    serverManyProductsVariables,
+  })
 
   const context = {
     data: {

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

@@ -8,7 +8,11 @@ import { BreadcrumbJsonLd, NextSeo } from 'next-seo'
 import { useRouter } from 'next/router'
 import { useMemo } from 'react'
 
-import type { ServerCollectionPageQueryQuery } from '@generated/graphql'
+import type {
+  ServerCollectionPageQueryQuery,
+  ServerManyProductsQueryQuery,
+  ServerManyProductsQueryQueryVariables,
+} from '@generated/graphql'
 import { ITEMS_PER_PAGE } from 'src/constants'
 import { useApplySearchState } from 'src/sdk/search/state'
 
@@ -18,7 +22,8 @@ import storeConfig from '../../../../discovery.config'
 import ProductListing from './ProductListing'
 
 export type ProductListingPageProps = {
-  data: ServerCollectionPageQueryQuery
+  data: ServerCollectionPageQueryQuery & ServerManyProductsQueryQuery
+  serverManyProductsVariables: ServerManyProductsQueryQueryVariables
   page: PLPContentType
   globalSections?: Array<{ name: string; data: any }>
 }
@@ -26,12 +31,24 @@ export type ProductListingPageProps = {
 type UseSearchParams = {
   collection: ServerCollectionPageQueryQuery['collection']
   sort: SearchState['sort']
+  serverData?: ServerCollectionPageQueryQuery & ServerManyProductsQueryQuery
 }
 const useSearchParams = ({
   collection,
   sort,
+  serverData,
 }: UseSearchParams): SearchState => {
-  const selectedFacets = collection?.meta.selectedFacets
+  const selectedFacets = [
+    ...collection?.meta.selectedFacets,
+    {
+      key: 'fuzzy',
+      value: serverData?.search?.metadata?.fuzzy ?? 'auto',
+    },
+    {
+      key: 'operator',
+      value: serverData?.search?.metadata?.logicalOperator ?? 'and',
+    },
+  ]
   const { asPath } = useRouter()
 
   const hrefState = useMemo(() => {
@@ -57,6 +74,7 @@ const useSearchParams = ({
 export default function ProductListingPage({
   page: plpContentType,
   data: server,
+  serverManyProductsVariables,
   globalSections,
 }: ProductListingPageProps) {
   const { settings } = plpContentType
@@ -66,6 +84,7 @@ export default function ProductListingPage({
   const searchParams = useSearchParams({
     collection,
     sort: settings?.productGallery?.sortBySelection as SearchState['sort'],
+    serverData: server,
   })
 
   const {
@@ -117,6 +136,7 @@ export default function ProductListingPage({
         globalSections={globalSections}
         page={plpContentType}
         data={server}
+        serverManyProductsVariables={serverManyProductsVariables}
       />
     </SearchProvider>
   )

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

@@ -6,9 +6,12 @@ import { gql } from '@generated'
 import type {
   ServerCollectionPageQueryQuery,
   ServerCollectionPageQueryQueryVariables,
+  ServerManyProductsQueryQuery,
+  ServerManyProductsQueryQueryVariables,
 } from '@generated/graphql'
 import { execute } from 'src/server'
 
+import type { SearchState } from '@faststore/sdk'
 import type { Locator } from '@vtex/client-cms'
 import dynamic from 'next/dynamic'
 import {
@@ -27,6 +30,7 @@ import type { PageContentType } from 'src/server/cms'
 import { injectGlobalSections } from 'src/server/cms/global'
 import { getPLP, type PLPContentType } from 'src/server/cms/plp'
 import { getDynamicContent } from 'src/utils/dynamicContent'
+import { fetchServerManyProducts } from 'src/utils/fetchProductGallerySSR'
 
 const LandingPage = dynamic(
   () => import('src/components/templates/LandingPage')
@@ -41,7 +45,8 @@ type Props = BaseProps &
     | {
         type: 'plp'
         page: PLPContentType
-        data: ServerCollectionPageQueryQuery
+        data: ServerCollectionPageQueryQuery & ServerManyProductsQueryQuery
+        serverManyProductsVariables: ServerManyProductsQueryQueryVariables
       }
     | {
         type: 'page'
@@ -163,6 +168,15 @@ export const getStaticProps: GetStaticProps<
     globalSectionsFooterPromise,
   ])
 
+  const [serverManyProductsData, serverManyProductsVariables] =
+    await fetchServerManyProducts({
+      itemsPerPage: cmsPage?.settings?.productGallery?.itemsPerPage,
+      sort: cmsPage?.settings?.productGallery
+        ?.sortBySelection as SearchState['sort'],
+      term: '',
+      selectedFacets: data?.collection?.meta.selectedFacets,
+    })
+
   const notFound = errors.find(isNotFoundError)
 
   if (notFound) {
@@ -194,7 +208,11 @@ export const getStaticProps: GetStaticProps<
 
   return {
     props: {
-      data,
+      data: {
+        ...data,
+        ...serverManyProductsData,
+      },
+      serverManyProductsVariables,
       page: cmsPage,
       globalSections: globalSectionsResult,
       type: 'plp',

package/src/sdk/product/usePageProductsQuery.ts

@@ -4,17 +4,20 @@ import type {
   ClientManyProductsQueryQuery,
   ClientManyProductsQueryQueryVariables,
 } from '@generated/graphql'
+import deepEquals from 'fast-deep-equal'
 import {
-  useEffect,
-  useCallback,
   createContext,
+  useCallback,
   useContext,
-  useRef,
+  useEffect,
   useMemo,
+  useRef,
   useState,
 } from 'react'
 import { useQuery } from 'src/sdk/graphql/useQuery'
+import { generatedBuildTime } from '../../../next-seo.config'
 import { useLocalizedVariables } from './useLocalizedVariables'
+import { useShouldFetchFirstPage } from './useShouldFetchFirstPage'
 
 export const UseGalleryPageContext = createContext<
   ReturnType<typeof useCreateUseGalleryPage>['useGalleryPage']
@@ -64,14 +67,27 @@ export const query = gql(`
 
 const getKey = (object: any) => JSON.stringify(object)
 
+interface UseCreateUseGalleryPageProps {
+  initialPages: ClientManyProductsQueryQuery
+  serverManyProductsVariables: ClientManyProductsQueryQueryVariables
+}
+
 /**
  * Use this hook for managed pages state and creating useGalleryPage hook that will be used for fetching a list of products per pages in PLP or Search
  */
-export const useCreateUseGalleryPage = () => {
-  const [pages, setPages] = useState<ClientManyProductsQueryQuery[]>([])
+export const useCreateUseGalleryPage = (
+  params?: UseCreateUseGalleryPageProps
+) => {
+  const initialPages = params?.initialPages?.search ? [params.initialPages] : []
+  const initialVariables = params?.serverManyProductsVariables
+    ? [getKey(params.serverManyProductsVariables)]
+    : []
+
+  const [pages, setPages] =
+    useState<ClientManyProductsQueryQuery[]>(initialPages)
   // We create pagesRef as a mirror of the pages state so we don't have to add pages as a dependency of the useGalleryPage hook
-  const pagesRef = useRef<ClientManyProductsQueryQuery[]>([])
-  const pagesCache = useRef<string[]>([])
+  const pagesRef = useRef<ClientManyProductsQueryQuery[]>(initialPages)
+  const pagesCache = useRef<string[]>(initialVariables)
 
   const useGalleryPage = useCallback(function useGalleryPage(page: number) {
     const {
@@ -87,8 +103,17 @@ export const useCreateUseGalleryPage = () => {
       selectedFacets,
     })
 
-    const hasSameVariables =
-      pagesCache.current[page] === getKey(localizedVariables)
+    const hasSameVariables = deepEquals(
+      pagesCache.current[page],
+      getKey(localizedVariables)
+    )
+
+    const shouldFetchFirstPage = useShouldFetchFirstPage({
+      page,
+      generatedBuildTime,
+    })
+
+    const shouldFetch = !hasSameVariables || shouldFetchFirstPage
 
     const { data } = useQuery<
       ClientManyProductsQueryQuery,
@@ -96,10 +121,10 @@ export const useCreateUseGalleryPage = () => {
     >(query, localizedVariables, {
       fallbackData: null,
       suspense: true,
-      doNotRun: hasSameVariables,
+      doNotRun: !shouldFetch,
     })
 
-    const shouldUpdatePages = !hasSameVariables && data !== null
+    const shouldUpdatePages = data !== null
 
     if (shouldUpdatePages) {
       pagesCache.current[page] = getKey(localizedVariables)