@faststore/core 2.0.139-alpha.0 → 2.0.141-alpha.0

package/src/pages/s.tsx

@@ -1,25 +1,38 @@
+import type { SearchState } from '@faststore/sdk'
 import { parseSearchState, SearchProvider } from '@faststore/sdk'
+import { SROnly as UISROnly } from '@faststore/ui'
 import { NextSeo } from 'next-seo'
 import { useRouter } from 'next/router'
+import type { ComponentType } from 'react'
 import { useEffect, useState } from 'react'
-import type { SearchState } from '@faststore/sdk'
-import { SROnly as UISROnly } from '@faststore/ui'
 
 import Breadcrumb from 'src/components/sections/Breadcrumb'
 import ProductGallery from 'src/components/sections/ProductGallery'
 import { ITEMS_PER_PAGE } from 'src/constants'
+import CUSTOM_COMPONENTS from 'src/customizations/components'
 import { useApplySearchState } from 'src/sdk/search/state'
 import { mark } from 'src/sdk/tests/mark'
 
-import storeConfig from '../../faststore.config'
+import { Locator } from '@vtex/client-cms'
+import { GetStaticProps } from 'next'
 import GlobalSections, {
   getGlobalSectionsData,
   GlobalSectionsData,
 } from 'src/components/cms/GlobalSections'
-import { Locator } from '@vtex/client-cms'
-import { GetStaticProps } from 'next'
+import RenderSections from 'src/components/cms/RenderSections'
+import { getPage, SearchContentType } from 'src/server/cms'
+import storeConfig from '../../faststore.config'
+
+/**
+ * Sections: Components imported from each store's custom components and '../components/sections' only.
+ * Do not import or render components from any other folder in here.
+ */
+const COMPONENTS: Record<string, ComponentType<any>> = {
+  Breadcrumb,
+  ...CUSTOM_COMPONENTS,
+}
 
-type Props = {
+type Props = SearchContentType & {
   globalSections: GlobalSectionsData
 }
 
@@ -36,7 +49,7 @@ const useSearchParams = () => {
   return params
 }
 
-function Page({ globalSections }: Props) {
+function Page({ sections, globalSections }: Props) {
   const searchParams = useSearchParams()
   const applySearchState = useApplySearchState()
   const title = 'Search Results'
@@ -79,7 +92,7 @@ function Page({ globalSections }: Props) {
           If needed, wrap your component in a <Section /> component
           (not the HTML tag) before rendering it here.
         */}
-        <Breadcrumb name="All Products" />
+        <RenderSections sections={sections} components={COMPONENTS} />
 
         <ProductGallery
           title="Search Results"
@@ -95,10 +108,16 @@ export const getStaticProps: GetStaticProps<
   Record<string, string>,
   Locator
 > = async ({ previewData }) => {
-  const globalSections = await getGlobalSectionsData(previewData)
+  const [cmsPage, globalSections] = await Promise.all([
+    getPage<SearchContentType>({
+      ...(previewData?.contentType === 'search' ? previewData : null),
+      contentType: 'search',
+    }),
+    getGlobalSectionsData(previewData),
+  ])
 
   return {
-    props: { globalSections },
+    props: { ...cmsPage, globalSections },
   }
 }
 

package/src/server/cms.ts

@@ -1,5 +1,5 @@
-import ClientCMS from '@vtex/client-cms'
 import type { ContentData, Locator } from '@vtex/client-cms'
+import ClientCMS from '@vtex/client-cms'
 
 import config from '../../faststore.config'
 
@@ -54,6 +54,8 @@ export const getPage = async <T extends ContentData>(options: Options) => {
 }
 
 export type PDPContentType = ContentData
+export type PLPContentType = ContentData
+export type SearchContentType = ContentData
 
 export type PageContentType = ContentData & {
   settings: {