chore: improve eslint

packages/.eslintrc.json

@@ -24,6 +24,15 @@
         "unused-imports/no-unused-imports-ts": "warn",
         "@typescript-eslint/await-thenable": "error",
         "@typescript-eslint/no-for-in-array": "error",
-        "@typescript-eslint/consistent-indexed-object-style": ["off", "record"]
+        "@typescript-eslint/no-implied-eval": "error",
+        "@typescript-eslint/no-invalid-this": "error",
+        "@typescript-eslint/no-loop-func": "error",
+        "@typescript-eslint/no-this-alias": "error",
+        "@typescript-eslint/prefer-for-of": "error",
+        "@typescript-eslint/prefer-includes": "error",
+        "@typescript-eslint/prefer-nullish-coalescing": "error",
+        "@typescript-eslint/prefer-optional-chain": "error",
+        "@typescript-eslint/prefer-reduce-type-parameter": "error",
+        "@typescript-eslint/prefer-string-starts-ends-with": "error"
     }
 }

packages/dashboard/src/pages/Welcome/index.tsx

@@ -36,7 +36,7 @@ export default function Welcome() {
     useEffect(
         () => () => {
             const link = privacyPolicyElement()
-            link && link.removeEventListener('click', handleLinkClick)
+            link?.removeEventListener('click', handleLinkClick)
         },
         [],
     )
@@ -48,7 +48,7 @@ export default function Welcome() {
 
     const handleIFrameLoad = () => {
         const link = privacyPolicyElement()
-        link && link.addEventListener('click', handleLinkClick)
+        link?.addEventListener('click', handleLinkClick)
     }
 
     const handleLinkClick = useCallback(() => {

packages/external-plugin-previewer/src/index.tsx

@@ -15,8 +15,8 @@ export function MaskExternalPluginPreviewRenderer({ pluginBase, payload, script,
             const instance = new RemoteContent({ $data: { payload } })
             instance.$mount({ target: dom })
             return () => instance.$destroy()
-        } catch (e) {
-            onError?.(e)
+        } catch (error: any) {
+            onError?.(error)
         }
         return
     }, [dom, onError, payload, template, pluginBase])

packages/maskbook/miscs/package-overrides/react-devtools.js

@@ -1,5 +1,8 @@
 // we don't import 'react-devtools' cause it needs to download electron
 import { connectToDevTools } from 'react-devtools-core/backend'
+
 try {
     connectToDevTools({ useHttps: false })
-} catch (e) {}
+} catch {
+    // ignore
+}

packages/maskbook/src/components/InjectedComponents/TypedMessageRenderer.tsx

@@ -115,7 +115,7 @@ export const DefaultTypedMessageTupleRenderer = memo(function DefaultTypedMessag
     try {
         JSON.stringify(props.message.items)
     } catch (e) {
-        if ((e?.message as string).includes('circular structure')) {
+        if (e instanceof Error && e.message.includes('circular structure')) {
             return (
                 <Typography>
                     The TypedMessage has a circular structure so it can't be rendered on the screen.

packages/maskbook/src/components/shared/Image.tsx

@@ -163,12 +163,12 @@ async function toImage(arr: ImageBitmapSource): Promise<CanvasImageSource> {
         // Safari route
         return new Promise<CanvasImageSource>((resolve, reject) => {
             const img = document.createElement('img')
-            img.addEventListener('load', function () {
-                resolve(this)
+            img.addEventListener('load', () => {
+                resolve(img)
                 URL.revokeObjectURL(img.src)
             })
-            img.addEventListener('error', (e) => {
-                reject(e)
+            img.addEventListener('error', ({ error }) => {
+                reject(error)
                 URL.revokeObjectURL(img.src)
             })
             // TODO: this might be blocked by CSP

packages/maskbook/src/components/shared/SelectProfileUI/SelectProfileUI.tsx

@@ -38,7 +38,7 @@ export function SelectProfileUI(props: SelectProfileUIProps) {
         return true
     })
     const listAfterSearch = listBeforeSearch.filter((x) => {
-        if (frozenSelected && frozenSelected.find((y) => x.identifier.equals(y.identifier))) return false
+        if (frozenSelected.find((y) => x.identifier.equals(y.identifier))) return false
         if (search === '') return true
         return (
             !!x.identifier.userId.toLowerCase().match(search.toLowerCase()) ||

packages/maskbook/src/components/shared/qrcode.tsx

@@ -10,7 +10,7 @@ export function NativeQRScanner(props: { onScan?: (val: string) => void; onQuit?
                 // TODO:
                 throw new Error('Not supported on Android')
             }
-        } catch (e) {
+        } catch {
             props.onQuit?.()
         }
     })

packages/maskbook/src/extension/background-script/CryptoServices/decryptFrom.ts

@@ -236,7 +236,7 @@ async function* decryptFromPayloadWithProgress_raw(
             // ! Do not remove the await here.
             return await decryptWith(aesKeyEncrypted)
         } catch (e) {
-            if (e.message === i18n.t('service_not_share_target')) {
+            if (e instanceof Error && e.message === i18n.t('service_not_share_target')) {
                 console.debug(e)
                 // TODO: Replace this error with:
                 // You do not have the necessary private key to decrypt this message.
@@ -319,7 +319,7 @@ async function* decryptFromImageUrlWithProgress_raw(
     const post = await decodeImageUrl(url, {
         pass: author.toText(),
     })
-    if (post.indexOf('🎼') !== 0 && !/https:\/\/.+\..+\/(\?PostData_v\d=)?%20(.+)%40/.test(post))
+    if (!post.startsWith('🎼') && !/https:\/\/.+\..+\/(\?PostData_v\d=)?%20(.+)%40/.test(post))
         return makeError(i18n.t('service_decode_image_payload_failed'), true)
     const worker = await Result.wrapAsync(() => getNetworkWorker(author))
     if (worker.err) return makeError(worker.val as Error)
@@ -385,7 +385,7 @@ async function* findAuthorPublicKey(
                 .catch(() => null)
         }
     }
-    if (author && author.publicKey) return author
+    if (author?.publicKey) return author
     return 'out of chance'
 }
 
@@ -405,7 +405,7 @@ async function decryptFromCache(postPayload: Payload, by: ProfileIdentifier) {
             'append',
         )
     }
-    if (cachedKey && cachedKey.postCryptoKey) {
+    if (cachedKey?.postCryptoKey) {
         try {
             const result = decodeText(
                 await cryptoProvider.decryptWithAES({

packages/maskbook/src/extension/background-script/CryptoServices/encryptTo.ts

@@ -73,7 +73,9 @@ export async function encryptTo(
     try {
         const publicKey = (await queryPersonaByProfileDB(whoAmI))?.publicKey
         if (publicKey) payload.authorPublicKey = compressSecp256k1Key(publicKey, 'public')
-    } catch (e) {}
+    } catch {
+        // ignore
+    }
 
     payload.signature = '_'
 

packages/maskbook/src/extension/background-script/EthereumServices/nonce.ts

@@ -29,8 +29,8 @@ class NonceManager {
                 try {
                     this.lock()
                     callback(null, await getTransactionCount(this.address))
-                } catch (e) {
-                    callback(e)
+                } catch (error: any) {
+                    callback(error)
                 }
             }
             if (this.locked) this.tasks.push(run)

packages/maskbook/src/extension/background-script/EthereumServices/send.ts

@@ -172,7 +172,7 @@ export async function INTERNAL_send(
                 }
                 break
         }
-    } catch (error) {
+    } catch (error: any) {
         callback(error)
     }
 }

packages/maskbook/src/extension/background-script/StorageService.ts

@@ -14,7 +14,7 @@ class MutexStorage<T extends browser.storage.StorageValue> {
         if (!this.locked) this.tasks.shift()?.()
     }
     public async getStorage(key: string) {
-        return new Promise<T | void>(async (resolve, reject) => {
+        return new Promise<T | undefined>(async (resolve, reject) => {
             const callback = (e: Error | null, storage?: T) => {
                 if (e) reject(e)
                 else resolve(storage)
@@ -26,8 +26,8 @@ class MutexStorage<T extends browser.storage.StorageValue> {
                     this.lock()
                     const stored = await browser.storage.local.get(key)
                     callback(null, (stored ?? {})[key] as T)
-                } catch (e) {
-                    callback(e)
+                } catch (error: any) {
+                    callback(error)
                 }
             }
             if (this.locked) this.tasks.push(run)
@@ -48,7 +48,9 @@ class MutexStorage<T extends browser.storage.StorageValue> {
                     await browser.storage.local.set({ [key]: value })
                     callback(null)
                 } catch (e) {
-                    callback(e)
+                    if (e instanceof Error) {
+                        callback(e)
+                    }
                 }
             }
             if (this.locked) this.tasks.push(run)
@@ -59,7 +61,7 @@ class MutexStorage<T extends browser.storage.StorageValue> {
 
 const storage = new MutexStorage<browser.storage.StorageValue>()
 
-export async function getStorage<T extends browser.storage.StorageValue>(key: string): Promise<T | void> {
+export async function getStorage<T extends browser.storage.StorageValue>(key: string): Promise<T | undefined> {
     if (typeof browser === 'undefined' || !browser.storage) return
     const value = await storage.getStorage(key)
     return value as T

packages/maskbook/src/extension/injected-script/addEventListener.ts

@@ -52,7 +52,7 @@ function dispatchEventRaw<T extends Event>(target: Node | Document | null, event
         // passive event
         const listeners = CapturedListeners.get(Node)?.get(type)
         if (!listeners) continue
-        for (const [f, { capture, once, passive }] of listeners) {
+        for (const [f, { capture }] of listeners) {
             if (capture) continue
             try {
                 f(event)

packages/maskbook/src/extension/options-page/DashboardComponents/RestoreFromBackupBox.tsx

@@ -61,7 +61,7 @@ export function RestoreFromBackupBox(props: RestoreFromBackupBoxProps) {
                 darkPlaceholderImageURL={new URL('./RestoreFromBackupBox-dark.png', import.meta.url).toString()}
                 lightPlaceholderImageURL={new URL('./RestoreFromBackupBox-light.png', import.meta.url).toString()}
                 data-active={over}
-                onClick={() => inputRef.current && inputRef.current.click()}
+                onClick={() => inputRef.current?.click()}
             />
         </div>
     )

packages/maskbook/src/extension/options-page/DashboardComponents/RestoreFromQRCodeImageBox.tsx

@@ -88,7 +88,7 @@ export function RestoreFromQRCodeImageBox(props: RestoreFromQRCodeImageBoxProps)
                 darkPlaceholderImageURL={new URL('./RestoreFromQRCodeImageBox-dark.png', import.meta.url).toString()}
                 lightPlaceholderImageURL={new URL('./RestoreFromQRCodeImageBox-light.png', import.meta.url).toString()}
                 data-active={over}
-                onClick={() => inputRef.current && inputRef.current.click()}>
+                onClick={() => inputRef.current?.click()}>
                 {file ? <QRCodeImageScanner src={dataURL} onScan={onScan} onError={onError} /> : null}
             </RestoreBox>
         </div>

packages/maskbook/src/extension/options-page/DashboardDialogs/Backup/Backup.tsx

@@ -31,7 +31,7 @@ export function DashboardBackupDialog(props: WrappedDialogProps) {
         try {
             await Services.Welcome.createBackupFile({ download: true, onlyBackupWhoAmI: false })
             props.onClose()
-        } catch (e) {
+        } catch {
             enqueueSnackbar(t('set_up_backup_fail'), {
                 variant: 'error',
             })

packages/maskbook/src/extension/options-page/DashboardDialogs/Backup/ConfirmBackup.tsx

@@ -58,7 +58,7 @@ export function ConfirmBackup({ restoreId, date, backup, onDone }: ConfirmBackup
                 setImported('loading')
                 await Services.Welcome.confirmBackup(restoreId)
                 setImported(true)
-            } catch (e) {
+            } catch {
                 failToRestore()
                 setImported(false)
             }

packages/maskbook/src/extension/options-page/DashboardDialogs/Backup/SelectBackup.tsx

@@ -79,7 +79,7 @@ export function SelectBackup({ onConfirm }: SelectBackupProps) {
                     <InputBase
                         className={selectBackupClasses.input}
                         placeholder={t('dashboard_paste_database_backup_hint')}
-                        inputRef={(input: HTMLInputElement) => input && input.focus()}
+                        inputRef={(input: HTMLInputElement) => input?.focus()}
                         multiline
                         value={textValue}
                         onChange={(e) => setTextValue(e.target.value)}
@@ -112,7 +112,7 @@ export function SelectBackup({ onConfirm }: SelectBackupProps) {
             const restoreId = uuid()
             await Services.Welcome.setUnconfirmedBackup(restoreId, json)
             onConfirm?.(restoreId, json)
-        } catch (e) {
+        } catch {
             enqueueSnackbar(t('set_up_restore_fail'), { variant: 'error' })
         }
     }

packages/maskbook/src/extension/options-page/DashboardDialogs/Contact/DeleteConfirm.tsx

@@ -20,7 +20,7 @@ export function DashboardContactDeleteConfirmDialog(
         [contact],
         () => {
             props.onClose()
-            setTimeout(onDeleted, 0)
+            setTimeout(() => onDeleted(), 0)
         },
     )
     return (

packages/maskbook/src/extension/options-page/DashboardDialogs/Persona/Import.tsx

@@ -38,7 +38,7 @@ export function DashboardImportPersonaDialog(props: WrappedDialogProps) {
             } else {
                 failToRestore()
             }
-        } catch (e) {
+        } catch {
             failToRestore()
         }
     }
@@ -57,28 +57,22 @@ export function DashboardImportPersonaDialog(props: WrappedDialogProps) {
                             autoFocus
                             required
                             label={t('name')}
-                            inputProps={{
-                                'data-testid': 'username_input',
-                            }}
+                            inputProps={{ 'data-testid': 'username_input' }}
                             variant="outlined"
                         />
                         <TextField
                             value={mnemonicWordsValue}
                             onChange={(e) => setMnemonicWordsValue(e.target.value)}
                             required
                             label={t('mnemonic_words')}
-                            inputProps={{
-                                'data-testid': 'mnemonic_input',
-                            }}
+                            inputProps={{ 'data-testid': 'mnemonic_input' }}
                             variant="outlined"
                         />
                         <TextField
                             onChange={(e) => setPassword(e.target.value)}
                             value={password}
                             label={t('password')}
-                            inputProps={{
-                                'data-testid': 'password_input',
-                            }}
+                            inputProps={{ 'data-testid': 'password_input' }}
                             variant="outlined"
                         />
                     </>
@@ -112,9 +106,7 @@ export function DashboardImportPersonaDialog(props: WrappedDialogProps) {
                             onChange={setFile}
                             onScan={setScannedValue}
                             onError={() => {
-                                enqueueSnackbar(t('set_up_qr_scanner_fail'), {
-                                    variant: 'error',
-                                })
+                                enqueueSnackbar(t('set_up_qr_scanner_fail'), { variant: 'error' })
                             }}
                         />
                         <RestoreFromQRCodeCameraBox
@@ -123,9 +115,7 @@ export function DashboardImportPersonaDialog(props: WrappedDialogProps) {
                                 setScannedValue(scannedValue)
                             }}
                             onError={() => {
-                                enqueueSnackbar(t('set_up_qr_scanner_fail'), {
-                                    variant: 'error',
-                                })
+                                enqueueSnackbar(t('set_up_qr_scanner_fail'), { variant: 'error' })
                             }}
                         />
                     </>
@@ -161,10 +151,8 @@ export function DashboardImportPersonaDialog(props: WrappedDialogProps) {
                                     : Services.Identity.restoreFromBackup(scannedValue))
 
                                 importPersona(persona)
-                            } catch (e) {
-                                enqueueSnackbar(t('set_up_restore_fail'), {
-                                    variant: 'error',
-                                })
+                            } catch {
+                                enqueueSnackbar(t('set_up_restore_fail'), { variant: 'error' })
                             }
                         }}
                         data-testid="import_button">