@chrysb/alphaclaw 0.4.1-beta.0 → 0.4.1-beta.2

package/lib/public/js/components/welcome.js

@@ -1,19 +1,11 @@
 import { h } from "https://esm.sh/preact";
-import { useState, useEffect, useRef } from "https://esm.sh/preact/hooks";
+import { useState, useEffect } from "https://esm.sh/preact/hooks";
 import htm from "https://esm.sh/htm";
 import {
   runOnboard,
   verifyGithubOnboardingRepo,
   fetchModels,
-  fetchCodexStatus,
-  disconnectCodex,
-  exchangeCodexOAuth,
-  fetchStatus,
-  fetchPairings,
-  approvePairing,
-  rejectPairing,
 } from "../lib/api.js";
-import { usePolling } from "../hooks/usePolling.js";
 import {
   getModelProvider,
   getFeaturedModels,
@@ -27,41 +19,46 @@ import { WelcomeHeader } from "./onboarding/welcome-header.js";
 import { WelcomeSetupStep } from "./onboarding/welcome-setup-step.js";
 import { WelcomeFormStep } from "./onboarding/welcome-form-step.js";
 import { WelcomePairingStep } from "./onboarding/welcome-pairing-step.js";
+import { getPreferredPairingChannel } from "./onboarding/pairing-utils.js";
 import {
-  getPreferredPairingChannel,
-  isChannelPaired,
-} from "./onboarding/pairing-utils.js";
+  kOnboardingStorageKey,
+  kPairingChannelKey,
+  useWelcomeStorage,
+} from "./onboarding/use-welcome-storage.js";
+import { useWelcomeCodex } from "./onboarding/use-welcome-codex.js";
+import { useWelcomePairing } from "./onboarding/use-welcome-pairing.js";
 const html = htm.bind(h);
-const kOnboardingStorageKey = "openclaw_setup";
-const kOnboardingStepKey = "_step";
-const kPairingChannelKey = "_pairingChannel";
 const kMaxOnboardingVars = 64;
 const kMaxEnvKeyLength = 128;
 const kMaxEnvValueLength = 4096;
 
 export const Welcome = ({ onComplete }) => {
-  const [initialSetupState] = useState(() => {
-    try {
-      return JSON.parse(localStorage.getItem(kOnboardingStorageKey) || "{}");
-    } catch {
-      return {};
-    }
-  });
-  const [vals, setVals] = useState(() => ({ ...initialSetupState }));
+  const kSetupStepIndex = kWelcomeGroups.length;
+  const kPairingStepIndex = kSetupStepIndex + 1;
+  const { vals, setVals, setValue, step, setStep, setupError, setSetupError } =
+    useWelcomeStorage({
+      kSetupStepIndex,
+      kPairingStepIndex,
+    });
   const [models, setModels] = useState([]);
   const [modelsLoading, setModelsLoading] = useState(true);
   const [modelsError, setModelsError] = useState(null);
   const [showAllModels, setShowAllModels] = useState(false);
-  const [codexStatus, setCodexStatus] = useState({ connected: false });
-  const [codexLoading, setCodexLoading] = useState(true);
-  const [codexManualInput, setCodexManualInput] = useState("");
-  const [codexExchanging, setCodexExchanging] = useState(false);
-  const [codexAuthStarted, setCodexAuthStarted] = useState(false);
-  const [codexAuthWaiting, setCodexAuthWaiting] = useState(false);
   const [loading, setLoading] = useState(false);
   const [githubStepLoading, setGithubStepLoading] = useState(false);
-  const [error, setError] = useState(null);
-  const codexPopupPollRef = useRef(null);
+  const [formError, setFormError] = useState(null);
+  const {
+    codexStatus,
+    codexLoading,
+    codexManualInput,
+    setCodexManualInput,
+    codexExchanging,
+    codexAuthStarted,
+    codexAuthWaiting,
+    startCodexAuth,
+    completeCodexAuth,
+    handleCodexDisconnect,
+  } = useWelcomeCodex({ setFormError });
 
   useEffect(() => {
     fetchModels()
@@ -78,50 +75,6 @@ export const Welcome = ({ onComplete }) => {
       .finally(() => setModelsLoading(false));
   }, []);
 
-  const refreshCodexStatus = async () => {
-    try {
-      const status = await fetchCodexStatus();
-      setCodexStatus(status);
-      if (status?.connected) {
-        setCodexAuthStarted(false);
-        setCodexAuthWaiting(false);
-      }
-    } catch {
-      setCodexStatus({ connected: false });
-    } finally {
-      setCodexLoading(false);
-    }
-  };
-
-  useEffect(() => {
-    refreshCodexStatus();
-  }, []);
-
-  useEffect(() => {
-    const onMessage = async (e) => {
-      if (e.data?.codex === "success") {
-        await refreshCodexStatus();
-      }
-      if (e.data?.codex === "error") {
-        setError(`Codex auth failed: ${e.data.message || "unknown error"}`);
-      }
-    };
-    window.addEventListener("message", onMessage);
-    return () => window.removeEventListener("message", onMessage);
-  }, []);
-
-  useEffect(
-    () => () => {
-      if (codexPopupPollRef.current) {
-        clearInterval(codexPopupPollRef.current);
-        codexPopupPollRef.current = null;
-      }
-    },
-    [],
-  );
-
-  const set = (key, value) => setVals((prev) => ({ ...prev, [key]: value }));
-
   const selectedProvider = getModelProvider(vals.MODEL_KEY);
   const featuredModels = getFeaturedModels(models);
   const baseModelOptions = showAllModels
@@ -152,18 +105,6 @@ export const Welcome = ({ onComplete }) => {
             : false;
 
   const allValid = kWelcomeGroups.every((g) => g.validate(vals, { hasAi }));
-  const kSetupStepIndex = kWelcomeGroups.length;
-  const kPairingStepIndex = kSetupStepIndex + 1;
-  const [step, setStep] = useState(() => {
-    const parsedStep = Number.parseInt(
-      String(initialSetupState?.[kOnboardingStepKey] || ""),
-      10,
-    );
-    if (!Number.isFinite(parsedStep)) return 0;
-    return Math.max(0, Math.min(kPairingStepIndex, parsedStep));
-  });
-  const [pairingError, setPairingError] = useState(null);
-  const [pairingComplete, setPairingComplete] = useState(false);
   const isSetupStep = step === kSetupStepIndex;
   const isPairingStep = step === kPairingStepIndex;
   const activeGroup = step < kSetupStepIndex ? kWelcomeGroups[step] : null;
@@ -173,94 +114,20 @@ export const Welcome = ({ onComplete }) => {
   const selectedPairingChannel = String(
     vals[kPairingChannelKey] || getPreferredPairingChannel(vals),
   );
-  const pairingStatusPoll = usePolling(fetchStatus, 3000, {
-    enabled: isPairingStep,
+  const {
+    pairingStatusPoll,
+    pairingRequestsPoll,
+    pairingChannels,
+    canFinishPairing,
+    pairingError,
+    pairingComplete,
+    handlePairingApprove,
+    handlePairingReject,
+    resetPairingState,
+  } = useWelcomePairing({
+    isPairingStep,
+    selectedPairingChannel,
   });
-  const pairingRequestsPoll = usePolling(
-    async () => {
-      const payload = await fetchPairings();
-      const allPending = payload.pending || [];
-      return allPending.filter((p) => p.channel === selectedPairingChannel);
-    },
-    1000,
-    { enabled: isPairingStep && !!selectedPairingChannel },
-  );
-  const pairingChannels = pairingStatusPoll.data?.channels || {};
-  const canFinishPairing = isChannelPaired(pairingChannels, selectedPairingChannel);
-
-  useEffect(() => {
-    if (isPairingStep && canFinishPairing) {
-      setPairingComplete(true);
-    }
-  }, [isPairingStep, canFinishPairing]);
-
-  useEffect(() => {
-    localStorage.setItem(
-      kOnboardingStorageKey,
-      JSON.stringify({
-        ...vals,
-        [kOnboardingStepKey]: step,
-      }),
-    );
-  }, [vals, step]);
-
-  const startCodexAuth = () => {
-    if (codexStatus.connected) return;
-    setCodexAuthStarted(true);
-    setCodexAuthWaiting(true);
-    const authUrl = "/auth/codex/start";
-    const popup = window.open(
-      authUrl,
-      "codex-auth",
-      "popup=yes,width=640,height=780",
-    );
-    if (!popup || popup.closed) {
-      setCodexAuthWaiting(false);
-      window.location.href = authUrl;
-      return;
-    }
-    if (codexPopupPollRef.current) {
-      clearInterval(codexPopupPollRef.current);
-    }
-    codexPopupPollRef.current = setInterval(() => {
-      if (popup.closed) {
-        clearInterval(codexPopupPollRef.current);
-        codexPopupPollRef.current = null;
-        setCodexAuthWaiting(false);
-      }
-    }, 500);
-  };
-
-  const completeCodexAuth = async () => {
-    if (!codexManualInput.trim() || codexExchanging) return;
-    setCodexExchanging(true);
-    setError(null);
-    try {
-      const result = await exchangeCodexOAuth(codexManualInput.trim());
-      if (!result.ok)
-        throw new Error(result.error || "Codex OAuth exchange failed");
-      setCodexManualInput("");
-      setCodexAuthStarted(false);
-      setCodexAuthWaiting(false);
-      await refreshCodexStatus();
-    } catch (err) {
-      setError(err.message || "Codex OAuth exchange failed");
-    } finally {
-      setCodexExchanging(false);
-    }
-  };
-
-  const handleCodexDisconnect = async () => {
-    const result = await disconnectCodex();
-    if (!result.ok) {
-      setError(result.error || "Failed to disconnect Codex");
-      return;
-    }
-    setCodexAuthStarted(false);
-    setCodexAuthWaiting(false);
-    setCodexManualInput("");
-    await refreshCodexStatus();
-  };
 
   const handleSubmit = async () => {
     if (!allValid || loading) return;
@@ -294,14 +161,16 @@ export const Welcome = ({ onComplete }) => {
       return "";
     })();
     if (preflightError) {
-      setError(preflightError);
+      setFormError(preflightError);
+      setSetupError(null);
       setStep(Math.max(0, kWelcomeGroups.findIndex((g) => g.id === "github")));
       return;
     }
     setStep(kSetupStepIndex);
     setLoading(true);
-    setError(null);
-    setPairingError(null);
+    setFormError(null);
+    setSetupError(null);
+    resetPairingState();
 
     try {
       const result = await runOnboard(vars, vals.MODEL_KEY);
@@ -316,38 +185,15 @@ export const Welcome = ({ onComplete }) => {
       }));
       setLoading(false);
       setStep(kPairingStepIndex);
-      setPairingComplete(false);
+      resetPairingState();
+      setSetupError(null);
     } catch (err) {
       console.error("Onboard error:", err);
-      setError(err.message);
+      setSetupError(err.message || "Onboarding failed");
       setLoading(false);
     }
   };
 
-  const handlePairingApprove = async (id, channel) => {
-    try {
-      setPairingError(null);
-      const result = await approvePairing(id, channel);
-      if (!result.ok) throw new Error(result.error || "Could not approve pairing");
-      setPairingComplete(true);
-      pairingRequestsPoll.refresh();
-      pairingStatusPoll.refresh();
-    } catch (err) {
-      setPairingError(err.message || "Could not approve pairing");
-    }
-  };
-
-  const handlePairingReject = async (id, channel) => {
-    try {
-      setPairingError(null);
-      const result = await rejectPairing(id, channel);
-      if (!result.ok) throw new Error(result.error || "Could not reject pairing");
-      pairingRequestsPoll.refresh();
-    } catch (err) {
-      setPairingError(err.message || "Could not reject pairing");
-    }
-  };
-
   const finishOnboarding = () => {
     localStorage.removeItem(kOnboardingStorageKey);
     onComplete();
@@ -355,17 +201,18 @@ export const Welcome = ({ onComplete }) => {
 
   const goBack = () => {
     if (isSetupStep) return;
-    setError(null);
+    setFormError(null);
     setStep((prev) => Math.max(0, prev - 1));
   };
   const goBackFromSetupError = () => {
     setLoading(false);
+    setSetupError(null);
     setStep(kWelcomeGroups.length - 1);
   };
 
   const goNext = async () => {
     if (!activeGroup || !currentGroupValid) return;
-    setError(null);
+    setFormError(null);
     if (activeGroup.id === "github") {
       setGithubStepLoading(true);
       try {
@@ -374,11 +221,11 @@ export const Welcome = ({ onComplete }) => {
           vals.GITHUB_TOKEN,
         );
         if (!result?.ok) {
-          setError(result?.error || "GitHub verification failed");
+          setFormError(result?.error || "GitHub verification failed");
           return;
         }
       } catch (err) {
-        setError(err?.message || "GitHub verification failed");
+        setFormError(err?.message || "GitHub verification failed");
         return;
       } finally {
         setGithubStepLoading(false);
@@ -412,7 +259,7 @@ export const Welcome = ({ onComplete }) => {
       <div class="bg-surface border border-border rounded-xl p-4 space-y-3">
         ${isSetupStep
           ? html`<${WelcomeSetupStep}
-              error=${error}
+              error=${setupError}
               loading=${loading}
               onRetry=${handleSubmit}
               onBack=${goBackFromSetupError}
@@ -434,7 +281,7 @@ export const Welcome = ({ onComplete }) => {
                 activeGroup=${activeGroup}
                 vals=${vals}
                 hasAi=${hasAi}
-                setValue=${set}
+                setValue=${setValue}
                 modelOptions=${modelOptions}
                 modelsLoading=${modelsLoading}
                 modelsError=${modelsError}
@@ -453,7 +300,7 @@ export const Welcome = ({ onComplete }) => {
                 completeCodexAuth=${completeCodexAuth}
                 codexExchanging=${codexExchanging}
                 visibleAiFieldKeys=${visibleAiFieldKeys}
-                error=${error}
+                error=${formError}
                 step=${step}
                 totalGroups=${kWelcomeGroups.length}
                 currentGroupValid=${currentGroupValid}

package/lib/public/js/lib/api.js

@@ -540,6 +540,33 @@ export const saveFileContent = async (filePath, content) => {
   return parseJsonOrThrow(res, 'Could not save file');
 };
 
+export const createBrowseFile = async (filePath) => {
+  const res = await authFetch('/api/browse/create-file', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ path: String(filePath || '') }),
+  });
+  return parseJsonOrThrow(res, 'Could not create file');
+};
+
+export const createBrowseFolder = async (folderPath) => {
+  const res = await authFetch('/api/browse/create-folder', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ path: String(folderPath || '') }),
+  });
+  return parseJsonOrThrow(res, 'Could not create folder');
+};
+
+export const moveBrowsePath = async (from, to) => {
+  const res = await authFetch('/api/browse/move', {
+    method: 'POST',
+    headers: { 'Content-Type': 'application/json' },
+    body: JSON.stringify({ from: String(from || ''), to: String(to || '') }),
+  });
+  return parseJsonOrThrow(res, 'Could not move path');
+};
+
 export const deleteBrowseFile = async (filePath) => {
   const res = await authFetch('/api/browse/delete', {
     method: 'DELETE',

package/lib/public/js/lib/browse-file-policies.js

@@ -43,7 +43,9 @@ export const matchesBrowsePolicyPath = (policyPathSet, normalizedPath) => {
   for (const policyPath of policyPathSet) {
     if (
       safeNormalizedPath === policyPath ||
-      safeNormalizedPath.endsWith(`/${policyPath}`)
+      safeNormalizedPath.endsWith(`/${policyPath}`) ||
+      safeNormalizedPath.startsWith(`${policyPath}/`) ||
+      safeNormalizedPath.includes(`/${policyPath}/`)
     ) {
       return true;
     }

package/lib/public/shared/browse-file-policies.json

@@ -6,7 +6,8 @@
   "lockedPaths": [
     "hooks/bootstrap/agents.md",
     "hooks/bootstrap/tools.md",
-    "skills/control-ui/skill.md",
+    "skills/control-ui",
+    "skills/gog-cli",
     ".alphaclaw/hourly-git-sync.sh",
     ".alphaclaw/.cli-device-auto-approved"
   ]

package/lib/server/constants.js

@@ -147,7 +147,6 @@ const kLogMaxBytes = parsePositiveIntEnv(
 
 const kSystemVars = new Set([
   "WEBHOOK_TOKEN",
-  "OPENCLAW_HOOKS_TOKEN",
   "OPENCLAW_GATEWAY_TOKEN",
   "SETUP_PASSWORD",
   "PORT",

package/lib/server/gmail-serve.js

@@ -110,7 +110,7 @@ const createGmailServeManager = ({
     }
     const token = String(webhookToken || "").trim();
     if (!token) {
-      throw new Error("OPENCLAW_HOOKS_TOKEN is required to start Gmail watch serve");
+      throw new Error("WEBHOOK_TOKEN is required to start Gmail watch serve");
     }
 
     const args = buildArgs({ account, port: normalizedPort, webhookToken: token });

package/lib/server/gmail-watch.js

@@ -203,39 +203,19 @@ const createGmailWatchService = ({
   };
 
   const ensureWebhookToken = () => {
-    const existing = String(
-      process.env.OPENCLAW_HOOKS_TOKEN || process.env.WEBHOOK_TOKEN || "",
-    ).trim();
+    const existing = String(process.env.WEBHOOK_TOKEN || "").trim();
     if (existing) return { token: existing, changed: false };
     const vars = readEnvFile();
-    const tokenFromOpenclawHooks = String(
-      vars.find((entry) => entry.key === "OPENCLAW_HOOKS_TOKEN")?.value || "",
-    ).trim();
-    const tokenFromLegacyWebhook = String(
+    const tokenFromFile = String(
       vars.find((entry) => entry.key === "WEBHOOK_TOKEN")?.value || "",
     ).trim();
-    const tokenFromFile = tokenFromOpenclawHooks || tokenFromLegacyWebhook;
     if (tokenFromFile) {
-      process.env.OPENCLAW_HOOKS_TOKEN = tokenFromFile;
-      if (!process.env.WEBHOOK_TOKEN) {
-        process.env.WEBHOOK_TOKEN = tokenFromFile;
-      }
-      if (!tokenFromOpenclawHooks) {
-        const nextVars = vars.filter(
-          (entry) => entry.key !== "OPENCLAW_HOOKS_TOKEN",
-        );
-        nextVars.push({ key: "OPENCLAW_HOOKS_TOKEN", value: tokenFromFile });
-        writeEnvFile(nextVars);
-        reloadEnv();
-        return { token: tokenFromFile, changed: true };
-      }
+      process.env.WEBHOOK_TOKEN = tokenFromFile;
       return { token: tokenFromFile, changed: false };
     }
     const token = generatePushToken();
-    const nextVars = vars.filter(
-      (entry) => entry.key !== "OPENCLAW_HOOKS_TOKEN",
-    );
-    nextVars.push({ key: "OPENCLAW_HOOKS_TOKEN", value: token });
+    const nextVars = vars.filter((entry) => entry.key !== "WEBHOOK_TOKEN");
+    nextVars.push({ key: "WEBHOOK_TOKEN", value: token });
     writeEnvFile(nextVars);
     reloadEnv();
     return { token, changed: true };
@@ -258,7 +238,7 @@ const createGmailWatchService = ({
       changed = true;
     }
     if (typeof cfg.hooks.token !== "string" || !cfg.hooks.token.trim()) {
-      cfg.hooks.token = "${OPENCLAW_HOOKS_TOKEN}";
+      cfg.hooks.token = "${WEBHOOK_TOKEN}";
       changed = true;
     }
     if (!Array.isArray(cfg.hooks.presets)) {
@@ -337,7 +317,7 @@ const createGmailWatchService = ({
           const watch = getAccountGmailWatch(account || {});
           if (!account || !watch.enabled || !watch.port) return;
           const token = String(
-            process.env.OPENCLAW_HOOKS_TOKEN || process.env.WEBHOOK_TOKEN || "",
+            process.env.WEBHOOK_TOKEN || "",
           ).trim();
           if (!token) return;
           const status = await serveManager.startServe({
@@ -633,7 +613,7 @@ const createGmailWatchService = ({
       try {
         let state = readState();
         const hookToken = String(
-          process.env.OPENCLAW_HOOKS_TOKEN || process.env.WEBHOOK_TOKEN || "",
+          process.env.WEBHOOK_TOKEN || "",
         ).trim();
         const enabled = listWatchEnabledAccounts(state);
         for (const account of enabled) {