Fix most linter warnings. (#853)

* Add back type checking and fix errors.

* Fix most linter warnings.

* Fix glob pattern and more things.

* Fix prettier formatting too.

* Fix disabled button test.

Author: yuchenshi

.eslintrc.js

@@ -22,9 +22,10 @@ module.exports = {
     'plugin:jest/recommended',
     'plugin:react-hooks/recommended',
   ],
-  plugins: ['jest'],
+  plugins: ['jest', 'unused-imports'],
   rules: {
     'jest/no-jasmine-globals': 'error',
+    'unused-imports/no-unused-imports-ts': 'error',
     'no-restricted-globals': [
       'error',
       {

package-lock.json

@@ -87,8 +87,8 @@
     "test:debug": "react-scripts --inspect-brk test --env=./custom-jest-environment.js --runInBand",
     "test:coverage": "react-scripts test --coverage --watchAll=false --env=./custom-jest-environment.js",
     "eject": "react-scripts eject",
-    "lint": "prettier --check . && eslint 'src/**/*.{ts,tsx}'",
-    "lint:fix": "eslint --fix 'src/**/*.{ts,tsx}' && npm run format",
+    "lint": "prettier --check . && eslint --ext .js,.jsx,.ts,.tsx src/",
+    "lint:fix": "eslint --ext .js,.jsx,.ts,.tsx src/ && npm run format",
     "fmt": "npm run format",
     "format": "prettier --write .",
     "prepare": "husky install"
@@ -122,6 +122,7 @@
     "confusing-browser-globals": "^1.0.11",
     "eslint-plugin-jest": "^23.11.0",
     "eslint-plugin-react-hooks": "^4.0.0",
+    "eslint-plugin-unused-imports": "^2.0.0",
     "globalthis": "^1.0.1",
     "husky": "^8.0.0",
     "import-sort-config": "^6.0.0",

package.json

@@ -13,9 +13,10 @@
  * See the License for the specific language governing permissions and
  * limitations under the License.
  */
+const React = require('react');
 
 function ReactMarkdown({ children }) {
-  return <>Markdown: {children}</>;
+  return React.createElement(React.Fragment, {}, 'Markdown: ', children);
 }
 
 export default ReactMarkdown;

src/__mocks__/react-markdown.js

@@ -15,9 +15,7 @@
  */
 
 import { fireEvent, render } from '@testing-library/react';
-import { createMemoryHistory } from 'history';
 import React from 'react';
-import ReactDOM from 'react-dom';
 import { act } from 'react-dom/test-utils';
 import { BrowserRouter } from 'react-router-dom';
 

src/components/App/index.test.tsx

@@ -18,9 +18,7 @@ import { Portal } from '@rmwc/base';
 import { fireEvent, render } from '@testing-library/react';
 import React from 'react';
 import { Provider } from 'react-redux';
-import configureStore from 'redux-mock-store';
 
-import { AppState } from '../../../store';
 import { waitForDialogsToOpen } from '../../../test_utils';
 import { getMockAuthStore } from '../test_utils';
 import {

src/components/Auth/OneAccountPerEmailCard/OneAccountPerEmailCard.test.tsx

@@ -147,11 +147,11 @@ export const UserForm: React.FC<React.PropsWithChildren<UserFormProps>> = ({
   const {
     register,
     handleSubmit,
-    formState: { errors, isValid },
+    formState: { errors },
     reset,
   } = form;
 
-  // FIXME: Should be able to just check isValid, instead of checking
+  // FIXME: Should be able to just check form.isValid, instead of checking
   // that there are no errors. This only happens when `atLeastOneMethodRequired`
   // is the only error present and is causing the "Save" and "Save and create
   // another" buttons to remain enabled even when neither email/password or

src/components/Auth/UserFormDialog/UserForm.tsx

@@ -14,8 +14,6 @@
  * limitations under the License.
  */
 
-import React from 'react';
-
 import { wrapWithForm } from '../../../../test_utils';
 import { CustomAttributes } from './CustomAttributes';
 
@@ -60,7 +58,7 @@ describe('CustomAttributes', () => {
   });
 
   it('displays an error if a forbidden key was used', async () => {
-    const { triggerValidation, getByRole, getByText } = setup(
+    const { triggerValidation, getByRole } = setup(
       '{"firebase": "is awesome"}'
     );
     await triggerValidation();

src/components/Auth/UserFormDialog/controls/CustomAttributes.test.tsx

@@ -14,7 +14,6 @@
  * limitations under the License.
  */
 
-import React from 'react';
 import { act } from 'react-dom/test-utils';
 
 import { wrapWithForm } from '../../../../test_utils';
@@ -51,7 +50,7 @@ describe('ImageUrlInput', () => {
       });
 
       await triggerValidation();
-      getByText('Error loading image');
+      expect(getByText('Error loading image')).not.toBeNull();
     });
 
     it('displays an image if image loaded', async () => {
@@ -64,13 +63,13 @@ describe('ImageUrlInput', () => {
       });
 
       await triggerValidation();
-      getByAltText('Profile preview');
+      expect(getByAltText('Profile preview')).not.toBeNull();
     });
 
     it('displays loading spinner', async () => {
       const { getByTestId, triggerValidation } = setup({ photoUrl: 'lol.png' });
       await triggerValidation();
-      getByTestId('spinner');
+      expect(getByTestId('spinner')).not.toBeNull();
     });
 
     it('displays nothing if there is no image', async () => {

src/components/Auth/UserFormDialog/controls/ImageUrlInput.test.tsx

@@ -15,7 +15,6 @@
  */
 
 import { fireEvent } from '@testing-library/react';
-import React from 'react';
 
 import { wrapWithForm } from '../../../../test_utils';
 import { PhoneControl, PhoneControlProps } from './PhoneControl';