format with prettier

.eslintrc.cjs

@@ -82,7 +82,7 @@ module.exports = {
         "node_modules",
         "dist", 
         "config",
-        "**/*.test.ts",
-        "**/*.test.tsx"
+        // "**/*.test.ts",
+        // "**/*.test.tsx"
     ],
 };

babel.config.js

@@ -1,29 +1,29 @@
 module.exports = {
-  presets: [
-    [
-      '@babel/preset-env',
-      {
-        modules: false,
-        targets: {
-          browsers: ['last 2 versions'],
-        },
-      },
+    presets: [
+        [
+            "@babel/preset-env",
+            {
+                modules: false,
+                targets: {
+                    browsers: ["last 2 versions"],
+                },
+            },
+        ],
+        ["@babel/preset-typescript", { jsxPragma: "h" }],
     ],
-    ['@babel/preset-typescript', { jsxPragma: 'h' }],
-  ],
-  plugins: [
-    ['babel-plugin-tsconfig-paths'],
-    [
-      '@babel/plugin-transform-react-jsx',
-      {
-        runtime: 'automatic',
-        importSource: 'preact',
-      },
+    plugins: [
+        ["babel-plugin-tsconfig-paths"],
+        [
+            "@babel/plugin-transform-react-jsx",
+            {
+                runtime: "automatic",
+                importSource: "preact",
+            },
+        ],
     ],
-  ],
-  env: {
-    test: {
-      plugins: ['dynamic-import-node', 'istanbul'],
+    env: {
+        test: {
+            plugins: ["dynamic-import-node", "istanbul"],
+        },
     },
-  },
 };

babelrc.js

@@ -1,24 +1,24 @@
-const plugins = ['babel-plugin-istanbul'];
+const plugins = ["babel-plugin-istanbul"];
 
 module.exports = {
-  presets: [
-    [
-      '@babel/preset-env',
-      {
-        useBuiltIns: 'usage', // alternative mode: "entry"
-        corejs: 3, // default would be 2
-        targets: '> 0.25%, not dead',
-        // set your own target environment here (see Browserslist)
-      },
+    presets: [
+        [
+            "@babel/preset-env",
+            {
+                useBuiltIns: "usage", // alternative mode: "entry"
+                corejs: 3, // default would be 2
+                targets: "> 0.25%, not dead",
+                // set your own target environment here (see Browserslist)
+            },
+        ],
+        "@babel/typescript",
+        [
+            "@babel/preset-react",
+            {
+                development: true,
+            },
+        ],
     ],
-    '@babel/typescript',
-    [
-      '@babel/preset-react',
-      {
-        development: true,
-      },
-    ],
-  ],
-  plugins,
-  babelrc: false,
+    plugins,
+    babelrc: false,
 };

docs/MSRCH-4696.md

@@ -1,5 +1,5 @@
 # Highlights
 
-- Using vite instead of webpack for better DX
-- Vite builds LiveSearchPLP widget in library mode for easier reusabliity
-- Consistant organization of types
+-   Using vite instead of webpack for better DX
+-   Vite builds LiveSearchPLP widget in library mode for easier reusabliity
+-   Consistant organization of types

jest.config.js

@@ -1,31 +1,31 @@
 const config = {
-  preset: 'jest-preset-preact',
+    preset: "jest-preset-preact",
 
-  roots: ['<rootDir>/src'],
-  clearMocks: true,
-  testEnvironment: 'jsdom',
-  moduleFileExtensions: ['ts', 'tsx', 'js'],
-  setupFilesAfterEnv: ['@testing-library/jest-dom', 'jest-styled-components'],
-  transform: {
-    '^.+\\.tsx?$': 'ts-jest',
-    '^.+\\.svg$': 'jest-transformer-svg',
-  },
-  moduleDirectories: ['<rootDir>/src', 'node_modules'],
-  moduleNameMapper: {
-    '\\.(css|less)$': 'identity-obj-proxy',
-    '^components(.*)$': '<rootDir>/src/components$1',
-    '^styles(.*)$': '<rootDir>/src/styles$1',
-    '^utils(.*)$': '<rootDir>/src/utils$1',
+    roots: ["<rootDir>/src"],
+    clearMocks: true,
+    testEnvironment: "jsdom",
+    moduleFileExtensions: ["ts", "tsx", "js"],
+    setupFilesAfterEnv: ["@testing-library/jest-dom", "jest-styled-components"],
+    transform: {
+        "^.+\\.tsx?$": "ts-jest",
+        "^.+\\.svg$": "jest-transformer-svg",
+    },
+    moduleDirectories: ["<rootDir>/src", "node_modules"],
+    moduleNameMapper: {
+        "\\.(css|less)$": "identity-obj-proxy",
+        "^components(.*)$": "<rootDir>/src/components$1",
+        "^styles(.*)$": "<rootDir>/src/styles$1",
+        "^utils(.*)$": "<rootDir>/src/utils$1",
 
-    // Add aliases here ---> "^alias(.*)$": "<rootDir>/src/alias-path$1", <---
-  },
-  testPathIgnorePatterns: ['<rootDir>/src/components/Facets'],
-  globals: {
-    API_URL: '',
-    TEST_URL: '',
-    API_KEY: '',
-    SANDBOX_KEY: '',
-  },
+        // Add aliases here ---> "^alias(.*)$": "<rootDir>/src/alias-path$1", <---
+    },
+    testPathIgnorePatterns: ["<rootDir>/src/components/Facets"],
+    globals: {
+        API_URL: "",
+        TEST_URL: "",
+        API_KEY: "",
+        SANDBOX_KEY: "",
+    },
 };
 
 module.exports = config;

src/api/fragments.ts

@@ -7,7 +7,7 @@ accordance with the terms of the Adobe license agreement accompanying
 it.
 */
 
-const Facet = `
+const Facet = /* GraphQL */`
     fragment Facet on Aggregation {
         title
         attribute
@@ -35,7 +35,7 @@ const Facet = `
     }
 `;
 
-const ProductView = `
+const ProductView = /* GraphQL */`
     fragment ProductView on ProductSearchItem {
         productView {
             __typename
@@ -119,7 +119,7 @@ const ProductView = `
     }
 `;
 
-const Product = `
+const Product = /* GraphQL */`
     fragment Product on ProductSearchItem {
         product {
             __typename

src/api/graphql.ts

@@ -1,22 +1,15 @@
-async function getGraphQL(
-  query = '',
-  variables = {},
-  store = '',
-  baseUrl = ''
-) {
-  const graphqlEndpoint = baseUrl
-    ? `${baseUrl}/graphql`
-    : `${window.origin}/graphql`;
-  const response = await fetch(graphqlEndpoint, {
-    method: 'POST',
-    headers: { 'Content-Type': 'application/json', Store: store },
-    body: JSON.stringify({
-      query,
-      variables,
-    }),
-  }).then((res) => res.json());
+async function getGraphQL(query = "", variables = {}, store = "", baseUrl = "") {
+    const graphqlEndpoint = baseUrl ? `${baseUrl}/graphql` : `${window.origin}/graphql`;
+    const response = await fetch(graphqlEndpoint, {
+        method: "POST",
+        headers: { "Content-Type": "application/json", Store: store },
+        body: JSON.stringify({
+            query,
+            variables,
+        }),
+    }).then((res) => res.json());
 
-  return response;
+    return response;
 }
 
 export { getGraphQL };

src/api/mutations.ts

@@ -1,10 +1,10 @@
-const CREATE_EMPTY_CART = `
-  mutation createEmptyCart($input: createEmptyCartInput) {
-    createEmptyCart(input: $input)
-  }
+const CREATE_EMPTY_CART = /* GraphQL */`
+    mutation createEmptyCart($input: createEmptyCartInput) {
+        createEmptyCart(input: $input)
+    }
 `;
 
-const ADD_TO_CART = `
+const ADD_TO_CART = /* GraphQL */`
   mutation addProductsToCart(
     $cartId: String!
     $cartItems: [CartItemInput!]!
@@ -30,7 +30,7 @@ const ADD_TO_CART = `
   }
 `;
 
-const ADD_TO_WISHLIST = `
+const ADD_TO_WISHLIST = /* GraphQL */`
   mutation addProductsToWishlist(
     $wishlistId: ID!
     $wishlistItems: [WishlistItemInput!]!
@@ -58,7 +58,7 @@ const ADD_TO_WISHLIST = `
   }
 `;
 
-const REMOVE_FROM_WISHLIST = `
+const REMOVE_FROM_WISHLIST = /* GraphQL */`
   mutation removeProductsFromWishlist (
     $wishlistId: ID!
     $wishlistItemsIds: [ID!]!
@@ -86,9 +86,4 @@ const REMOVE_FROM_WISHLIST = `
   }
 `;
 
-export {
-  CREATE_EMPTY_CART,
-  ADD_TO_CART,
-  ADD_TO_WISHLIST,
-  REMOVE_FROM_WISHLIST,
-};
+export { CREATE_EMPTY_CART, ADD_TO_CART, ADD_TO_WISHLIST, REMOVE_FROM_WISHLIST };

src/api/queries.ts

@@ -7,9 +7,9 @@ accordance with the terms of the Adobe license agreement accompanying
 it.
 */
 
-import { Facet, Product, ProductView } from './fragments';
+import { Facet, Product, ProductView } from "./fragments";
 
-const ATTRIBUTE_METADATA_QUERY = `
+const ATTRIBUTE_METADATA_QUERY = /* GraphQL */`
     query attributeMetadata {
         attributeMetadata {
         sortable {
@@ -26,7 +26,7 @@ const ATTRIBUTE_METADATA_QUERY = `
     }
 `;
 
-const QUICK_SEARCH_QUERY = `
+const QUICK_SEARCH_QUERY = /* GraphQL */`
     query quickSearch(
         $phrase: String!
         $pageSize: Int = 20
@@ -57,7 +57,7 @@ const QUICK_SEARCH_QUERY = `
     ${Product}
 `;
 
-const PRODUCT_SEARCH_QUERY = `
+const PRODUCT_SEARCH_QUERY = /* GraphQL */`
     query productSearch(
         $phrase: String!
         $pageSize: Int
@@ -101,7 +101,7 @@ const PRODUCT_SEARCH_QUERY = `
     ${Facet}
 `;
 
-const REFINE_PRODUCT_QUERY = `
+const REFINE_PRODUCT_QUERY = /* GraphQL */`
     query refineProduct(
         $optionIds: [String!]!
         $sku: String!
@@ -177,7 +177,7 @@ const REFINE_PRODUCT_QUERY = `
     }
 `;
 
-const GET_CUSTOMER_CART = `
+const GET_CUSTOMER_CART = /* GraphQL */`
     query customerCart {
         customerCart {
             id
@@ -193,7 +193,7 @@ const GET_CUSTOMER_CART = `
     }
 `;
 
-const GET_CUSTOMER_WISHLISTS = `
+const GET_CUSTOMER_WISHLISTS = /* GraphQL */`
     query customer {
       customer {
         wishlists {
@@ -216,10 +216,10 @@ const GET_CUSTOMER_WISHLISTS = `
 `;
 
 export {
-  ATTRIBUTE_METADATA_QUERY,
-  PRODUCT_SEARCH_QUERY,
-  QUICK_SEARCH_QUERY,
-  REFINE_PRODUCT_QUERY,
-  GET_CUSTOMER_CART,
-  GET_CUSTOMER_WISHLISTS,
+    ATTRIBUTE_METADATA_QUERY,
+    PRODUCT_SEARCH_QUERY,
+    QUICK_SEARCH_QUERY,
+    REFINE_PRODUCT_QUERY,
+    GET_CUSTOMER_CART,
+    GET_CUSTOMER_WISHLISTS,
 };