chore: rebase master and fix expo-camera bugs

helium · Sep 10, 2024 · a307011 · a307011
1 parent 4af76d4
commit a307011
Show file tree

Hide file tree

Showing 4 changed files with 476 additions and 36 deletions.
diff --git a/src/components/DynamicQrScanner.tsx b/src/components/DynamicQrScanner.tsx
@@ -1,8 +1,7 @@
 /* eslint-disable no-console */
-import React, { useEffect, useMemo, useState } from 'react'
-import { BarCodeScanningResult, Camera } from 'expo-camera'
+import React, { useEffect, useState } from 'react'
+import { BarcodeScanningResult, Camera, CameraView } from 'expo-camera'
 import { Linking, Platform, StyleSheet } from 'react-native'
-import { BarCodeScanner } from 'expo-barcode-scanner'
 import { useNavigation } from '@react-navigation/native'
 import { useAsync } from 'react-async-hook'
 import { useTranslation } from 'react-i18next'
@@ -24,9 +23,13 @@ const DynamicQrScanner = ({ onBarCodeScanned, progress }: Props) => {
   const { t } = useTranslation()
 
   useEffect(() => {
-    Camera.requestCameraPermissionsAsync().then(({ status }) => {
-      setHasPermission(status === 'granted')
-    })
+    console.log('useEffect')
+    Camera.requestCameraPermissionsAsync().then(
+      ({ status }: { status: string }) => {
+        setHasPermission(status === 'granted')
+      },
+    )
+    console.log('useEffect2')
   }, [])
 
   useAsync(async () => {
@@ -54,13 +57,7 @@ const DynamicQrScanner = ({ onBarCodeScanned, progress }: Props) => {
     }
   }, [hasPermission, navigation, showOKCancelAlert])
 
-  const barCodeScannerSettings = useMemo(
-    () => ({
-      barCodeTypes: [BarCodeScanner.Constants.BarCodeType.qr],
-    }),
-    [],
-  )
-  const handleBarCodeScanned = (result: BarCodeScanningResult) => {
+  const handleBarCodeScanned = (result: BarcodeScanningResult) => {
     onBarCodeScanned(result.data)
   }
 
@@ -71,10 +68,12 @@ const DynamicQrScanner = ({ onBarCodeScanned, progress }: Props) => {
 
       {hasPermission === true && (
         <Box flex={1}>
-          <Camera
-            onBarCodeScanned={handleBarCodeScanned}
-            barCodeScannerSettings={barCodeScannerSettings}
+          <CameraView
+            onBarcodeScanned={handleBarCodeScanned}
+            barcodeScannerSettings={{ barcodeTypes: ['qr'] }}
             style={StyleSheet.absoluteFillObject}
+            // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+            // @ts-ignore
             ratio="16:9"
           />
           <CameraScannerLayout />

diff --git a/src/features/keystone/ConnectKeystoneStartScreen.tsx b/src/features/keystone/ConnectKeystoneStartScreen.tsx
@@ -1,3 +1,4 @@
+/* eslint-disable react/jsx-props-no-spreading */
 import Box from '@components/Box'
 import ButtonPressable from '@components/ButtonPressable'
 import SafeAreaBox from '@components/SafeAreaBox'
@@ -101,7 +102,7 @@ const WarningContent = () => {
         <Box alignItems="center">
           <WarningKeystone />
           <Text variant="body0" textAlign="center" marginVertical="l">
-            {t('keystone.connectKeystoneStart.warning')}
+            {t('keystone.connectKeystoneStart.warning') as string}
           </Text>
         </Box>
       </Box>
@@ -147,10 +148,10 @@ const ConnectKeystoneStart = () => {
             source={require('../../assets/images/connectKeystoneLogo.png')}
           />
           <Text variant="h0" textAlign="center" marginVertical="l">
-            {t('keystone.connectKeystoneStart.title')}
+            {t('keystone.connectKeystoneStart.title') as string}
           </Text>
           <Text variant="subtitle1" textAlign="center">
-            {t('keystone.connectKeystoneStart.subtitle')}
+            {t('keystone.connectKeystoneStart.subtitle') as string}
           </Text>
         </Box>
       </Box>

diff --git a/src/features/keystone/SignTx/SignTxModal.tsx b/src/features/keystone/SignTx/SignTxModal.tsx
@@ -12,9 +12,8 @@ import KeystoneSDK, {
 } from '@keystonehq/keystone-sdk'
 import { AnimatedQrCode } from '@components/StaticQrCode'
 import useAlert from '@hooks/useAlert'
-import { BarCodeScanningResult, Camera } from 'expo-camera'
+import { BarcodeScanningResult, Camera, CameraView } from 'expo-camera'
 import { Linking, Platform, StyleSheet } from 'react-native'
-import { BarCodeScanner } from 'expo-barcode-scanner'
 import ProgressBar from '@components/ProgressBar'
 import { useAsync } from 'react-async-hook'
 import EventEmitter from 'events'
@@ -56,22 +55,20 @@ const DaynamicQrScanner = ({ onBarCodeScanned, progress }: Props) => {
     }
   }, [hasPermission, showOKCancelAlert])
 
-  const barCodeScannerSettings = useMemo(
-    () => ({
-      barCodeTypes: [BarCodeScanner.Constants.BarCodeType.qr],
-    }),
-    [],
-  )
-  const handleBarCodeScanned = (result: BarCodeScanningResult) => {
+  const handleBarCodeScanned = (result: BarcodeScanningResult) => {
     onBarCodeScanned(result.data)
   }
 
   return (
     <SafeAreaBox flex={1} edges={['top']}>
-      <Camera
-        onBarCodeScanned={handleBarCodeScanned}
-        barCodeScannerSettings={barCodeScannerSettings}
+      <CameraView
+        onBarcodeScanned={handleBarCodeScanned}
+        barcodeScannerSettings={{
+          barcodeTypes: ['qr'],
+        }}
         style={StyleSheet.absoluteFillObject}
+        // eslint-disable-next-line @typescript-eslint/ban-ts-comment
+        // @ts-ignore
         ratio="16:9"
       />
       <CameraScannerLayout />