Q176: onboarding progress survives a restart, and an unfinished setup reopens

Co-Authored-By: Claude Opus 5.5 <noreply@anthropic.com>

src/renderer/src/app/App.tsx

@@ -46,10 +46,6 @@ export function App() {
     return directory;
   }, [snapshot?.agents, snapshot?.employees, snapshot?.activeOrgId]);
   const [creatingOrg, setCreatingOrg] = useState(false);
-  // Keeps the wizard mounted through its post-bootstrap connectors step: the
-  // organization exists from Launch onward, so the org-count check alone
-  // would flip to the shell mid-onboarding.
-  const [finishingSetup, setFinishingSetup] = useState(false);
 
   const theme = snapshot?.uiPreferences.theme ?? "system";
   useEffect(() => {
@@ -67,17 +63,16 @@ export function App() {
   if (!snapshot) {
     return <div className="app-shell" style={{ display: "grid", placeItems: "center" }} />;
   }
-  if (snapshot.organizations.length === 0 || creatingOrg || finishingSetup) {
+  // A company exists from Launch on, but its setup is unfinished until the connectors step is done; that is stored, so a restart resumes it.
+  const unfinished = snapshot.organizations.find((organization) => organization.setupCompletedAt === null) ?? null;
+  if (snapshot.organizations.length === 0 || creatingOrg || unfinished) {
     return (
       <Onboarding
         snapshot={snapshot}
         actions={actions}
-        onCancel={creatingOrg ? () => setCreatingOrg(false) : null}
-        onBootstrapped={() => setFinishingSetup(true)}
-        onCompleted={() => {
-          setCreatingOrg(false);
-          setFinishingSetup(false);
-        }}
+        onCancel={creatingOrg && !unfinished ? () => setCreatingOrg(false) : null}
+        resumeOrgId={unfinished?.id ?? null}
+        onCompleted={() => setCreatingOrg(false)}
       />
     );
   }

src/renderer/src/app/Onboarding.tsx

@@ -1,5 +1,7 @@
 import { AutonomySummary } from "./AutonomySummary";
-import { useMemo, useState, type FormEvent } from "react";
+import { useEffect, useMemo, useState, type FormEvent } from "react";
+import { RestartForLanguage } from "../pages/settings/LanguageField";
+import type { OnboardingDraft } from "../../../shared/commands";
 import {
   PROVIDER_AUTH_TYPE,
   type AppSnapshot,
@@ -12,21 +14,12 @@ import { ProviderStep } from "./OnboardingProviderStep";
 import { ConnectorsStep } from "./OnboardingConnectorsStep";
 import { t } from "../i18n/i18n";
 
-type Step = "welcome" | "provider" | "company" | "mode" | "mission" | "connectors";
+type Step = OnboardingDraft["step"] | "connectors";
 
-export interface Draft {
-  companyName: string;
-  companyDescription: string;
-  employeeName: string;
-  workspacePath: string;
-  executionMode: "ai_ceo" | "ai_cofounder";
-  providerKey: string;
-  providerSecret: string;
-  providerBaseUrl: string;
-  providerModel: string;
-  goalTitle: string;
-  goalDescription: string;
-}
+/** The wizard's fields; only the key is never saved between launches. */
+export type Draft = Omit<OnboardingDraft, "step"> & { providerSecret: string };
+
+const SAVE_DELAY_MS = 400;
 
 const STEPS: Array<{ id: Step; label: string }> = [
   { id: "welcome", label: t("Start") },
@@ -41,13 +34,14 @@ export function Onboarding({
   snapshot,
   actions,
   onCancel,
-  onBootstrapped,
+  resumeOrgId,
   onCompleted,
 }: {
   snapshot: AppSnapshot;
   actions: SnapshotActions;
   onCancel: (() => void) | null;
-  onBootstrapped: () => void;
+  /** A created company whose setup was not finished: the wizard reopens on its connectors step. */
+  resumeOrgId: string | null;
   onCompleted: () => void;
 }) {
   const availableProviders = useMemo(
@@ -57,23 +51,51 @@ export function Onboarding({
   const firstProvider = availableProviders[0];
   if (!firstProvider) throw new Error("Provider catalog must include at least one non-cloud provider.");
 
-  const [step, setStep] = useState<Step>("welcome");
-  const [draft, setDraft] = useState<Draft>({
-    companyName: "",
-    companyDescription: "",
-    employeeName: "",
-    workspacePath: "",
-    executionMode: "ai_ceo",
-    providerKey: firstProvider.key,
-    providerSecret: "",
-    providerBaseUrl: "",
-    providerModel: "",
-    goalTitle: "",
-    goalDescription: "",
+  const saved = resumeOrgId ? null : snapshot.onboardingDraft;
+  const [step, setStep] = useState<Step>(resumeOrgId ? "connectors" : saved?.step ?? "welcome");
+  const [draft, setDraft] = useState<Draft>(() => {
+    if (!saved) {
+      return {
+        companyName: "", companyDescription: "", employeeName: "", workspacePath: "", executionMode: "ai_ceo", providerKey: firstProvider.key,
+        providerSecret: "", providerBaseUrl: "", providerModel: "", goalTitle: "", goalDescription: "",
+      };
+    }
+    const fields: Partial<OnboardingDraft> = { ...saved };
+    delete fields.step;
+    return { ...(fields as Omit<OnboardingDraft, "step">), providerSecret: "" };
   });
+  const [restored] = useState(saved !== null);
   const [error, setError] = useState<string | null>(null);
   const [submitting, setSubmitting] = useState(false);
-  const [bootstrappedOrgId, setBootstrappedOrgId] = useState<string | null>(null);
+  const [bootstrappedOrgId, setBootstrappedOrgId] = useState<string | null>(resumeOrgId);
+
+  // Saves the wizard (without the key) as it is filled in, so a restart resumes it; stops once the company exists.
+  useEffect(() => {
+    if (step === "connectors" || submitting || bootstrappedOrgId) return;
+    const fields: Partial<Draft> = { ...draft };
+    delete fields.providerSecret;
+    const timer = setTimeout(() => {
+      void window.agentCompany.saveOnboardingDraft({ draft: { ...(fields as Omit<OnboardingDraft, "step">), step } }).then((result) => {
+        if (!result.ok) setError(t("Your progress could not be saved: {error}", { error: result.error.message }));
+      });
+    }, SAVE_DELAY_MS);
+    return () => clearTimeout(timer);
+  }, [draft, step, submitting, bootstrappedOrgId]);
+
+  // The snapshot is reloaded too, so reopening the wizard does not bring back the cancelled draft.
+  const cancel = onCancel && (() => {
+    void window.agentCompany.saveOnboardingDraft({ draft: null }).then(async (result) => {
+      if (!result.ok) return setError(result.error.message);
+      await actions.reload();
+      onCancel();
+    }).catch((reason: unknown) => setError(reason instanceof Error ? reason.message : String(reason)));
+  });
+
+  const finishSetup = (orgId: string) => {
+    void actions.run(() => window.agentCompany.completeSetup({ orgId }))
+      .then((result) => { if (result) onCompleted(); })
+      .catch((reason: unknown) => setError(reason instanceof Error ? reason.message : String(reason)));
+  };
 
   const selectedProvider = requireProvider(availableProviders, draft.providerKey);
   const isMac = window.agentCompany.platform === "darwin";
@@ -125,7 +147,6 @@ export function Onboarding({
       setError(result.error.message);
       return;
     }
-    onBootstrapped();
     setBootstrappedOrgId(result.data.orgId);
     await actions.reload();
     setStep("connectors");
@@ -148,8 +169,8 @@ export function Onboarding({
           <div className="row" style={{ gap: 8 }}>
             <div className="brand-mark">A</div>
             <div style={{ fontWeight: 540 }}>AgentCompany</div>
-            {onCancel && step !== "connectors" && (
-              <button type="button" className="button ghost" style={{ marginLeft: "auto" }} onClick={onCancel}>
+            {cancel && step !== "connectors" && (
+              <button type="button" className="button ghost" style={{ marginLeft: "auto" }} onClick={cancel}>
                 {t("Cancel")}
               </button>
             )}
@@ -179,6 +200,11 @@ export function Onboarding({
 
       <form className="onboarding-panel" onSubmit={submit} noValidate>
         <div key={step} className="step-view">
+          {restored && step !== "connectors" && (
+            <p role="status" style={{ fontSize: 13, color: "var(--text-2)", margin: "0 0 12px" }}>
+              {t("Your progress was restored. Keys are never saved before launch, so enter yours again.")}
+            </p>
+          )}
           {step === "welcome" && (
             <WelcomeStep
               language={snapshot.uiPreferences.language}
@@ -219,7 +245,7 @@ export function Onboarding({
               orgId={bootstrappedOrgId}
               snapshot={snapshot}
               actions={actions}
-              onFinish={onCompleted}
+              onFinish={() => finishSetup(bootstrappedOrgId)}
             />
           )}
         </div>
@@ -256,6 +282,7 @@ function WelcomeStep({
           options={[{ id: "en", label: "English" }, { id: "zh", label: "中文" }]}
         />
       </div>
+      <RestartForLanguage language={language} />
       <p style={{ color: "var(--text-2)", fontSize: 14, lineHeight: 1.55 }}>
         {t("AgentCompany sets up your operating loop in six steps. Bring an API key, pick a runtime for the founding CEO, and we'll wire up the first goal, project, and task.")}
       </p>

src/renderer/src/i18n/zh.ts

@@ -694,6 +694,8 @@ export const zh: Record<string, string> = {
   "Resets {date} (UTC)": "{date} 重置（UTC）",
   "Unsaved": "未保存",
   "Working language": "工作语言",
+  "Your progress could not be saved: {error}": "无法保存你的进度：{error}",
+  "Your progress was restored. Keys are never saved before launch, so enter yours again.": "已恢复你的进度。启动前不会保存密钥，请重新输入。",
   "Runs on its own: approves its risky work and large hires, and writes deliverables without review.": "自主运行：自行批准高风险工作和大额招聘，交付物不经审核直接写入。",
   "Checks with you: risky work and large hires wait for you, and deliverables wait for your review.": "与你确认：高风险工作和大额招聘需要你批准，交付物需经你审核。",
   "What this mode allows": "此模式允许的范围",

src/renderer/src/pages/settings/LanguageField.tsx

@@ -9,23 +9,6 @@ const NAMES: Record<UiLanguage, string> = { en: "English", zh: "中文" };
 
 /** The display language is fixed per launch, so a choice waits for a restart the user starts after seeing what it interrupts. */
 export function LanguageField({ uiPreferences, actions }: { uiPreferences: UiPreferences; actions: SnapshotActions }) {
-  const [confirming, setConfirming] = useState(false);
-  const [running, setRunning] = useState<number | null>(null);
-  const [error, setError] = useState<string | null>(null);
-  const confirm = () => {
-    setRunning(null);
-    setError(null);
-    setConfirming(true);
-    void window.agentCompany.runningSessionCount().then((result) => {
-      if (result.ok) setRunning(result.data);
-      else setError(result.error.message);
-    });
-  };
-  const pending = uiPreferences.language !== window.agentCompany.language;
-  const restart = () => {
-    setError(null);
-    void window.agentCompany.relaunchApp().then((result) => { if (!result.ok) setError(result.error.message); });
-  };
   return (
     <Field label={t("Language")}>
       <select
@@ -38,12 +21,36 @@ export function LanguageField({ uiPreferences, actions }: { uiPreferences: UiPre
         <option value="zh">{NAMES.zh}</option>
       </select>
       <span style={{ fontSize: 12, color: "var(--text-3)" }}>{t("Changes only what you see; agents keep the company's working language.")}</span>
-      {pending && (
-        <span className="row" style={{ gap: 8, fontSize: 12 }} role="status">
-          {t("{language} applies after a restart.", { language: NAMES[uiPreferences.language] })}
-          <Button size="small" onClick={confirm}>{t("Restart now")}</Button>
-        </span>
-      )}
+      <RestartForLanguage language={uiPreferences.language} />
+    </Field>
+  );
+}
+
+/** Shown while the saved language differs from this launch's: a restart, confirmed after naming what it interrupts. */
+export function RestartForLanguage({ language }: { language: UiLanguage }) {
+  const [confirming, setConfirming] = useState(false);
+  const [running, setRunning] = useState<number | null>(null);
+  const [error, setError] = useState<string | null>(null);
+  if (language === window.agentCompany.language) return null;
+  const confirm = () => {
+    setRunning(null);
+    setError(null);
+    setConfirming(true);
+    void window.agentCompany.runningSessionCount().then((result) => {
+      if (result.ok) setRunning(result.data);
+      else setError(result.error.message);
+    });
+  };
+  const restart = () => {
+    setError(null);
+    void window.agentCompany.relaunchApp().then((result) => { if (!result.ok) setError(result.error.message); });
+  };
+  return (
+    <>
+      <span className="row" style={{ gap: 8, fontSize: 12 }} role="status">
+        {t("{language} applies after a restart.", { language: NAMES[language] })}
+        <Button size="small" onClick={confirm}>{t("Restart now")}</Button>
+      </span>
       <Dialog title={t("Restart to switch language?")} open={confirming} submitLabel={t("Restart now")} onClose={() => setConfirming(false)} onSubmit={(event) => { event.preventDefault(); restart(); }}>
         <ul style={{ margin: 0, paddingLeft: 18, lineHeight: 1.6, fontSize: 13 }}>
           <li>{t("Text you typed but have not sent or saved is lost.")}</li>
@@ -53,6 +60,6 @@ export function LanguageField({ uiPreferences, actions }: { uiPreferences: UiPre
         </ul>
         {error && <div className="form-error" role="alert">{error}</div>}
       </Dialog>
-    </Field>
+    </>
   );
 }