eslintrc.yaml

extends:
  - "plugin:jsx-a11y/recommended" # (from @magento/eslint-config)
  - "plugin:package-json/recommended" # (from @magento/eslint-config)
  - "plugin:ordered-imports/recommended"
  - "@valtech-commerce/eslint-config/react"

globals:
  process: readonly
  module: readonly
  googleMapsLoaded: readonly
  STORE_NAME: readonly
  STORE_CONFIGS: readonly
  AVAILABLE_STORE_VIEWS: readonly
  STORE_VIEW_LOCALE: readonly
  STORE_VIEW_CODE: readonly
  _ltk: readonly

plugins:
  - "package-json" # (from @magento/eslint-config)
  - "prettier"
  - "ordered-imports"

rules:
  camelcase: [off]
  padded-blocks: [off]
  arrow-body-style: [off]
  import/group-exports: [off]
  require-unicode-regexp: [off]
  import/exports-last: [off]
  # https://github.com/KyleMayes/eslint-plugin-ordered-imports/blob/master/README.md
  ordered-imports/ordered-imports:
    - error
    - declaration-ordering:
        - name
        - case-insensitive
      specifier-ordering: case-insensitive
      group-ordering:
        - name: react
          match: ^react
          order: 10
        - name: project root
          match: ^@
          order: 30
        - name: parent directories
          match: ^\.\.
          order: 40
        - name: current directory
          match: ^\.
          order: 50
        - name: third-party
          match: .*
          order: 20
  logical-assignment-operators: [off]
  class-methods-use-this: [off]
  no-undef: [off]
  no-restricted-globals:
    - error
    - name: "window"
      message: "Use globalThis instead"
  no-prototype-builtins: [off]
  no-useless-escape: [off]
  no-plusplus: [off]
  no-restricted-syntax: [off]
  no-underscore-dangle: [off]
  no-restricted-imports:
    - error
    - paths:
        - name: "@magento/venia-ui/lib/classify"
          importNames: ["mergeClasses"]
          message: 'Please import "useStyle" instead.'
  unicorn/prevent-abbreviations:
    - error
    - checkProperties: true
      checkFilenames: false
      replacements:
        params: false
        props: false
        ref: false
      allowList:
        propClasses: true
        useParams: true
  unicorn/no-keyword-prefix: [off]
  unicorn/template-indent:
    - error
    - indent: 4
  unicorn/prefer-module: [off]
  unicorn/prefer-node-protocol: [off]

  react/jsx-no-literals:
    - error
    - allowedStrings: []
      ignoreProps: true # Use ignoreProps: false to catch label/title/alt text, etc. Has the downside of erroring on "id" and other string props.
      noStrings: true

  react/jsx-one-expression-per-line: [off]
  react/jsx-props-no-spreading: [off]
  react/function-component-definition:
    - error
    - namedComponents: "arrow-function"
      unnamedComponents: "arrow-function"
  react/jsx-indent:
    - error
    - 4
  react/jsx-indent-props:
    - error
    - 4
  react/prop-types:
    - error
    - ignore: ["children"]

  react-hooks/exhaustive-deps: [warn] # Until we decide on a strategy for refactoring useEffect with an empty array

overrides:
  - files: ["*.spec.js"]
    env:
      jest: true

  - files: ["*.wrap.*"]
    rules:
      func-names: [off]

  - files: ["use*.js"]
    excludedFiles: ["*.spec.js", "*.wrap.js", "*.targetables.js", "*.gql.*"]
    rules:
      import/prefer-default-export: [off]
      import/no-default-export: [off]