🙋 test getStaticProps with revalidate

framework/commerce/api/operations.ts

@@ -23,6 +23,8 @@ export const OPERATIONS = [
   'getAllProductPaths',
   'getAllProducts',
   'getProduct',
+  'getAllFacets',
+
 ] as const
 
 export const defaultOperations = OPERATIONS.reduce((ops, k) => {
@@ -156,6 +158,22 @@ export type Operations<P extends APIProvider> = {
   }
 }
 
+// getAllFacets: {
+//   <T extends GetAllFacetsOperation>(opts: {
+//     variables?: T['variables']
+//     config?: P['config']
+//     preview?: boolean
+//   }): Promise<T['data']>
+
+//   <T extends GetAllFacetsOperation>(
+//     opts: {
+//       variables?: T['variables']
+//       config?: P['config']
+//       preview?: boolean
+//     } & OperationOptions
+//   ): Promise<T['data']>
+// }
+
 export type APIOperations<P extends APIProvider> = {
   [K in keyof Operations<P>]?: (ctx: OperationContext<P>) => Operations<P>[K]
 }

framework/commerce/types/facet.ts

@@ -0,0 +1,85 @@
+
+export type FacetOption = {
+  __typename?: 'MultipleChoiceOption'
+  id: string
+  displayName: string
+  values: FacetOptionValues[]
+}
+
+export type FacetOptionValues = {
+  label: string
+  hexColors?: string[]
+}
+
+export type FacetVariant = {
+  id: string | number
+  options: FacetOption[]
+  availableForSale?: boolean
+}
+
+export type Facet = {
+  id: string
+  name: string
+  description: string
+  descriptionHtml?: string
+  sku?: string
+  slug?: string
+  path?: string
+  images: FacetImage[]
+  variants: FacetVariant[]
+  price: FacetPrice
+  options: FacetOption[]
+}
+
+export type SearchFacetsBody = {
+  search?: string
+  categoryId?: string | number
+  brandId?: string | number
+  sort?: string
+  locale?: string
+}
+
+export type FacetTypes = {
+  facet: Facet
+  searchBody: SearchFacetsBody
+}
+
+export type SearchFacetsHook<T extends FacetTypes = FacetTypes> = {
+  data: {
+    facets: T['facet'][]
+    found: boolean
+  }
+  body: T['searchBody']
+  input: T['searchBody']
+  fetcherInput: T['searchBody']
+}
+
+export type FacetsSchema<T extends FacetTypes = FacetTypes> = {
+  endpoint: {
+    options: {}
+    handlers: {
+      getFacets: SearchFacetsHook<T>
+    }
+  }
+}
+
+export type GetAllFacetPathsOperation<
+  T extends FacetTypes = FacetTypes
+> = {
+  data: { facets: Pick<T['facet'], 'path'>[] }
+  variables: { first?: number }
+}
+
+export type GetAllFacetsOperation<T extends FacetTypes = FacetTypes> = {
+  data: { facets: T['facet'][] }
+  variables: {
+    relevance?: 'featured' | 'best_selling' | 'newest'
+    ids?: string[]
+    first?: number
+  }
+}
+
+export type GetFacetOperation<T extends FacetTypes = FacetTypes> = {
+  data: { facet?: T['facet'] }
+  variables: { path: string; slug?: never } | { path?: never; slug: string }
+}

framework/vendure/api/index.ts

@@ -1,15 +1,16 @@
-import type { APIProvider, CommerceAPIConfig } from '@commerce/api'
+import type { CommerceAPIConfig } from '@commerce/api'
 import { CommerceAPI, getCommerceApi as commerceApi } from '@commerce/api'
-import fetchGraphqlApi from './utils/fetch-graphql-api'
-
-import login from './operations/login'
+import getAllFacets from './operations/get-all-facets'
 import getAllPages from './operations/get-all-pages'
-import getPage from './operations/get-page'
-import getSiteInfo from './operations/get-site-info'
-import getCustomerWishlist from './operations/get-customer-wishlist'
 import getAllProductPaths from './operations/get-all-product-paths'
 import getAllProducts from './operations/get-all-products'
+import getCustomerWishlist from './operations/get-customer-wishlist'
+import getPage from './operations/get-page'
 import getProduct from './operations/get-product'
+import getSiteInfo from './operations/get-site-info'
+import login from './operations/login'
+import fetchGraphqlApi from './utils/fetch-graphql-api'
+
 
 export interface VendureConfig extends CommerceAPIConfig {}
 
@@ -40,6 +41,7 @@ const operations = {
   getAllProductPaths,
   getAllProducts,
   getProduct,
+  getAllFacets,
 }
 
 export const provider = { config, operations }

framework/vendure/api/operations/get-all-facets.ts

@@ -0,0 +1,46 @@
+import { Facet } from '@commerce/types/facet'
+import { Provider, VendureConfig } from '../'
+import { GetAllFacetsQuery } from '../../schema'
+import { normalizeSearchResult } from '../../utils/normalize'
+import { getAllFacetsQuery } from '../../utils/queries/get-all-facets-query'
+import { OperationContext } from '@commerce/api/operations'
+
+export type FacetVariables = { first?: number }
+
+export default function getAllFacetsOperation({
+  commerce,
+}: OperationContext<Provider>) {
+  async function getAllFacets(opts?: {
+    variables?: FacetVariables
+    config?: Partial<VendureConfig>
+    preview?: boolean
+  }): Promise<{ facets: Facet[] }>
+
+  async function getAllFacets({
+    query = getAllFacetsQuery,
+    variables: { ...vars } = {},
+    config: cfg,
+  }: {
+    query?: string
+    variables?: FacetVariables
+    config?: Partial<VendureConfig>
+    preview?: boolean
+  } = {}): Promise<{ facets: Facet[] | any[] }> {
+    const config = commerce.getConfig(cfg)
+    const variables = {
+      input: {
+        take: vars.first,
+        groupByFacet: true,
+      },
+    }
+    const { data } = await config.fetch<GetAllFacetsQuery>(query, {
+      variables,
+    })
+
+    return {
+      facets: data.search.items.map((item) => normalizeSearchResult(item)),
+    }
+  }
+
+  return getAllFacets
+}

pages/index.tsx

@@ -60,7 +60,7 @@ export async function getStaticProps({
 
   return {
     props: { products },
-    revalidate: 20,
+    revalidate: 60,
   }
 }
 

src/components/hooks/facets/useFacets.tsx

@@ -3,7 +3,7 @@ import { getAllFacetsQuery } from '@framework/utils/queries/get-all-facets-query
 import gglFetcher from 'src/utils/gglFetcher'
 import useSWR from 'swr'
 
-const useFacets = (options: QueryFacetsArgs) => {
+const useFacets = (options?: QueryFacetsArgs) => {
   const { data, isValidating, ...rest } = useSWR<GetAllFacetsQuery>([getAllFacetsQuery, options], gglFetcher)
   return { items: data?.facets.items, totalItems: data?.facets.totalItems, loading: isValidating, ...rest }
 }