Fix Shopify translations issue

framework/shopify/product/get-all-product-paths.ts

@@ -1,4 +1,3 @@
-import { Product } from '@commerce/types'
 import { getConfig, ShopifyConfig } from '../api'
 import fetchAllProducts from '../api/utils/fetch-all-products'
 import { ProductEdge } from '../schema'

framework/shopify/product/get-all-products.ts

@@ -1,9 +1,8 @@
-import { GraphQLFetcherResult } from '@commerce/api'
+import { Product } from '@commerce/types'
 import { getConfig, ShopifyConfig } from '../api'
-import { ProductEdge } from '../schema'
+import { QueryRoot, QueryRootProductsArgs } from '../schema'
 import { getAllProductsQuery } from '../utils/queries'
 import { normalizeProduct } from '../utils/normalize'
-import { Product } from '@commerce/types'
 
 type Variables = {
   first?: number
@@ -21,16 +20,25 @@ const getAllProducts = async (options: {
 }): Promise<ReturnType> => {
   let { config, variables = { first: 250 } } = options ?? {}
   config = getConfig(config)
+  let products: Product[] = []
 
-  const { data }: GraphQLFetcherResult = await config.fetch(
+  const { data } = await config!.fetch<QueryRoot, QueryRootProductsArgs>(
     getAllProductsQuery,
-    { variables }
+    {
+      variables,
+    },
+    {
+      ...(config.locale && {
+        headers: {
+          'Accept-Language': config.locale!,
+        },
+      }),
+    }
   )
-
-  const products =
-    data.products?.edges?.map(({ node: p }: ProductEdge) =>
-      normalizeProduct(p)
-    ) ?? []
+  products = [
+    ...products,
+    ...data.products.edges.map(({ node: p }) => normalizeProduct(p)),
+  ]
 
   return {
     products,

framework/shopify/product/get-product.ts

@@ -1,31 +1,43 @@
-import { GraphQLFetcherResult } from '@commerce/api'
+import { Product } from '@commerce/types'
+import { QueryRoot } from '../schema'
 import { getConfig, ShopifyConfig } from '../api'
 import { normalizeProduct, getProductQuery } from '../utils'
 
-type Variables = {
+export type GetProductInput = {
   slug: string
 }
 
-type ReturnType = {
-  product: any
+export type GetProductResult = {
+  product?: Product
 }
 
-const getProduct = async (options: {
-  variables: Variables
-  config: ShopifyConfig
+const getProduct = async ({
+  variables,
+  config,
+}: {
+  variables: GetProductInput
+  config?: ShopifyConfig
   preview?: boolean
-}): Promise<ReturnType> => {
-  let { config, variables } = options ?? {}
-  config = getConfig(config)
+}): Promise<GetProductResult> => {
+  const { fetch, locale } = getConfig(config)
 
-  const { data }: GraphQLFetcherResult = await config.fetch(getProductQuery, {
-    variables,
-  })
-  const { productByHandle } = data
+  const {
+    data: { productByHandle },
+  } = await fetch<QueryRoot>(
+    getProductQuery,
+    {
+      variables,
+    },
+    {
+      ...(locale && {
+        headers: {
+          'Accept-Language': locale,
+        },
+      }),
+    }
+  )
 
-  return {
-    product: productByHandle ? normalizeProduct(productByHandle) : null,
-  }
+  return productByHandle ? { product: normalizeProduct(productByHandle) } : {}
 }
 
 export default getProduct

framework/shopify/product/use-search.tsx

@@ -1,7 +1,9 @@
 import { SWRHook } from '@commerce/utils/types'
 import useSearch, { UseSearch } from '@commerce/product/use-search'
+import { SearchProductsInput, SearchProductsData } from '@commerce/types'
 
 import { ProductEdge } from '../schema'
+
 import {
   getAllProductsQuery,
   getCollectionProductsQuery,
@@ -9,22 +11,8 @@ import {
   normalizeProduct,
 } from '../utils'
 
-import { Product } from '@commerce/types'
-
 export default useSearch as UseSearch<typeof handler>
 
-export type SearchProductsInput = {
-  search?: string
-  categoryId?: string
-  brandId?: string
-  sort?: string
-}
-
-export type SearchProductsData = {
-  products: Product[]
-  found: boolean
-}
-
 export const handler: SWRHook<
   SearchProductsData,
   SearchProductsInput,
@@ -68,6 +56,7 @@ export const handler: SWRHook<
         ['categoryId', input.categoryId],
         ['brandId', input.brandId],
         ['sort', input.sort],
+        ['locale', input.locale],
       ],
       swrOptions: {
         revalidateOnFocus: false,