feat: wallet sync synchronize via qr code from mobile to desktop

LedgerHQ · Aug 22, 2024 · f4d732e · f4d732e
1 parent 82a2495
commit f4d732e
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 27 deletions.
diff --git a/...dger-live-mobile/src/newArch/features/WalletSync/components/Activation/ActivationFlow.tsx b/...dger-live-mobile/src/newArch/features/WalletSync/components/Activation/ActivationFlow.tsx
@@ -75,6 +75,7 @@ const ActivationFlow = ({
             onQrCodeScanned={handleQrCodeScanned}
             currentOption={currentOption}
             setSelectedOption={setOption}
+            qrCodeValue={qrProcess.url}
           />
         );
 

diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Synchronize/QrCode.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/components/Synchronize/QrCode.tsx
@@ -1,5 +1,5 @@
 import React from "react";
-import { Flex, Text } from "@ledgerhq/native-ui";
+import { Flex, InfiniteLoader, Text } from "@ledgerhq/native-ui";
 import styled, { useTheme } from "styled-components/native";
 import QRCode from "react-native-qrcode-svg";
 import getWindowDimensions from "~/logic/getWindowDimensions";
@@ -12,7 +12,7 @@ const Italic = styled(Text)`
 // Won't work since we don't have inter italic font
 
 type Props = {
-  qrCodeValue: string;
+  qrCodeValue?: string;
 };
 
 const QrCode = ({ qrCodeValue }: Props) => {
@@ -79,12 +79,16 @@ const QrCode = ({ qrCodeValue }: Props) => {
         justifyContent={"center"}
         testID="ws-qr-code-displayed"
       >
-        <QRCode
-          value={qrCodeValue}
-          logo={require("~/images/bigSquareLogo.png")}
-          logoSize={65}
-          size={QRCodeSize}
-        />
+        {qrCodeValue ? (
+          <QRCode
+            value={qrCodeValue}
+            logo={require("~/images/bigSquareLogo.png")}
+            logoSize={65}
+            size={QRCodeSize}
+          />
+        ) : (
+          <InfiniteLoader size={65} />
+        )}
       </Flex>
       <BottomContainer steps={steps} />
     </Flex>

diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useQRCodeHost.ts b/apps/ledger-live-mobile/src/newArch/features/WalletSync/hooks/useQRCodeHost.ts
@@ -52,10 +52,6 @@ export function useQRCodeHost({ setCurrentStep, currentStep, currentOption }: Pr
       trustchainApiBaseUrl,
       onDisplayQRCode: url => {
         setUrl(url);
-
-        //TODO-remove when clearing code, used to test behavior with webTool
-        // eslint-disable-next-line no-console
-        console.log("onDisplayQRCode", url);
       },
       onDisplayDigits: digits => {
         setPinCode(digits);
@@ -72,17 +68,6 @@ export function useQRCodeHost({ setCurrentStep, currentStep, currentOption }: Pr
       memberName,
       alreadyHasATrustchain: !!trustchain,
     })
-      .catch(e => {
-        if (e instanceof InvalidDigitsError) {
-          setCurrentStep(Steps.SyncError);
-          return;
-        } else if (e instanceof NoTrustchainInitialized) {
-          setCurrentStep(Steps.UnbackedError);
-          return;
-        }
-        setError(e);
-        throw e;
-      })
       .then(newTrustchain => {
         if (newTrustchain) {
           dispatch(setTrustchain(newTrustchain));
@@ -98,6 +83,17 @@ export function useQRCodeHost({ setCurrentStep, currentStep, currentOption }: Pr
         setUrl(null);
         setPinCode(null);
         setIsLoading(false);
+      })
+      .catch(e => {
+        if (e instanceof InvalidDigitsError) {
+          setCurrentStep(Steps.SyncError);
+          return;
+        } else if (e instanceof NoTrustchainInitialized) {
+          setCurrentStep(Steps.UnbackedError);
+          return;
+        }
+        setError(e);
+        throw e;
       });
   }, [
     trustchain,

diff --git a/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx b/apps/ledger-live-mobile/src/newArch/features/WalletSync/screens/Synchronize/QrCodeMethod.tsx
@@ -15,9 +15,15 @@ interface Props {
   setSelectedOption: (option: OptionsType) => void;
   onQrCodeScanned: (data: string) => void;
   currentOption: Options;
+  qrCodeValue?: string;
 }
 
-const QrCodeMethod = ({ setSelectedOption, onQrCodeScanned, currentOption }: Props) => {
+const QrCodeMethod = ({
+  setSelectedOption,
+  onQrCodeScanned,
+  currentOption,
+  qrCodeValue,
+}: Props) => {
   const { onClickTrack } = useLedgerSyncAnalytics();
   const { t } = useTranslation();
 
@@ -44,7 +50,7 @@ const QrCodeMethod = ({ setSelectedOption, onQrCodeScanned, currentOption }: Pro
         return (
           <>
             <TrackScreen category={AnalyticsPage.ShowQRCode} />
-            <QrCode qrCodeValue="ledger.com" />
+            <QrCode qrCodeValue={qrCodeValue} />
           </>
         );
     }

diff --git a/libs/trustchain/src/qrcode/index.ts b/libs/trustchain/src/qrcode/index.ts
@@ -373,10 +373,10 @@ function fromErrorMessage(payload: { message: string; type: string }): Error {
     throw new InvalidDigitsError(payload.message);
   }
   if (payload.type === "UNEXPECTED_SHARE_CREDENTIAL") {
-    throw new TrustchainsAlreadyInitialized(payload.message);
+    throw new NoTrustchainInitialized(payload.message);
   }
   if (payload.type === "UNEXPECTED_REQUEST_CREDENTIAL") {
-    throw new NoTrustchainInitialized(payload.message);
+    throw new TrustchainsAlreadyInitialized(payload.message);
   }
   const error = new Error(payload.message);
   error.name = "TrustchainQRCode-" + payload.type;