Browse Source

chore(ui): Re-enable restricted import lint rules (#76465)

Scott Cooper 6 months ago
parent
commit
a6da828d22

+ 55 - 0
.eslintrc.js

@@ -35,6 +35,61 @@ module.exports = {
             message: 'Do not depend on toolbar internals',
           },
         ],
+        paths: [
+          {
+            name: '@testing-library/react',
+            message:
+              'Please import from `sentry-test/reactTestingLibrary` instead so that we can ensure consistency throughout the codebase',
+          },
+          {
+            name: '@testing-library/react-hooks',
+            message:
+              'Please import from `sentry-test/reactTestingLibrary` instead so that we can ensure consistency throughout the codebase',
+          },
+          {
+            name: '@testing-library/user-event',
+            message:
+              'Please import from `sentry-test/reactTestingLibrary` instead so that we can ensure consistency throughout the codebase',
+          },
+          {
+            name: '@sentry/browser',
+            message:
+              'Please import from `@sentry/react` to ensure consistency throughout the codebase.',
+          },
+          {
+            name: 'marked',
+            message:
+              "Please import marked from 'app/utils/marked' so that we can ensure sanitation of marked output",
+          },
+          {
+            name: 'lodash',
+            message:
+              "Please import lodash utilities individually. e.g. `import isEqual from 'lodash/isEqual';`. See https://github.com/getsentry/frontend-handbook#lodash from for information",
+          },
+          {
+            name: 'lodash/get',
+            message:
+              'Optional chaining `?.` and nullish coalescing operators `??` are available and preferred over using `lodash/get`. See https://github.com/getsentry/frontend-handbook#new-syntax for more information',
+          },
+          {
+            name: 'sentry/utils/theme',
+            importNames: ['lightColors', 'darkColors'],
+            message:
+              "'lightColors' and 'darkColors' exports intended for use in Storybook only. Instead, use theme prop from emotion or the useTheme hook.",
+          },
+          {
+            name: 'react-router',
+            importNames: ['withRouter'],
+            message:
+              "Use 'useLocation', 'useParams', 'useNavigate', 'useRoutes' from sentry/utils instead.",
+          },
+          {
+            name: 'sentry/utils/withSentryRouter',
+            importNames: ['withSentryRouter'],
+            message:
+              "Use 'useLocation', 'useParams', 'useNavigate', 'useRoutes' from sentry/utils instead.",
+          },
+        ],
       },
     ],
 

+ 1 - 1
static/app/components/feedback/feedbackSearch.tsx

@@ -1,7 +1,7 @@
 import type {CSSProperties} from 'react';
 import {useCallback, useMemo} from 'react';
 import styled from '@emotion/styled';
-import {orderBy} from 'lodash';
+import orderBy from 'lodash/orderBy';
 
 import {fetchTagValues, useFetchOrganizationTags} from 'sentry/actionCreators/tags';
 import {SearchQueryBuilder} from 'sentry/components/searchQueryBuilder';

+ 1 - 1
static/app/views/issueList/customViewsHeader.tsx

@@ -1,7 +1,7 @@
 import {useEffect, useMemo, useState} from 'react';
 import type {InjectedRouter} from 'react-router';
 import styled from '@emotion/styled';
-import {debounce} from 'lodash';
+import debounce from 'lodash/debounce';
 
 import GlobalEventProcessingAlert from 'sentry/components/globalEventProcessingAlert';
 import * as Layout from 'sentry/components/layouts/thirds';

+ 1 - 1
static/app/views/profiling/landing/slowestFunctionsTable.tsx

@@ -1,6 +1,6 @@
 import {Fragment, useCallback, useMemo, useState} from 'react';
 import styled from '@emotion/styled';
-import {clamp} from 'lodash';
+import clamp from 'lodash/clamp';
 
 import {Button} from 'sentry/components/button';
 import ButtonBar from 'sentry/components/buttonBar';

+ 1 - 1
static/app/views/settings/account/accountDetails.tsx

@@ -1,5 +1,5 @@
 import {Fragment} from 'react';
-import {cloneDeep} from 'lodash';
+import cloneDeep from 'lodash/cloneDeep';
 
 import {updateUser} from 'sentry/actionCreators/account';
 import AvatarChooser from 'sentry/components/avatarChooser';