@chrysb/alphaclaw 0.9.16 → 0.9.18

package/lib/public/js/components/agents-tab/agent-overview/model-card.js

@@ -3,6 +3,7 @@ import htm from "htm";
 import { Badge } from "../../badge.js";
 import { LoadingSpinner } from "../../loading-spinner.js";
 import { OverflowMenu, OverflowMenuItem } from "../../overflow-menu.js";
+import { RowAccessorySelect } from "../../row-accessory-select.js";
 import {
   getModelDisplayLabel,
   SearchableModelPicker,
@@ -22,16 +23,25 @@ export const AgentModelCard = ({
     canEditModel,
     effectiveModel,
     effectiveModelEntry,
+    formatInheritedThinkingLabel,
     handleClearModelOverride,
     handleSelectModel,
+    handleSelectThinkingDefault,
     hasDistinctModelOverride,
+    hasDistinctThinkingOverride,
+    inheritedThinkingDefault,
     loading,
     menuOpen,
     modelEntries,
     popularModels,
     remainingModelOptions,
     setMenuOpen,
+    showThinkingSelect,
+    thinkingOptionsLoading,
+    thinkingSelectOptions,
+    thinkingSelectValue,
     updatingModel,
+    updatingThinking,
   } = useModelCard({
     agent,
     onUpdateAgent,
@@ -63,7 +73,19 @@ export const AgentModelCard = ({
                             handleClearModelOverride();
                           }}
                         >
-                          Inherit from defaults
+                          Inherit model from defaults
+                        </${OverflowMenuItem}>
+                      `
+                    : null}
+                  ${hasDistinctThinkingOverride
+                    ? html`
+                        <${OverflowMenuItem}
+                          onClick=${() => {
+                            setMenuOpen(false);
+                            handleSelectThinkingDefault("");
+                          }}
+                        >
+                          Inherit thinking from defaults
                         </${OverflowMenuItem}>
                       `
                     : null}
@@ -93,17 +115,20 @@ export const AgentModelCard = ({
             </p>`
           : html`
               <div class="space-y-1">
-                ${modelEntries.map(
-                  (entry) => html`
+                ${modelEntries.map((entry) => {
+                  const isPrimary = entry.key === effectiveModel;
+                  const showThinkingPicker =
+                    isPrimary && showThinkingSelect && !thinkingOptionsLoading;
+                  return html`
                     <div
                       key=${entry.key}
-                      class="flex items-center justify-between py-1"
+                      class="flex items-center justify-between gap-3 py-1"
                     >
                       <div class="flex items-center gap-2 min-w-0">
                         <span class="text-sm text-body truncate">
                           ${getModelDisplayLabel(entry)}
                         </span>
-                        ${entry.key === effectiveModel
+                        ${isPrimary
                           ? html`<${Badge} tone="cyan">Primary</${Badge}>`
                           : html`
                               <button
@@ -115,9 +140,36 @@ export const AgentModelCard = ({
                               </button>
                             `}
                       </div>
+                      ${showThinkingPicker
+                        ? html`
+                            <${RowAccessorySelect}
+                              ariaLabel="Agent thinking level"
+                              title="Agent thinking level"
+                              value=${thinkingSelectValue}
+                              disabled=${saving ||
+                              updatingModel ||
+                              updatingThinking ||
+                              !canEditModel}
+                              onChange=${handleSelectThinkingDefault}
+                            >
+                              <option value="">
+                                ${formatInheritedThinkingLabel(
+                                  inheritedThinkingDefault,
+                                )}
+                              </option>
+                              ${thinkingSelectOptions.map(
+                                (option) => html`
+                                  <option value=${option.value}>
+                                    ${option.label}
+                                  </option>
+                                `,
+                              )}
+                            </${RowAccessorySelect}>
+                          `
+                        : null}
                     </div>
-                  `,
-                )}
+                  `;
+                })}
               </div>
             `}
       ${loading

package/lib/public/js/components/agents-tab/agent-overview/use-model-card.js

@@ -1,4 +1,10 @@
 import { useEffect, useMemo, useState } from "preact/hooks";
+import { fetchThinkingOptions } from "../../../lib/api.js";
+import {
+  formatInheritedThinkingLabel,
+  formatThinkingLevelLabel,
+  shouldShowThinkingLevelSelect,
+} from "../../../lib/thinking-levels.js";
 import { useModels } from "../../models-tab/use-models.js";
 import {
   buildProviderHasAuth,
@@ -25,7 +31,14 @@ export const useModelCard = ({
   onUpdateAgent = async () => {},
 }) => {
   const [updatingModel, setUpdatingModel] = useState(false);
+  const [updatingThinking, setUpdatingThinking] = useState(false);
   const [menuOpen, setMenuOpen] = useState(false);
+  const [thinkingOptions, setThinkingOptions] = useState({
+    levels: [],
+    inheritedDefault: "off",
+    modelDefault: "off",
+  });
+  const [thinkingOptionsLoading, setThinkingOptionsLoading] = useState(false);
   const {
     catalog,
     primary: defaultPrimaryModel,
@@ -41,6 +54,45 @@ export const useModelCard = ({
   const hasDistinctModelOverride =
     !!explicitModel &&
     String(explicitModel).trim() !== String(defaultPrimaryModel || "").trim();
+  const explicitThinkingDefault = String(agent.thinkingDefault || "").trim();
+  const inheritedThinkingDefault = String(
+    thinkingOptions.inheritedDefault || thinkingOptions.modelDefault || "off",
+  ).trim();
+  const hasDistinctThinkingOverride =
+    !!explicitThinkingDefault &&
+    explicitThinkingDefault !== inheritedThinkingDefault;
+  const showThinkingSelect = shouldShowThinkingLevelSelect(
+    thinkingOptions.levels,
+  );
+
+  useEffect(() => {
+    const modelKey = String(effectiveModel || "").trim();
+    if (!modelKey.includes("/")) {
+      setThinkingOptions({
+        levels: [],
+        inheritedDefault: "off",
+        modelDefault: "off",
+      });
+      return undefined;
+    }
+    let cancelled = false;
+    setThinkingOptionsLoading(true);
+    fetchThinkingOptions(modelKey)
+      .then((payload) => {
+        if (cancelled || !payload?.ok) return;
+        setThinkingOptions({
+          levels: Array.isArray(payload.levels) ? payload.levels : [],
+          inheritedDefault: String(payload.inheritedDefault || "off").trim(),
+          modelDefault: String(payload.modelDefault || "off").trim(),
+        });
+      })
+      .finally(() => {
+        if (!cancelled) setThinkingOptionsLoading(false);
+      });
+    return () => {
+      cancelled = true;
+    };
+  }, [effectiveModel]);
 
   const providerHasAuth = useMemo(
     () => buildProviderHasAuth({ authProfiles, codexStatus }),
@@ -149,6 +201,69 @@ export const useModelCard = ({
     }
   };
 
+  const handleSelectThinkingDefault = async (nextValue) => {
+    const normalizedValue = String(nextValue || "").trim();
+    const isInherit = !normalizedValue;
+    if (isInherit) {
+      if (!hasDistinctThinkingOverride) return;
+      setUpdatingThinking(true);
+      try {
+        await onUpdateAgent(
+          String(agent.id || "").trim(),
+          { thinkingDefault: null },
+          "Agent thinking level reset to default",
+        );
+      } finally {
+        setUpdatingThinking(false);
+      }
+      return;
+    }
+    if (normalizedValue === explicitThinkingDefault) return;
+    setUpdatingThinking(true);
+    try {
+      await onUpdateAgent(
+        String(agent.id || "").trim(),
+        { thinkingDefault: normalizedValue },
+        "Agent thinking level updated",
+      );
+    } finally {
+      setUpdatingThinking(false);
+    }
+  };
+
+  const thinkingSelectValue = hasDistinctThinkingOverride
+    ? explicitThinkingDefault
+    : "";
+  const thinkingSelectOptions = useMemo(() => {
+    const seen = new Set();
+    const options = [];
+    const addOption = (value, label) => {
+      const normalizedValue = String(value || "").trim();
+      if (!normalizedValue || seen.has(normalizedValue)) return;
+      seen.add(normalizedValue);
+      options.push({
+        value: normalizedValue,
+        label: String(label || formatThinkingLevelLabel(normalizedValue)).trim(),
+      });
+    };
+    for (const entry of thinkingOptions.levels) {
+      addOption(
+        entry?.id,
+        formatThinkingLevelLabel(entry?.label || entry?.id),
+      );
+    }
+    if (
+      explicitThinkingDefault &&
+      !seen.has(explicitThinkingDefault)
+    ) {
+      addOption(
+        explicitThinkingDefault,
+        `${formatThinkingLevelLabel(explicitThinkingDefault)} (custom)`,
+      );
+    }
+    return options;
+  }, [explicitThinkingDefault, thinkingOptions.levels]);
+
   return {
     authorizedModelOptions,
     canEditModel: modelsReady && !loadingModels,
@@ -156,13 +271,22 @@ export const useModelCard = ({
     effectiveModelEntry,
     handleClearModelOverride,
     handleSelectModel,
+    handleSelectThinkingDefault,
     hasDistinctModelOverride,
+    hasDistinctThinkingOverride,
+    inheritedThinkingDefault,
     loading: !modelsReady || loadingModels,
     menuOpen,
     modelEntries,
     popularModels,
     remainingModelOptions,
     setMenuOpen,
+    showThinkingSelect,
+    thinkingOptionsLoading,
+    thinkingSelectOptions,
+    thinkingSelectValue,
+    formatInheritedThinkingLabel,
     updatingModel,
+    updatingThinking,
   };
 };

package/lib/public/js/components/api-feature-panel.js

@@ -0,0 +1,76 @@
+import { h } from "preact";
+import htm from "htm";
+import { copyTextToClipboard } from "../lib/clipboard.js";
+import { showToast } from "./toast.js";
+import { FileCopyLineIcon } from "./icons.js";
+import { InfoTooltip } from "./info-tooltip.js";
+import { ToggleSwitch } from "./toggle-switch.js";
+
+const html = htm.bind(h);
+
+const getApiUrl = () => {
+  if (typeof window === "undefined" || !window.location?.origin) return "/v1";
+  return `${window.location.origin}/v1`;
+};
+
+export const ApiFeaturePanel = ({
+  openAiCompatApi = { enabled: false },
+  savingOpenAiCompatApi = false,
+  onToggleOpenAiCompatApi = () => {},
+}) => {
+  const apiHydrated = openAiCompatApi?.hydrated === true;
+  const apiEnabled = openAiCompatApi?.enabled === true;
+  const apiUrl = getApiUrl();
+  const handleCopy = async () => {
+    const copied = await copyTextToClipboard(apiUrl);
+    showToast(
+      copied ? "API URL copied" : "Could not copy API URL",
+      copied ? "success" : "error",
+    );
+  };
+
+  return html`
+    <div class="bg-surface border border-border rounded-xl p-4">
+      <div class="flex items-center justify-between gap-3">
+        <div class="flex items-center gap-1.5 min-w-0">
+          <h2 class="card-label">API</h2>
+          <${InfoTooltip}
+            text="Allows trusted server-side clients to call OpenClaw via an OpenAI compatible API."
+            widthClass="w-72"
+          />
+        </div>
+        <${ToggleSwitch}
+          checked=${apiEnabled}
+          disabled=${savingOpenAiCompatApi || !apiHydrated}
+          label=${savingOpenAiCompatApi
+            ? "Saving..."
+            : !apiHydrated
+              ? "Loading..."
+              : apiEnabled
+                ? "Enabled"
+                : "Disabled"}
+          onChange=${onToggleOpenAiCompatApi}
+        />
+      </div>
+      ${apiHydrated && apiEnabled
+        ? html`
+            <div class="mt-4 text-xs text-fg-muted mb-2">OpenAI compatible URL</div>
+            <div class="flex items-center gap-2">
+              <code class="flex-1 min-w-0 bg-field border border-border rounded-lg px-3 py-2 text-xs text-body font-mono break-all">
+                ${apiUrl}
+              </code>
+              <button
+                type="button"
+                class="ac-btn-secondary text-xs p-2 rounded-lg shrink-0"
+                title="Copy URL"
+                aria-label="Copy API URL"
+                onclick=${handleCopy}
+              >
+                <${FileCopyLineIcon} className="w-4 h-4" />
+              </button>
+            </div>
+          `
+        : null}
+    </div>
+  `;
+};

package/lib/public/js/components/envars.js

@@ -58,7 +58,7 @@ const normalizeEnvVarKey = (raw) =>
     .toUpperCase()
     .replace(/[^A-Z0-9_]/g, "_");
 const kManagedChannelTokenPattern =
-  /^(?:TELEGRAM_BOT_TOKEN|DISCORD_BOT_TOKEN|SLACK_BOT_TOKEN|SLACK_APP_TOKEN)(?:_[A-Z0-9_]+)?$/;
+  /^(?:TELEGRAM_BOT_TOKEN|DISCORD_BOT_TOKEN|SLACK_BOT_TOKEN|SLACK_APP_TOKEN|WHATSAPP_OWNER_NUMBER)(?:_[A-Z0-9_]+)?$/;
 const stripSurroundingQuotes = (raw) => {
   const value = String(raw || "").trim();
   if (value.length < 2) return value;

package/lib/public/js/components/general/index.js

@@ -8,6 +8,7 @@ import { DevicePairings } from "../device-pairings.js";
 import { ActionButton } from "../action-button.js";
 import { Google } from "../google/index.js";
 import { Features } from "../features.js";
+import { ApiFeaturePanel } from "../api-feature-panel.js";
 import { GeneralDoctorWarning } from "../doctor/general-warning.js";
 import { ChevronDownIcon } from "../icons.js";
 import { UpdateActionButton } from "../update-action-button.js";
@@ -136,6 +137,11 @@ export const GeneralTab = ({
         onRestartRequired=${onRestartRequired}
         onOpenGmailWebhook=${onOpenGmailWebhook}
       />
+      <${ApiFeaturePanel}
+        openAiCompatApi=${state.openAiCompatApi}
+        savingOpenAiCompatApi=${state.savingOpenAiCompatApi}
+        onToggleOpenAiCompatApi=${actions.handleOpenAiCompatApiToggle}
+      />
 
       ${state.repo &&
       html`

package/lib/public/js/components/general/use-general-tab.js

@@ -8,14 +8,36 @@ import {
   rejectDevice,
   rejectPairing,
   triggerWatchdogRepair,
+  updateOpenAiCompatApiFeature,
   updateSyncCron,
 } from "../../lib/api.js";
 import { usePolling } from "../../hooks/usePolling.js";
+import {
+  kOpenAiCompatApiFeatureCacheKey,
+} from "../../lib/storage-keys.js";
 import { showToast } from "../toast.js";
 import { ALL_CHANNELS } from "../channels.js";
 
 const kDefaultSyncCronSchedule = "0 * * * *";
 
+const readCachedOpenAiCompatApi = () => {
+  try {
+    const rawValue = window.localStorage.getItem(kOpenAiCompatApiFeatureCacheKey);
+    if (rawValue === "true") return { enabled: true, hydrated: true };
+    if (rawValue === "false") return { enabled: false, hydrated: true };
+  } catch {}
+  return { enabled: false, hydrated: false };
+};
+
+const writeCachedOpenAiCompatApi = (enabled) => {
+  try {
+    window.localStorage.setItem(
+      kOpenAiCompatApiFeatureCacheKey,
+      enabled ? "true" : "false",
+    );
+  } catch {}
+};
+
 export const useGeneralTab = ({
   statusData = null,
   watchdogData = null,
@@ -30,6 +52,14 @@ export const useGeneralTab = ({
   const [syncCronSchedule, setSyncCronSchedule] = useState(kDefaultSyncCronSchedule);
   const [savingSyncCron, setSavingSyncCron] = useState(false);
   const [syncCronChoice, setSyncCronChoice] = useState(kDefaultSyncCronSchedule);
+  const [cachedOpenAiCompatApi] = useState(readCachedOpenAiCompatApi);
+  const [openAiCompatApiEnabled, setOpenAiCompatApiEnabled] = useState(
+    cachedOpenAiCompatApi.enabled,
+  );
+  const [openAiCompatApiHydrated, setOpenAiCompatApiHydrated] = useState(
+    cachedOpenAiCompatApi.hydrated,
+  );
+  const [savingOpenAiCompatApi, setSavingOpenAiCompatApi] = useState(false);
   const [pairingStatusRefreshing, setPairingStatusRefreshing] = useState(false);
   const [devicePollingEnabled, setDevicePollingEnabled] = useState(false);
   const [cliAutoApproveComplete, setCliAutoApproveComplete] = useState(false);
@@ -42,6 +72,8 @@ export const useGeneralTab = ({
   const channels = status?.channels ?? null;
   const repo = status?.repo || null;
   const syncCron = status?.syncCron || null;
+  const openAiCompatApi = status?.alphaclaw?.features?.openaiCompatApi || null;
+  const hasOpenAiCompatApiStatus = typeof openAiCompatApi?.enabled === "boolean";
   const openclawVersion = status?.openclawVersion || null;
 
   const hasUnpaired = ALL_CHANNELS.some((channel) => {
@@ -134,6 +166,14 @@ export const useGeneralTab = ({
     );
   }, [syncCron?.enabled, syncCron?.schedule]);
 
+  useEffect(() => {
+    if (!hasOpenAiCompatApiStatus) return;
+    const nextEnabled = openAiCompatApi.enabled === true;
+    setOpenAiCompatApiEnabled(nextEnabled);
+    setOpenAiCompatApiHydrated(true);
+    writeCachedOpenAiCompatApi(nextEnabled);
+  }, [hasOpenAiCompatApiStatus, openAiCompatApi?.enabled]);
+
   useEffect(
     () => () => {
       if (pairingRefreshTimerRef.current) {
@@ -196,6 +236,28 @@ export const useGeneralTab = ({
     });
   };
 
+  const handleOpenAiCompatApiToggle = async (enabled) => {
+    if (savingOpenAiCompatApi) return;
+    const previousEnabled = openAiCompatApiEnabled;
+    setOpenAiCompatApiEnabled(enabled);
+    setSavingOpenAiCompatApi(true);
+    try {
+      const data = await updateOpenAiCompatApiFeature(enabled);
+      if (!data.ok) {
+        throw new Error(data.error || "Could not save API setting");
+      }
+      writeCachedOpenAiCompatApi(enabled);
+      setOpenAiCompatApiHydrated(true);
+      showToast(`API ${enabled ? "enabled" : "disabled"}`, "success");
+      onRefreshStatuses();
+    } catch (err) {
+      setOpenAiCompatApiEnabled(previousEnabled);
+      showToast(err.message || "Could not save API setting", "error");
+    } finally {
+      setSavingOpenAiCompatApi(false);
+    }
+  };
+
   const handleApprove = async (id, channel, accountId = "") => {
     try {
       const result = await approvePairing(id, channel, accountId);
@@ -288,12 +350,18 @@ export const useGeneralTab = ({
       gatewayStatus,
       hasUnpaired,
       openclawVersion,
+      openAiCompatApi: {
+        ...(openAiCompatApi || {}),
+        enabled: openAiCompatApiEnabled,
+        hydrated: openAiCompatApiHydrated,
+      },
       pending,
       pairingsPolling: pairingsPoll.isPolling,
       pairingStatusRefreshing,
       repairingWatchdog,
       repo,
       savingSyncCron,
+      savingOpenAiCompatApi,
       syncCron,
       syncCronChoice,
       syncCronEnabled,
@@ -306,6 +374,7 @@ export const useGeneralTab = ({
       handleDeviceApprove,
       handleDeviceReject,
       handleOpenDashboard,
+      handleOpenAiCompatApiToggle,
       handleReject,
       handleSyncCronChoiceChange,
       handleWatchdogRepair,

package/lib/public/js/components/row-accessory-select.js

@@ -0,0 +1,52 @@
+import { h } from "preact";
+import htm from "htm";
+
+const html = htm.bind(h);
+
+const RowAccessoryChevron = () => html`
+  <svg
+    width="14"
+    height="14"
+    viewBox="0 0 16 16"
+    fill="none"
+    class="text-fg-dim"
+    aria-hidden="true"
+  >
+    <path
+      d="M3.5 6L8 10.5L12.5 6"
+      stroke="currentColor"
+      stroke-width="2"
+      stroke-linecap="round"
+      stroke-linejoin="round"
+    />
+  </svg>
+`;
+
+export const RowAccessorySelect = ({
+  ariaLabel = "",
+  title = "",
+  value = "",
+  disabled = false,
+  onChange = () => {},
+  children = null,
+}) => html`
+  <label
+    class=${`relative inline-flex shrink-0 items-center justify-end max-w-[12rem] min-w-[5.5rem] ${disabled
+      ? "opacity-50 cursor-not-allowed"
+      : "cursor-pointer"}`}
+  >
+    <select
+      aria-label=${ariaLabel}
+      title=${title || ariaLabel}
+      value=${value}
+      disabled=${disabled}
+      onInput=${(event) => onChange(String(event.currentTarget?.value ?? ""))}
+      class="appearance-none bg-transparent border-0 py-0 pl-0 pr-5 w-full text-right text-xs text-fg-muted hover:text-body cursor-pointer focus:outline-none focus-visible:ring-1 focus-visible:ring-border rounded disabled:cursor-not-allowed truncate"
+    >
+      ${children}
+    </select>
+    <span class="pointer-events-none absolute right-0 top-1/2 -translate-y-1/2">
+      <${RowAccessoryChevron} />
+    </span>
+  </label>
+`;

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

@@ -550,6 +550,25 @@ export async function updateSyncCron(payload) {
   return data;
 }
 
+export async function updateOpenAiCompatApiFeature(enabled) {
+  const res = await authFetch("/api/alphaclaw/config/features/openai-compat-api", {
+    method: "PUT",
+    headers: { "Content-Type": "application/json" },
+    body: JSON.stringify({ enabled }),
+  });
+  const text = await res.text();
+  let data;
+  try {
+    data = text ? JSON.parse(text) : {};
+  } catch {
+    throw new Error(text || "Could not parse AlphaClaw config response");
+  }
+  if (!res.ok) {
+    throw new Error(data.error || text || `HTTP ${res.status}`);
+  }
+  return data;
+}
+
 export async function fetchCronJobs({ sortBy = "nextRunAtMs", sortDir = "asc" } = {}) {
   const params = new URLSearchParams();
   if (sortBy) params.set("sortBy", String(sortBy));
@@ -857,6 +876,13 @@ export const fetchModelStatus = async () => {
   return res.json();
 };
 
+export const fetchThinkingOptions = async (modelKey) => {
+  const normalized = String(modelKey || "").trim();
+  const qs = new URLSearchParams({ modelKey: normalized });
+  const res = await authFetch(`/api/models/thinking-options?${qs.toString()}`);
+  return res.json();
+};
+
 export const setPrimaryModel = async (modelKey) => {
   const res = await authFetch("/api/models/set", {
     method: "POST",

package/lib/public/js/lib/model-catalog.js

@@ -4,6 +4,7 @@ import { getFeaturedModels } from "./model-config.js";
 
 export const kModelCatalogCacheKey = "/api/models";
 export const kModelCatalogPollIntervalMs = 3000;
+export const kDefaultOnboardingModelKey = "anthropic/claude-opus-4-8";
 
 export const getModelCatalogModels = (payload) =>
   Array.isArray(payload?.models) ? payload.models : [];
@@ -26,6 +27,11 @@ export const getInitialOnboardingModelKey = ({
 } = {}) => {
   const normalizedCurrent = String(currentModelKey || "").trim();
   if (normalizedCurrent) return normalizedCurrent;
+  const catalogHasKey = (key) =>
+    catalog.some((model) => String(model?.key || "") === key);
+  if (catalogHasKey(kDefaultOnboardingModelKey)) {
+    return kDefaultOnboardingModelKey;
+  }
   const featuredModels = getFeaturedModels(catalog);
   return String(featuredModels[0]?.key || catalog[0]?.key || "");
 };

package/lib/public/js/lib/model-config.js

@@ -9,6 +9,10 @@ export const getAuthProviderFromModelProvider = (provider) => {
 };
 
 export const kFeaturedModelDefs = [
+  {
+    label: "Opus 4.8",
+    preferredKeys: ["anthropic/claude-opus-4-8"],
+  },
   {
     label: "Opus 4.7",
     preferredKeys: ["anthropic/claude-opus-4-7"],
@@ -58,13 +62,14 @@ export const kProviderAuthFields = {
       linkText: "Get key",
       placeholder: "sk-ant-...",
     },
-    {
-      key: "ANTHROPIC_TOKEN",
-      label: "Anthropic Setup Token",
-      hint: "From claude setup-token (uses your Claude subscription)",
-      linkText: "Get token",
-      placeholder: "Token...",
-    },
+    // Temporarily hidden — setup-token flow is not supported in onboarding yet.
+    // {
+    //   key: "ANTHROPIC_TOKEN",
+    //   label: "Anthropic Setup Token",
+    //   hint: "From claude setup-token (uses your Claude subscription)",
+    //   linkText: "Get token",
+    //   placeholder: "Token...",
+    // },
   ],
   openai: [
     {

package/lib/public/js/lib/storage-keys.js

@@ -31,3 +31,7 @@ export const kAgentLastSessionKey = "alphaclaw.agent.lastSessionKey";
 
 // --- Chat ---
 export const kChatSessionDraftsStorageKey = "alphaclaw.chat.sessionDrafts";
+
+// --- Features ---
+export const kOpenAiCompatApiFeatureCacheKey =
+  "alphaclaw.features.openAiCompatApi.enabled";