feat(onboarding): usage

yw-kqy · yw-kqy · commit 6b3690b09860 · 2026-04-10T15:39:55.000+08:00
diff --git a/src-api/src/core/openclaw-workspace-markdown.ts b/src-api/src/core/openclaw-workspace-markdown.ts
@@ -2,6 +2,8 @@ import { mkdir, access } from "node:fs/promises";
 import { constants as fsConstants } from "node:fs";
 import { homedir } from "node:os";
 import { join } from "node:path";
+import { BotService } from "./bot-service";
+import { readGatewaySettings } from "./openclaw-config-file";
 
 export type WorkspaceTemplateId = "export-owner" | "equipment-rental" | "platform-ops";
 
@@ -53,6 +55,8 @@ export interface ApplyWorkspaceTemplateResult {
   success: true;
   assistantId: string;
   assistantName: string;
+  botId: string;
+  botName: string;
   workspacePath: string;
   writtenFiles: WrittenWorkspaceFile[];
   warnings: string[];
@@ -74,6 +78,12 @@ const GENERATED_FILES = [
   "assistants/profile.md",
 ];
 
+const TEMPLATE_BOT_EMOJI: Record<WorkspaceTemplateId, string> = {
+  "export-owner": "🌍",
+  "equipment-rental": "🏗️",
+  "platform-ops": "📈",
+};
+
 function slugify(value: string): string {
   const normalized = value
     .trim()
@@ -472,10 +482,30 @@ export async function applyWorkspaceTemplate(
     });
   }
 
+  const gatewaySettings = await readGatewaySettings().catch(() => null);
+  const defaultGatewayPort = gatewaySettings?.port ?? 18789;
+  const defaultGatewayUrl = `ws://localhost:${defaultGatewayPort}/ws`;
+  const defaultGatewayToken =
+    gatewaySettings?.authMode === "token" ? gatewaySettings.authToken ?? undefined : undefined;
+  const bot = BotService.create({
+    name: assistantName,
+    avatar_emoji: TEMPLATE_BOT_EMOJI[input.templateId],
+    description: assistantGoal,
+    skills_config: [],
+    mcp_config: {},
+    llm_config: {},
+    openclaw_ws_url: defaultGatewayUrl,
+    openclaw_ws_token: defaultGatewayToken,
+    openclaw_agent_id: "main",
+    is_active: true,
+  });
+
   return {
     success: true,
     assistantId,
     assistantName,
+    botId: bot.id,
+    botName: bot.name,
     workspacePath,
     writtenFiles,
     warnings: [],
diff --git a/src/components/StartupGuard.tsx b/src/components/StartupGuard.tsx
@@ -2,48 +2,45 @@ import { useEffect, useState } from "react";
 import { Navigate } from "react-router-dom";
 import { apiClient } from "../shared/api-client";
 import { setOnboardingRuntimeState } from "../shared/store/onboarding-runtime-store.ts";
-import { getOnboardingProgress, useWizardStore } from "../shared/store/wizard-store";
+import { getOnboardingProgress, isOnboardingComplete, useWizardStore } from "../shared/store/wizard-store";
 
-type CheckState = "loading" | "has-openclaw" | "no-openclaw" | "error";
+type CheckState = "loading" | "installed" | "resume-onboarding" | "start-onboarding" | "error";
 
 export function StartupGuard() {
   const [state, setState] = useState<CheckState>("loading");
-  const [hasProgress, setHasProgress] = useState(false);
+  const [targetStep, setTargetStep] = useState("welcome");
 
   useEffect(() => {
     let cancelled = false;
 
-    const progress = getOnboardingProgress();
-    if (progress) {
-      useWizardStore.getState().goToStep(progress.lastStepId);
-      setHasProgress(true);
-      setOnboardingRuntimeState({
-        startupCheck: "unknown",
-        hasOpenClaw: false,
-        selectedTemplateId: null,
-        initializedAssistantAt: null,
-        assistantName: null,
-        assistantWorkspacePath: null,
-      });
-      setState("no-openclaw");
-      return () => {
-        cancelled = true;
-      };
-    }
-
     apiClient
       .get<{ hasOpenClaw: boolean }>("/openclaw/check-environment")
       .then((res) => {
         if (cancelled) return;
+
+        const progress = getOnboardingProgress();
+        const completed = isOnboardingComplete();
+        const nextStep = progress?.lastStepId ?? "welcome";
+
         setOnboardingRuntimeState({
           startupCheck: "ready",
           hasOpenClaw: res.hasOpenClaw,
           selectedTemplateId: null,
           initializedAssistantAt: null,
           assistantName: null,
           assistantWorkspacePath: null,
+          createdBotId: null,
+          createdBotName: null,
         });
-        setState(res.hasOpenClaw ? "has-openclaw" : "no-openclaw");
+
+        if (res.hasOpenClaw) {
+          setState("installed");
+          return;
+        }
+
+        useWizardStore.getState().goToStep(nextStep);
+        setTargetStep(nextStep);
+        setState(progress || completed ? "resume-onboarding" : "start-onboarding");
       })
       .catch(() => {
         if (cancelled) return;
@@ -54,6 +51,8 @@ export function StartupGuard() {
           initializedAssistantAt: null,
           assistantName: null,
           assistantWorkspacePath: null,
+          createdBotId: null,
+          createdBotName: null,
         });
         setState("error");
       });
@@ -108,16 +107,19 @@ export function StartupGuard() {
     );
   }
 
-  if (state === "no-openclaw" || state === "has-openclaw" || state === "error") {
-    if (!hasProgress) {
-      useWizardStore.getState().goToStep("welcome");
-      return <Navigate to="/onboarding/welcome" replace />;
-    }
-    const progress = getOnboardingProgress();
-    const targetStep = progress?.lastStepId ?? "welcome";
+  if (state === "installed") {
+    return <Navigate to="/bots" replace />;
+  }
+
+  if (state === "resume-onboarding") {
     return <Navigate to={`/onboarding/${targetStep}`} replace />;
   }
 
+  if (state === "start-onboarding") {
+    useWizardStore.getState().goToStep("welcome");
+    return <Navigate to="/onboarding/welcome" replace />;
+  }
+
   if (state === "error") {
     useWizardStore.getState().goToStep("welcome");
     return <Navigate to="/onboarding/welcome" replace />;
diff --git a/src/pages/OnboardingV2/Page1Welcome.tsx b/src/pages/OnboardingV2/Page1Welcome.tsx
@@ -1,12 +1,15 @@
 import { useMemo } from "react";
 import { useNavigate } from "react-router-dom";
 import { getOnboardingRuntimeState } from "../../shared/store/onboarding-runtime-store";
+import { isOnboardingComplete } from "../../shared/store/wizard-store";
 import { OnboardingPageShell } from "./OnboardingPageShell";
 
 export function OnboardingPage() {
   const navigate = useNavigate();
   const runtimeState = useMemo(() => getOnboardingRuntimeState(), []);
   const hasOpenClaw = runtimeState.hasOpenClaw;
+  const hadCompletedOnboarding = useMemo(() => isOnboardingComplete(), []);
+  const needsReinstall = hadCompletedOnboarding && !hasOpenClaw;
   const footer = {
     hint: "你之后仍可从设置重新进入这条向导。",
     actions: [
@@ -86,16 +89,20 @@ export function OnboardingPage() {
       <section className="rounded-[24px] border border-[#E2E8F0] bg-[linear-gradient(180deg,#F8FAFC_0%,#FFFFFF_100%)] p-6 shadow-[0_18px_48px_rgba(15,23,42,0.06)]">
         <div className="text-[13px] font-semibold text-[#2563EB]">下一步</div>
         <div className="mt-3 text-[24px] font-semibold leading-[1.3] text-[#0F172A]">
-          {hasOpenClaw ? "已检测到 OpenClaw" : "开始安装 OpenClaw"}
+          {hasOpenClaw ? "已检测到 OpenClaw" : needsReinstall ? "需要重新安装 OpenClaw" : "开始安装 OpenClaw"}
         </div>
         <p className="mt-3 text-[14px] leading-7 text-[#64748B]">
           {hasOpenClaw
             ? "你可以直接退出向导，或者重新进入安装流程。"
-            : "当前还没有检测到 OpenClaw，建议先完成安装再继续。"}
+            : needsReinstall
+              ? "检测到你之前已经完成过初始化，但当前没有找到 OpenClaw，可能已被手动卸载，建议先重新安装。"
+              : "当前还没有检测到 OpenClaw，建议先完成安装再继续。"}
         </p>
 
         <div className="mt-6 rounded-2xl border border-[#E2E8F0] bg-white px-4 py-4 text-[13px] leading-6 text-[#64748B]">
-          这一步只做一个决定：继续安装，或者在已安装时直接退出向导。
+          {needsReinstall
+            ? "这一步会引导你修复当前缺失的 OpenClaw 环境，完成后再继续后续配置。"
+            : "这一步只做一个决定：继续安装，或者在已安装时直接退出向导。"}
         </div>
       </section>
     </OnboardingPageShell>
diff --git a/src/pages/OnboardingV2/Page4Template.tsx b/src/pages/OnboardingV2/Page4Template.tsx
@@ -66,6 +66,8 @@ export function OnboardingPage() {
       initializedAssistantAt: null,
       assistantName: runtimeState.assistantName,
       assistantWorkspacePath: null,
+      createdBotId: null,
+      createdBotName: null,
     });
     navigate("/onboarding/assistant");
   }
diff --git a/src/pages/OnboardingV2/Page5Assistant.tsx b/src/pages/OnboardingV2/Page5Assistant.tsx
@@ -4,12 +4,12 @@ import {
   applyWorkspaceTemplate,
   fetchWorkspaceTemplateSchema,
 } from "../../shared/hooks/useOnboardingWorkspace";
-import { getTemplateMeta } from "../Onboarding/views/template-meta";
 import {
   getOnboardingRuntimeState,
   setOnboardingRuntimeState,
 } from "../../shared/store/onboarding-runtime-store";
 import type { WorkspaceTemplateSchema } from "../../shared/types";
+import { getTemplateMeta } from "../Onboarding/views/template-meta";
 import { OnboardingPageShell } from "./OnboardingPageShell";
 
 export function OnboardingPage() {
@@ -61,6 +61,8 @@ export function OnboardingPage() {
         initializedAssistantAt: Date.now(),
         assistantName: result.assistantName,
         assistantWorkspacePath: result.workspacePath,
+        createdBotId: result.botId,
+        createdBotName: result.botName,
       });
 
       navigate("/onboarding/ready", { state: result });
@@ -87,13 +89,21 @@ export function OnboardingPage() {
         },
         variant: "primary" as const,
         disabled:
-          isSaving || !assistantName.trim() || !assistantGoal.trim() || !toneStyle.trim() || !schema,
+          isSaving ||
+          !assistantName.trim() ||
+          !assistantGoal.trim() ||
+          !toneStyle.trim() ||
+          !schema,
       },
     ],
   };
 
   return (
-    <OnboardingPageShell footer={footer} mainClassName="items-start" contentClassName="max-w-[760px]">
+    <OnboardingPageShell
+      footer={footer}
+      mainClassName="items-start"
+      contentClassName="max-w-[760px]"
+    >
       <section>
         <div className="inline-flex items-center rounded-full bg-[#EFF6FF] px-3 py-1 text-[11px] font-semibold text-[#2563EB]">
           Step 5 / 创建助手
@@ -103,7 +113,10 @@ export function OnboardingPage() {
         </h2>
         <p className="mt-3 text-[14px] leading-7 text-[#64748B]">
           当前模板为
-          <span className="font-semibold text-[#0F172A]"> {templateMeta.icon} {templateMeta.name}</span>
+          <span className="font-semibold text-[#0F172A]">
+            {" "}
+            {templateMeta.icon} {templateMeta.name}
+          </span>
           。补齐助手名称、目标和协作风格后，系统会为它创建独立 workspace 并写入初始化 markdown。
         </p>
 
@@ -123,7 +136,9 @@ export function OnboardingPage() {
             </div>
 
             <div>
-              <label className="block text-[13px] font-semibold text-[#0F172A]">你最希望它帮你推进什么</label>
+              <label className="block text-[13px] font-semibold text-[#0F172A]">
+                你最希望它帮你推进什么
+              </label>
               <textarea
                 value={assistantGoal}
                 onChange={(event) => setAssistantGoal(event.target.value)}
@@ -134,7 +149,9 @@ export function OnboardingPage() {
             </div>
 
             <div>
-              <label className="block text-[13px] font-semibold text-[#0F172A]">你希望它的协作风格</label>
+              <label className="block text-[13px] font-semibold text-[#0F172A]">
+                你希望它的协作风格
+              </label>
               <textarea
                 value={toneStyle}
                 onChange={(event) => setToneStyle(event.target.value)}
@@ -145,10 +162,6 @@ export function OnboardingPage() {
             </div>
           </div>
 
-          <div className="mt-4 rounded-2xl border border-[#E2E8F0] bg-[#F8FAFC] px-4 py-4 text-[13px] leading-7 text-[#64748B]">
-            创建后会生成：AGENTS.md、SOUL.md、TOOLS.md、MEMORY.md 和助手 profile markdown。
-          </div>
-
           {error ? (
             <div className="mt-4 rounded-2xl border border-[#FECACA] bg-[#FEF2F2] px-4 py-3 text-[13px] leading-6 text-[#B91C1C]">
               {error}
diff --git a/src/pages/OnboardingV2/Page5Ready.tsx b/src/pages/OnboardingV2/Page5Ready.tsx
@@ -22,11 +22,13 @@ export function OnboardingPage() {
           Step 6 / 开始对话
         </div>
         <h2 className="mt-4 text-[28px] font-semibold leading-[1.15] tracking-[-0.03em] text-[#0F172A]">
-          第一个助手已经初始化完成
+          第一个助手和默认 Bot 已创建完成
         </h2>
         <p className="mt-3 text-[14px] leading-7 text-[#64748B]">
           <span className="font-semibold text-[#0F172A]">{result?.assistantName ?? runtimeState.assistantName ?? "我的助手"}</span>
-          的专属 workspace 已创建完成，现在可以直接进入对话，也可以先查看生成结果。
+          的专属 workspace 已创建完成，系统也已经自动生成第一个 Bot：
+          <span className="font-semibold text-[#0F172A]"> {result?.botName ?? runtimeState.createdBotName ?? "默认 Bot"}</span>
+          。现在可以直接进入对话，也可以先查看生成结果。
         </p>
 
         <div className="mt-6 rounded-3xl border border-[#E2E8F0] bg-white p-5 shadow-[0_12px_30px_rgba(15,23,42,0.05)]">
@@ -36,6 +38,10 @@ export function OnboardingPage() {
             Workspace 路径：{result?.workspacePath ?? runtimeState.assistantWorkspacePath ?? "未记录"}
           </div>
 
+          <div className="mt-4 rounded-2xl border border-[#DCFCE7] bg-[#F0FDF4] px-4 py-4 text-[13px] leading-7 text-[#166534]">
+            已创建 Bot：{result?.botName ?? runtimeState.createdBotName ?? "默认 Bot"}
+          </div>
+
           <div className="mt-4 rounded-2xl border border-[#E2E8F0] bg-[#F8FAFC] px-4 py-4 text-[13px] leading-7 text-[#64748B]">
             已生成文件：
             <div className="mt-2 space-y-1 text-[#0F172A]">
diff --git a/src/shared/store/onboarding-runtime-store.ts b/src/shared/store/onboarding-runtime-store.ts
@@ -7,6 +7,8 @@ export interface OnboardingRuntimeState {
   initializedAssistantAt: number | null;
   assistantName: string | null;
   assistantWorkspacePath: string | null;
+  createdBotId: string | null;
+  createdBotName: string | null;
 }
 
 const STORAGE_KEY = "onboarding_runtime_state_v1";
@@ -18,6 +20,8 @@ const defaultState: OnboardingRuntimeState = {
   initializedAssistantAt: null,
   assistantName: null,
   assistantWorkspacePath: null,
+  createdBotId: null,
+  createdBotName: null,
 };
 
 function canUseStorage() {
@@ -48,6 +52,8 @@ export function getOnboardingRuntimeState(): OnboardingRuntimeState {
       assistantName: typeof parsed.assistantName === "string" ? parsed.assistantName : null,
       assistantWorkspacePath:
         typeof parsed.assistantWorkspacePath === "string" ? parsed.assistantWorkspacePath : null,
+      createdBotId: typeof parsed.createdBotId === "string" ? parsed.createdBotId : null,
+      createdBotName: typeof parsed.createdBotName === "string" ? parsed.createdBotName : null,
     };
   } catch {
     return defaultState;
diff --git a/src/shared/types/index.ts b/src/shared/types/index.ts
@@ -233,6 +233,8 @@ export interface WorkspaceInitResult {
   success: true;
   assistantId: string;
   assistantName: string;
+  botId: string;
+  botName: string;
   workspacePath: string;
   writtenFiles: Array<{
     kind: "agents" | "soul" | "tools" | "memory" | "assistant-profile";

Original file line number	Diff line number	Diff line change
`@@ -66,6 +66,8 @@ export function OnboardingPage() {`
`66`	`66`	`initializedAssistantAt: null,`
`67`	`67`	`assistantName: runtimeState.assistantName,`
`68`	`68`	`assistantWorkspacePath: null,`
	`69`	`+ createdBotId: null,`
	`70`	`+ createdBotName: null,`
`69`	`71`	`});`
`70`	`72`	`navigate("/onboarding/assistant");`
`71`	`73`	`}`