[core] Add eslint rule to restrict import from ../internals root (#…

…13633)
mui · Jun 27, 2024 · 7f390b4 · 7f390b4
1 parent 2375a65
commit 7f390b4
Show file tree

Hide file tree

Showing 4 changed files with 38 additions and 23 deletions.
diff --git a/.eslintrc.js b/.eslintrc.js
@@ -1,6 +1,19 @@
 const baseline = require('@mui/monorepo/.eslintrc');
 const path = require('path');
 
+const chartsPackages = ['x-charts', 'x-charts-pro'];
+
+const dataGridPackages = [
+  'x-data-grid',
+  'x-data-grid-pro',
+  'x-data-grid-premium',
+  'x-data-grid-generator',
+];
+
+const datePickersPackages = ['x-date-pickers', 'x-date-pickers-pro'];
+
+const treeViewPackages = ['x-tree-view', 'x-tree-view-pro'];
+
 // Enable React Compiler Plugin rules globally
 const ENABLE_REACT_COMPILER_PLUGIN = process.env.ENABLE_REACT_COMPILER_PLUGIN ?? false;
 
@@ -139,6 +152,18 @@ module.exports = {
     ...(ENABLE_REACT_COMPILER_PLUGIN ? { 'react-compiler/react-compiler': 'error' } : {}),
     // TODO move to @mui/monorepo/.eslintrc, codebase is moving away from default exports
     'import/prefer-default-export': 'off',
+    'import/no-restricted-paths': [
+      'error',
+      {
+        zones: [...chartsPackages, ...datePickersPackages, ...treeViewPackages].map(
+          (packageName) => ({
+            target: `./packages/${packageName}/src/**/!(*.test.*|*.spec.*)`,
+            from: `./packages/${packageName}/src/internals/index.ts`,
+            message: `Use a more specific import instead. E.g. import { MyInternal } from '../internals/MyInternal';`,
+          }),
+        ),
+      },
+    ],
     // TODO move rule into the main repo once it has upgraded
     '@typescript-eslint/return-await': 'off',
     'no-restricted-imports': 'off',
@@ -167,7 +192,7 @@ module.exports = {
     // TODO move to @mui/monorepo/.eslintrc
     // TODO Fix <Input> props names to not conflict
     'react/jsx-no-duplicate-props': [1, { ignoreCase: false }],
-    // TOOD move to @mui/monorepo/.eslintrc, these are false positive
+    // TODO move to @mui/monorepo/.eslintrc, these are false positive
     'react/no-unstable-nested-components': ['error', { allowAsProps: true }],
   },
   overrides: [
@@ -257,18 +282,9 @@ module.exports = {
     ...buildPackageRestrictedImports('@mui/x-tree-view-pro', 'x-tree-view-pro', false),
     ...buildPackageRestrictedImports('@mui/x-license', 'x-license'),
 
-    ...addReactCompilerRule(['x-charts', 'x-charts-pro'], ENABLE_REACT_COMPILER_PLUGIN_CHARTS),
-    ...addReactCompilerRule(
-      ['x-data-grid', 'x-data-grid-pro', 'x-data-grid-premium', 'x-data-grid-generator'],
-      ENABLE_REACT_COMPILER_PLUGIN_DATA_GRID,
-    ),
-    ...addReactCompilerRule(
-      ['x-date-pickers', 'x-date-pickers-pro'],
-      ENABLE_REACT_COMPILER_PLUGIN_DATE_PICKERS,
-    ),
-    ...addReactCompilerRule(
-      ['x-tree-view', 'x-tree-view-pro'],
-      ENABLE_REACT_COMPILER_PLUGIN_TREE_VIEW,
-    ),
+    ...addReactCompilerRule(chartsPackages, ENABLE_REACT_COMPILER_PLUGIN_CHARTS),
+    ...addReactCompilerRule(dataGridPackages, ENABLE_REACT_COMPILER_PLUGIN_DATA_GRID),
+    ...addReactCompilerRule(datePickersPackages, ENABLE_REACT_COMPILER_PLUGIN_DATE_PICKERS),
+    ...addReactCompilerRule(treeViewPackages, ENABLE_REACT_COMPILER_PLUGIN_TREE_VIEW),
   ],
 };
diff --git a/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx b/packages/x-date-pickers/src/DateTimePicker/DateTimePickerToolbar.tsx
@@ -20,7 +20,7 @@ import { MULTI_SECTION_CLOCK_SECTION_WIDTH } from '../internals/constants/dimens
 import { formatMeridiem } from '../internals/utils/date-utils';
 import { MakeOptional } from '../internals/models/helpers';
 import { pickersToolbarTextClasses } from '../internals/components/pickersToolbarTextClasses';
-import { pickersToolbarClasses } from '../internals';
+import { pickersToolbarClasses } from '../internals/components/pickersToolbarClasses';
 import { PickerValidDate } from '../models';
 
 export interface ExportedDateTimePickerToolbarProps extends ExportedBaseToolbarProps {

diff --git a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePicker.tsx
@@ -28,19 +28,18 @@ import {
   renderDigitalClockTimeView,
   renderMultiSectionDigitalClockTimeView,
 } from '../timeViewRenderers';
-import {
-  DefaultizedProps,
-  UsePickerViewsProps,
-  VIEW_HEIGHT,
-  isDatePickerView,
-  isInternalTimeView,
-} from '../internals';
+
 import {
   multiSectionDigitalClockClasses,
   multiSectionDigitalClockSectionClasses,
 } from '../MultiSectionDigitalClock';
 import { digitalClockClasses } from '../DigitalClock';
 import { DesktopDateTimePickerLayout } from './DesktopDateTimePickerLayout';
+import { VIEW_HEIGHT } from '../internals/constants/dimensions';
+import { DefaultizedProps } from '../internals/models/helpers';
+import { UsePickerViewsProps } from '../internals/hooks/usePicker/usePickerViews';
+import { isInternalTimeView } from '../internals/utils/time-utils';
+import { isDatePickerView } from '../internals/utils/date-utils';
 
 const rendererInterceptor = function rendererInterceptor<
   TDate extends PickerValidDate,

diff --git a/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePickerLayout.tsx b/packages/x-date-pickers/src/DesktopDateTimePicker/DesktopDateTimePickerLayout.tsx
@@ -11,7 +11,7 @@ import {
   usePickerLayout,
 } from '../PickersLayout';
 import { PickerValidDate } from '../models';
-import { DateOrTimeViewWithMeridiem } from '../internals';
+import { DateOrTimeViewWithMeridiem } from '../internals/models/common';
 
 /**
  * @ignore - internal component.