From 9a28a0164e84e4da609b740e4c788dadde858f4a Mon Sep 17 00:00:00 2001 From: J Caso Date: Tue, 25 Feb 2025 16:39:32 +0100 Subject: [PATCH 1/7] fix: camera black screen UI --- src/ui/components/Scanner/Scanner.scss | 6 ++ src/ui/components/Scanner/Scanner.tsx | 111 +++++++++++++++---------- 2 files changed, 75 insertions(+), 42 deletions(-) diff --git a/src/ui/components/Scanner/Scanner.scss b/src/ui/components/Scanner/Scanner.scss index a5d0d485b..a7d2747e6 100644 --- a/src/ui/components/Scanner/Scanner.scss +++ b/src/ui/components/Scanner/Scanner.scss @@ -79,6 +79,12 @@ ion-grid.qr-code-scanner { background: rgba(var(--ion-color-neutral-700-rgb), 0.2); } + &.transitioning { + .scanner-spinner-container { + background: #000000; + } + } + .page-footer .secondary-button { opacity: 0.5; backdrop-filter: blur(0.33rem); diff --git a/src/ui/components/Scanner/Scanner.tsx b/src/ui/components/Scanner/Scanner.tsx index 27e2ef574..acfee5562 100644 --- a/src/ui/components/Scanner/Scanner.tsx +++ b/src/ui/components/Scanner/Scanner.tsx @@ -103,7 +103,9 @@ const Scanner = forwardRef( const [groupIdentifierOpen, setGroupIdentifierOpen] = useState(false); const [resumeMultiSig, setResumeMultiSig] = useState(null); + const [isTransitioning, setIsTransitioning] = useState(false); const isHandlingQR = useRef(false); + const scannerState = useRef<"stopped" | "starting" | "running">("stopped"); useEffect(() => { if (platforms.includes("mobileweb")) { @@ -125,11 +127,16 @@ const Scanner = forwardRef( }; const stopScan = async () => { - if (permission) { - await BarcodeScanner.stopScan(); - await BarcodeScanner.removeAllListeners(); + if (!permission || !Capacitor.isNativePlatform()) { + setScanning(false); + document?.querySelector("body")?.classList.remove("scanner-active"); + scannerState.current = "stopped"; + return; } + await BarcodeScanner.stopScan(); + await BarcodeScanner.removeAllListeners(); + scannerState.current = "stopped"; setScanning(false); document?.querySelector("body")?.classList.remove("scanner-active"); setGroupId(""); @@ -139,6 +146,26 @@ const Scanner = forwardRef( stopScan, })); + useEffect(() => { + const handleCameraChange = async () => { + if ( + !scanning || + !Capacitor.isNativePlatform() || + isTransitioning || + scannerState.current === "starting" + ) + return; + + setIsTransitioning(true); + await stopScan(); + + await initScan(); + setIsTransitioning(false); + }; + + handleCameraChange(); + }, [cameraDirection]); + const handleConnectWallet = (id: string) => { if (/^b[1-9A-HJ-NP-Za-km-z]{33}/.test(id)) { dispatch(setToastMsg(ToastMsgType.PEER_ID_SUCCESS)); @@ -418,47 +445,42 @@ const Scanner = forwardRef( }; const initScan = async () => { - if (Capacitor.isNativePlatform()) { - const allowed = await checkPermission(); - setPermisson(!!allowed); - onCheckPermissionFinish?.(!!allowed); - - if (allowed) { - await BarcodeScanner.removeAllListeners(); - const listener = await BarcodeScanner.addListener( - "barcodesScanned", - async (result) => { - await listener.remove(); - if (isHandlingQR.current) return; - isHandlingQR.current = true; - if (!result.barcodes?.length) return; - await processValue(result.barcodes[0].rawValue); - } - ); - const listenerError = await BarcodeScanner.addListener( - "scanError", - async (result) => { - await listenerError.remove(); - } - ); - try { - await BarcodeScanner.startScan({ - formats: [BarcodeFormat.QrCode], - lensFacing: cameraDirection, - }); - } catch (error) { - showError("Error starting barcode scan:", error); - setScanUnavailable(true); - stopScan(); + if (!Capacitor.isNativePlatform() || mobileweb) return; + + const allowed = await checkPermission(); + setPermisson(!!allowed); + onCheckPermissionFinish?.(!!allowed); + + if (!allowed) return; + + if (scannerState.current !== "stopped") { + await stopScan(); + } + + try { + scannerState.current = "starting"; + const listener = await BarcodeScanner.addListener( + "barcodesScanned", + async (result) => { + await listener.remove(); + if (isHandlingQR.current || !result.barcodes?.length) return; + isHandlingQR.current = true; + await processValue(result.barcodes[0].rawValue); } - } + ); - document?.querySelector("body")?.classList.add("scanner-active"); + await BarcodeScanner.startScan({ + formats: [BarcodeFormat.QrCode], + lensFacing: cameraDirection, + }); + + scannerState.current = "running"; setScanning(true); document?.querySelector("body")?.classList.add("scanner-active"); - document - ?.querySelector("body.scanner-active > div:last-child") - ?.classList.remove("hide"); + } catch (error) { + setScanUnavailable(true); + await stopScan(); + showError("Error starting barcode scan:", error, dispatch); } }; @@ -507,7 +529,6 @@ const Scanner = forwardRef( }, [ currentOperation, routePath, - cameraDirection, isShowConnectionsModal, createIdentifierModalIsOpen, currentToastMsgs, @@ -594,6 +615,7 @@ const Scanner = forwardRef( const containerClass = combineClassNames("qr-code-scanner", { "no-permission": !permission || mobileweb, "scan-unavailable": scanUnavailable, + transitioning: isTransitioning, }); return ( @@ -602,7 +624,12 @@ const Scanner = forwardRef( className={containerClass} data-testid="qr-code-scanner" > - {scanning || mobileweb || scanUnavailable ? ( + {isTransitioning ? ( +
+ ) : scanning || mobileweb || scanUnavailable ? ( <> From 20f61dbcbacf8b408046d01ae82fbd2b34986381 Mon Sep 17 00:00:00 2001 From: J Caso Date: Thu, 27 Feb 2025 17:10:11 +0100 Subject: [PATCH 2/7] fix: add brackets to multiple lines conditional --- android/build.gradle | 2 +- src/ui/components/Scanner/Scanner.tsx | 244 +++++++++++++------------- 2 files changed, 125 insertions(+), 121 deletions(-) diff --git a/android/build.gradle b/android/build.gradle index f1b3b0e51..859b2419e 100644 --- a/android/build.gradle +++ b/android/build.gradle @@ -9,7 +9,7 @@ buildscript { dependencies { classpath 'com.android.tools.build:gradle:8.7.2' classpath 'com.google.gms:google-services:4.4.2' - + classpath 'org.jetbrains.kotlin:kotlin-gradle-plugin:1.8.22' // NOTE: Do not place your application dependencies here; they belong // in the individual module build.gradle files } diff --git a/src/ui/components/Scanner/Scanner.tsx b/src/ui/components/Scanner/Scanner.tsx index acfee5562..96ed7c375 100644 --- a/src/ui/components/Scanner/Scanner.tsx +++ b/src/ui/components/Scanner/Scanner.tsx @@ -113,18 +113,82 @@ const Scanner = forwardRef( } }, [platforms]); - const checkPermission = async () => { - const status = await BarcodeScanner.checkPermissions(); - if (status.camera === "granted") { - return true; - } - if ( - status.camera === "prompt" || - status.camera == "prompt-with-rationale" - ) { - return (await BarcodeScanner.requestPermissions()).camera === "granted"; - } - }; + useImperativeHandle(ref, () => ({ + stopScan, + })); + + useEffect(() => { + const onLoad = async () => { + if ( + routePath === TabsRoutePath.SCAN && + (isShowConnectionsModal || createIdentifierModalIsOpen) + ) { + await stopScan(); + return; + } + + const isDuplicateConnectionToast = currentToastMsgs.some( + (item) => ToastMsgType.DUPLICATE_CONNECTION === item.message + ); + const isRequestPending = currentToastMsgs.some((item) => + [ + ToastMsgType.CONNECTION_REQUEST_PENDING, + ToastMsgType.CREDENTIAL_REQUEST_PENDING, + ].includes(item.message) + ); + + const isScanning = + routePath === TabsRoutePath.SCAN || + [ + OperationType.SCAN_CONNECTION, + OperationType.SCAN_WALLET_CONNECTION, + OperationType.SCAN_SSI_BOOT_URL, + OperationType.SCAN_SSI_CONNECT_URL, + ].includes(currentOperation); + + const isMultisignScan = + [ + OperationType.MULTI_SIG_INITIATOR_SCAN, + OperationType.MULTI_SIG_RECEIVER_SCAN, + ].includes(currentOperation) && !isDuplicateConnectionToast; + + if ((isScanning && !isRequestPending) || isMultisignScan) { + await initScan(); + } else { + await stopScan(); + } + }; + onLoad(); + }, [ + currentOperation, + routePath, + isShowConnectionsModal, + createIdentifierModalIsOpen, + currentToastMsgs, + ]); + + useEffect(() => { + const handleCameraChange = async () => { + if ( + !scanning || + !Capacitor.isNativePlatform() || + isTransitioning || + scannerState.current === "starting" + ) { + return; + } + + setIsTransitioning(true); + if (scannerState.current === "running") { + await stopScan(); + } + + await initScan(); + setIsTransitioning(false); + }; + + handleCameraChange(); + }, [cameraDirection]); const stopScan = async () => { if (!permission || !Capacitor.isNativePlatform()) { @@ -142,29 +206,58 @@ const Scanner = forwardRef( setGroupId(""); }; - useImperativeHandle(ref, () => ({ - stopScan, - })); + const initScan = async () => { + if (!Capacitor.isNativePlatform() || mobileweb) return; - useEffect(() => { - const handleCameraChange = async () => { - if ( - !scanning || - !Capacitor.isNativePlatform() || - isTransitioning || - scannerState.current === "starting" - ) - return; + const allowed = await checkPermission(); + setPermisson(!!allowed); + onCheckPermissionFinish?.(!!allowed); - setIsTransitioning(true); + if (!allowed) return; + + if (scannerState.current !== "stopped") { await stopScan(); + } - await initScan(); - setIsTransitioning(false); - }; + try { + scannerState.current = "starting"; + const listener = await BarcodeScanner.addListener( + "barcodesScanned", + async (result) => { + await listener.remove(); + if (isHandlingQR.current || !result.barcodes?.length) return; + isHandlingQR.current = true; + await processValue(result.barcodes[0].rawValue); + } + ); - handleCameraChange(); - }, [cameraDirection]); + await BarcodeScanner.startScan({ + formats: [BarcodeFormat.QrCode], + lensFacing: cameraDirection, + }); + + scannerState.current = "running"; + setScanning(true); + document?.querySelector("body")?.classList.add("scanner-active"); + } catch (error) { + setScanUnavailable(true); + await stopScan(); + showError("Error starting barcode scan:", error, dispatch); + } + }; + + const checkPermission = async () => { + const status = await BarcodeScanner.checkPermissions(); + if (status.camera === "granted") { + return true; + } + if ( + status.camera === "prompt" || + status.camera == "prompt-with-rationale" + ) { + return (await BarcodeScanner.requestPermissions()).camera === "granted"; + } + }; const handleConnectWallet = (id: string) => { if (/^b[1-9A-HJ-NP-Za-km-z]{33}/.test(id)) { @@ -444,96 +537,6 @@ const Scanner = forwardRef( handleResolveOobi(content); }; - const initScan = async () => { - if (!Capacitor.isNativePlatform() || mobileweb) return; - - const allowed = await checkPermission(); - setPermisson(!!allowed); - onCheckPermissionFinish?.(!!allowed); - - if (!allowed) return; - - if (scannerState.current !== "stopped") { - await stopScan(); - } - - try { - scannerState.current = "starting"; - const listener = await BarcodeScanner.addListener( - "barcodesScanned", - async (result) => { - await listener.remove(); - if (isHandlingQR.current || !result.barcodes?.length) return; - isHandlingQR.current = true; - await processValue(result.barcodes[0].rawValue); - } - ); - - await BarcodeScanner.startScan({ - formats: [BarcodeFormat.QrCode], - lensFacing: cameraDirection, - }); - - scannerState.current = "running"; - setScanning(true); - document?.querySelector("body")?.classList.add("scanner-active"); - } catch (error) { - setScanUnavailable(true); - await stopScan(); - showError("Error starting barcode scan:", error, dispatch); - } - }; - - useEffect(() => { - const onLoad = async () => { - if ( - routePath === TabsRoutePath.SCAN && - (isShowConnectionsModal || createIdentifierModalIsOpen) - ) { - await stopScan(); - return; - } - - const isDuplicateConnectionToast = currentToastMsgs.some( - (item) => ToastMsgType.DUPLICATE_CONNECTION === item.message - ); - const isRequestPending = currentToastMsgs.some((item) => - [ - ToastMsgType.CONNECTION_REQUEST_PENDING, - ToastMsgType.CREDENTIAL_REQUEST_PENDING, - ].includes(item.message) - ); - - const isScanning = - routePath === TabsRoutePath.SCAN || - [ - OperationType.SCAN_CONNECTION, - OperationType.SCAN_WALLET_CONNECTION, - OperationType.SCAN_SSI_BOOT_URL, - OperationType.SCAN_SSI_CONNECT_URL, - ].includes(currentOperation); - - const isMultisignScan = - [ - OperationType.MULTI_SIG_INITIATOR_SCAN, - OperationType.MULTI_SIG_RECEIVER_SCAN, - ].includes(currentOperation) && !isDuplicateConnectionToast; - - if ((isScanning && !isRequestPending) || isMultisignScan) { - await initScan(); - } else { - await stopScan(); - } - }; - onLoad(); - }, [ - currentOperation, - routePath, - isShowConnectionsModal, - createIdentifierModalIsOpen, - currentToastMsgs, - ]); - useEffect(() => { return () => { stopScan(); @@ -654,6 +657,7 @@ const Scanner = forwardRef( ) : (
From 19ae9b508572470e6a1bdf9b04e19eac361de9ec Mon Sep 17 00:00:00 2001 From: J Caso Date: Thu, 27 Feb 2025 17:14:26 +0100 Subject: [PATCH 3/7] fix: use black color as var --- src/ui/components/Scanner/Scanner.scss | 2 +- src/ui/styles/colors.scss | 2 ++ 2 files changed, 3 insertions(+), 1 deletion(-) diff --git a/src/ui/components/Scanner/Scanner.scss b/src/ui/components/Scanner/Scanner.scss index a7d2747e6..496f94c1b 100644 --- a/src/ui/components/Scanner/Scanner.scss +++ b/src/ui/components/Scanner/Scanner.scss @@ -81,7 +81,7 @@ ion-grid.qr-code-scanner { &.transitioning { .scanner-spinner-container { - background: #000000; + background: var(--ion-color-black-900); } } diff --git a/src/ui/styles/colors.scss b/src/ui/styles/colors.scss index 7388e6f6a..398f65649 100644 --- a/src/ui/styles/colors.scss +++ b/src/ui/styles/colors.scss @@ -56,6 +56,8 @@ --ion-color-danger-contrast: var(--ion-color-neutral-100); --ion-item-background: var(--ion-color-neutral-100); + --ion-color-black-900: #000000; + --ion-color-card-theme-one: linear-gradient( 90.04deg, var(--ion-color-theme-one-primary) 28.46%, From 5f0c8bf7a5adac966ded9671d63c9a7d0acad494 Mon Sep 17 00:00:00 2001 From: J Caso Date: Thu, 27 Feb 2025 18:03:07 +0100 Subject: [PATCH 4/7] fix: removed duplicated bg --- src/ui/components/Scanner/Scanner.tsx | 93 +++++++++++++-------------- 1 file changed, 46 insertions(+), 47 deletions(-) diff --git a/src/ui/components/Scanner/Scanner.tsx b/src/ui/components/Scanner/Scanner.tsx index 96ed7c375..73b058aa7 100644 --- a/src/ui/components/Scanner/Scanner.tsx +++ b/src/ui/components/Scanner/Scanner.tsx @@ -568,50 +568,50 @@ const Scanner = forwardRef( const RenderPageFooter = () => { switch (currentOperation) { - case OperationType.SCAN_WALLET_CONNECTION: - return ( - - ); - case OperationType.MULTI_SIG_INITIATOR_SCAN: - return ( - - ); - case OperationType.MULTI_SIG_RECEIVER_SCAN: - return ( - - ); - case OperationType.SCAN_SSI_BOOT_URL: - case OperationType.SCAN_SSI_CONNECT_URL: - return
; - default: - return ( - - ); + case OperationType.SCAN_WALLET_CONNECTION: + return ( + + ); + case OperationType.MULTI_SIG_INITIATOR_SCAN: + return ( + + ); + case OperationType.MULTI_SIG_RECEIVER_SCAN: + return ( + + ); + case OperationType.SCAN_SSI_BOOT_URL: + case OperationType.SCAN_SSI_CONNECT_URL: + return
; + default: + return ( + + ); } }; @@ -657,7 +657,6 @@ const Scanner = forwardRef( ) : (
@@ -691,10 +690,10 @@ const Scanner = forwardRef( currentOperation === OperationType.MULTI_SIG_RECEIVER_SCAN ? `${i18n.t("createidentifier.scan.pasteoobi")}` : currentOperation === OperationType.SCAN_WALLET_CONNECTION - ? i18n.t( + ? i18n.t( "tabs.menu.tab.items.connectwallet.inputpidmodal.header" ) - : `${i18n.t("createidentifier.scan.pastecontents")}` + : `${i18n.t("createidentifier.scan.pastecontents")}` }`, actionButton: true, actionButtonDisabled: !pastedValue, From 21180b6b3bfbabd337d06fd460a2533fc7469d26 Mon Sep 17 00:00:00 2001 From: J Caso Date: Thu, 27 Feb 2025 18:04:00 +0100 Subject: [PATCH 5/7] fix: refactor black color --- src/ui/styles/colors.scss | 3 +-- 1 file changed, 1 insertion(+), 2 deletions(-) diff --git a/src/ui/styles/colors.scss b/src/ui/styles/colors.scss index 398f65649..37f39799d 100644 --- a/src/ui/styles/colors.scss +++ b/src/ui/styles/colors.scss @@ -48,6 +48,7 @@ --ion-color-error-800-rgb: 163, 0, 0; + --ion-color-black-900: #000000; --ion-color-archive-400: #531fad; --ion-color-primary: var(--ion-color-neutral-700); @@ -56,8 +57,6 @@ --ion-color-danger-contrast: var(--ion-color-neutral-100); --ion-item-background: var(--ion-color-neutral-100); - --ion-color-black-900: #000000; - --ion-color-card-theme-one: linear-gradient( 90.04deg, var(--ion-color-theme-one-primary) 28.46%, From 11938b5595a8cd039951ebf4131079976132da76 Mon Sep 17 00:00:00 2001 From: J Caso Date: Mon, 3 Mar 2025 10:27:40 +0100 Subject: [PATCH 6/7] fix: hidden buttons --- src/ui/components/Scanner/Scanner.scss | 8 +- src/ui/components/Scanner/Scanner.tsx | 233 ++++++++++++------------- 2 files changed, 108 insertions(+), 133 deletions(-) diff --git a/src/ui/components/Scanner/Scanner.scss b/src/ui/components/Scanner/Scanner.scss index 496f94c1b..b331ccbce 100644 --- a/src/ui/components/Scanner/Scanner.scss +++ b/src/ui/components/Scanner/Scanner.scss @@ -76,13 +76,7 @@ ion-grid.qr-code-scanner { width: 100%; align-items: center; justify-content: center; - background: rgba(var(--ion-color-neutral-700-rgb), 0.2); - } - - &.transitioning { - .scanner-spinner-container { - background: var(--ion-color-black-900); - } + background: var(--ion-color-black-900); } .page-footer .secondary-button { diff --git a/src/ui/components/Scanner/Scanner.tsx b/src/ui/components/Scanner/Scanner.tsx index 73b058aa7..b1ccb3274 100644 --- a/src/ui/components/Scanner/Scanner.tsx +++ b/src/ui/components/Scanner/Scanner.tsx @@ -22,7 +22,7 @@ import { } from "react"; import { Agent } from "../../../core/agent/agent"; import { - KeriConnectionType, + OobiType, OOBI_AGENT_ONLY_RE, WOOBI_RE, } from "../../../core/agent/agent.types"; @@ -103,9 +103,8 @@ const Scanner = forwardRef( const [groupIdentifierOpen, setGroupIdentifierOpen] = useState(false); const [resumeMultiSig, setResumeMultiSig] = useState(null); - const [isTransitioning, setIsTransitioning] = useState(false); const isHandlingQR = useRef(false); - const scannerState = useRef<"stopped" | "starting" | "running">("stopped"); + const [isTransitioning, setIsTransitioning] = useState(false); useEffect(() => { if (platforms.includes("mobileweb")) { @@ -117,6 +116,46 @@ const Scanner = forwardRef( stopScan, })); + const initScan = async () => { + if (Capacitor.isNativePlatform()) { + const allowed = await checkPermission(); + setPermisson(!!allowed); + onCheckPermissionFinish?.(!!allowed); + + if (allowed) { + await BarcodeScanner.removeAllListeners(); + const listener = await BarcodeScanner.addListener( + "barcodesScanned", + async (result) => { + await listener.remove(); + if (isHandlingQR.current) return; + isHandlingQR.current = true; + if (!result.barcodes?.length) return; + await processValue(result.barcodes[0].rawValue); + } + ); + + try { + await BarcodeScanner.startScan({ + formats: [BarcodeFormat.QrCode], + lensFacing: cameraDirection, + }); + } catch (error) { + showError("Error starting barcode scan:", error); + setScanUnavailable(true); + stopScan(); + } + } + + document?.querySelector("body")?.classList.add("scanner-active"); + setScanning(true); + document?.querySelector("body")?.classList.add("scanner-active"); + document + ?.querySelector("body.scanner-active > div:last-child") + ?.classList.remove("hide"); + } + }; + useEffect(() => { const onLoad = async () => { if ( @@ -169,20 +208,8 @@ const Scanner = forwardRef( useEffect(() => { const handleCameraChange = async () => { - if ( - !scanning || - !Capacitor.isNativePlatform() || - isTransitioning || - scannerState.current === "starting" - ) { - return; - } - setIsTransitioning(true); - if (scannerState.current === "running") { - await stopScan(); - } - + await stopScan(); await initScan(); setIsTransitioning(false); }; @@ -190,61 +217,11 @@ const Scanner = forwardRef( handleCameraChange(); }, [cameraDirection]); - const stopScan = async () => { - if (!permission || !Capacitor.isNativePlatform()) { - setScanning(false); - document?.querySelector("body")?.classList.remove("scanner-active"); - scannerState.current = "stopped"; - return; - } - - await BarcodeScanner.stopScan(); - await BarcodeScanner.removeAllListeners(); - scannerState.current = "stopped"; - setScanning(false); - document?.querySelector("body")?.classList.remove("scanner-active"); - setGroupId(""); - }; - - const initScan = async () => { - if (!Capacitor.isNativePlatform() || mobileweb) return; - - const allowed = await checkPermission(); - setPermisson(!!allowed); - onCheckPermissionFinish?.(!!allowed); - - if (!allowed) return; - - if (scannerState.current !== "stopped") { - await stopScan(); - } - - try { - scannerState.current = "starting"; - const listener = await BarcodeScanner.addListener( - "barcodesScanned", - async (result) => { - await listener.remove(); - if (isHandlingQR.current || !result.barcodes?.length) return; - isHandlingQR.current = true; - await processValue(result.barcodes[0].rawValue); - } - ); - - await BarcodeScanner.startScan({ - formats: [BarcodeFormat.QrCode], - lensFacing: cameraDirection, - }); - - scannerState.current = "running"; - setScanning(true); - document?.querySelector("body")?.classList.add("scanner-active"); - } catch (error) { - setScanUnavailable(true); - await stopScan(); - showError("Error starting barcode scan:", error, dispatch); - } - }; + useEffect(() => { + return () => { + stopScan(); + }; + }, []); const checkPermission = async () => { const status = await BarcodeScanner.checkPermissions(); @@ -259,6 +236,17 @@ const Scanner = forwardRef( } }; + const stopScan = async () => { + if (permission) { + await BarcodeScanner.stopScan(); + await BarcodeScanner.removeAllListeners(); + } + + setScanning(false); + document?.querySelector("body")?.classList.remove("scanner-active"); + setGroupId(""); + }; + const handleConnectWallet = (id: string) => { if (/^b[1-9A-HJ-NP-Za-km-z]{33}/.test(id)) { dispatch(setToastMsg(ToastMsgType.PEER_ID_SUCCESS)); @@ -390,7 +378,7 @@ const Scanner = forwardRef( content ); - if (invitation.type === KeriConnectionType.NORMAL) { + if (invitation.type === OobiType.NORMAL) { setIsValueCaptured && setIsValueCaptured(true); const scanMultiSigByTab = routePath === TabsRoutePath.SCAN; @@ -413,7 +401,7 @@ const Scanner = forwardRef( } } - if (invitation.type === KeriConnectionType.MULTI_SIG_INITIATOR) { + if (invitation.type === OobiType.MULTI_SIG_INITIATOR) { setGroupId(invitation.groupId); dispatch(updateOrAddMultisigConnectionCache(invitation.connection)); setCreateIdentifierModalIsOpen(true); @@ -537,12 +525,6 @@ const Scanner = forwardRef( handleResolveOobi(content); }; - useEffect(() => { - return () => { - stopScan(); - }; - }, []); - const handlePrimaryButtonAction = () => { stopScan(); dispatch(setCurrentOperation(OperationType.MULTI_SIG_INITIATOR_INIT)); @@ -568,57 +550,56 @@ const Scanner = forwardRef( const RenderPageFooter = () => { switch (currentOperation) { - case OperationType.SCAN_WALLET_CONNECTION: - return ( - - ); - case OperationType.MULTI_SIG_INITIATOR_SCAN: - return ( - - ); - case OperationType.MULTI_SIG_RECEIVER_SCAN: - return ( - - ); - case OperationType.SCAN_SSI_BOOT_URL: - case OperationType.SCAN_SSI_CONNECT_URL: - return
; - default: - return ( - - ); + case OperationType.SCAN_WALLET_CONNECTION: + return ( + + ); + case OperationType.MULTI_SIG_INITIATOR_SCAN: + return ( + + ); + case OperationType.MULTI_SIG_RECEIVER_SCAN: + return ( + + ); + case OperationType.SCAN_SSI_BOOT_URL: + case OperationType.SCAN_SSI_CONNECT_URL: + return
; + default: + return ( + + ); } }; const containerClass = combineClassNames("qr-code-scanner", { "no-permission": !permission || mobileweb, "scan-unavailable": scanUnavailable, - transitioning: isTransitioning, }); return ( @@ -690,10 +671,10 @@ const Scanner = forwardRef( currentOperation === OperationType.MULTI_SIG_RECEIVER_SCAN ? `${i18n.t("createidentifier.scan.pasteoobi")}` : currentOperation === OperationType.SCAN_WALLET_CONNECTION - ? i18n.t( + ? i18n.t( "tabs.menu.tab.items.connectwallet.inputpidmodal.header" ) - : `${i18n.t("createidentifier.scan.pastecontents")}` + : `${i18n.t("createidentifier.scan.pastecontents")}` }`, actionButton: true, actionButtonDisabled: !pastedValue, From b4d34ed4745d1225caa2da9b20819fb52664da53 Mon Sep 17 00:00:00 2001 From: J Caso Date: Mon, 3 Mar 2025 13:06:59 +0100 Subject: [PATCH 7/7] fix: set isAlreadyLoaded flag --- src/ui/components/Scanner/Scanner.tsx | 3 +++ 1 file changed, 3 insertions(+) diff --git a/src/ui/components/Scanner/Scanner.tsx b/src/ui/components/Scanner/Scanner.tsx index b1ccb3274..c92b453d1 100644 --- a/src/ui/components/Scanner/Scanner.tsx +++ b/src/ui/components/Scanner/Scanner.tsx @@ -105,6 +105,7 @@ const Scanner = forwardRef( useState(null); const isHandlingQR = useRef(false); const [isTransitioning, setIsTransitioning] = useState(false); + const [isAlreadyLoaded, setIsAlreadyLoaded] = useState(false); useEffect(() => { if (platforms.includes("mobileweb")) { @@ -196,6 +197,7 @@ const Scanner = forwardRef( } else { await stopScan(); } + setIsAlreadyLoaded(true); }; onLoad(); }, [ @@ -214,6 +216,7 @@ const Scanner = forwardRef( setIsTransitioning(false); }; + if (!isAlreadyLoaded) return; handleCameraChange(); }, [cameraDirection]);