Linting fixes (main process & scripts)

.babelrc.json

@@ -8,7 +8,12 @@
         }
       }
     ],
-    "@babel/preset-react",
+    [
+      "@babel/preset-react",
+      {
+        "runtime": "automatic"
+      }
+    ],
     "@babel/preset-typescript"
   ],
   "plugins": [

.lintstagedrc.json

@@ -1,3 +1,4 @@
 {
-  "**/*.{yml,json,md,html,ts,js}": "prettier --check"
+  "**/*.{yml,json,md,html,ts,js}": "prettier --check",
+  "**/*.{ts,tsx,js,jsx}": "eslint --quiet --fix"
 }

@types/frame/index.d.ts

@@ -1,3 +1,4 @@
+/* eslint-disable @typescript-eslint/triple-slash-reference */
 /// <reference path="./environment.d.ts" />
 /// <reference path="./rpc.d.ts" />
 /// <reference path="./restore.d.ts" />

@types/frame/state.d.ts

@@ -86,11 +86,6 @@ interface GasLevels {
 
 type HexAmount = string
 
-enum Colorway {
-  light = 'light',
-  dark = 'dark'
-}
-
 type Color = { r: number; g: number; b: number }
 type ColorwayPalette = {
   accent1: Color

app/dapp/index.js

@@ -1,5 +1,4 @@
 import * as Sentry from '@sentry/electron'
-import React from 'react'
 import { createRoot } from 'react-dom/client'
 import Restore from 'react-restore'
 
@@ -16,7 +15,7 @@ document.addEventListener('drop', (e) => e.preventDefault())
 if (process.env.NODE_ENV !== 'development') {
   window.eval = global.eval = () => {
     throw new Error(`This app does not support window.eval()`)
-  } // eslint-disable-line
+  }
 }
 
 function AppComponent() {

app/dash/Accounts/Add/index.js

@@ -1,5 +1,3 @@
-/* globals Worker */
-
 import React from 'react'
 import Restore from 'react-restore'
 import { Transition } from 'react-transition-group'

app/dash/Accounts/Add/particleWorker.js

@@ -1,5 +1,3 @@
-/* globals self */
-
 let canvas, ctx, looper
 const particles = []
 const particleCount = 56

app/dash/Signer/index.js

@@ -495,7 +495,7 @@ class Signer extends React.Component {
           <></>
         )}
         <div className='signerControls'>
-          {!!permissionId ? (
+          {permissionId ? (
             <div className='signerControlDetail'>
               <div className='signerControlDetailKey'>{'PERMISSION ID:'}</div>
               <div className='signerControlDetailValue'>{permissionId}</div>

app/dash/index.js

@@ -1,5 +1,4 @@
 import * as Sentry from '@sentry/electron'
-import React from 'react'
 import { createRoot } from 'react-dom/client'
 import Restore from 'react-restore'
 
@@ -16,7 +15,7 @@ document.addEventListener('drop', (e) => e.preventDefault())
 if (process.env.NODE_ENV !== 'development') {
   window.eval = global.eval = () => {
     throw new Error(`This app does not support window.eval()`)
-  } // eslint-disable-line
+  }
 }
 
 function AppComponent() {

app/onboard/index.js

@@ -1,5 +1,4 @@
 import * as Sentry from '@sentry/electron'
-import React from 'react'
 import { createRoot } from 'react-dom/client'
 import Restore from 'react-restore'
 
@@ -16,7 +15,7 @@ document.addEventListener('drop', (e) => e.preventDefault())
 if (process.env.NODE_ENV !== 'development') {
   window.eval = global.eval = () => {
     throw new Error(`This app does not support window.eval()`)
-  } // eslint-disable-line
+  }
 }
 
 function AppComponent() {

app/store.js

@@ -1,5 +1,3 @@
-/* globals */
-
 import EventEmitter from 'events'
 import Restore from 'react-restore'
 

app/tray/Account/Balances/index.js

@@ -1,5 +1,3 @@
-/* globals ResizeObserver */
-
 import React from 'react'
 import Restore from 'react-restore'
 

app/tray/Account/Signer/SignerPreview/index.js

@@ -168,7 +168,7 @@ class Signer extends React.Component {
                       this.setState({ notifySuccess: false, notifyText: '' })
                     }, 5000)
                   }
-                  const crumb = !!signer ? signerPanelCrumb(signer) : accountPanelCrumb()
+                  const crumb = signer ? signerPanelCrumb(signer) : accountPanelCrumb()
                   link.send('tray:action', 'navDash', crumb)
                 }}
               >

app/tray/Footer/RequestCommand/index.js

@@ -328,7 +328,7 @@ class RequestCommand extends React.Component {
     const showWarning = !status && mode !== 'monitor'
     const requiredApproval = showWarning && (req.approvals || []).filter((a) => !a.approved)[0]
 
-    if (!!requiredApproval) {
+    if (requiredApproval) {
       return (
         <div className='requestNotice requestNoticeApproval'>
           <div className='requestNoticeInner requestNoticeInnerApproval'>

app/tray/index.js

@@ -1,5 +1,4 @@
 import * as Sentry from '@sentry/electron'
-import React from 'react'
 import { createRoot } from 'react-dom/client'
 import Restore from 'react-restore'
 
@@ -16,7 +15,7 @@ document.addEventListener('drop', (e) => e.preventDefault())
 if (process.env.NODE_ENV !== 'development') {
   window.eval = global.eval = () => {
     throw new Error(`This app does not support window.eval()`)
-  } // eslint-disable-line
+  }
 }
 
 function AppComponent() {

eslint.config.mjs

@@ -0,0 +1,162 @@
+import ts from '@typescript-eslint/eslint-plugin'
+import tsParser from '@typescript-eslint/parser'
+import prettier from 'eslint-config-prettier'
+import react from 'eslint-plugin-react'
+import reactHooks from 'eslint-plugin-react-hooks'
+import testingLibrary from 'eslint-plugin-testing-library'
+import jest from 'eslint-plugin-jest'
+import globals from 'globals'
+
+export default [
+  'eslint:recommended',
+  // Ignored dirs
+  {
+    ignores: ['dist/**/*', 'compiled/**/*', 'bundle/**/*']
+  },
+  // Temporary ignored dirs - TODO: remove on rewrite
+  {
+    ignores: ['main/signers/**/*']
+  },
+  // All files
+  {
+    files: ['**/*.{js,mjs,ts,tsx}'],
+    languageOptions: {
+      ecmaVersion: 'latest',
+      globals: {
+        ...globals.es2021
+      }
+    },
+    rules: {
+      ...prettier.rules,
+      'no-unused-vars': [
+        'error',
+        {
+          args: 'after-used',
+          ignoreRestSiblings: true,
+          argsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_'
+        }
+      ]
+    }
+  },
+  // Main process files and scripts
+  {
+    files: ['**/*.{js,mjs,ts}'],
+    ignores: ['app/**/*', 'resources/Components/**/*'],
+    languageOptions: {
+      globals: {
+        ...globals.node
+      }
+    }
+  },
+  // Renderer process files
+  {
+    files: [
+      'app/**/*.js',
+      'main/dapps/server/inject/*.js',
+      'resources/**/*.{js,ts,tsx}',
+      'test/app/**/*.js',
+      'test/resources/Components/**/*.js'
+    ],
+    languageOptions: {
+      globals: {
+        ...globals.browser,
+        process: true,
+        global: true
+      }
+    }
+  },
+  // TS files
+  {
+    files: ['**/*.{ts,tsx}'],
+    languageOptions: {
+      parser: tsParser,
+      parserOptions: {
+        ecmaFeatures: { modules: true },
+        ecmaVersion: 'latest',
+        project: './tsconfig.json'
+      }
+    },
+    plugins: {
+      '@typescript-eslint': ts
+    },
+    rules: {
+      ...ts.configs['eslint-recommended'].rules,
+      ...ts.configs.recommended.rules,
+      'no-undef': 'off', // redundant - TS will fail to compile with undefined vars
+      '@typescript-eslint/no-unused-vars': [
+        'error',
+        {
+          args: 'after-used',
+          ignoreRestSiblings: true,
+          argsIgnorePattern: '^_',
+          destructuredArrayIgnorePattern: '^_'
+        }
+      ],
+      '@typescript-eslint/no-empty-function': ['error', { allow: ['arrowFunctions'] }], // allow noop arrow functions, e.g. in a method signature for ensuring a parameter defaults to a function
+      '@typescript-eslint/prefer-namespace-keyword': 'off', // use ES module syntax instead of namespace
+      '@typescript-eslint/no-namespace': ['error', { allowDeclarations: true }]
+    }
+  },
+  // React / JSX files
+  // TODO: simplify as '**/*.{jsx,tsx}'
+  {
+    files: [
+      'app/**/*.js',
+      'resources/Components/**/*.js',
+      'resources/Native/**/*.js',
+      'resources/svg/index.js',
+      'test/app/**/*.js',
+      'test/resources/Components/**/*.js',
+      'test/jest.svg.js'
+    ],
+    plugins: {
+      react,
+      'react-hooks': reactHooks
+    },
+    languageOptions: {
+      parserOptions: {
+        ecmaFeatures: {
+          jsx: true
+        }
+      }
+    },
+    settings: {
+      react: {
+        version: 'detect'
+      }
+    },
+    rules: {
+      ...react.configs.recommended.rules,
+      ...react.configs['jsx-runtime'].rules,
+      ...reactHooks.configs.recommended.rules,
+      'react/prop-types': 'off' // all type checking to be done in TS
+    }
+  },
+  // Test files
+  {
+    files: ['test/**/*.js', '**/__mocks__/**/*.js'],
+    plugins: {
+      jest
+    },
+    languageOptions: {
+      globals: {
+        ...globals.jest
+      }
+    }
+    // TODO: enable jest rules
+    // rules: {
+    //   ...jest.configs.recommended.rules
+    // }
+  },
+  // Components test files
+  {
+    files: ['test/app/**/*.js', 'test/resources/Components/**/*.js', 'app/**/__mocks__/**/*.js'],
+    plugins: {
+      'testing-library': testingLibrary
+    },
+    rules: {
+      ...testingLibrary.configs.react.rules
+    }
+  }
+]

main/accounts/Account/index.ts

@@ -14,7 +14,6 @@ import provider from '../../provider'
 import { ApprovalType } from '../../../resources/constants'
 
 import reveal from '../../reveal'
-import type { Breadcrumb } from '../../windows/nav/breadcrumb'
 import type { TypedMessage } from '../types'
 
 const nebula = nebulaApi()