From e17d776c8d98143deb755a27e26f6ea1cc8a7ece Mon Sep 17 00:00:00 2001
From: Taylor Ho <taylorkmho@gmail.com>
Date: Fri, 31 Jul 2026 11:45:55 -0700
Subject: [PATCH] fix(desktop): keep identity CTAs visible while loading

- Render the identity backup Next and Back actions during the perceptual key-creation hold
- Keep Back available while disabling Next until the completed identity state is revealed
- Cover loading and completed CTA states in the onboarding backup E2E flow

Co-authored-by: Taylor Ho <taylorkmho@gmail.com>
Signed-off-by: Taylor Ho <taylorkmho@gmail.com>
---
 .../src/features/onboarding/ui/BackupStep.tsx | 42 +++++++++----------
 desktop/tests/e2e/onboarding-backup.spec.ts   |  4 ++
 2 files changed, 24 insertions(+), 22 deletions(-)

diff --git a/desktop/src/features/onboarding/ui/BackupStep.tsx b/desktop/src/features/onboarding/ui/BackupStep.tsx
index 99d9c6324d..2367b9faf9 100644
--- a/desktop/src/features/onboarding/ui/BackupStep.tsx
+++ b/desktop/src/features/onboarding/ui/BackupStep.tsx
@@ -410,29 +410,27 @@ export function BackupStep({
         </div>
       )}
 
-      {created ? (
-        <OnboardingFooter className={REVEAL_ANIMATION_CLASS}>
-          <Button
-            className={ONBOARDING_PRIMARY_CTA_CLASS}
-            data-testid="onboarding-next"
-            disabled={backupNextDisabled()}
-            onClick={onNext}
-            type="button"
-          >
-            Next
-          </Button>
+      <OnboardingFooter className={REVEAL_ANIMATION_CLASS}>
+        <Button
+          className={ONBOARDING_PRIMARY_CTA_CLASS}
+          data-testid="onboarding-next"
+          disabled={!created || backupNextDisabled()}
+          onClick={onNext}
+          type="button"
+        >
+          Next
+        </Button>
 
-          <Button
-            className={ONBOARDING_SECONDARY_CTA_CLASS}
-            data-testid="onboarding-back"
-            onClick={onBack}
-            type="button"
-            variant="ghost"
-          >
-            Back
-          </Button>
-        </OnboardingFooter>
-      ) : null}
+        <Button
+          className={ONBOARDING_SECONDARY_CTA_CLASS}
+          data-testid="onboarding-back"
+          onClick={onBack}
+          type="button"
+          variant="ghost"
+        >
+          Back
+        </Button>
+      </OnboardingFooter>
     </OnboardingSlideTransition>
   );
 }
diff --git a/desktop/tests/e2e/onboarding-backup.spec.ts b/desktop/tests/e2e/onboarding-backup.spec.ts
index df3528c8bd..4b9040bd2b 100644
--- a/desktop/tests/e2e/onboarding-backup.spec.ts
+++ b/desktop/tests/e2e/onboarding-backup.spec.ts
@@ -59,6 +59,9 @@ test("backup step appears on fresh-key path after profile submit", async ({
     page.getByRole("heading", { name: "Creating your identity key" }),
   ).toBeVisible();
   await expect(page.getByTestId("backup-intro-logo")).toBeVisible();
+  await expect(page.getByTestId("onboarding-next")).toBeVisible();
+  await expect(page.getByTestId("onboarding-next")).toBeDisabled();
+  await expect(page.getByTestId("onboarding-back")).toBeEnabled();
 
   await expect(
     page.getByRole("heading", {
@@ -66,6 +69,7 @@ test("backup step appears on fresh-key path after profile submit", async ({
     }),
   ).toBeVisible();
   await expect(page.getByTestId("backup-intro-logo")).toHaveCount(0);
+  await expect(page.getByTestId("onboarding-next")).toBeEnabled();
 });
 
 // ---------------------------------------------------------------------------