diff --git a/desktop/src/features/onboarding/ui/BackupStep.tsx b/desktop/src/features/onboarding/ui/BackupStep.tsx index 192de327f5..7783f72106 100644 --- a/desktop/src/features/onboarding/ui/BackupStep.tsx +++ b/desktop/src/features/onboarding/ui/BackupStep.tsx @@ -1,4 +1,12 @@ -import { Check, Copy, Eye, EyeOff, Info, ShieldCheck } from "lucide-react"; +import { + Check, + Copy, + Download, + Eye, + EyeOff, + Info, + ShieldCheck, +} from "lucide-react"; import { useReducedMotion } from "motion/react"; import * as React from "react"; @@ -14,6 +22,7 @@ import { ONBOARDING_PRIMARY_CTA_CLASS, ONBOARDING_SECONDARY_CTA_CLASS, } from "./OnboardingChrome"; +import { IdentityKeyHelpDialog } from "./IdentityKeyHelpDialog"; import { OnboardingFooter } from "./OnboardingFooter"; import { type OnboardingTransitionDirection, @@ -190,12 +199,12 @@ export function BackupStep({ >

- Backup options + {previewMode ? "Back up your identity" : "Backup options"}

- Your identity key works like a password for your Buzz account. Keep - a copy somewhere safe. You can create a backup file and lock it with - a password you can remember. + {previewMode + ? "Buzz keeps your identity key protected on this device, but you should make a separate backup in case you lose access." + : "Your identity key works like a password for your Buzz account. Keep a copy somewhere safe. You can create a backup file and lock it with a password you can remember."}

@@ -219,7 +228,9 @@ export function BackupStep({ data-testid="backup-option-panel" > - Saved in your password manager + {previewMode + ? "Save in your password manager" + : "Saved in your password manager"} Copy your identity key, then save it in a password manager like @@ -256,7 +267,9 @@ export function BackupStep({ data-testid="backup-option-panel" > - Locked in a backup file + {previewMode + ? "Create a locked backup" + : "Locked in a backup file"} Create a backup file and choose a password you can remember. @@ -306,9 +319,11 @@ export function BackupStep({ className={`text-title font-normal text-foreground ${REVEAL_ANIMATION_CLASS}`} key={created ? "created" : "creating"} > - {created - ? "Your unique identity key has been created" - : "Creating your identity key"} + {created && previewMode + ? "Your identity key is ready" + : created + ? "Your unique identity key has been created" + : "Creating your identity key"} {created ? (

- {introStorageDescription} You can continue now, or{" "} - {" "} - for ways to restore your account. + {previewMode ? ( + <> + This works as the login and password for your Buzz account. Use + it to access Buzz from any device. + + ) : ( + <> + {introStorageDescription} You can continue now, or{" "} + {" "} + for ways to restore your account. + + )}

) : null} @@ -384,6 +408,28 @@ export function BackupStep({