Merge pull request #5700 from logto-io/gao-add-eslint-rule

chore(console): restrict route component in pages

packages/console/.eslintrc.cjs

@@ -0,0 +1,53 @@
+// eslint-disable-next-line import/no-extraneous-dependencies -- a transitive dependency of @silverhand/eslint-config
+const xo = require('eslint-config-xo');
+
+/** @type {import('eslint').Linter.Config} */
+module.exports = {
+  extends: '@silverhand/react',
+  parserOptions: {
+    project: ['./tsconfig.json', './tsconfig.scripts.gen.json'],
+  },
+  rules: {
+    'react/function-component-definition': [
+      'error',
+      {
+        namedComponents: 'function-declaration',
+        unnamedComponents: 'arrow-function',
+      },
+    ],
+    'import/no-unused-modules': [
+      'error',
+      {
+        unusedExports: true,
+      },
+    ],
+  },
+  overrides: [
+    {
+      files: [
+        '*.d.ts',
+        '**/assets/docs/guides/types.ts',
+        '**/assets/docs/guides/*/index.ts',
+        '**/assets/docs/guides/*/components/**/*.tsx',
+        '**/mdx-components*/*/index.tsx',
+      ],
+      rules: {
+        'import/no-unused-modules': 'off',
+      },
+    },
+    {
+      files: ['src/pages/**/*.tsx'],
+      rules: {
+        'no-restricted-imports': [
+          ...xo.rules['no-restricted-imports'],
+          {
+            name: 'react-router-dom',
+            importNames: ['Route', 'Routes'],
+            message:
+              "Don't use `Route` or `Routes` in pages, add routes to `src/hooks/use-console-routes` instead.",
+          },
+        ],
+      },
+    },
+  ],
+};

packages/console/package.json

@@ -142,44 +142,6 @@
     "@cloud/*": "./src/cloud/$1",
     "@mdx/components/*": "./src/mdx-components/$1"
   },
-  "eslintConfig": {
-    "extends": "@silverhand/react",
-    "parserOptions": {
-      "project": [
-        "./tsconfig.json",
-        "./tsconfig.scripts.gen.json"
-      ]
-    },
-    "rules": {
-      "react/function-component-definition": [
-        "error",
-        {
-          "namedComponents": "function-declaration",
-          "unnamedComponents": "arrow-function"
-        }
-      ],
-      "import/no-unused-modules": [
-        "error",
-        {
-          "unusedExports": true
-        }
-      ]
-    },
-    "overrides": [
-      {
-        "files": [
-          "*.d.ts",
-          "**/assets/docs/guides/types.ts",
-          "**/assets/docs/guides/*/index.ts",
-          "**/assets/docs/guides/*/components/**/*.tsx",
-          "**/mdx-components*/*/index.tsx"
-        ],
-        "rules": {
-          "import/no-unused-modules": "off"
-        }
-      }
-    ]
-  },
   "stylelint": {
     "extends": "@silverhand/eslint-config-react/.stylelintrc"
   },

packages/console/src/pages/ApiResourceDetails/index.tsx

@@ -6,6 +6,8 @@ import classNames from 'classnames';
 import { useEffect, useState } from 'react';
 import { toast } from 'react-hot-toast';
 import { Trans, useTranslation } from 'react-i18next';
+// FIXME: @yijun
+// eslint-disable-next-line no-restricted-imports
 import { Navigate, Route, Routes, useLocation, useParams } from 'react-router-dom';
 import useSWR from 'swr';
 

packages/console/src/pages/OrganizationDetails/index.tsx

@@ -1,6 +1,8 @@
 import { type Organization } from '@logto/schemas';
 import { useCallback, useState } from 'react';
 import { useTranslation } from 'react-i18next';
+// FIXME: @gao
+// eslint-disable-next-line no-restricted-imports
 import { Navigate, Route, Routes, useParams } from 'react-router-dom';
 import useSWR from 'swr';
 

packages/console/src/pages/OrganizationRoleDetails/index.tsx

@@ -3,6 +3,8 @@ import { type OrganizationRole } from '@logto/schemas';
 import { useState } from 'react';
 import { toast } from 'react-hot-toast';
 import { useTranslation } from 'react-i18next';
+// FIXME: @yijun
+// eslint-disable-next-line no-restricted-imports
 import { Navigate, Route, Routes, useParams } from 'react-router-dom';
 import useSWR, { useSWRConfig } from 'swr';
 

packages/console/src/pages/Organizations/Guide/index.tsx

@@ -1,5 +1,7 @@
 import { useCallback } from 'react';
 import Modal from 'react-modal';
+// FIXME: @charles
+// eslint-disable-next-line no-restricted-imports
 import { Navigate, Route, Routes } from 'react-router-dom';
 
 import DsModalHeader from '@/ds-components/ModalHeader';

packages/console/src/pages/TenantSettings/TenantMembers/index.tsx

@@ -1,5 +1,7 @@
 import classNames from 'classnames';
 import { useContext, useState } from 'react';
+// FIXME: @charles
+// eslint-disable-next-line no-restricted-imports
 import { Route, Routes } from 'react-router-dom';
 import useSWRMutation from 'swr/mutation';