Update ESLint configuration to eslint.config.js format

eslint.config.js

@@ -0,0 +1,146 @@
+import globals from 'globals';
+import js from '@eslint/js';
+import reactNative from '@react-native-community/eslint-config';
+import reactRecommended from 'eslint-plugin-react/configs/recommended';
+import importPlugin from 'eslint-plugin-import';
+import metamaskDesignTokens from '@metamask/eslint-plugin-design-tokens';
+import babelParser from '@babel/eslint-parser';
+
+export default [
+  js.configs.recommended,
+  reactNative,
+  reactRecommended,
+  {
+    files: ['**/*.{js,jsx,ts,tsx}'],
+    languageOptions: {
+      parser: babelParser,
+      parserOptions: {
+        ecmaVersion: 'latest',
+        sourceType: 'module',
+        ecmaFeatures: {
+          jsx: true,
+        },
+      },
+      globals: {
+        ...globals.browser,
+        ...globals.jest,
+        __DEV__: 'readonly',
+        device: 'readonly',
+        element: 'readonly',
+        by: 'readonly',
+        driver: 'readonly',
+        $: 'readonly',
+        $$: 'readonly',
+      },
+    },
+    plugins: {
+      import: importPlugin,
+      '@metamask/design-tokens': metamaskDesignTokens,
+    },
+    rules: {
+      'no-console': ['error', { allow: ['warn', 'error'] }],
+      'quotes': ['error', 'single', { avoidEscape: true, allowTemplateLiterals: true }],
+      'import/no-extraneous-dependencies': ['error', { packageDir: ['./'] }],
+      'react-native/no-color-literals': 'error',
+      'react-native/no-inline-styles': 'error',
+      'react-native/split-platform-components': 'error',
+      '@metamask/design-tokens/color-no-hex': 'warn',
+      'no-shadow': 'off',
+      'no-bitwise': 'off',
+      'class-methods-use-this': 'off',
+      'import/no-named-as-default': 'off',
+      'no-invalid-this': 'off',
+      'no-new': 'off',
+      'react/jsx-handler-names': 'off',
+      'react/no-did-mount-set-state': 'off',
+      'react/prefer-stateless-function': 'off',
+      'array-callback-return': 'error',
+      'arrow-body-style': 'error',
+      'dot-notation': 'error',
+      'eqeqeq': 'error',
+      'import/no-amd': 'error',
+      'import/no-commonjs': 'error',
+      'import/no-duplicates': 'error',
+      'import/no-mutable-exports': 'error',
+      'import/no-namespace': 'error',
+      'import/no-nodejs-modules': 'error',
+      'import/prefer-default-export': 'error',
+      'no-alert': 'error',
+      'no-else-return': 'error',
+      'no-eval': 'error',
+      'no-extend-native': 'error',
+      'no-extra-bind': 'error',
+      'no-global-assign': 'error',
+      'no-implicit-globals': 'error',
+      'no-implied-eval': 'error',
+      'no-lonely-if': 'error',
+      'no-loop-func': 'error',
+      'no-new-func': 'error',
+      'no-new-wrappers': 'error',
+      'no-proto': 'error',
+      'no-script-url': 'error',
+      'no-self-compare': 'error',
+      'no-throw-literal': 'error',
+      'no-unmodified-loop-condition': 'error',
+      'no-unneeded-ternary': ['error', { defaultAssignment: false }],
+      'no-unsafe-negation': 'error',
+      'no-unused-expressions': 'off',
+      'no-use-before-define': ['error', 'nofunc'],
+      'no-useless-call': 'error',
+      'no-useless-computed-key': 'error',
+      'no-useless-concat': 'error',
+      'no-useless-constructor': 'error',
+      'no-useless-rename': 'error',
+      'no-var': 'error',
+      'no-with': 'error',
+      'object-shorthand': 'error',
+      'operator-assignment': 'error',
+      'prefer-arrow-callback': 'error',
+      'prefer-const': 'error',
+      'prefer-rest-params': 'error',
+      'prefer-spread': 'error',
+      'import/no-unresolved': 'error',
+      'react/jsx-boolean-value': 'error',
+      'react/jsx-key': 'warn',
+      'react/jsx-pascal-case': 'error',
+      'react/jsx-wrap-multilines': 'error',
+      'react/no-danger': 'error',
+      'react/no-did-update-set-state': 'error',
+      'react/no-find-dom-node': 'error',
+      'react/no-multi-comp': ['error', { ignoreStateless: true }],
+      'react/no-render-return-value': 'error',
+      'react/no-string-refs': 'error',
+      'react/prefer-es6-class': 'error',
+    },
+  },
+  {
+    files: ['**/*.{ts,tsx}'],
+    extends: ['@metamask/eslint-config-typescript'],
+    rules: {
+      '@typescript-eslint/no-explicit-any': 'error',
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          vars: 'all',
+          args: 'all',
+          argsIgnorePattern: '[_]+',
+          ignoreRestSiblings: true,
+        },
+      ],
+    },
+  },
+  {
+    files: ['scripts/**/*.js'],
+    rules: {
+      'no-console': 'off',
+      'import/no-commonjs': 'off',
+      'import/no-nodejs-modules': 'off',
+    },
+  },
+  {
+    files: ['**/*.test.{js,ts,tsx}', '**/*.stories.{js,ts,tsx}'],
+    rules: {
+      '@metamask/design-tokens/color-no-hex': 'off',
+    },
+  },
+];

package.json

@@ -445,7 +445,7 @@
     "enzyme": "3.9.0",
     "enzyme-adapter-react-16": "1.10.0",
     "enzyme-to-json": "3.3.5",
-    "eslint": "^7.23.0",
+    "eslint": "^9.9.0",
     "eslint-config-prettier": "^8.1.0",
     "eslint-import-resolver-typescript": "^3.5.3",
     "eslint-plugin-import": "^2.27.5",
@@ -584,4 +584,4 @@
     }
   },
   "packageManager": "yarn@1.22.22"
-}
+}