Merge pull request #19534 from mozilla/fix-fxa-react-eslint

dschom · web-flow · commit 2c68942e2e42 · 2025-10-02T12:56:01.000-07:00
polish(fxa-react): Fix eslint in fxa-react
diff --git a/packages/fxa-react/.eslintrc.json b/packages/fxa-react/.eslintrc.json
@@ -1,24 +1,38 @@
 {
-  "extends": ["plugin:fxa/recommended"],
-  "plugins": ["fxa"],
-  "parserOptions": {
-    "ecmaVersion": "2020",
-    "sourceType": "module"
-  },
-  "env": {
-    "browser": true,
-    "jest": true
-  },
+  "root": true,
+  "extends": ["react-app", "react-app/jest"],
+  "plugins": ["header"],
   "rules": {
-    "require-atomic-updates": "off",
-    "space-unary-ops": "off",
-    "no-useless-escape": "off"
+    "import/export": "error",
+    "import/named": "off",
+    "import/no-deprecated": "error",
+    "import/no-named-as-default-member": "off",
+    "import/no-unresolved": "off",
+    "jest/no-jest-import": "off",
+    "jest/valid-describe": "off",
+    "testing-library/no-wait-for-multiple-assertions": "off",
+    "testing-library/no-render-in-setup": "off",
+    "testing-library/prefer-find-by": "off",
+    "testing-library/no-wait-for-side-effects": "off",
+    "testing-library/prefer-presence-queries": "off",
+    "testing-library/no-node-access": "off",
+    "testing-library/render-result-naming-convention": "off",
+    "testing-library/prefer-screen-queries": "off",
+    "testing-library/no-unnecessary-act": "off",
+    "testing-library/no-container": "off",
+    "header/header": [
+      2, "block",
+      " This Source Code Form is subject to the terms of the Mozilla Public\n * License, v. 2.0. If a copy of the MPL was not distributed with this\n * file, You can obtain one at http://mozilla.org/MPL/2.0/. "
+    ]
   },
-  "ignorePatterns": [
-    "dist",
-    "node_modules",
-    "pm2.config.js",
-    "storybook-static"
+  "overrides": [
+    {
+      "files": ["*.ts", "*.tsx"],
+      "rules": {
+        "no-unused-vars": "off",
+        "@typescript-eslint/no-unused-vars": "error"
+      }
+    }
   ],
-  "root": true
+  "ignorePatterns": ["build/", "scripts/build.js", "dist/"]
 }
diff --git a/packages/fxa-react/Gruntfile.js b/packages/fxa-react/Gruntfile.js
@@ -2,8 +2,6 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-'use strict';
-
 module.exports = function (grunt) {
   const srcPaths = [
     'components/**/*.ftl',
diff --git a/packages/fxa-react/components/AppErrorDialog/index.stories.tsx b/packages/fxa-react/components/AppErrorDialog/index.stories.tsx
@@ -1,3 +1,7 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import AppErrorDialog from './index';
diff --git a/packages/fxa-react/components/AppErrorDialog/index.tsx b/packages/fxa-react/components/AppErrorDialog/index.tsx
@@ -2,7 +2,7 @@
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-import React, { ReactNode } from 'react';
+import React from 'react';
 import { Localized } from '@fluent/react';
 
 export type ErrorType = 'general' | 'query-parameter-violation';
diff --git a/packages/fxa-react/components/Header/index.stories.tsx b/packages/fxa-react/components/Header/index.stories.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import { Header } from './index';
diff --git a/packages/fxa-react/components/LinkExternal/index.stories.tsx b/packages/fxa-react/components/LinkExternal/index.stories.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import LinkExternal from './index';
diff --git a/packages/fxa-react/components/LoadingSpinner/index.stories.tsx b/packages/fxa-react/components/LoadingSpinner/index.stories.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import { storiesOf } from '@storybook/react';
 import LoadingSpinner, { SpinnerType } from './index';
diff --git a/packages/fxa-react/components/LoadingSpinner/index.test.tsx b/packages/fxa-react/components/LoadingSpinner/index.test.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import { screen } from '@testing-library/react';
 
@@ -30,7 +33,7 @@ it('renders blue spinner as expected', () => {
   expect(spinnerType).toBeInTheDocument();
 });
 
-it('renders blue spinner as expected', () => {
+it('renders white spinner as expected', () => {
   renderWithLocalizationProvider(
     <LoadingSpinner spinnerType={SpinnerType.White} />
   );
diff --git a/packages/fxa-react/components/LoadingSpinner/index.tsx b/packages/fxa-react/components/LoadingSpinner/index.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import { useLocalization } from '@fluent/react';
 import React from 'react';
 import classNames from 'classnames';
diff --git a/packages/fxa-react/components/LogoLockup/index.test.tsx b/packages/fxa-react/components/LogoLockup/index.test.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import LogoLockup from '.';
 import { renderWithLocalizationProvider } from '../../lib/test-utils/localizationProvider';
diff --git a/packages/fxa-react/components/Portal/index.test.tsx b/packages/fxa-react/components/Portal/index.test.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import Portal from './index';
diff --git a/packages/fxa-react/components/Portal/index.tsx b/packages/fxa-react/components/Portal/index.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React, { memo, useEffect } from 'react';
 import { createPortal } from 'react-dom';
 
diff --git a/packages/fxa-react/extract-imported-components.js b/packages/fxa-react/extract-imported-components.js
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 const { readdirSync, readFileSync, statSync } = require('fs');
 const { resolve } = require('path');
 
diff --git a/packages/fxa-react/lib/hooks.stories.tsx b/packages/fxa-react/lib/hooks.stories.tsx
@@ -1,3 +1,6 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 import React, { useCallback } from 'react';
 import { storiesOf } from '@storybook/react';
 import { useAwait, PromiseState } from './hooks';
@@ -43,10 +46,10 @@ const UseAwaitExample = ({
     executeImmediately,
     initialState,
   });
-  const executeWithApiUrl = useCallback(() => apiExecute(apiUrl), [
-    apiUrl,
-    apiExecute,
-  ]);
+  const executeWithApiUrl = useCallback(
+    () => apiExecute(apiUrl),
+    [apiUrl, apiExecute]
+  );
 
   const buttonClassNames = 'mr-1 py-1 px-2 bg-grey-100 border-grey-600';
   return (
diff --git a/packages/fxa-react/lib/hooks.test.tsx b/packages/fxa-react/lib/hooks.test.tsx
@@ -107,7 +107,7 @@ describe('useAwait', () => {
       } catch (e) {
         setThrownState(e);
       }
-    }, [execute]);
+    }, [execute, fnArgs]);
     return (
       <div>
         {state.pending && <div data-testid="pending">pending</div>}
@@ -187,9 +187,7 @@ describe('useAwait', () => {
     const fn = async () => {
       throw expectedError;
     };
-    const { findByTestId, getByTestId, debug } = render(
-      <Subject {...{ fn }} />
-    );
+    const { findByTestId, getByTestId } = render(<Subject {...{ fn }} />);
     expect(parseState(getByTestId)).toEqual({
       pending: undefined,
       result: undefined,
@@ -213,7 +211,7 @@ describe('useAwait', () => {
     const fn = async () => {
       throw expectedError;
     };
-    const { findByTestId, getByTestId, debug } = render(
+    const { findByTestId, getByTestId } = render(
       <Subject {...{ fn, rethrowError: true }} />
     );
     expect(parseState(getByTestId)).toEqual({
@@ -251,12 +249,9 @@ describe('useAwait', () => {
   });
 
   it('does not re-execute when a promise is already pending', async () => {
-    const expectedError = 'oops!';
     let count = 0;
     const fn = async () => `count: ${++count}`;
-    const { findByTestId, getByTestId, debug } = render(
-      <Subject {...{ fn }} />
-    );
+    const { findByTestId, getByTestId } = render(<Subject {...{ fn }} />);
     expect(parseState(getByTestId)).toEqual({
       pending: undefined,
       result: undefined,
diff --git a/packages/fxa-react/lib/test-utils/index.test.tsx b/packages/fxa-react/lib/test-utils/index.test.tsx
@@ -208,7 +208,7 @@ describe('testL10n', () => {
       expect(() => {
         ftlMsgResolver.getMsg('test-straight-quote', `"please, don’t go"`);
       }).toThrow(
-        `Fluent message contains a straight quote (") and must be updated to its curly equivalent (“”). Fluent message: \"please, don’t go\"`
+        `Fluent message contains a straight quote (") and must be updated to its curly equivalent (“”). Fluent message: "please, don’t go"`
       );
     });
 
diff --git a/packages/fxa-react/lib/test-utils/localizationProvider.tsx b/packages/fxa-react/lib/test-utils/localizationProvider.tsx
@@ -30,5 +30,3 @@ export function withLocalizationProvider(
     </AppLocalizationProvider>
   );
 }
-
-export default { renderWithLocalizationProvider, withLocalizationProvider };
diff --git a/packages/fxa-react/lib/utils.tsx b/packages/fxa-react/lib/utils.tsx
@@ -278,6 +278,7 @@ function _checkPattern(
  */
 function _clean(msg: string) {
   return msg.replace(
+    // eslint-disable-next-line
     /[\u0000-\u001F\u007F-\u009F\u061C\u200E\u200F\u202A-\u202E\u2066-\u2069]/g,
     ''
   );
