From 75d2bc36a767798e41e5af179faccacb5bb2e9cf Mon Sep 17 00:00:00 2001
From: ZhenQian <zhenqian@keyst.one>
Date: Tue, 8 Oct 2024 14:00:35 +0800
Subject: [PATCH] fix: fix scan qrcode the app crash

---
 src/features/keystone/ScanQrCodeScreen.tsx | 40 ++++++++++++++++------
 src/locales/en.ts                          |  3 ++
 2 files changed, 33 insertions(+), 10 deletions(-)

diff --git a/src/features/keystone/ScanQrCodeScreen.tsx b/src/features/keystone/ScanQrCodeScreen.tsx
index 70134a2c5..04926b961 100644
--- a/src/features/keystone/ScanQrCodeScreen.tsx
+++ b/src/features/keystone/ScanQrCodeScreen.tsx
@@ -5,28 +5,48 @@ import { URDecoder } from '@ngraveio/bc-ur'
 import KeystoneSDK, { MultiAccounts, UR } from '@keystonehq/keystone-sdk'
 import { RootNavigationProp } from 'src/navigation/rootTypes'
 import { useNavigation } from '@react-navigation/native'
+import { Alert } from 'react-native'
+import { useTranslation } from 'react-i18next'
 import { KeystoneAccountType } from './SelectKeystoneAccountsScreen'
 
 const ScanQrCodeScreen = () => {
+  const { t } = useTranslation()
   const navigation = useNavigation<RootNavigationProp>()
   const [multiAccounts, setMultiAccounts] = useState<MultiAccounts>()
   const decoder = useMemo(() => new URDecoder(), [])
   const [isScanQrCodeComplete, setIsScanQrCodeComplete] = useState(false)
   const [progress, setProgress] = useState<number>(0)
+  const [isUnexpectedQrCode, setIsUnexpectedQrCode] = useState(false)
   const handleBarCodeScanned = (qrString: string) => {
-    decoder.receivePart(qrString.toLowerCase())
-    setProgress(Number((decoder.getProgress() * 100).toFixed(0)))
-    if (decoder.isComplete()) {
-      const ur = decoder.resultUR()
-      const qrCodeDataRes: MultiAccounts = new KeystoneSDK().parseMultiAccounts(
-        new UR(Buffer.from(ur.cbor.toString('hex'), 'hex'), ur.type),
-      )
-      setProgress(100)
-      setIsScanQrCodeComplete(true)
-      setMultiAccounts(qrCodeDataRes)
+    // fix unexpected qrcode string
+    try {
+      decoder.receivePart(qrString.toLowerCase())
+      setProgress(Number((decoder.getProgress() * 100).toFixed(0)))
+      if (decoder.isComplete()) {
+        const ur = decoder.resultUR()
+        const qrCodeDataRes: MultiAccounts =
+          new KeystoneSDK().parseMultiAccounts(
+            new UR(Buffer.from(ur.cbor.toString('hex'), 'hex'), ur.type),
+          )
+        setProgress(100)
+        setIsScanQrCodeComplete(true)
+        setMultiAccounts(qrCodeDataRes)
+      }
+    } catch (error) {
+      setIsUnexpectedQrCode(true)
     }
   }
 
+  useEffect(() => {
+    if (isUnexpectedQrCode) {
+      Alert.alert(
+        t('keystone.connectKeystoneStart.unexpectedQrCodeTitle'),
+        t('keystone.connectKeystoneStart.unexpectedQrCodeContent'),
+      )
+    }
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isUnexpectedQrCode])
+
   useEffect(() => {
     if (isScanQrCodeComplete) {
       const derivationAccounts: KeystoneAccountType[] = []
diff --git a/src/locales/en.ts b/src/locales/en.ts
index 486eeaf4d..b1283c665 100644
--- a/src/locales/en.ts
+++ b/src/locales/en.ts
@@ -771,6 +771,9 @@ export default {
       scanQrCode: 'Scan QR Code',
       warning: 'Please enable your camera permission via [Settings]',
       ok: 'OK',
+      unexpectedQrCodeContent:
+        'The QR code you scanned is not valid. Please try again.',
+      unexpectedQrCodeTitle: 'Unexpected QR Code',
     },
     selectKeystoneAccounts: {
       subtitle: