@agent-native/toolkit 0.221.0-same-host-mcp-20261027-20261027081850 → 0.221.0

package/dist/app/onboarding/FirstRunOnboarding.js

@@ -5,21 +5,24 @@ import { listFirstRunOnboardingExtensions, } from "@agent-native/core/client/onb
 import { saveFirstRunOnboardingRole } from "@agent-native/core/client/onboarding/first-run-status";
 import { createOnboardingCorrelationId, setCustomKeyOnboardingAttempt, setOnboardingExperiment, trackOnboardingEvent, useOnboarding, } from "@agent-native/core/client/onboarding/use-onboarding";
 import { ONBOARDING_PREVIEW_QUERY_PARAM, ONBOARDING_PREVIEW_STEP_QUERY_PARAM, useOnboardingPreviewMode, useOnboardingPreviewStep, } from "@agent-native/core/client/onboarding/use-preview-mode";
+import { useActionMutation } from "@agent-native/core/client/use-action";
 import { SETTINGS_REDESIGN_FLAG } from "@agent-native/core/feature-flags/registry";
 import { buildSettingsRoute, SETTINGS_PAGE_IDS, } from "@agent-native/core/navigation";
+import { FIRST_RUN_BUILDER_CREDITS_V2_EXPERIMENT_ID, FIRST_RUN_BUILDER_CREDITS_V2_FLAG_KEY, } from "@agent-native/core/shared";
 import { Badge } from "@agent-native/toolkit/ui/badge";
 import { Button } from "@agent-native/toolkit/ui/button";
 import { Popover, PopoverContent, PopoverTrigger, } from "@agent-native/toolkit/ui/popover";
 import { Skeleton } from "@agent-native/toolkit/ui/skeleton";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger, } from "@agent-native/toolkit/ui/tooltip";
 import { cn } from "@agent-native/toolkit/utils";
-import { IconArrowRight, IconChevronDown, IconChevronUp, IconHelpCircle, IconKey, IconLoader2, } from "@tabler/icons-react";
+import { IconAlertCircle, IconArrowRight, IconChevronDown, IconChevronUp, IconHelpCircle, IconKey, IconLoader2, } from "@tabler/icons-react";
 import { useCallback, useEffect, useMemo, useRef, useState, } from "react";
 import { useNavigate } from "react-router";
 import { useBuilderConnectFlow } from "../settings/useBuilderStatus.js";
 import { BuilderIncludedServices, CapabilityInfoButton, getBuilderIncludedCapabilities, } from "./BuilderIncludedServices.js";
 import { assignFirstRunSetupVariant, FIRST_RUN_SETUP_EXPERIMENT_ID, getPreviewFirstRunSetupVariant, } from "./first-run-experiment.js";
 import { ONBOARDING_PRIMARY_BUTTON_CLASS, OnboardingStepLayout, } from "./OnboardingStepLayout.js";
+const FIRST_RUN_CREDITS_V2_APP_IDS = new Set(["clips", "design", "slides"]);
 function trackFirstRunSetupOutcome(attempt, outcome, errorType) {
     if (!attempt || attempt.outcomeTracked)
         return;
@@ -33,7 +36,7 @@ function trackFirstRunSetupOutcome(attempt, outcome, errorType) {
         ...(errorType ? { error_type: errorType } : {}),
     });
 }
-function firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, setupSkippable) {
+function firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, setupSkippable, setupRecoverySkippable = false) {
     // `optional` must match whether the screen offers a skip: Analytics funnels
     // read it to keep a skip from counting as drop-off.
     const beforeStepCount = beforeSetupExtensions.reduce((count, extension) => count + (extension.stepCount ?? 1), 0);
@@ -65,7 +68,9 @@ function firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensi
         flow: "first_run",
         step_id: screen,
         step_index: stepIndex,
-        optional: screen === "role" || (screen === "choice" && setupSkippable),
+        optional: screen === "role" ||
+            (screen === "choice" && setupSkippable) ||
+            (screen === "connecting" && setupRecoverySkippable),
     };
 }
 const SETUP_EXPERIMENT_DECISION_TIMEOUT_MS = 4000;
@@ -104,12 +109,49 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
     const canTrackOnboardingScreen = (!loading && profile !== null) || canRenderRoleWithoutProfile;
     const setupSkippable = profile?.appId === "clips";
     const [setupExperimentDecision, setSetupExperimentDecision] = useState(null);
-    const setupVariant = useMemo(() => (previewMode && getPreviewFirstRunSetupVariant(window.location.search)) ||
-        assignFirstRunSetupVariant(), [previewMode]);
+    const [creditsV2Assignment, setCreditsV2Assignment] = useState(null);
+    const [creditsV2ExposureTracked, setCreditsV2ExposureTracked] = useState(false);
+    const creditsV2Flag = useFeatureFlagState(FIRST_RUN_BUILDER_CREDITS_V2_FLAG_KEY);
+    const creditsV2FlagAppliesToApp = FIRST_RUN_CREDITS_V2_APP_IDS.has(profile?.appId ?? "");
+    const creditsV2Exposure = useActionMutation("record-first-run-builder-credits-v2-exposure", {
+        uiOnly: true,
+        skipActionQueryInvalidation: true,
+    });
+    const previewCreditsV2 = previewMode &&
+        typeof window !== "undefined" &&
+        new URLSearchParams(window.location.search).get("experiment") === "v2";
+    const creditsV2Enabled = creditsV2FlagAppliesToApp &&
+        creditsV2Flag.status === "ready" &&
+        creditsV2Flag.enabled;
+    const creditsV2FlowEnabled = creditsV2Enabled || previewCreditsV2;
+    const creditsV2FlagPending = !previewMode &&
+        creditsV2FlagAppliesToApp &&
+        creditsV2Flag.status === "loading";
+    const setupVariant = useMemo(() => {
+        const previewVariant = previewMode && getPreviewFirstRunSetupVariant(window.location.search);
+        if (previewCreditsV2)
+            return previewVariant;
+        if (previewVariant)
+            return previewVariant;
+        if (creditsV2FlowEnabled) {
+            return creditsV2Assignment?.experiment_variant ?? null;
+        }
+        return assignFirstRunSetupVariant();
+    }, [
+        creditsV2FlowEnabled,
+        creditsV2Assignment,
+        previewCreditsV2,
+        previewMode,
+        profile?.appId,
+    ]);
+    const setupExperimentId = creditsV2FlowEnabled
+        ? FIRST_RUN_BUILDER_CREDITS_V2_EXPERIMENT_ID
+        : FIRST_RUN_SETUP_EXPERIMENT_ID;
     // The credits arm offers Skip in every app, so analytics must mark the choice step optional there too.
     const choiceSkippable = setupSkippable ||
         (setupVariant === "credits" &&
-            (previewMode || setupExperimentDecision === true));
+            (previewMode || setupExperimentDecision === true) &&
+            (!creditsV2Enabled || creditsV2ExposureTracked));
     const [extensionPlacement, setExtensionPlacement] = useState("after-setup");
     const [extensionIndex, setExtensionIndex] = useState(0);
     const [extensionStepIndex, setExtensionStepIndex] = useState(0);
@@ -155,11 +197,14 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         previewMode,
         choiceSkippable,
     ]);
-    const trackFirstRunStepSkipped = useCallback((stepScreen, reason = "user_action", stepExtensionIndex = extensionIndex, stepIndex = extensionStepIndex) => {
+    const trackFirstRunStepSkipped = useCallback((stepScreen, reason = "user_action", stepExtensionIndex = extensionIndex, stepIndex = extensionStepIndex, optionalOverride) => {
         if (previewMode)
             return;
         trackOnboardingEvent("onboarding_step_skipped", {
             ...firstRunStepProperties(stepScreen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, stepExtensionIndex, stepIndex, choiceSkippable),
+            ...(optionalOverride !== undefined
+                ? { optional: optionalOverride }
+                : {}),
             reason,
         });
     }, [
@@ -175,6 +220,12 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
     const completionInFlightRef = useRef(false);
     const completionRedirectRef = useRef(null);
     const setupSkipStartedRef = useRef(false);
+    const creditsV2ExposureStartedRef = useRef(false);
+    const creditsV2ExposureFailedRef = useRef(false);
+    const creditsV2ExposureSettledRef = useRef(false);
+    const creditsV2ExposureTrackedRef = useRef(false);
+    const creditsV2ExposureConfirmationStartedRef = useRef(false);
+    const setupExperimentTimedOutRef = useRef(false);
     const onboardingTerminalRef = useRef(false);
     const abandonmentTrackedRef = useRef(false);
     const onboardingStartedRef = useRef(false);
@@ -238,13 +289,133 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
             trackOnboardingEvent("onboarding_started", { flow: "first_run" });
         }
     }, [canTrackOnboardingScreen, firstRun, previewMode]);
-    // Both arms render a skeleton until the experiment decision is known, and the
-    // credits arm's skip depends on it, so the choice view waits for the decision
-    // and is sent once with its resolved optional flag. Without an assigned arm
-    // no decision is ever made, and the choice UI renders as is.
+    // The v2 choice event waits until the rendered arm has been attributed.
     const choiceStepKnown = screen !== "choice" ||
-        setupVariant === null ||
-        setupExperimentDecision !== null;
+        (!creditsV2FlagPending &&
+            (!creditsV2FlowEnabled || setupExperimentDecision !== null) &&
+            (setupVariant === null || setupExperimentDecision !== null) &&
+            (!creditsV2Enabled ||
+                setupExperimentDecision !== true ||
+                creditsV2ExposureTracked));
+    const beginBeforeSetup = useCallback(() => {
+        if (beforeSetupExtensions.length === 0) {
+            setScreen("choice");
+            return;
+        }
+        setExtensionPlacement("before-setup");
+        setExtensionIndex(0);
+        setExtensionStepIndex(0);
+        setScreen("extension");
+    }, [beforeSetupExtensions.length]);
+    const handleFinish = useCallback((completedScreen, track = true) => {
+        if (afterSetupExtensions.length === 0) {
+            void finishOnboarding(completedScreen);
+            return;
+        }
+        if (completedScreen && track)
+            trackFirstRunStepCompleted(completedScreen);
+        setExtensionPlacement("after-setup");
+        setExtensionIndex(0);
+        setExtensionStepIndex(0);
+        setScreen("extension");
+    }, [afterSetupExtensions.length, finishOnboarding, trackFirstRunStepCompleted]);
+    const skipFailedBuilderSetup = useCallback(() => {
+        if (setupSkipStartedRef.current || completionInFlightRef.current)
+            return;
+        setupSkipStartedRef.current = true;
+        trackFirstRunStepSkipped("connecting", "builder_provision_failed", extensionIndex, extensionStepIndex, true);
+        if (setupSkippable)
+            completionRedirectRef.current = "/record";
+        handleFinish(null);
+    }, [
+        extensionIndex,
+        extensionStepIndex,
+        handleFinish,
+        setupSkippable,
+        trackFirstRunStepSkipped,
+    ]);
+    const handleBuilderConnected = useCallback(() => {
+        trackFirstRunSetupOutcome(builderSetupAttemptRef.current, "connected");
+        builderSetupAttemptRef.current = null;
+        setupAttemptRef.current = null;
+        trackFirstRunStepCompleted("choice");
+        trackFirstRunStepCompleted("connecting");
+        handleFinish(null);
+    }, [handleFinish, trackFirstRunStepCompleted]);
+    const connectFlow = useBuilderConnectFlow({
+        enabled: firstRun && !previewMode,
+        provisionAccount: true,
+        trackingSource: "first_run_onboarding",
+        trackingFlow: "connect_llm",
+        onConnected: handleBuilderConnected,
+    });
+    const accountExists = connectFlow.accountExists && !connectFlow.connecting;
+    const provisioning = builderConnectionMode === "provision" && !accountExists;
+    const provisioningFailed = provisioning &&
+        !connectFlow.connecting &&
+        Boolean(connectFlow.terminalError);
+    const connectionFailed = provisioningFailed;
+    useEffect(() => {
+        if (previewMode ||
+            !firstRun ||
+            !canTrackOnboardingScreen ||
+            screen !== "choice" ||
+            !creditsV2Enabled ||
+            setupExperimentDecision !== true ||
+            creditsV2ExposureTrackedRef.current ||
+            !creditsV2Assignment) {
+            return;
+        }
+        creditsV2ExposureTrackedRef.current = true;
+        setOnboardingExperiment({
+            id: creditsV2Assignment.experiment_id,
+            variant: creditsV2Assignment.experiment_variant,
+        });
+        setCreditsV2ExposureTracked(true);
+        trackOnboardingEvent("onboarding_experiment_exposed", {
+            flow: "first_run",
+            step_id: "choice",
+            experiment_id: creditsV2Assignment.experiment_id,
+            experiment_variant: creditsV2Assignment.experiment_variant,
+        });
+        if (creditsV2ExposureConfirmationStartedRef.current)
+            return;
+        creditsV2ExposureConfirmationStartedRef.current = true;
+        const persistExposure = async () => {
+            let lastError;
+            // A write can commit even when its response is lost, so retry the idempotent assignment to reconcile it.
+            for (const delayMs of [0, 0, 1_000, 5_000, 30_000]) {
+                if (delayMs > 0) {
+                    await new Promise((resolve) => window.setTimeout(resolve, delayMs));
+                }
+                try {
+                    const { assignment } = await creditsV2Exposure.mutateAsync({
+                        confirmedVariant: creditsV2Assignment.experiment_variant,
+                    });
+                    if (assignment?.experiment_id !== creditsV2Assignment.experiment_id ||
+                        assignment.experiment_variant !==
+                            creditsV2Assignment.experiment_variant) {
+                        throw new Error("The server did not persist the displayed first-run Builder credits v2 assignment.");
+                    }
+                    return;
+                }
+                catch (error) {
+                    lastError = error;
+                }
+            }
+            console.error("Failed to persist first-run Builder credits v2 exposure:", lastError);
+        };
+        void persistExposure();
+    }, [
+        canTrackOnboardingScreen,
+        creditsV2Assignment,
+        creditsV2Enabled,
+        creditsV2Exposure.mutateAsync,
+        firstRun,
+        previewMode,
+        setupExperimentDecision,
+        screen,
+    ]);
     useEffect(() => {
         if (previewMode ||
             !firstRun ||
@@ -253,8 +424,13 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
             stepViewRef.current = null;
             return;
         }
-        const step = firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, choiceSkippable);
-        const key = [step.step_id, step.extension_id, step.step_index].join(":");
+        const step = firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, choiceSkippable, provisioningFailed);
+        const key = [
+            step.step_id,
+            step.extension_id,
+            step.step_index,
+            step.optional,
+        ].join(":");
         if (stepViewRef.current?.key !== key) {
             stepViewRef.current = { key, id: createOnboardingCorrelationId() };
         }
@@ -275,6 +451,7 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         previewMode,
         canTrackOnboardingScreen,
         choiceStepKnown,
+        provisioningFailed,
         screen,
     ]);
     useEffect(() => {
@@ -289,7 +466,7 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
                 return;
             abandonmentTrackedRef.current = true;
             trackOnboardingEvent("onboarding_abandoned", {
-                ...firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, choiceSkippable),
+                ...firstRunStepProperties(screen, beforeSetupExtensions, afterSetupExtensions, extensionPlacement, extensionIndex, extensionStepIndex, choiceSkippable, provisioningFailed),
                 reason: "page_exit",
             });
         };
@@ -306,44 +483,8 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         canTrackOnboardingScreen,
         screen,
         choiceSkippable,
+        provisioningFailed,
     ]);
-    const beginBeforeSetup = useCallback(() => {
-        if (beforeSetupExtensions.length === 0) {
-            setScreen("choice");
-            return;
-        }
-        setExtensionPlacement("before-setup");
-        setExtensionIndex(0);
-        setExtensionStepIndex(0);
-        setScreen("extension");
-    }, [beforeSetupExtensions.length]);
-    const handleFinish = useCallback((completedScreen, track = true) => {
-        if (afterSetupExtensions.length === 0) {
-            void finishOnboarding(completedScreen);
-            return;
-        }
-        if (completedScreen && track)
-            trackFirstRunStepCompleted(completedScreen);
-        setExtensionPlacement("after-setup");
-        setExtensionIndex(0);
-        setExtensionStepIndex(0);
-        setScreen("extension");
-    }, [afterSetupExtensions.length, finishOnboarding, trackFirstRunStepCompleted]);
-    const handleBuilderConnected = useCallback(() => {
-        trackFirstRunSetupOutcome(builderSetupAttemptRef.current, "connected");
-        builderSetupAttemptRef.current = null;
-        setupAttemptRef.current = null;
-        trackFirstRunStepCompleted("choice");
-        trackFirstRunStepCompleted("connecting");
-        handleFinish(null);
-    }, [handleFinish, trackFirstRunStepCompleted]);
-    const connectFlow = useBuilderConnectFlow({
-        enabled: firstRun && !previewMode,
-        provisionAccount: true,
-        trackingSource: "first_run_onboarding",
-        trackingFlow: "connect_llm",
-        onConnected: handleBuilderConnected,
-    });
     const builderStatusReadCount = connectFlow.statusReadSettledCount ?? 0;
     useEffect(() => {
         const startedAt = retryingBuilderStatusAtCountRef.current;
@@ -368,12 +509,13 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
             trackFirstRunSetupOutcome(attempt, "failed", "account_exists");
             return;
         }
-        if (connectFlow.terminalError) {
+        if (connectFlow.terminalError || connectFlow.statusUnavailable) {
             trackFirstRunSetupOutcome(attempt, "failed", "connection_error");
         }
     }, [
         connectFlow.accountExists,
         connectFlow.connecting,
+        connectFlow.statusUnavailable,
         connectFlow.terminalError,
     ]);
     // Preview never fetches status, so show the activation path it would offer.
@@ -386,11 +528,14 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
     // page in both arms and stays out of the results.
     const setupExperimentEligible = setupStatusSettled &&
         canActivateBuilderFreeCredits &&
-        !connectFlow.configured;
+        !connectFlow.configured &&
+        !connectFlow.statusUnavailable;
     useEffect(() => {
         if (previewMode ||
             !firstRun ||
             screen !== "choice" ||
+            creditsV2FlagPending ||
+            creditsV2FlowEnabled ||
             !setupVariant ||
             !setupStatusSettled ||
             setupExperimentDecision !== null) {
@@ -398,12 +543,14 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         }
         if (setupExperimentEligible) {
             setOnboardingExperiment({
-                id: FIRST_RUN_SETUP_EXPERIMENT_ID,
+                id: setupExperimentId,
                 variant: setupVariant,
             });
             trackOnboardingEvent("onboarding_experiment_exposed", {
                 flow: "first_run",
                 step_id: "choice",
+                experiment_id: setupExperimentId,
+                experiment_variant: setupVariant,
             });
         }
         setSetupExperimentDecision(setupExperimentEligible);
@@ -411,11 +558,73 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         firstRun,
         previewMode,
         screen,
+        creditsV2FlagPending,
+        creditsV2FlowEnabled,
         setupExperimentEligible,
         setupExperimentDecision,
         setupStatusSettled,
+        setupExperimentId,
         setupVariant,
     ]);
+    useEffect(() => {
+        if (previewMode ||
+            !firstRun ||
+            screen !== "choice" ||
+            !creditsV2Enabled ||
+            !setupStatusSettled ||
+            setupExperimentTimedOutRef.current ||
+            setupExperimentDecision === true) {
+            return;
+        }
+        if (!setupExperimentEligible) {
+            creditsV2ExposureFailedRef.current = false;
+            setSetupExperimentDecision(false);
+            return;
+        }
+        if (creditsV2ExposureFailedRef.current)
+            return;
+        if (creditsV2ExposureStartedRef.current)
+            return;
+        creditsV2ExposureStartedRef.current = true;
+        creditsV2ExposureSettledRef.current = false;
+        setSetupExperimentDecision(null);
+        void creditsV2Exposure
+            .mutateAsync({})
+            .then(({ assignment }) => {
+            creditsV2ExposureSettledRef.current = true;
+            if (setupExperimentTimedOutRef.current)
+                return;
+            if (assignment?.experiment_id !==
+                FIRST_RUN_BUILDER_CREDITS_V2_EXPERIMENT_ID ||
+                (assignment.experiment_variant !== "control" &&
+                    assignment.experiment_variant !== "credits")) {
+                setSetupExperimentDecision(false);
+                return;
+            }
+            setCreditsV2Assignment({
+                experiment_id: FIRST_RUN_BUILDER_CREDITS_V2_EXPERIMENT_ID,
+                experiment_variant: assignment.experiment_variant,
+            });
+            setSetupExperimentDecision(true);
+        })
+            .catch(() => {
+            creditsV2ExposureSettledRef.current = true;
+            if (setupExperimentTimedOutRef.current)
+                return;
+            creditsV2ExposureStartedRef.current = false;
+            creditsV2ExposureFailedRef.current = true;
+            setSetupExperimentDecision(false);
+        });
+    }, [
+        creditsV2Enabled,
+        creditsV2Exposure.mutateAsync,
+        firstRun,
+        previewMode,
+        screen,
+        setupExperimentDecision,
+        setupExperimentEligible,
+        setupStatusSettled,
+    ]);
     // A stalled Builder status read must not leave the setup screen blank. Past
     // the limit the person gets the existing page and stays out of the
     // experiment, identically in both arms, so exposure counts stay honest.
@@ -423,13 +632,28 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         if (previewMode ||
             !firstRun ||
             screen !== "choice" ||
-            !setupVariant ||
+            creditsV2FlagPending ||
+            (!setupVariant && !creditsV2FlowEnabled) ||
             setupExperimentDecision !== null) {
             return;
         }
-        const timer = window.setTimeout(() => setSetupExperimentDecision((decision) => decision ?? false), SETUP_EXPERIMENT_DECISION_TIMEOUT_MS);
+        const timer = window.setTimeout(() => {
+            if (creditsV2ExposureSettledRef.current)
+                return;
+            setupExperimentTimedOutRef.current = true;
+            setSetupExperimentDecision((decision) => decision ?? false);
+        }, SETUP_EXPERIMENT_DECISION_TIMEOUT_MS);
         return () => window.clearTimeout(timer);
-    }, [firstRun, previewMode, screen, setupExperimentDecision, setupVariant]);
+    }, [
+        creditsV2FlowEnabled,
+        creditsV2FlagPending,
+        firstRun,
+        previewMode,
+        screen,
+        setupExperimentDecision,
+        setupStatusSettled,
+        setupVariant,
+    ]);
     const retryOnboardingCompletion = useCallback(() => {
         const attempt = completionAttemptRef.current;
         void finishOnboarding(attempt?.screen ?? null, attempt?.extensionIndex ?? extensionIndex, attempt?.redirect ?? null);
@@ -588,9 +812,10 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
         // shows, plus the app's own headline capabilities it covers.
         const builderCapabilities = getBuilderIncludedCapabilities(profile.capabilities);
         const inCreditsArm = setupVariant === "credits";
-        // Both arms must wait: the control setup actions can be used as soon as
-        // they render, so exposure has to be recorded before either arm is usable.
-        if (!previewMode && setupVariant && setupExperimentDecision === null) {
+        if (!previewMode &&
+            (creditsV2FlagPending ||
+                (creditsV2FlowEnabled && setupExperimentDecision === null) ||
+                (setupVariant && setupExperimentDecision === null))) {
             return _jsx(OnboardingSkeleton, {});
         }
         const creditsEligible = inCreditsArm && (previewMode || setupExperimentDecision === true);
@@ -619,10 +844,10 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
             };
             return (_jsx(OnboardingShell, { profile: profile, screen: "choice", progressWidth: progressWidth, ...completionErrorProps, children: _jsxs("div", { "data-testid": "first-run-credits-offer", className: "mx-auto flex w-full flex-col items-center gap-5 pt-[max(0rem,6vh)] text-center", children: [_jsx("h1", { className: cn("text-balance text-[28px] font-bold leading-tight tracking-[-0.02em] text-foreground", profile.appId === "clips" ? "max-w-lg" : "max-w-sm"), children: profile.appId === "clips"
                                 ? t("agentChat.onboarding.creditsTitleClips")
-                                : t("agentChat.onboarding.creditsTitle") }), _jsxs("p", { className: "max-w-sm text-sm leading-6 text-muted-foreground", children: [t("agentChat.onboarding.creditsSubtitle"), " ", _jsx("button", { type: "button", "data-testid": "first-run-credits-learn-more", "aria-expanded": moreInfoOpen, "aria-controls": moreInfoOpen ? "first-run-credits-details" : undefined, className: "rounded-sm underline underline-offset-2 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: toggleMoreInfo, children: t("agentChat.onboarding.creditsLearnMore") })] }), _jsxs("div", { className: "flex w-full max-w-sm flex-col items-center gap-3", children: [_jsx("button", { type: "button", "data-testid": "first-run-credits-activate", className: cn(ONBOARDING_PRIMARY_BUTTON_CLASS, "min-h-11 w-full text-sm"), onClick: () => handleBuilder(true), disabled: connectFlow.connecting, children: t("agentChat.onboarding.creditsActivate") }), _jsx("button", { type: "button", "data-testid": "first-run-credits-connect-existing", className: cn(mutedButtonClass, "min-h-11 w-full text-sm"), onClick: () => handleBuilder(false), disabled: connectFlow.connecting, children: t("agentChat.onboarding.builderExistingAccount") }), _jsxs("p", { className: "text-xs leading-5 text-muted-foreground", children: [t("agentChat.onboarding.creditsFinePrint"), " ", _jsx("a", { href: "https://www.builder.io/legal/terms", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderTerms") }), " ", t("agentChat.onboarding.builderConsentAnd"), " ", _jsx("a", { href: "https://www.builder.io/legal/privacy", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderPrivacy") }), "."] })] }), builderStatusError, _jsx("div", { className: "flex flex-wrap items-center justify-center gap-x-3 gap-y-2", children: _jsxs("button", { type: "button", "data-testid": "first-run-credits-more-info", "aria-expanded": moreInfoOpen, "aria-controls": moreInfoOpen ? "first-run-credits-details" : undefined, className: "inline-flex min-h-8 items-center gap-1 rounded-full border border-border px-3 text-xs font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: toggleMoreInfo, children: [t("agentChat.onboarding.creditsMoreInfo"), _jsx(MoreInfoChevron, { size: 14, "aria-hidden": true })] }) }), moreInfoOpen && (_jsx("div", { id: "first-run-credits-details", "data-testid": "first-run-credits-details", className: "mt-3 flex w-full max-w-3xl flex-col gap-6 text-left", children: setupCards })), _jsx("div", { className: "fixed bottom-6 right-6 z-10", children: _jsxs(Popover, { open: skipConfirmOpen, onOpenChange: setSkipConfirmOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", "data-testid": "first-run-credits-skip", className: "inline-flex min-h-6 items-center px-2 rounded-sm text-xs font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.creditsSkip") }) }), _jsxs(PopoverContent, { side: "top", align: "end", portalled: false, "aria-labelledby": "first-run-credits-skip-title", "aria-describedby": "first-run-credits-skip-body", className: "w-96 max-w-[calc(100vw-2rem)] space-y-3 p-4 text-left", onOpenAutoFocus: (event) => {
+                                : t("agentChat.onboarding.creditsTitle") }), _jsxs("p", { className: "max-w-sm text-sm leading-6 text-muted-foreground", children: [t("agentChat.onboarding.creditsSubtitle"), " ", _jsx("button", { type: "button", "data-testid": "first-run-credits-learn-more", "aria-expanded": moreInfoOpen, "aria-controls": moreInfoOpen ? "first-run-credits-details" : undefined, className: "rounded-sm underline underline-offset-2 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: toggleMoreInfo, children: t("agentChat.onboarding.creditsLearnMore") })] }), _jsxs("div", { className: "flex w-full max-w-sm flex-col items-center gap-3", children: [_jsx("button", { type: "button", "data-testid": "first-run-credits-activate", className: cn(ONBOARDING_PRIMARY_BUTTON_CLASS, "min-h-11 w-full text-sm"), onClick: () => handleBuilder(true), disabled: connectFlow.connecting, children: t("agentChat.onboarding.creditsActivate") }), _jsx("button", { type: "button", "data-testid": "first-run-credits-connect-existing", className: cn(mutedButtonClass, "min-h-11 w-full text-sm"), onClick: () => handleBuilder(false), disabled: connectFlow.connecting, children: t("agentChat.onboarding.builderExistingAccount") }), creditsV2FlowEnabled && (_jsx("button", { type: "button", "data-testid": "first-run-credits-own-api-keys", className: "min-h-7 text-xs font-medium text-muted-foreground underline underline-offset-4 transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: () => void handleOpenSettings(), disabled: connectFlow.connecting, children: t("agentChat.onboarding.creditsUseOwnApiKeys") })), _jsxs("p", { className: "text-xs leading-5 text-muted-foreground", children: [t("agentChat.onboarding.creditsFinePrint"), " ", _jsx("a", { href: "https://www.builder.io/legal/terms", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderTerms") }), " ", t("agentChat.onboarding.builderConsentAnd"), " ", _jsx("a", { href: "https://www.builder.io/legal/privacy", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderPrivacy") }), "."] })] }), builderStatusError, _jsx("div", { className: "flex flex-wrap items-center justify-center gap-x-3 gap-y-2", children: _jsxs("button", { type: "button", "data-testid": "first-run-credits-more-info", "aria-expanded": moreInfoOpen, "aria-controls": moreInfoOpen ? "first-run-credits-details" : undefined, className: "inline-flex min-h-8 items-center gap-1 rounded-full border border-border px-3 text-xs font-medium text-foreground transition-colors hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: toggleMoreInfo, children: [t("agentChat.onboarding.creditsMoreInfo"), _jsx(MoreInfoChevron, { size: 14, "aria-hidden": true })] }) }), moreInfoOpen && (_jsx("div", { id: "first-run-credits-details", "data-testid": "first-run-credits-details", className: "mt-3 flex w-full max-w-3xl flex-col gap-6 text-left", children: setupCards })), _jsx("div", { className: "fixed bottom-6 right-6 z-10", children: creditsV2FlowEnabled ? (_jsx("button", { type: "button", "data-testid": "first-run-credits-skip", className: "inline-flex min-h-6 items-center px-2 rounded-sm text-xs font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: skipSetup, children: t("agentChat.onboarding.creditsSkip") })) : (_jsxs(Popover, { open: skipConfirmOpen, onOpenChange: setSkipConfirmOpen, children: [_jsx(PopoverTrigger, { asChild: true, children: _jsx("button", { type: "button", "data-testid": "first-run-credits-skip", className: "inline-flex min-h-6 items-center px-2 rounded-sm text-xs font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.creditsSkip") }) }), _jsxs(PopoverContent, { side: "top", align: "end", portalled: false, "aria-labelledby": "first-run-credits-skip-title", "aria-describedby": "first-run-credits-skip-body", className: "w-96 max-w-[calc(100vw-2rem)] space-y-3 p-4 text-left", onOpenAutoFocus: (event) => {
                                             event.preventDefault();
                                             skipGoBackRef.current?.focus();
-                                        }, children: [_jsxs("div", { className: "space-y-1", children: [_jsx("p", { id: "first-run-credits-skip-title", className: "text-sm font-semibold text-foreground", children: t("agentChat.onboarding.creditsSkipConfirmTitle") }), _jsx("p", { id: "first-run-credits-skip-body", className: "text-xs leading-5 text-muted-foreground", children: t("agentChat.onboarding.creditsSkipConfirmBody") })] }), _jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "px-0 text-muted-foreground hover:bg-transparent hover:text-foreground", onClick: () => void handleOpenSettings(), children: t("agentChat.onboarding.creditsUseCustomKeys") }), _jsxs("div", { className: "flex flex-wrap justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", size: "sm", "data-testid": "first-run-credits-skip-confirm", onClick: skipSetup, children: t("agentChat.onboarding.creditsSkipAnyway") }), _jsx(Button, { type: "button", size: "sm", ref: skipGoBackRef, onClick: () => setSkipConfirmOpen(false), children: t("agentChat.onboarding.creditsSkipGoBack") })] })] })] })] }) })] }) }));
+                                        }, children: [_jsxs("div", { className: "space-y-1", children: [_jsx("p", { id: "first-run-credits-skip-title", className: "text-sm font-semibold text-foreground", children: t("agentChat.onboarding.creditsSkipConfirmTitle") }), _jsx("p", { id: "first-run-credits-skip-body", className: "text-xs leading-5 text-muted-foreground", children: t("agentChat.onboarding.creditsSkipConfirmBody") })] }), _jsxs("div", { className: "flex flex-wrap items-center justify-between gap-2", children: [_jsx(Button, { type: "button", variant: "ghost", size: "sm", className: "px-0 text-muted-foreground hover:bg-transparent hover:text-foreground", onClick: () => void handleOpenSettings(), children: t("agentChat.onboarding.creditsUseCustomKeys") }), _jsxs("div", { className: "flex flex-wrap justify-end gap-2", children: [_jsx(Button, { type: "button", variant: "secondary", size: "sm", "data-testid": "first-run-credits-skip-confirm", onClick: skipSetup, children: t("agentChat.onboarding.creditsSkipAnyway") }), _jsx(Button, { type: "button", size: "sm", ref: skipGoBackRef, onClick: () => setSkipConfirmOpen(false), children: t("agentChat.onboarding.creditsSkipGoBack") })] })] })] })] })) })] }) }));
         }
         return (_jsx(OnboardingShell, { profile: profile, screen: "choice", progressWidth: progressWidth, ...completionErrorProps, children: _jsxs("div", { className: "mx-auto flex w-full max-w-3xl flex-col gap-9", children: [_jsxs("div", { className: "flex flex-col gap-6", children: [_jsxs("div", { className: "flex flex-col gap-2", children: [_jsx("h1", { className: "text-[28px] font-bold leading-tight tracking-[-0.02em] text-foreground", children: "Choose your setup" }), _jsx("p", { className: "text-sm text-muted-foreground", children: "We recommend starting with Builder.io for the fastest setup." })] }), setupCards, setupSkipButton] }), _jsxs("p", { className: "text-center text-xs leading-5 text-muted-foreground", children: [t("agentChat.onboarding.builderConsentPrefix"), " ", _jsx("a", { href: "https://www.builder.io/legal/terms", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderTerms") }), " ", t("agentChat.onboarding.builderConsentAnd"), " ", _jsx("a", { href: "https://www.builder.io/legal/privacy", target: "_blank", rel: "noreferrer", className: "underline underline-offset-2 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: t("agentChat.onboarding.builderPrivacy") }), "."] })] }) }));
     }
@@ -645,22 +870,25 @@ export function FirstRunOnboarding({ initialFirstRun = false, } = {}) {
                                                 });
                                             }, className: "size-4 shrink-0 accent-primary" }), _jsx("span", { className: "font-medium text-foreground", children: t(labelKey) })] }, value)))] }), selectedRole === "other" && (_jsxs("div", { className: "mt-4 flex flex-col gap-2", children: [_jsx("label", { htmlFor: "first-run-role-other", className: "text-sm font-medium text-foreground", children: t("agentChat.onboarding.roleOtherInputLabel") }), _jsx("input", { id: "first-run-role-other", "data-testid": "first-run-role-other-input", type: "text", value: customRole, maxLength: 120, disabled: savingRole, onChange: (event) => setCustomRole(event.target.value), className: "min-h-10 rounded-lg border border-border bg-card px-3 text-sm text-foreground outline-none transition-colors placeholder:text-muted-foreground focus:border-primary/40 focus:ring-2 focus:ring-ring" })] })), roleSaveError && (_jsx("p", { className: "mt-4 text-xs leading-5 text-destructive", role: "alert", children: roleSaveError }))] }) }) }));
     }
-    const accountExists = connectFlow.accountExists && !connectFlow.connecting;
-    const provisioning = builderConnectionMode === "provision" && !accountExists;
     const returnToSetupChoice = () => setScreen("choice");
-    return (_jsx(OnboardingShell, { profile: profile, screen: "connecting", progressWidth: progressWidth, ...completionErrorProps, children: _jsxs("div", { className: "mx-auto flex w-full max-w-md flex-col items-center text-center", role: "status", "aria-live": "polite", "aria-busy": connectFlow.connecting, children: [_jsx("div", { className: "flex size-10 items-center justify-center rounded-full bg-primary/10 text-primary", children: accountExists ? (_jsx(IconKey, { size: 19 })) : (_jsx(IconLoader2, { className: "animate-spin", size: 19 })) }), _jsx("h1", { className: "mt-5 text-xl font-semibold tracking-[-0.04em]", children: accountExists
+    return (_jsx(OnboardingShell, { profile: profile, screen: "connecting", progressWidth: progressWidth, ...completionErrorProps, children: _jsxs("div", { className: "mx-auto flex w-full max-w-md flex-col items-center text-center", role: "status", "aria-live": "polite", "aria-busy": connectFlow.connecting, children: [_jsxs("div", { className: cn("flex size-10 items-center justify-center rounded-full", connectionFailed
+                        ? "bg-destructive/10 text-destructive"
+                        : "bg-primary/10 text-primary"), children: [accountExists ? _jsx(IconKey, { size: 19 }) : null, connectionFailed ? _jsx(IconAlertCircle, { size: 19 }) : null, !accountExists && !connectionFailed ? (_jsx(IconLoader2, { className: "animate-spin", size: 19 })) : null] }), _jsx("h1", { className: "mt-5 text-xl font-semibold tracking-[-0.04em]", children: accountExists
                         ? t("agentChat.onboarding.builderAccountExistsTitle")
-                        : provisioning
-                            ? t("agentChat.onboarding.creditsActivating")
-                            : t("agentChat.onboarding.builderConnecting") }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", children: accountExists ? (t("agentChat.onboarding.builderAccountExistsDescription")) : provisioning ? (_jsxs(_Fragment, { children: [t("agentChat.onboarding.builderProvisioningDescription"), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": t("agentChat.onboarding.creditsAboutLabel"), className: "ml-0 inline-flex size-6 items-center justify-center rounded-full align-middle text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: _jsx(IconHelpCircle, { size: 12, "aria-hidden": true }) }) }), _jsx(TooltipContent, { side: "top", className: "max-w-xs text-xs", children: t("agentChat.onboarding.creditsActivatingTooltip") })] }) })] })) : (t("agentChat.onboarding.builderConnectionDescription")) }), accountExists ? (_jsxs("button", { type: "button", className: cn(ONBOARDING_PRIMARY_BUTTON_CLASS, "mt-7 w-full"), onClick: () => handleBuilder(false), disabled: connectFlow.connecting, children: [t("agentChat.auth.logIn"), _jsx(IconArrowRight, { size: 15 })] })) : (_jsxs(_Fragment, { children: [_jsxs("div", { className: "mt-7 w-full rounded-xl bg-muted/35 p-4 text-left", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx(Skeleton, { className: "h-3 w-28" }), _jsx(Skeleton, { className: "h-5 w-16 rounded-full" })] }), _jsx(Skeleton, { className: "mt-4 h-8 w-full" }), _jsxs("div", { className: "mt-3 grid grid-cols-3 gap-2", children: [_jsx(Skeleton, { className: "h-7 w-full" }), _jsx(Skeleton, { className: "h-7 w-full" }), _jsx(Skeleton, { className: "h-7 w-full" })] })] }), connectFlow.connecting &&
+                        : provisioningFailed
+                            ? t("agentChat.settingsShell.builder.setupFailed")
+                            : provisioning
+                                ? t("agentChat.onboarding.creditsActivating")
+                                : t("agentChat.onboarding.builderConnecting") }), _jsx("p", { className: "mt-2 text-sm text-muted-foreground", role: connectionFailed ? "alert" : undefined, children: accountExists ? (t("agentChat.onboarding.builderAccountExistsDescription")) : provisioningFailed ? (t("agentChat.onboarding.builderProvisionFailedDetail")) : provisioning ? (_jsxs(_Fragment, { children: [t("agentChat.onboarding.builderProvisioningDescription"), _jsx(TooltipProvider, { children: _jsxs(Tooltip, { children: [_jsx(TooltipTrigger, { asChild: true, children: _jsx("button", { type: "button", "aria-label": t("agentChat.onboarding.creditsAboutLabel"), className: "ml-0 inline-flex size-6 items-center justify-center rounded-full align-middle text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", children: _jsx(IconHelpCircle, { size: 12, "aria-hidden": true }) }) }), _jsx(TooltipContent, { side: "top", className: "max-w-xs text-xs", children: t("agentChat.onboarding.creditsActivatingTooltip") })] }) })] })) : (t("agentChat.onboarding.builderConnectionDescription")) }), accountExists ? (_jsxs("button", { type: "button", className: cn(ONBOARDING_PRIMARY_BUTTON_CLASS, "mt-7 w-full"), onClick: () => handleBuilder(false), disabled: connectFlow.connecting, children: [t("agentChat.auth.logIn"), _jsx(IconArrowRight, { size: 15 })] })) : (_jsxs(_Fragment, { children: [connectFlow.connecting ? (_jsxs("div", { className: "mt-7 w-full rounded-xl bg-muted/35 p-4 text-left", children: [_jsxs("div", { className: "flex items-center justify-between gap-3", children: [_jsx(Skeleton, { className: "h-3 w-28" }), _jsx(Skeleton, { className: "h-5 w-16 rounded-full" })] }), _jsx(Skeleton, { className: "mt-4 h-8 w-full" }), _jsxs("div", { className: "mt-3 grid grid-cols-3 gap-2", children: [_jsx(Skeleton, { className: "h-7 w-full" }), _jsx(Skeleton, { className: "h-7 w-full" }), _jsx(Skeleton, { className: "h-7 w-full" })] })] })) : null, connectFlow.connecting &&
                             (builderCancelRequested ? (_jsxs("div", { className: "mt-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-sm text-muted-foreground", "data-testid": "first-run-cancel-pending", children: t("agentChat.onboarding.builderCancelPending") }), _jsx("button", { type: "button", "data-testid": "first-run-back-to-choice", className: secondaryButtonClass, onClick: returnToSetupChoice, children: t("agentChat.onboarding.back") })] })) : (_jsx("button", { type: "button", "data-testid": "first-run-cancel-builder", className: "fixed bottom-6 left-6 inline-flex min-h-6 items-center px-2 rounded-sm text-xs font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: () => {
                                     setBuilderCancelRequested(true);
                                     connectFlow.cancel();
                                 }, children: t("common.cancel") }))), connectFlow.statusUnavailable &&
                             connectFlow.connecting &&
                             !connectFlow.terminalError && (_jsx("p", { className: "mt-4 text-xs text-destructive", role: "alert", children: t("agentChat.settingsShell.integrations.builderStatusFailed") })), connectFlow.terminalError && connectFlow.connecting && (_jsx("p", { className: "mt-4 text-xs text-destructive", role: "alert", children: connectFlow.terminalError })), !connectFlow.connecting &&
+                            !provisioningFailed &&
                             (connectFlow.statusUnavailable || connectFlow.terminalError) && (_jsxs("div", { className: "mt-4 flex flex-col items-center gap-2", children: [_jsx("p", { className: "text-xs text-destructive", role: "alert", children: connectFlow.terminalError ??
-                                        t("agentChat.settingsShell.integrations.builderStatusFailed") }), _jsx("button", { type: "button", className: secondaryButtonClass, onClick: () => handleBuilder(builderConnectionMode === "provision"), children: "Try again" }), _jsx("button", { type: "button", "data-testid": "first-run-back-to-choice", className: secondaryButtonClass, onClick: returnToSetupChoice, children: t("agentChat.onboarding.back") })] })), !connectFlow.connecting &&
+                                        t("agentChat.settingsShell.integrations.builderStatusFailed") }), _jsx("button", { type: "button", className: secondaryButtonClass, onClick: () => handleBuilder(builderConnectionMode === "provision"), children: "Try again" }), _jsx("button", { type: "button", "data-testid": "first-run-back-to-choice", className: secondaryButtonClass, onClick: returnToSetupChoice, children: t("agentChat.onboarding.back") })] })), provisioningFailed ? (_jsxs("div", { className: "mt-4 flex w-full flex-col items-center gap-2", children: [_jsx("button", { type: "button", "data-testid": "first-run-retry-builder", className: cn(ONBOARDING_PRIMARY_BUTTON_CLASS, "w-full"), onClick: () => handleBuilder(true), children: t("agentChat.settingsShell.builder.retry") }), _jsx("button", { type: "button", "data-testid": "first-run-open-key-settings-after-failure", className: cn(secondaryButtonClass, "w-full"), onClick: () => void handleOpenSettings(), children: t("agentChat.onboarding.openAiKeySettings") }), _jsx("button", { type: "button", "data-testid": "first-run-skip-builder-after-failure", className: "inline-flex min-h-9 items-center justify-center rounded-lg px-2.5 text-xs font-medium text-muted-foreground transition-colors hover:bg-muted hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: skipFailedBuilderSetup, children: t("agentChat.onboarding.skipForNow") })] })) : null, !connectFlow.connecting &&
                             !connectFlow.statusUnavailable &&
                             !connectFlow.terminalError && (_jsx("button", { type: "button", "data-testid": "first-run-back-to-choice", className: "fixed bottom-6 left-6 inline-flex min-h-6 items-center px-2 rounded-sm text-xs font-medium text-muted-foreground transition-colors hover:text-foreground focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring", onClick: returnToSetupChoice, children: t("agentChat.onboarding.back") }))] })), accountExists && !connectFlow.connecting && (_jsx("button", { type: "button", "data-testid": "first-run-back-to-choice", className: cn(secondaryButtonClass, "mt-3"), onClick: returnToSetupChoice, children: t("agentChat.onboarding.back") }))] }) }));
 }