Change Region Query in favor of Session query

vtex-sites · Mar 17, 2022 · 5e5844c · 5e5844c
1 parent 9f5148a
commit 5e5844c
Show file tree

Hide file tree

Showing 10 changed files with 254 additions and 167 deletions.
diff --git a/@generated/graphql/index.ts b/@generated/graphql/index.ts
diff --git a/@generated/graphql/persisted.json b/@generated/graphql/persisted.json
@@ -1,6 +1,6 @@
 {
   "StoreCollection": "query StoreCollection {\n  allStoreCollection(filter: {type: {eq: Department}}) {\n    edges {\n      node {\n        slug\n        seo {\n          title\n        }\n      }\n    }\n  }\n}\n",
-  "RegionQuery": "query RegionQuery($input: RegionInput) {\n  region(input: $input)\n}\n",
+  "RegionQuery": "query RegionQuery($session: IStoreSession!) {\n  session(session: $session) {\n    channel\n  }\n}\n",
   "ProductGalleryQuery": "query ProductGalleryQuery($first: Int!, $after: String!, $sort: StoreSort!, $term: String!, $selectedFacets: [IStoreSelectedFacet!]!) {\n  search(\n    first: $first\n    after: $after\n    sort: $sort\n    term: $term\n    selectedFacets: $selectedFacets\n  ) {\n    products {\n      pageInfo {\n        totalCount\n      }\n      edges {\n        node {\n          id: productID\n          slug\n          sku\n          brand {\n            brandName: name\n            name\n          }\n          name\n          gtin\n          isVariantOf {\n            productGroupID\n            name\n          }\n          image {\n            url\n            alternateName\n          }\n          offers {\n            lowPrice\n            offers {\n              availability\n              price\n              listPrice\n              quantity\n              seller {\n                identifier\n              }\n            }\n          }\n        }\n      }\n    }\n    facets {\n      key\n      label\n      type\n      values {\n        label\n        value\n        selected\n        quantity\n      }\n    }\n  }\n}\n",
   "HomePageQuery": "query HomePageQuery {\n  site {\n    siteMetadata {\n      title\n      description\n      titleTemplate\n    }\n  }\n  allStoreProduct(limit: 14) {\n    nodes {\n      id: productID\n      slug\n      sku\n      brand {\n        brandName: name\n        name\n      }\n      name\n      gtin\n      isVariantOf {\n        productGroupID\n        name\n      }\n      image {\n        url\n        alternateName\n      }\n      offers {\n        lowPrice\n        offers {\n          availability\n          price\n          listPrice\n          quantity\n          seller {\n            identifier\n          }\n        }\n      }\n    }\n  }\n}\n",
   "SearchPageQuery": "query SearchPageQuery {\n  site {\n    siteMetadata {\n      titleTemplate\n      title\n      description\n    }\n  }\n}\n",

diff --git a/gatsby-browser.js b/gatsby-browser.js
@@ -13,6 +13,8 @@ import TestProvider from './src/sdk/tests'
 import { uiActions, uiEffects, uiInitialState } from './src/sdk/ui'
 import storeConfig from './store.config'
 
+const channel = JSON.stringify(storeConfig.channel)
+
 export const wrapRootElement = ({ element }) => (
   <ErrorBoundary>
     <AnalyticsHandler />
@@ -22,7 +24,7 @@ export const wrapRootElement = ({ element }) => (
         actions={uiActions}
         effects={uiEffects}
       >
-        <SessionProvider initialState={{ channel: storeConfig.channel }}>
+        <SessionProvider initialState={{ channel }}>
           <CartProvider mode="optimistic" onValidateCart={validateCart}>
             {element}
           </CartProvider>

diff --git a/gatsby-ssr.js b/gatsby-ssr.js
@@ -11,6 +11,8 @@ import TestProvider from './src/sdk/tests'
 import { uiActions, uiEffects, uiInitialState } from './src/sdk/ui'
 import storeConfig from './store.config'
 
+const channel = JSON.stringify(storeConfig.channel)
+
 export const wrapRootElement = ({ element }) => (
   <ErrorBoundary>
     <AnalyticsHandler />
@@ -20,7 +22,7 @@ export const wrapRootElement = ({ element }) => (
         actions={uiActions}
         effects={uiEffects}
       >
-        <SessionProvider initialState={{ channel: storeConfig.channel }}>
+        <SessionProvider initialState={{ channel }}>
           <CartProvider mode="optimistic" onValidateCart={validateCart}>
             {element}
           </CartProvider>

diff --git a/package.json b/package.json
@@ -27,7 +27,7 @@
     "@envelop/graphql-jit": "^1.1.1",
     "@envelop/parser-cache": "^2.2.0",
     "@envelop/validation-cache": "^2.2.0",
-    "@faststore/api": "https://pkg.csb.dev/vtex/faststore/commit/a83409a6/@faststore/api",
+    "@faststore/api": "https://pkg.csb.dev/vtex/faststore/commit/abef51fc/@faststore/api",
     "@faststore/sdk": "^1.6.7",
     "@faststore/ui": "^1.6.7",
     "@vtex/gatsby-plugin-nginx": "^1.6.7",

diff --git a/src/components/common/PostalCode/PostalCodeInput.tsx b/src/components/common/PostalCode/PostalCodeInput.tsx
@@ -15,8 +15,10 @@ const POSTAL_CODE_STORAGE_KEY = 'main::store::postalCode'
 const POSTAL_CODE_INPUT_ID = 'postal-code-input'
 
 export const RegionQuery = gql`
-  query RegionQuery($input: RegionInput) {
-    region(input: $input)
+  query RegionQuery($session: IStoreSession!) {
+    session(session: $session) {
+      channel
+    }
   }
 `
 
@@ -27,22 +29,33 @@ export default function PostalCodeInput() {
     ''
   )
 
-  const { country } = useSession()
+  const { country, setSession, ...partialSession } = useSession()
 
-  const handleSubmit = (event: KeyboardEvent<HTMLInputElement>) => {
+  const handleSubmit = async (event: KeyboardEvent<HTMLInputElement>) => {
     const value = ref.current?.value
 
     if (!(event.key === 'Enter' && typeof value === 'string')) {
       return
     }
 
     setPostalCode(value)
-    request<RegionQueryQuery, RegionQueryQueryVariables>(RegionQuery, {
-      input: {
-        postalCode: value,
-        country: country ?? 'BRA',
-        salesChannel: null,
-      },
+    const {
+      session: { channel },
+    } = await request<RegionQueryQuery, RegionQueryQueryVariables>(
+      RegionQuery,
+      {
+        session: {
+          channel: partialSession.channel,
+          postalCode: value,
+          country,
+        },
+      }
+    )
+
+    setSession({
+      ...partialSession,
+      country,
+      channel: channel ?? partialSession.channel,
     })
   }
 

diff --git a/src/sdk/product/useProduct.ts b/src/sdk/product/useProduct.ts
@@ -29,7 +29,7 @@ export const useProduct = <T extends BrowserProductQueryQuery>(
     return {
       locator: [
         { key: 'id', value: productID },
-        { key: 'channel', value: channel },
+        { key: 'channel', value: JSON.parse(channel).salesChannel },
       ],
     }
   }, [channel, productID])

diff --git a/src/server/index.js b/src/server/index.js
@@ -20,7 +20,8 @@ const apiOptions = {
   platform: storeConfig.platform,
   account: storeConfig.api.storeId,
   environment: storeConfig.api.environment,
-  channel: storeConfig.channel,
+  // TODO: the API should handle this sales channel as string
+  channel: storeConfig.channel.salesChannel,
 }
 
 const apiSchema = getSchema(apiOptions)

diff --git a/store.config.js b/store.config.js
@@ -9,7 +9,9 @@ module.exports = {
   },
 
   // Default channel
-  channel: '1',
+  channel: {
+    salesChannel: '1',
+  },
 
   // Production URLs
   storeUrl: 'https://vtexfaststore.com',

diff --git a/yarn.lock b/yarn.lock
@@ -1472,9 +1472,21 @@
     minimatch "^3.0.4"
     strip-json-comments "^3.1.1"
 
-"@faststore/api@https://pkg.csb.dev/vtex/faststore/commit/a83409a6/@faststore/api":
+"@faststore/api@https://pkg.csb.dev/vtex/faststore/commit/3614aa32/@faststore/api":
   version "1.6.10"
-  resolved "https://pkg.csb.dev/vtex/faststore/commit/a83409a6/@faststore/api#52bef6ef069a7638bfe8ca2ea9499db09406b86e"
+  resolved "https://pkg.csb.dev/vtex/faststore/commit/3614aa32/@faststore/api#7834e267497c4345382063b847c4844d452508b8"
+  dependencies:
+    "@graphql-tools/schema" "^8.2.0"
+    "@rollup/plugin-graphql" "^1.0.0"
+    "@sindresorhus/slugify" "^1.1.2"
+    dataloader "^2.0.0"
+    fast-deep-equal "^3.1.3"
+    isomorphic-unfetch "^3.1.0"
+    p-limit "^3.1.0"
+
+"@faststore/api@https://pkg.csb.dev/vtex/faststore/commit/abef51fc/@faststore/api":
+  version "1.6.10"
+  resolved "https://pkg.csb.dev/vtex/faststore/commit/abef51fc/@faststore/api#a23c611b1032708e9809a1c8f640e3f32225f878"
   dependencies:
     "@graphql-tools/schema" "^8.2.0"
     "@rollup/plugin-graphql" "^1.0.0"