Merge pull request #5730 from EdgeApp/william/lint-fixes

Lint fixes

Author: swansontec

eslint.config.mjs

@@ -57,10 +57,6 @@ export default [
       'scripts/secretFiles.ts',
       'scripts/themeServer.ts',
       'scripts/updateVersion.ts',
-      'src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx',
-      'src/__tests__/components/MenuTabs.test.tsx',
-      'src/__tests__/utils.test.ts',
-      'src/__tests__/utils/parseMarkedText.test.ts',
       'src/actions/BackupModalActions.tsx',
       'src/actions/CategoriesActions.ts',
       'src/actions/CountryListActions.tsx',
@@ -212,13 +208,10 @@ export default [
       'src/components/notification/NotificationView.tsx',
       'src/components/progress-indicators/AccountSyncBar.tsx',
       'src/components/progress-indicators/CancellableProcessingScene.tsx',
-      'src/components/progress-indicators/CircleTimer.tsx',
-      'src/components/progress-indicators/FillLoader.tsx',
       'src/components/progress-indicators/FullScreenLoader.tsx',
       'src/components/progress-indicators/LoadingSplashScreen.tsx',
       'src/components/progress-indicators/Shimmer.tsx',
       'src/components/progress-indicators/StepProgressBar.tsx',
-      'src/components/progress-indicators/WalletSyncCircle.tsx',
       'src/components/rows/CoinRankRow.tsx',
       'src/components/rows/CryptoFiatAmountRow.tsx',
       'src/components/rows/CurrencyRow.tsx',
@@ -574,7 +567,6 @@ export default [
       '@typescript-eslint/no-dynamic-delete': 'warn',
       '@typescript-eslint/no-misused-promises': 'warn',
       '@typescript-eslint/prefer-nullish-coalescing': 'warn',
-      '@typescript-eslint/prefer-optional-chain': 'warn',
       '@typescript-eslint/require-array-sort-compare': 'warn',
       '@typescript-eslint/restrict-plus-operands': 'warn',
       '@typescript-eslint/restrict-template-expressions': 'warn',

src/__tests__/components/CreateWalletSelectCryptoRow.test.tsx

@@ -23,7 +23,7 @@ describe('WalletListRow', () => {
   it('should render with loading props', () => {
     const pluginId = 'bitcoin'
     const walletName = 'My bitcoin wallet'
-    const onPress = () => undefined
+    const onPress = (): void => {}
     const rightSide = (
       <IonIcon size={26} color="#66EDA8" name="chevron-forward-outline" />
     )

src/__tests__/components/MenuTabs.test.tsx

@@ -11,9 +11,10 @@ describe('MenuTabs', () => {
     const rendered = render(
       <FakeProviders>
         <MenuTabs
-          // @ts-expect-error
+          // @ts-expect-error The menu expects a special navigation object,
+          // but our mock one is close enough:
           navigation={fakeNavigation}
-          // @ts-expect-error
+          // @ts-expect-error The subset of router state we need:
           state={{ index: 0, routes: [] }}
         />
       </FakeProviders>

src/__tests__/utils.test.ts

@@ -316,9 +316,8 @@ describe('precisionAdjust', function () {
     }
   }
 
-  for (const key in tests) {
-    // @ts-expect-error
-    const { input, output } = tests[key]
+  for (const key of Object.keys(tests)) {
+    const { input, output } = tests[key as keyof typeof tests]
     const {
       displayDenominationMultiplier,
       primaryExchangeMultiplier,

src/__tests__/utils/parseMarkedText.test.ts

@@ -1,10 +1,12 @@
 import { describe, it } from '@jest/globals'
-import { asObject, asTuple, asUnknown, asValue, type Cleaner } from 'cleaners'
+import { asObject, asTuple, asValue, type Cleaner } from 'cleaners'
 
 import { parseMarkedText } from '../../util/parseMarkedText'
 
 describe('parseMarkedText', () => {
-  const asJsxElement = (asChildren: Cleaner<any> = asUnknown) =>
+  const asJsxElement = <T>(
+    asChildren: Cleaner<T>
+  ): Cleaner<{ props: { children: T } }> =>
     asObject({
       props: asObject({
         children: asChildren

src/actions/NotificationActions.ts

@@ -362,7 +362,7 @@ async function legacyGet(path: string) {
       'X-Api-Key': ENV.EDGE_API_KEY
     }
   })
-  if (response != null && response.ok) {
+  if (response.ok) {
     return await response.json()
   } else {
     throw new Error('Error accessing notification server')

src/components/common/DotsBackground.tsx

@@ -51,7 +51,7 @@ export function DotsBackground(props: Props): React.ReactElement {
           cy: overrideDot.cy ?? dot.cy
         }
         if (mergedDot.accentColor != null) {
-          const ac = (accentColors ?? {})[mergedDot.accentColor]
+          const ac = accentColors?.[mergedDot.accentColor]
           if (ac == null) {
             throw new Error('Missing accentColors')
           }

src/components/modals/CountryListModal.tsx

@@ -48,7 +48,7 @@ export const CountryListModal = ({
     const upperCaseText = searchText.toUpperCase()
     return (
       country.name.toLowerCase().includes(lowerCaseText) ||
-      (country.filename != null && country.filename.includes(lowerCaseText)) ||
+      country.filename?.includes(lowerCaseText) === true ||
       country['alpha-2'].includes(upperCaseText) ||
       country['alpha-3'].includes(upperCaseText)
     )

src/components/progress-indicators/CircleTimer.tsx

@@ -9,12 +9,13 @@ interface Props {
 
 export const TEN_MINUTES = 600
 
-export const CircleTimer: React.FC<Props> = ({ expiration, timeExpired }) => {
+export const CircleTimer: React.FC<Props> = props => {
+  const { expiration, timeExpired } = props
   const componentMounted = useRef(true)
   const timeoutId = useRef<ReturnType<typeof setTimeout> | null>(null)
   const isFocused = useIsFocused()
 
-  const timerTick = () => {
+  const timerTick = (): void => {
     if (!componentMounted.current || !isFocused) {
       if (timeoutId.current != null) {
         clearTimeout(timeoutId.current)
@@ -24,7 +25,7 @@ export const CircleTimer: React.FC<Props> = ({ expiration, timeExpired }) => {
     const now = new Date()
     const nowMilli = now.getTime()
     const expMil = expiration.getTime()
-    if (expiration && nowMilli >= expMil) {
+    if (nowMilli >= expMil) {
       timeExpired()
       return
     }
@@ -50,18 +51,12 @@ export const CircleTimer: React.FC<Props> = ({ expiration, timeExpired }) => {
   }, [])
 
   useEffect(() => {
-    if (expiration !== null) {
-      if (timeoutId.current != null) {
-        clearTimeout(timeoutId.current)
-      }
-      timeoutId.current = setTimeout(timerTick, 1000)
+    if (timeoutId.current != null) {
+      clearTimeout(timeoutId.current)
     }
+    timeoutId.current = setTimeout(timerTick, 1000)
     // eslint-disable-next-line react-hooks/exhaustive-deps
-  }, [expiration])
-
-  if (!expiration) {
-    return null
-  }
+  }, [])
 
   return <View style={{ width: 1, height: 1 }} />
 }

src/components/progress-indicators/FillLoader.tsx

@@ -1,31 +1,20 @@
 import * as React from 'react'
-import {
-  ActivityIndicator,
-  StyleSheet,
-  View,
-  type ViewStyle
-} from 'react-native'
+import { ActivityIndicator, StyleSheet, View } from 'react-native'
 
-import { THEME } from '../../theme/variables/airbitz'
+import { useTheme } from '../services/ThemeContext'
 
-interface Props {
-  indicatorStyles?: ViewStyle
-  size?: 'large' | 'small'
-}
+export const FillLoader: React.FC = props => {
+  const theme = useTheme()
 
-export class FillLoader extends React.Component<Props> {
-  render() {
-    const { size, indicatorStyles } = this.props
-    return (
-      <View style={styles.loadingContainer}>
-        <ActivityIndicator
-          color={THEME.COLORS.ACCENT_MINT}
-          style={[styles.indicator, indicatorStyles]}
-          size={size || 'large'}
-        />
-      </View>
-    )
-  }
+  return (
+    <View style={styles.loadingContainer}>
+      <ActivityIndicator
+        color={theme.icon}
+        style={styles.indicator}
+        size="large"
+      />
+    </View>
+  )
 }
 
 const styles = StyleSheet.create({