diff --git a/.eslintrc.cjs b/.eslintrc.cjs index 5040ab2..f796152 100644 --- a/.eslintrc.cjs +++ b/.eslintrc.cjs @@ -1,4 +1,5 @@ module.exports = { + root: true, parser: "@typescript-eslint/parser", parserOptions: { ecmaVersion: 2020, @@ -28,15 +29,16 @@ module.exports = { TEST_URL: true, }, extends: [ + "preact", // "eslint:recommended", - "plugin:preact/recommended", + // "plugin:preact/recommended", "plugin:@typescript-eslint/recommended", // "plugin:@typescript-eslint/eslint-recommended", // "preact", - "plugin:storybook/recommended", + // "plugin:storybook/recommended", "plugin:prettier/recommended", // should always be last ], - plugins: ["jest", "simple-import-sort", "@typescript-eslint"], + plugins: ["jest", "simple-import-sort"], rules: { "no-console": ["error"], "react/prop-types": 0, @@ -57,6 +59,7 @@ module.exports = { // Relative imports. // Anything that starts with a dot. ["^\\."], + [".css$"], // css last ], }, ], @@ -69,6 +72,8 @@ module.exports = { ], "@typescript-eslint/no-empty-function": "off", "@typescript-eslint/ban-ts-comment": ["error", { "ts-ignore": "allow-with-description" }], + // introduced with eslint-config-preact + radix: "off", }, overrides: [ { @@ -80,7 +85,7 @@ module.exports = { ], ignorePatterns: [ "node_modules", - "dist", + "dist", "config", // "**/*.test.ts", // "**/*.test.tsx" diff --git a/package.json b/package.json index c5a2c49..3f036ce 100644 --- a/package.json +++ b/package.json @@ -64,12 +64,11 @@ "babel-plugin-tsconfig-paths": "^1.0.3", "cross-env": "^7.0.3", "cssnano": "^6.0.1", - "eslint": "^8.50.0", + "eslint": "8.57.1", "eslint-config-preact": "^1.3.0", - "eslint-config-prettier": "^9.0.0", + "eslint-config-prettier": "^9.1.0", "eslint-plugin-cypress": "^2.15.1", "eslint-plugin-jest": "^27.4.2", - "eslint-plugin-preact": "^0.1.0", "eslint-plugin-prettier": "^5.2.1", "eslint-plugin-simple-import-sort": "^10.0.0", "eslint-plugin-storybook": "^0.6.14", diff --git a/src/LiveSearchPLP.tsx b/src/LiveSearchPLP.tsx index 3f9472a..dd8dcd1 100644 --- a/src/LiveSearchPLP.tsx +++ b/src/LiveSearchPLP.tsx @@ -1,6 +1,5 @@ import { render } from "preact/compat"; -import "./styles/index.css"; import { AttributeMetadataProvider, CartProvider, @@ -16,6 +15,8 @@ import App from "./containers/App"; import Resize from "./context/displayChange"; import Translation from "./context/translation"; +import "./styles/index.css"; + type LiveSearchPlpProps = { storeDetails: StoreDetails; root: HTMLElement; diff --git a/src/api/fragments.ts b/src/api/fragments.ts index 7c2fe48..a4ef0c7 100644 --- a/src/api/fragments.ts +++ b/src/api/fragments.ts @@ -7,7 +7,7 @@ accordance with the terms of the Adobe license agreement accompanying it. */ -const Facet = /* GraphQL */` +const Facet = /* GraphQL */ ` fragment Facet on Aggregation { title attribute @@ -35,7 +35,7 @@ const Facet = /* GraphQL */` } `; -const ProductView = /* GraphQL */` +const ProductView = /* GraphQL */ ` fragment ProductView on ProductSearchItem { productView { __typename @@ -119,7 +119,7 @@ const ProductView = /* GraphQL */` } `; -const Product = /* GraphQL */` +const Product = /* GraphQL */ ` fragment Product on ProductSearchItem { product { __typename @@ -127,7 +127,7 @@ const Product = /* GraphQL */` description { html } - short_description{ + short_description { html } name diff --git a/src/api/mutations.ts b/src/api/mutations.ts index 03df1c0..046e04e 100644 --- a/src/api/mutations.ts +++ b/src/api/mutations.ts @@ -1,89 +1,71 @@ -const CREATE_EMPTY_CART = /* GraphQL */` +const CREATE_EMPTY_CART = /* GraphQL */ ` mutation createEmptyCart($input: createEmptyCartInput) { createEmptyCart(input: $input) } `; -const ADD_TO_CART = /* GraphQL */` - mutation addProductsToCart( - $cartId: String! - $cartItems: [CartItemInput!]! - ) { - addProductsToCart( - cartId: $cartId - cartItems: $cartItems - ) { - cart { - items { - product { - name - sku - } - quantity +const ADD_TO_CART = /* GraphQL */ ` + mutation addProductsToCart($cartId: String!, $cartItems: [CartItemInput!]!) { + addProductsToCart(cartId: $cartId, cartItems: $cartItems) { + cart { + items { + product { + name + sku + } + quantity + } + } + user_errors { + code + message } - } - user_errors { - code - message - } - } - } + } + } `; -const ADD_TO_WISHLIST = /* GraphQL */` - mutation addProductsToWishlist( - $wishlistId: ID! - $wishlistItems: [WishlistItemInput!]! - ) { - addProductsToWishlist( - wishlistId: $wishlistId - wishlistItems: $wishlistItems - ) { - wishlist { - id - name - items_count - items_v2 { - items { - id - product { - uid +const ADD_TO_WISHLIST = /* GraphQL */ ` + mutation addProductsToWishlist($wishlistId: ID!, $wishlistItems: [WishlistItemInput!]!) { + addProductsToWishlist(wishlistId: $wishlistId, wishlistItems: $wishlistItems) { + wishlist { + id name - sku - } + items_count + items_v2 { + items { + id + product { + uid + name + sku + } + } + } } - } } - } - } + } `; -const REMOVE_FROM_WISHLIST = /* GraphQL */` - mutation removeProductsFromWishlist ( - $wishlistId: ID! - $wishlistItemsIds: [ID!]! - ) { - removeProductsFromWishlist( - wishlistId: $wishlistId - wishlistItemsIds: $wishlistItemsIds - ) { - wishlist { - id - name - items_count - items_v2 { - items { - id - product { - uid +const REMOVE_FROM_WISHLIST = /* GraphQL */ ` + mutation removeProductsFromWishlist($wishlistId: ID!, $wishlistItemsIds: [ID!]!) { + removeProductsFromWishlist(wishlistId: $wishlistId, wishlistItemsIds: $wishlistItemsIds) { + wishlist { + id name - sku - } + items_count + items_v2 { + items { + id + product { + uid + name + sku + } + } + } } - } } - } - } + } `; export { CREATE_EMPTY_CART, ADD_TO_CART, ADD_TO_WISHLIST, REMOVE_FROM_WISHLIST }; diff --git a/src/api/queries.ts b/src/api/queries.ts index 7dbfe8a..d0905a2 100644 --- a/src/api/queries.ts +++ b/src/api/queries.ts @@ -9,24 +9,24 @@ it. import { Facet, Product, ProductView } from "./fragments"; -const ATTRIBUTE_METADATA_QUERY = /* GraphQL */` +const ATTRIBUTE_METADATA_QUERY = /* GraphQL */ ` query attributeMetadata { attributeMetadata { - sortable { - label - attribute - numeric - } - filterableInSearch { - label - attribute - numeric - } + sortable { + label + attribute + numeric + } + filterableInSearch { + label + attribute + numeric + } } } `; -const QUICK_SEARCH_QUERY = /* GraphQL */` +const QUICK_SEARCH_QUERY = /* GraphQL */ ` query quickSearch( $phrase: String! $pageSize: Int = 20 @@ -57,7 +57,7 @@ const QUICK_SEARCH_QUERY = /* GraphQL */` ${Product} `; -const PRODUCT_SEARCH_QUERY = /* GraphQL */` +const PRODUCT_SEARCH_QUERY = /* GraphQL */ ` query productSearch( $phrase: String! $pageSize: Int @@ -101,15 +101,9 @@ const PRODUCT_SEARCH_QUERY = /* GraphQL */` ${Facet} `; -const REFINE_PRODUCT_QUERY = /* GraphQL */` - query refineProduct( - $optionIds: [String!]! - $sku: String! - ) { - refineProduct( - optionIds: $optionIds - sku: $sku - ) { +const REFINE_PRODUCT_QUERY = /* GraphQL */ ` + query refineProduct($optionIds: [String!]!, $sku: String!) { + refineProduct(optionIds: $optionIds, sku: $sku) { __typename id sku @@ -177,41 +171,41 @@ const REFINE_PRODUCT_QUERY = /* GraphQL */` } `; -const GET_CUSTOMER_CART = /* GraphQL */` +const GET_CUSTOMER_CART = /* GraphQL */ ` query customerCart { customerCart { id items { - id - product { - name - sku - } - quantity + id + product { + name + sku + } + quantity } } } `; -const GET_CUSTOMER_WISHLISTS = /* GraphQL */` +const GET_CUSTOMER_WISHLISTS = /* GraphQL */ ` query customer { - customer { - wishlists { - id - name - items_count - items_v2 { - items { - id - product { - uid - name - sku - } + customer { + wishlists { + id + name + items_count + items_v2 { + items { + id + product { + uid + name + sku + } + } + } } - } } - } } `; diff --git a/src/components/Pagination/Pagination.tsx b/src/components/Pagination/Pagination.tsx index be72f3c..c1efddb 100644 --- a/src/components/Pagination/Pagination.tsx +++ b/src/components/Pagination/Pagination.tsx @@ -35,7 +35,9 @@ export const Pagination: FunctionComponent = ({ onPageChange, t } return () => {}; + // eslint-disable-next-line react-hooks/exhaustive-deps }, []); + const onPrevious = () => { if (currentPage > 1) { onPageChange(currentPage - 1); @@ -49,7 +51,7 @@ export const Pagination: FunctionComponent = ({ onPageChange, t }; return ( -