From 5609a35f61d5ccdbadb218a233834ef0caa5e01e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juan=20Jos=C3=A9=20Ram=C3=ADrez?= <artjjrn@gmail.com>
Date: Mon, 13 Jul 2026 20:57:14 -0300
Subject: [PATCH 1/2] refactor: remove StartVerificationView interstitial
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Every KYC entry point except the card flow and first-time region KYC
already skipped this screen via autoStart/skipStartView — and in both
remaining flows the user had just tapped an explicit CTA, making it a
redundant double-consent step. The Sumsub SDK never needed it: it inits
off token + container, proven by the autoStart paths in prod.

Also unifies the exit-confirmation copy on the 'Exit for now?' variant;
the 'start again from scratch' copy was wrong anyway (Sumsub persists
applicant progress).
---
 .../add-money/[country]/bank/page.tsx         |  2 +-
 src/app/(mobile-ui)/qr-pay/page.tsx           |  1 -
 src/app/(mobile-ui)/withdraw/manteca/page.tsx |  1 -
 .../IframeWrapper/StartVerificationView.tsx   | 53 ----------
 src/components/Global/IframeWrapper/index.tsx | 82 +++++++---------
 src/components/Kyc/BridgeTosStep.tsx          |  2 +-
 src/components/Kyc/KycStatusDrawer.tsx        |  2 +-
 src/components/Kyc/SumsubKycModals.tsx        | 11 +--
 src/components/Kyc/SumsubKycWrapper.tsx       | 98 ++++++-------------
 .../Profile/views/UnlockedRegions.view.tsx    | 16 +--
 .../components/IncreaseLimitsButton.tsx       |  1 -
 11 files changed, 74 insertions(+), 195 deletions(-)
 delete mode 100644 src/components/Global/IframeWrapper/StartVerificationView.tsx

diff --git a/src/app/(mobile-ui)/add-money/[country]/bank/page.tsx b/src/app/(mobile-ui)/add-money/[country]/bank/page.tsx
index 9c99f92cb9..33c56d53c7 100644
--- a/src/app/(mobile-ui)/add-money/[country]/bank/page.tsx
+++ b/src/app/(mobile-ui)/add-money/[country]/bank/page.tsx
@@ -515,7 +515,7 @@ export default function OnrampBankPage() {
                     message={pendingModal.message}
                 />
 
-                <SumsubKycModals flow={sumsubFlow} autoStartSdk />
+                <SumsubKycModals flow={sumsubFlow} />
 
                 <BridgeTosStep
                     visible={showBridgeTos}
diff --git a/src/app/(mobile-ui)/qr-pay/page.tsx b/src/app/(mobile-ui)/qr-pay/page.tsx
index a5e11a4b33..8d26d9feba 100644
--- a/src/app/(mobile-ui)/qr-pay/page.tsx
+++ b/src/app/(mobile-ui)/qr-pay/page.tsx
@@ -1471,7 +1471,6 @@ export default function QRPayPage() {
                 onClose={qrLimitIncreaseFlow.handleClose}
                 onComplete={qrLimitIncreaseFlow.handleSdkComplete}
                 onRefreshToken={qrLimitIncreaseFlow.refreshToken}
-                autoStart
                 isMultiLevel
             />
             <div className={`flex min-h-[inherit] flex-col gap-8 ${getShakeClass(isShaking, shakeIntensity)}`}>
diff --git a/src/app/(mobile-ui)/withdraw/manteca/page.tsx b/src/app/(mobile-ui)/withdraw/manteca/page.tsx
index 4501750936..c5d99913fe 100644
--- a/src/app/(mobile-ui)/withdraw/manteca/page.tsx
+++ b/src/app/(mobile-ui)/withdraw/manteca/page.tsx
@@ -664,7 +664,6 @@ function MantecaBankWithdrawFlow() {
                 onClose={limitIncreaseFlow.handleClose}
                 onComplete={limitIncreaseFlow.handleSdkComplete}
                 onRefreshToken={limitIncreaseFlow.refreshToken}
-                autoStart
                 isMultiLevel
             />
             <NavHeader
diff --git a/src/components/Global/IframeWrapper/StartVerificationView.tsx b/src/components/Global/IframeWrapper/StartVerificationView.tsx
deleted file mode 100644
index 03a224783a..0000000000
--- a/src/components/Global/IframeWrapper/StartVerificationView.tsx
+++ /dev/null
@@ -1,53 +0,0 @@
-'use client'
-
-import { PeanutThinking } from '@/assets/mascot'
-import { Button } from '@/components/0_Bruddle/Button'
-import CloudsBackground from '@/components/0_Bruddle/CloudsBackground'
-import Image from 'next/image'
-import NavHeader from '../NavHeader'
-
-const StartVerificationView = ({
-    onStartVerification,
-    onClose,
-}: {
-    onStartVerification: () => void
-    onClose: () => void
-}) => {
-    return (
-        <div className="flex h-full w-full flex-col">
-            <div className="relative flex h-[45%] items-center justify-center bg-secondary-3/100">
-                <CloudsBackground minimal />
-                <Image
-                    src={PeanutThinking.src}
-                    unoptimized
-                    alt="verification"
-                    className="relative w-full max-w-72 object-contain md:max-w-80"
-                    height={100}
-                    width={100}
-                />
-                <div className="absolute right-5 top-5">
-                    <NavHeader icon="cancel" onPrev={onClose} />
-                </div>
-            </div>
-
-            <div className="flex h-[55%] flex-col bg-white p-4">
-                <h1 className="text-3xl font-extrabold">Secure Verification. Limited Data Use.</h1>
-                <div>
-                    <p className="mt-2 text-lg font-medium">
-                        The verification is done using a trusted provider, which shares your verification status with
-                        Peanut.
-                    </p>
-                    <p className="text-lg font-medium">
-                        It operates under industry-standard security and privacy practices.
-                    </p>
-                    <p className="text-lg font-bold">Peanut never sees or stores your verification data.</p>
-                </div>
-                <Button onClick={onStartVerification} className="my-auto" variant="purple" shadowSize="4">
-                    Start Secure Verification
-                </Button>
-            </div>
-        </div>
-    )
-}
-
-export default StartVerificationView
diff --git a/src/components/Global/IframeWrapper/index.tsx b/src/components/Global/IframeWrapper/index.tsx
index 400ea683ab..503f4f6389 100644
--- a/src/components/Global/IframeWrapper/index.tsx
+++ b/src/components/Global/IframeWrapper/index.tsx
@@ -3,7 +3,6 @@ import Modal from '../Modal'
 import { Icon, type IconName } from '../Icons/Icon'
 import ActionModal from '../ActionModal'
 import { useRouter } from 'next/navigation'
-import StartVerificationView from './StartVerificationView'
 import { useModalsContext } from '@/context/ModalsContext'
 import { Button, type ButtonVariant } from '@/components/0_Bruddle/Button'
 
@@ -12,15 +11,13 @@ export type IFrameWrapperProps = {
     visible: boolean
     onClose: (source?: 'manual' | 'completed' | 'tos_accepted') => void
     closeConfirmMessage?: string
-    skipStartView?: boolean
 }
 
-const IframeWrapper = ({ src, visible, onClose, closeConfirmMessage, skipStartView }: IFrameWrapperProps) => {
+const IframeWrapper = ({ src, visible, onClose, closeConfirmMessage }: IFrameWrapperProps) => {
     const enableConfirmationPrompt = closeConfirmMessage !== undefined
     const [isHelpModalOpen, setIsHelpModalOpen] = useState(false)
     const [modalVariant, setModalVariant] = useState<'stop-verification' | 'trouble'>('trouble')
     const [copied, setCopied] = useState(false)
-    const [isVerificationStarted, setIsVerificationStarted] = useState(skipStartView ?? false)
     const router = useRouter()
     const { setIsSupportModalOpen } = useModalsContext()
 
@@ -72,8 +69,8 @@ const IframeWrapper = ({ src, visible, onClose, closeConfirmMessage, skipStartVi
         }
 
         return {
-            title: 'Exit and lose progress?',
-            description: 'If you exit now, you’ll need to start the ID check again from scratch.',
+            title: 'Exit for now?',
+            description: 'You can pick up where you left off later — your progress is saved.',
             icon: 'alert' as IconName,
             iconContainerClassName: 'bg-secondary-1',
             ctas: [
@@ -135,49 +132,42 @@ const IframeWrapper = ({ src, visible, onClose, closeConfirmMessage, skipStartVi
             preventClose={true}
             hideOverlay={false}
         >
-            {!isVerificationStarted ? (
-                <StartVerificationView
-                    onClose={() => onClose('manual')}
-                    onStartVerification={() => setIsVerificationStarted(true)}
-                />
-            ) : (
-                <div className="flex h-full flex-col gap-2 p-0">
-                    <div className="h-full w-full flex-grow overflow-scroll">
-                        <iframe
-                            key={src}
-                            src={src}
-                            allow="camera *; microphone *; fullscreen *"
-                            style={{ width: '100%', height: '85%', border: 'none' }}
-                            className="rounded-md"
-                            sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-modals allow-top-navigation-by-user-activation allow-media-devices"
-                        />
-                        <div className="flex h-[15%] w-full flex-col items-center justify-center gap-2 px-5">
-                            <Button
-                                variant={'transparent'}
-                                className={`h-8 max-w-md font-normal underline`}
-                                onClick={() => {
-                                    setModalVariant('stop-verification')
-                                    setIsHelpModalOpen(true)
-                                }}
-                                shadowType="primary"
-                            >
-                                Stop verification process
-                            </Button>
+            <div className="flex h-full flex-col gap-2 p-0">
+                <div className="h-full w-full flex-grow overflow-scroll">
+                    <iframe
+                        key={src}
+                        src={src}
+                        allow="camera *; microphone *; fullscreen *"
+                        style={{ width: '100%', height: '85%', border: 'none' }}
+                        className="rounded-md"
+                        sandbox="allow-same-origin allow-scripts allow-forms allow-popups allow-modals allow-top-navigation-by-user-activation allow-media-devices"
+                    />
+                    <div className="flex h-[15%] w-full flex-col items-center justify-center gap-2 px-5">
+                        <Button
+                            variant={'transparent'}
+                            className={`h-8 max-w-md font-normal underline`}
+                            onClick={() => {
+                                setModalVariant('stop-verification')
+                                setIsHelpModalOpen(true)
+                            }}
+                            shadowType="primary"
+                        >
+                            Stop verification process
+                        </Button>
 
-                            <button
-                                onClick={() => {
-                                    setModalVariant('trouble')
-                                    setIsHelpModalOpen(true)
-                                }}
-                                className="flex items-center gap-1"
-                            >
-                                <Icon name="peanut-support" size={16} className="text-grey-1" />
-                                <p className="text-xs font-medium text-grey-1 underline">Having trouble?</p>
-                            </button>
-                        </div>
+                        <button
+                            onClick={() => {
+                                setModalVariant('trouble')
+                                setIsHelpModalOpen(true)
+                            }}
+                            className="flex items-center gap-1"
+                        >
+                            <Icon name="peanut-support" size={16} className="text-grey-1" />
+                            <p className="text-xs font-medium text-grey-1 underline">Having trouble?</p>
+                        </button>
                     </div>
                 </div>
-            )}
+            </div>
             <ActionModal
                 visible={isHelpModalOpen}
                 onClose={() => setIsHelpModalOpen(false)}
diff --git a/src/components/Kyc/BridgeTosStep.tsx b/src/components/Kyc/BridgeTosStep.tsx
index 4f71683068..44c4e1aad0 100644
--- a/src/components/Kyc/BridgeTosStep.tsx
+++ b/src/components/Kyc/BridgeTosStep.tsx
@@ -136,7 +136,7 @@ export const BridgeTosStep = ({ visible, onComplete, onSkip, reasonCode }: Bridg
                 ]}
             />
 
-            {tosLink && <IframeWrapper src={tosLink} visible={showIframe} onClose={handleIframeClose} skipStartView />}
+            {tosLink && <IframeWrapper src={tosLink} visible={showIframe} onClose={handleIframeClose} />}
         </>
     )
 }
diff --git a/src/components/Kyc/KycStatusDrawer.tsx b/src/components/Kyc/KycStatusDrawer.tsx
index 7f64e4222e..f538d54972 100644
--- a/src/components/Kyc/KycStatusDrawer.tsx
+++ b/src/components/Kyc/KycStatusDrawer.tsx
@@ -89,7 +89,7 @@ export const KycStatusDrawer = ({ isOpen, onClose, onKeepMounted }: KycStatusDra
                     {sumsubFlow.error && <p className="text-red-500 mt-3 text-center text-sm">{sumsubFlow.error}</p>}
                 </DrawerContent>
             </Drawer>
-            <SumsubKycModals flow={sumsubFlow} autoStartSdk />
+            <SumsubKycModals flow={sumsubFlow} />
         </>
     )
 }
diff --git a/src/components/Kyc/SumsubKycModals.tsx b/src/components/Kyc/SumsubKycModals.tsx
index 7d413c61ca..c081b04996 100644
--- a/src/components/Kyc/SumsubKycModals.tsx
+++ b/src/components/Kyc/SumsubKycModals.tsx
@@ -5,7 +5,6 @@ import { type useMultiPhaseKycFlow } from '@/hooks/useMultiPhaseKycFlow'
 
 interface SumsubKycModalsProps {
     flow: ReturnType<typeof useMultiPhaseKycFlow>
-    autoStartSdk?: boolean
 }
 
 /**
@@ -15,7 +14,7 @@ interface SumsubKycModalsProps {
  *
  * pair with useMultiPhaseKycFlow hook for the logic.
  */
-export const SumsubKycModals = ({ flow, autoStartSdk }: SumsubKycModalsProps) => {
+export const SumsubKycModals = ({ flow }: SumsubKycModalsProps) => {
     return (
         <>
             <SumsubKycWrapper
@@ -24,7 +23,6 @@ export const SumsubKycModals = ({ flow, autoStartSdk }: SumsubKycModalsProps) =>
                 onClose={flow.handleSdkClose}
                 onComplete={flow.handleSdkComplete}
                 onRefreshToken={flow.refreshToken}
-                autoStart={autoStartSdk}
                 isMultiLevel={flow.isMultiLevel}
             />
 
@@ -42,12 +40,7 @@ export const SumsubKycModals = ({ flow, autoStartSdk }: SumsubKycModalsProps) =>
             />
 
             {flow.tosLink && (
-                <IframeWrapper
-                    src={flow.tosLink}
-                    visible={flow.showTosIframe}
-                    onClose={flow.handleTosIframeClose}
-                    skipStartView
-                />
+                <IframeWrapper src={flow.tosLink} visible={flow.showTosIframe} onClose={flow.handleTosIframeClose} />
             )}
         </>
     )
diff --git a/src/components/Kyc/SumsubKycWrapper.tsx b/src/components/Kyc/SumsubKycWrapper.tsx
index a23b4834d5..861c7d8bfa 100644
--- a/src/components/Kyc/SumsubKycWrapper.tsx
+++ b/src/components/Kyc/SumsubKycWrapper.tsx
@@ -6,7 +6,6 @@ import ActionModal from '@/components/Global/ActionModal'
 import { Icon, type IconName } from '@/components/Global/Icons/Icon'
 import { Button, type ButtonVariant } from '@/components/0_Bruddle/Button'
 import { useModalsContext } from '@/context/ModalsContext'
-import StartVerificationView from '../Global/IframeWrapper/StartVerificationView'
 import { evaluateSumsubStatusEvent, type SumsubStatusEventPayload } from './sumsubStatusEvent.utils'
 
 // todo: move to consts
@@ -19,8 +18,6 @@ interface SumsubKycWrapperProps {
     onComplete: () => void
     onError?: (error: unknown) => void
     onRefreshToken: () => Promise<string>
-    /** skip StartVerificationView and launch SDK immediately (for re-submissions) */
-    autoStart?: boolean
     /** multi-level workflow (e.g. LATAM) — don't close SDK on Level 1 submission */
     isMultiLevel?: boolean
 }
@@ -32,10 +29,8 @@ export const SumsubKycWrapper = ({
     onComplete,
     onError,
     onRefreshToken,
-    autoStart,
     isMultiLevel,
 }: SumsubKycWrapperProps) => {
-    const [isVerificationStarted, setIsVerificationStarted] = useState(false)
     const [sdkLoaded, setSdkLoaded] = useState(false)
     const [sdkLoadError, setSdkLoadError] = useState(false)
     const [isHelpModalOpen, setIsHelpModalOpen] = useState(false)
@@ -86,9 +81,9 @@ export const SumsubKycWrapper = ({
         document.head.appendChild(script)
     }, [])
 
-    // initialize sdk when verification starts and all deps are ready
+    // initialize sdk as soon as the modal is visible and all deps are ready
     useEffect(() => {
-        if (!isVerificationStarted || !accessToken || !sdkLoaded || !sdkContainerRef.current) return
+        if (!visible || !accessToken || !sdkLoaded || !sdkContainerRef.current) return
 
         // clean up previous instance
         if (sdkInstanceRef.current) {
@@ -211,12 +206,11 @@ export const SumsubKycWrapper = ({
                 sdkInstanceRef.current = null
             }
         }
-    }, [isVerificationStarted, accessToken, sdkLoaded, stableOnComplete, stableOnError, stableOnRefreshToken])
+    }, [visible, accessToken, sdkLoaded, stableOnComplete, stableOnError, stableOnRefreshToken])
 
-    // reset state when modal closes, auto-start on re-submission
+    // reset state when modal closes
     useEffect(() => {
         if (!visible) {
-            setIsVerificationStarted(false)
             setSdkLoadError(false)
             hasSubmittedRef.current = false
             if (sdkInstanceRef.current) {
@@ -227,11 +221,8 @@ export const SumsubKycWrapper = ({
                 }
                 sdkInstanceRef.current = null
             }
-        } else if (autoStart) {
-            // skip StartVerificationView on re-submission (user already consented)
-            setIsVerificationStarted(true)
         }
-    }, [visible, autoStart])
+    }, [visible])
 
     // Close-button handler. After the user has submitted, the "are you sure
     // you want to stop?" modal is misleading — they're done, not abandoning.
@@ -269,54 +260,30 @@ export const SumsubKycWrapper = ({
             }
         }
 
-        return autoStart
-            ? {
-                  title: 'Exit for now?',
-                  description: 'You can pick up where you left off later — your progress is saved.',
-                  icon: 'alert' as IconName,
-                  iconContainerClassName: 'bg-secondary-1',
-                  ctas: [
-                      {
-                          text: 'Exit',
-                          onClick: () => {
-                              setIsHelpModalOpen(false)
-                              onClose()
-                          },
-                          variant: 'purple' as ButtonVariant,
-                          shadowSize: '4' as const,
-                      },
-                      {
-                          text: 'Continue',
-                          onClick: () => setIsHelpModalOpen(false),
-                          variant: 'transparent' as ButtonVariant,
-                          className: 'underline text-sm font-medium w-full h-fit mt-3',
-                      },
-                  ],
-              }
-            : {
-                  title: 'Exit and lose progress?',
-                  description: "If you exit now, you'll need to start the ID check again from scratch.",
-                  icon: 'alert' as IconName,
-                  iconContainerClassName: 'bg-secondary-1',
-                  ctas: [
-                      {
-                          text: 'Exit',
-                          onClick: () => {
-                              setIsHelpModalOpen(false)
-                              onClose()
-                          },
-                          variant: 'purple' as ButtonVariant,
-                          shadowSize: '4' as const,
-                      },
-                      {
-                          text: 'Keep going',
-                          onClick: () => setIsHelpModalOpen(false),
-                          variant: 'transparent' as ButtonVariant,
-                          className: 'underline text-sm font-medium w-full h-fit mt-3',
-                      },
-                  ],
-              }
-    }, [autoStart, modalVariant, onClose, setIsSupportModalOpen])
+        return {
+            title: 'Exit for now?',
+            description: 'You can pick up where you left off later — your progress is saved.',
+            icon: 'alert' as IconName,
+            iconContainerClassName: 'bg-secondary-1',
+            ctas: [
+                {
+                    text: 'Exit',
+                    onClick: () => {
+                        setIsHelpModalOpen(false)
+                        onClose()
+                    },
+                    variant: 'purple' as ButtonVariant,
+                    shadowSize: '4' as const,
+                },
+                {
+                    text: 'Continue',
+                    onClick: () => setIsHelpModalOpen(false),
+                    variant: 'transparent' as ButtonVariant,
+                    className: 'underline text-sm font-medium w-full h-fit mt-3',
+                },
+            ],
+        }
+    }, [modalVariant, onClose, setIsSupportModalOpen])
 
     return (
         <>
@@ -331,12 +298,7 @@ export const SumsubKycWrapper = ({
                 preventClose={true}
                 hideOverlay={false}
             >
-                {!isVerificationStarted ? (
-                    <StartVerificationView
-                        onClose={onClose}
-                        onStartVerification={() => setIsVerificationStarted(true)}
-                    />
-                ) : sdkLoadError ? (
+                {sdkLoadError ? (
                     <div className="flex h-full flex-col items-center justify-center gap-4 p-8">
                         <Icon name="alert" size={24} className="text-red-500" />
                         <p className="text-center text-lg font-medium">
diff --git a/src/components/Profile/views/UnlockedRegions.view.tsx b/src/components/Profile/views/UnlockedRegions.view.tsx
index 7660728c59..bd9eed9483 100644
--- a/src/components/Profile/views/UnlockedRegions.view.tsx
+++ b/src/components/Profile/views/UnlockedRegions.view.tsx
@@ -96,8 +96,6 @@ const UnlockedRegions = () => {
     // persist region intent for the duration of the kyc session so token refresh
     // and status checks use the correct template after the confirmation modal closes
     const [activeRegionIntent, setActiveRegionIntent] = useState<KYCRegionIntent | undefined>(undefined)
-    // skip StartVerificationView when re-submitting (user already consented)
-    const [autoStartSdk, setAutoStartSdk] = useState(false)
     // when an initiate fails, flow.error is set but the modal that triggered it
     // has already closed — show a dismissible error modal so the user isn't left
     // staring at a screen where "verify now" appeared to do nothing.
@@ -147,7 +145,6 @@ const UnlockedRegions = () => {
     const handleFinalKycSuccess = useCallback(() => {
         setSelectedRegion(null)
         setActiveRegionIntent(undefined)
-        setAutoStartSdk(false)
     }, [])
 
     const flow = useMultiPhaseKycFlow({
@@ -156,7 +153,6 @@ const UnlockedRegions = () => {
         onManualClose: () => {
             setSelectedRegion(null)
             setActiveRegionIntent(undefined)
-            setAutoStartSdk(false)
         },
     })
 
@@ -195,12 +191,6 @@ const UnlockedRegions = () => {
         await flow.handleInitiateKyc(intent, undefined, true)
     }, [flow.handleInitiateKyc, selectedRegion, hasCardAccess, hasActiveCard, router])
 
-    // re-submission: skip StartVerificationView since user already consented
-    const handleResubmitKyc = useCallback(async () => {
-        setAutoStartSdk(true)
-        await handleStartKyc()
-    }, [handleStartKyc])
-
     // ROW (rest-of-world) regions have no provider/rail, so an initiate there is a
     // terminal "not available in your region yet" — not a transient failure. Only
     // offer "Try again" for regions that can actually succeed on a retry.
@@ -249,7 +239,7 @@ const UnlockedRegions = () => {
             <KycActionRequiredModal
                 visible={modalVariant === 'action_required'}
                 onClose={handleModalClose}
-                onResubmit={handleResubmitKyc}
+                onResubmit={handleStartKyc}
                 isLoading={flow.isLoading}
                 rejectLabels={sumsubRejectLabels}
             />
@@ -257,7 +247,7 @@ const UnlockedRegions = () => {
             <KycFailedModal
                 visible={modalVariant === 'rejected'}
                 onClose={handleModalClose}
-                onRetry={handleResubmitKyc}
+                onRetry={handleStartKyc}
                 isLoading={flow.isLoading}
                 rejectLabels={sumsubRejectLabels}
                 rejectType={sumsubRejectType}
@@ -357,7 +347,7 @@ const UnlockedRegions = () => {
                 }
             />
 
-            <SumsubKycModals flow={flow} autoStartSdk={autoStartSdk} />
+            <SumsubKycModals flow={flow} />
         </div>
     )
 }
diff --git a/src/features/limits/components/IncreaseLimitsButton.tsx b/src/features/limits/components/IncreaseLimitsButton.tsx
index d363874643..3cc9c6ee39 100644
--- a/src/features/limits/components/IncreaseLimitsButton.tsx
+++ b/src/features/limits/components/IncreaseLimitsButton.tsx
@@ -65,7 +65,6 @@ export default function IncreaseLimitsButton() {
                 onClose={actionFlow.handleClose}
                 onComplete={actionFlow.handleSdkComplete}
                 onRefreshToken={actionFlow.refreshToken}
-                autoStart
                 isMultiLevel
             />
         </>

From baf2dc796976194ab9c93e0dcded6473be5af879 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Juan=20Jos=C3=A9=20Ram=C3=ADrez?= <artjjrn@gmail.com>
Date: Mon, 13 Jul 2026 21:17:58 -0300
Subject: [PATCH 2/2] fix: address code-review findings on SDK boot path
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Script-load effect keyed on window.snsWebSdk, not script-tag existence:
  a second wrapper instance could mark the SDK loaded while a sibling's
  script was still downloading, then init against undefined (blank modal).
- Init failure now flips sdkLoadError so the user gets the error UI +
  Close instead of an empty panel.
- Spinner behind the SDK container while the Sumsub iframe boots.
- IframeWrapper (Bridge ToS surfaces) gets honest exit copy — nothing is
  'saved' by closing an unaccepted ToS.
- Drop the reset-effect destroy block made redundant by visible being an
  init-effect dep; reword a cardApply.utils.ts comment that referenced
  the deleted interstitial.
---
 src/components/Card/cardApply.utils.ts        |  3 +-
 src/components/Global/IframeWrapper/index.tsx |  2 +-
 src/components/Kyc/SumsubKycWrapper.tsx       | 58 +++++++++++++------
 3 files changed, 43 insertions(+), 20 deletions(-)

diff --git a/src/components/Card/cardApply.utils.ts b/src/components/Card/cardApply.utils.ts
index 9c5591997c..367c96367b 100644
--- a/src/components/Card/cardApply.utils.ts
+++ b/src/components/Card/cardApply.utils.ts
@@ -5,8 +5,7 @@
  * aborted so the caller can show a retry message (or stop entirely).
  *
  * Without this, the immediate post-Sumsub re-apply races against Sumsub and
- * dumps the user back on the "Start Secure Verification" interstitial when
- * the WebSDK re-opens against an already-approved applicant. The signal lets
+ * re-opens the WebSDK against an already-approved applicant. The signal lets
  * the caller stop the loop on unmount so we don't burn 15 sequential fetches
  * after the user navigates away from the pending screen.
  */
diff --git a/src/components/Global/IframeWrapper/index.tsx b/src/components/Global/IframeWrapper/index.tsx
index 503f4f6389..1565b63345 100644
--- a/src/components/Global/IframeWrapper/index.tsx
+++ b/src/components/Global/IframeWrapper/index.tsx
@@ -70,7 +70,7 @@ const IframeWrapper = ({ src, visible, onClose, closeConfirmMessage }: IFrameWra
 
         return {
             title: 'Exit for now?',
-            description: 'You can pick up where you left off later — your progress is saved.',
+            description: 'You can come back and finish this anytime.',
             icon: 'alert' as IconName,
             iconContainerClassName: 'bg-secondary-1',
             ctas: [
diff --git a/src/components/Kyc/SumsubKycWrapper.tsx b/src/components/Kyc/SumsubKycWrapper.tsx
index 861c7d8bfa..e6b0b5d73e 100644
--- a/src/components/Kyc/SumsubKycWrapper.tsx
+++ b/src/components/Kyc/SumsubKycWrapper.tsx
@@ -5,6 +5,7 @@ import Modal from '@/components/Global/Modal'
 import ActionModal from '@/components/Global/ActionModal'
 import { Icon, type IconName } from '@/components/Global/Icons/Icon'
 import { Button, type ButtonVariant } from '@/components/0_Bruddle/Button'
+import Loading from '@/components/Global/Loading'
 import { useModalsContext } from '@/context/ModalsContext'
 import { evaluateSumsubStatusEvent, type SumsubStatusEventPayload } from './sumsubStatusEvent.utils'
 
@@ -63,22 +64,41 @@ export const SumsubKycWrapper = ({
 
     // load sumsub websdk script
     useEffect(() => {
+        if (window.snsWebSdk) {
+            setSdkLoaded(true)
+            return undefined
+        }
+
+        const handleLoaded = () => setSdkLoaded(true)
+        const handleError = () => {
+            console.error('[sumsub] failed to load websdk script')
+            setSdkLoadError(true)
+        }
+
         const existingScript = document.getElementById('sumsub-websdk')
         if (existingScript) {
-            setSdkLoaded(true)
-            return
+            // another wrapper instance appended the script and it's still
+            // downloading — a bare existence check would init against an
+            // undefined window.snsWebSdk
+            existingScript.addEventListener('load', handleLoaded)
+            existingScript.addEventListener('error', handleError)
+            // the script may have finished between the snsWebSdk check above
+            // and the listener attach — re-check so we don't wait forever
+            if (window.snsWebSdk) handleLoaded()
+            return () => {
+                existingScript.removeEventListener('load', handleLoaded)
+                existingScript.removeEventListener('error', handleError)
+            }
         }
 
         const script = document.createElement('script')
         script.id = 'sumsub-websdk'
         script.src = SUMSUB_SDK_URL
         script.async = true
-        script.onload = () => setSdkLoaded(true)
-        script.onerror = () => {
-            console.error('[sumsub] failed to load websdk script')
-            setSdkLoadError(true)
-        }
+        script.onload = handleLoaded
+        script.onerror = handleError
         document.head.appendChild(script)
+        return undefined
     }, [])
 
     // initialize sdk as soon as the modal is visible and all deps are ready
@@ -192,6 +212,8 @@ export const SumsubKycWrapper = ({
             }
         } catch (error) {
             console.error('[sumsub] failed to initialize sdk', error)
+            // surface the error UI — without this the modal stays blank
+            setSdkLoadError(true)
             stableOnError(error)
         }
 
@@ -208,19 +230,12 @@ export const SumsubKycWrapper = ({
         }
     }, [visible, accessToken, sdkLoaded, stableOnComplete, stableOnError, stableOnRefreshToken])
 
-    // reset state when modal closes
+    // reset state when modal closes (the init effect's cleanup already
+    // destroys the SDK instance — visible is one of its deps)
     useEffect(() => {
         if (!visible) {
             setSdkLoadError(false)
             hasSubmittedRef.current = false
-            if (sdkInstanceRef.current) {
-                try {
-                    sdkInstanceRef.current.destroy()
-                } catch {
-                    // ignore cleanup errors
-                }
-                sdkInstanceRef.current = null
-            }
         }
     }, [visible])
 
@@ -324,7 +339,16 @@ export const SumsubKycWrapper = ({
                                 <Icon name="cancel" size={24} />
                             </button>
                         </div>
-                        <div ref={sdkContainerRef} className="w-full flex-1 overflow-auto [&>iframe]:!min-h-full" />
+                        <div className="relative w-full flex-1">
+                            {/* sits behind the SDK iframe — covered once it paints */}
+                            <div className="absolute inset-0 flex items-center justify-center">
+                                <Loading className="h-8 w-8" />
+                            </div>
+                            <div
+                                ref={sdkContainerRef}
+                                className="relative h-full w-full overflow-auto [&>iframe]:!min-h-full"
+                            />
+                        </div>
                     </div>
                 )}
             </Modal>