refactor(core): use gql.tada on simple queries (#666)

bigcommerce · Mar 18, 2024 · 51a2b64 · 51a2b64
1 parent faa2330
commit 51a2b64
Show file tree

Hide file tree

Showing 10 changed files with 47 additions and 51 deletions.
diff --git a/.changeset/poor-schools-exercise.md b/.changeset/poor-schools-exercise.md
@@ -0,0 +1,5 @@
+---
+"@bigcommerce/catalyst-core": minor
+---
+
+use gql.tada on simple queries
diff --git a/apps/core/client/queries/get-blost-post.ts b/apps/core/client/queries/get-blost-post.ts
@@ -1,10 +1,10 @@
 import { cache } from 'react';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-const GET_BLOG_POST_QUERY = /* GraphQL */ `
+const GET_BLOG_POST_QUERY = graphql(`
   query getBlogPost($entityId: Int!) {
     site {
       content {
@@ -38,13 +38,11 @@ const GET_BLOG_POST_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getBlogPost = cache(async (entityId: number) => {
-  const query = graphql(GET_BLOG_POST_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_BLOG_POST_QUERY,
     variables: { entityId },
     fetchOptions: { next: { revalidate } },
   });

diff --git a/apps/core/client/queries/get-brand.ts b/apps/core/client/queries/get-brand.ts
@@ -1,14 +1,14 @@
 import { cache } from 'react';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
 export interface GetBrandOptions {
   brandId: number;
 }
 
-const GET_BRAND_QUERY = /* GraphQL */ `
+const GET_BRAND_QUERY = graphql(`
   query getBrand($entityId: Int!) {
     site {
       brand(entityId: $entityId) {
@@ -18,13 +18,11 @@ const GET_BRAND_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getBrand = cache(async ({ brandId }: GetBrandOptions) => {
-  const query = graphql(GET_BRAND_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_BRAND_QUERY,
     variables: { entityId: brandId },
     fetchOptions: { next: { revalidate } },
   });

diff --git a/apps/core/client/queries/get-brands.ts b/apps/core/client/queries/get-brands.ts
@@ -2,15 +2,15 @@ import { removeEdgesAndNodes } from '@bigcommerce/catalyst-client';
 import { cache } from 'react';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
 interface GetBrandsOptions {
   first?: number;
   brandIds?: number[];
 }
 
-const GET_BRANDS_QUERY = /* GraphQL */ `
+const GET_BRANDS_QUERY = graphql(`
   query getBrands($first: Int, $entityIds: [Int!]) {
     site {
       brands(first: $first, entityIds: $entityIds) {
@@ -24,13 +24,11 @@ const GET_BRANDS_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getBrands = cache(async ({ first = 5, brandIds }: GetBrandsOptions = {}) => {
-  const query = graphql(GET_BRANDS_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_BRANDS_QUERY,
     variables: { first, entityIds: brandIds },
     fetchOptions: { next: { revalidate } },
   });

diff --git a/apps/core/client/queries/get-category-tree.ts b/apps/core/client/queries/get-category-tree.ts
@@ -3,10 +3,10 @@ import { cache } from 'react';
 import { getSessionCustomerId } from '~/auth';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-export const GET_CATEGORY_TREE_QUERY = /* GraphQL */ `
+const GET_CATEGORY_TREE_QUERY = graphql(`
   query getCategoryTree($categoryId: Int) {
     site {
       categoryTree(rootEntityId: $categoryId) {
@@ -26,14 +26,13 @@ export const GET_CATEGORY_TREE_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getCategoryTree = cache(async (categoryId?: number) => {
-  const query = graphql(GET_CATEGORY_TREE_QUERY);
   const customerId = await getSessionCustomerId();
 
   const response = await client.fetch({
-    document: query,
+    document: GET_CATEGORY_TREE_QUERY,
     variables: { categoryId },
     customerId,
     fetchOptions: customerId ? { cache: 'no-store' } : { next: { revalidate } },

diff --git a/apps/core/client/queries/get-product-reviews.ts b/apps/core/client/queries/get-product-reviews.ts
@@ -2,10 +2,10 @@ import { removeEdgesAndNodes } from '@bigcommerce/catalyst-client';
 import { cache } from 'react';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-const GET_PRODUCT_REVIEWS_QUERY = /* GraphQL */ `
+const GET_PRODUCT_REVIEWS_QUERY = graphql(`
   query getProductReviews($entityId: Int!) {
     site {
       product(entityId: $entityId) {
@@ -33,13 +33,11 @@ const GET_PRODUCT_REVIEWS_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getProductReviews = cache(async (entityId: number) => {
-  const query = graphql(GET_PRODUCT_REVIEWS_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_PRODUCT_REVIEWS_QUERY,
     variables: { entityId },
     fetchOptions: { next: { revalidate } },
   });

diff --git a/apps/core/client/queries/get-raw-web-page-content.ts b/apps/core/client/queries/get-raw-web-page-content.ts
@@ -1,7 +1,7 @@
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 
-export const GET_RAW_WEB_PAGE_CONTENT_QUERY = /* GraphQL */ `
+const GET_RAW_WEB_PAGE_CONTENT_QUERY = graphql(`
   query getRawWebPageContent($id: ID!) {
     node(id: $id) {
       __typename
@@ -10,13 +10,11 @@ export const GET_RAW_WEB_PAGE_CONTENT_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getRawWebPageContent = async (id: string) => {
-  const query = graphql(GET_RAW_WEB_PAGE_CONTENT_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_RAW_WEB_PAGE_CONTENT_QUERY,
     variables: { id },
   });
 

diff --git a/apps/core/client/queries/get-recaptcha-settings.ts b/apps/core/client/queries/get-recaptcha-settings.ts
@@ -1,8 +1,8 @@
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-const GET_RECAPTCHA_SETTINGS_QUERY = /* GraphQL */ `
+const GET_RECAPTCHA_SETTINGS_QUERY = graphql(`
   query getReCaptchaSettings {
     site {
       settings {
@@ -13,11 +13,13 @@ const GET_RECAPTCHA_SETTINGS_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getReCaptchaSettings = async () => {
-  const query = graphql(GET_RECAPTCHA_SETTINGS_QUERY);
-  const response = await client.fetch({ document: query, fetchOptions: { next: { revalidate } } });
+  const response = await client.fetch({
+    document: GET_RECAPTCHA_SETTINGS_QUERY,
+    fetchOptions: { next: { revalidate } },
+  });
 
   return response.data.site.settings?.reCaptcha;
 };
diff --git a/apps/core/client/queries/get-route.ts b/apps/core/client/queries/get-route.ts
@@ -1,8 +1,8 @@
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-export const GET_ROUTE_QUERY = /* GraphQL */ `
+const GET_ROUTE_QUERY = graphql(`
   query getRoute($path: String!) {
     site {
       route(path: $path) {
@@ -31,13 +31,11 @@ export const GET_ROUTE_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getRoute = async (path: string) => {
-  const query = graphql(GET_ROUTE_QUERY);
-
   const response = await client.fetch({
-    document: query,
+    document: GET_ROUTE_QUERY,
     variables: { path },
     fetchOptions: { next: { revalidate } },
   });

diff --git a/apps/core/client/queries/get-store-settings.ts b/apps/core/client/queries/get-store-settings.ts
@@ -1,10 +1,10 @@
 import { cache } from 'react';
 
 import { client } from '..';
-import { graphql } from '../generated';
+import { graphql } from '../graphql';
 import { revalidate } from '../revalidate-target';
 
-export const GET_STORE_SETTINGS_QUERY = /* GraphQL */ `
+const GET_STORE_SETTINGS_QUERY = graphql(`
   query getStoreSettings {
     site {
       settings {
@@ -35,11 +35,13 @@ export const GET_STORE_SETTINGS_QUERY = /* GraphQL */ `
       }
     }
   }
-`;
+`);
 
 export const getStoreSettings = cache(async () => {
-  const query = graphql(GET_STORE_SETTINGS_QUERY);
-  const response = await client.fetch({ document: query, fetchOptions: { next: { revalidate } } });
+  const response = await client.fetch({
+    document: GET_STORE_SETTINGS_QUERY,
+    fetchOptions: { next: { revalidate } },
+  });
 
   return response.data.site.settings;
 });