ape-claw 0.1.6 → 0.1.8

package/src/server/routes/openclaw-env.mjs

@@ -0,0 +1,206 @@
+/**
+ * Routes:
+ *   GET  /api/openclaw/env
+ *   POST /api/openclaw/env
+ *
+ * Local-only helper for Forge to read/update OpenClaw env keys.
+ */
+
+import fs from "node:fs";
+import path from "node:path";
+import { collectBody } from "../middleware/body-limit.mjs";
+import { openClawEnvFileCandidates } from "../../lib/openclaw-paths.mjs";
+
+const ALLOWED_KEYS = [
+  "OPENAI_API_KEY",
+  "ANTHROPIC_API_KEY",
+  "PERPLEXITY_API_KEY",
+  "GROQ_API_KEY",
+  "TOGETHER_API_KEY",
+  "OLLAMA_HOST",
+  "OLLAMA_BASE_URL",
+];
+const BLOCKED_KEYS = new Set([
+  "PATH", "HOME", "SHELL", "PWD", "USER", "LOGNAME",
+  "OPENCLAW_HOME", "OPENCLAW_STATE_DIR", "OPENCLAW_CONFIG_PATH",
+  "FORGE_LLM_API_URL", "FORGE_LLM_API_KEY", "FORGE_LLM_MODEL",
+]);
+
+function isLocalRequest(req) {
+  const ip = String(req.socket?.remoteAddress || "");
+  return ip === "127.0.0.1" || ip === "::1" || ip === "::ffff:127.0.0.1";
+}
+
+function resolveEnvPath() {
+  const candidates = openClawEnvFileCandidates();
+  return candidates.find((p) => fs.existsSync(p)) || candidates[0];
+}
+
+function parseEnv(raw) {
+  const out = {};
+  for (const line of String(raw || "").split(/\r?\n/)) {
+    const s = line.trim();
+    if (!s || s.startsWith("#")) continue;
+    const eq = s.indexOf("=");
+    if (eq <= 0) continue;
+    const key = s.slice(0, eq).trim();
+    let val = s.slice(eq + 1).trim();
+    if ((val.startsWith('"') && val.endsWith('"')) || (val.startsWith("'") && val.endsWith("'"))) {
+      val = val.slice(1, -1);
+    }
+    if (key) out[key] = val;
+  }
+  return out;
+}
+
+function quoteEnvValue(value) {
+  const s = String(value ?? "");
+  if (!s) return '""';
+  if (/[\s#"'`\\]/.test(s)) {
+    return `"${s.replace(/\\/g, "\\\\").replace(/"/g, '\\"')}"`;
+  }
+  return s;
+}
+
+function isValidEnvKey(key) {
+  const k = String(key || "").trim();
+  if (!k) return false;
+  if (!/^[A-Za-z_][A-Za-z0-9_]*$/.test(k)) return false;
+  if (BLOCKED_KEYS.has(k)) return false;
+  return true;
+}
+
+function renderEnv(map, managedKeys, previousRaw = "") {
+  const oldLines = String(previousRaw || "").split(/\r?\n/);
+  const seen = new Set();
+  const nextLines = oldLines.map((line) => {
+    const eq = line.indexOf("=");
+    if (eq <= 0) return line;
+    const key = line.slice(0, eq).trim();
+    if (!managedKeys.has(key)) return line;
+    seen.add(key);
+    if (!(key in map)) return line;
+    const val = String(map[key] ?? "");
+    if (!val) return `# ${key}=`;
+    return `${key}=${quoteEnvValue(val)}`;
+  });
+
+  for (const key of managedKeys) {
+    if (seen.has(key)) continue;
+    const val = String(map[key] ?? "");
+    if (!val) continue;
+    nextLines.push(`${key}=${quoteEnvValue(val)}`);
+  }
+  return `${nextLines.join("\n").replace(/\n{3,}/g, "\n\n").trimEnd()}\n`;
+}
+
+function buildMasked(map) {
+  const masked = {};
+  for (const key of Object.keys(map || {})) {
+    const v = String(map[key] || "");
+    if (!v) masked[key] = "";
+    else if (key.endsWith("_HOST") || key.endsWith("_URL") || key.endsWith("_MODEL")) masked[key] = v;
+    else if (/KEY|TOKEN|SECRET|PASSWORD/i.test(key)) masked[key] = v.length <= 8 ? "*".repeat(v.length) : `${v.slice(0, 4)}...${v.slice(-4)}`;
+    else if (v.length <= 8) masked[key] = "*".repeat(v.length);
+    else masked[key] = `${v.slice(0, 4)}...${v.slice(-4)}`;
+  }
+  return masked;
+}
+
+export function handleOpenClawEnvGet(req, res) {
+  if (!isLocalRequest(req)) {
+    res.writeHead(403, { "content-type": "application/json" });
+    return res.end(JSON.stringify({ ok: false, error: "local requests only" }));
+  }
+  const envPath = resolveEnvPath();
+  const raw = fs.existsSync(envPath) ? fs.readFileSync(envPath, "utf8") : "";
+  const parsed = parseEnv(raw);
+  const values = {};
+  for (const key of ALLOWED_KEYS) values[key] = String(parsed[key] || "");
+  const customValues = {};
+  for (const [k, v] of Object.entries(parsed)) {
+    if (ALLOWED_KEYS.includes(k)) continue;
+    if (!isValidEnvKey(k)) continue;
+    customValues[k] = String(v || "");
+  }
+  const masked = buildMasked({ ...values, ...customValues });
+  res.writeHead(200, { "content-type": "application/json" });
+  return res.end(JSON.stringify({
+    ok: true,
+    envPath,
+    keys: ALLOWED_KEYS,
+    values,
+    customValues,
+    masked,
+  }));
+}
+
+export async function handleOpenClawEnvSet(req, res) {
+  if (!isLocalRequest(req)) {
+    res.writeHead(403, { "content-type": "application/json" });
+    return res.end(JSON.stringify({ ok: false, error: "local requests only" }));
+  }
+  const rawBody = await collectBody(req, res);
+  if (rawBody === null) return;
+  let body;
+  try { body = JSON.parse(rawBody); } catch {
+    res.writeHead(400, { "content-type": "application/json" });
+    return res.end(JSON.stringify({ ok: false, error: "invalid JSON body" }));
+  }
+  const updates = body?.updates && typeof body.updates === "object" ? body.updates : null;
+  if (!updates) {
+    res.writeHead(400, { "content-type": "application/json" });
+    return res.end(JSON.stringify({ ok: false, error: "updates object required" }));
+  }
+
+  const warnings = [];
+  for (const [k, v] of Object.entries(updates)) {
+    const val = String(v ?? "").trim();
+    if (!val) continue;
+    if (k === "OPENAI_API_KEY" && !val.startsWith("sk-")) {
+      warnings.push(`${k} should start with "sk-". The value you provided doesn't look like a valid OpenAI API key.`);
+    }
+    if (k === "ANTHROPIC_API_KEY" && !val.startsWith("sk-ant-")) {
+      warnings.push(`${k} should start with "sk-ant-". The value you provided doesn't look like a valid Anthropic key.`);
+    }
+    if (k === "GROQ_API_KEY" && !val.startsWith("gsk_")) {
+      warnings.push(`${k} should start with "gsk_". The value you provided doesn't look like a valid Groq key.`);
+    }
+    if (k === "PERPLEXITY_API_KEY" && !val.startsWith("pplx-")) {
+      warnings.push(`${k} should start with "pplx-". The value you provided doesn't look like a valid Perplexity key.`);
+    }
+    if (/API_KEY$/i.test(k) && val.length < 20) {
+      warnings.push(`${k} looks too short to be a real API key (${val.length} chars).`);
+    }
+  }
+  if (warnings.length) {
+    res.writeHead(400, { "content-type": "application/json" });
+    return res.end(JSON.stringify({ ok: false, error: "Invalid API key format", warnings }));
+  }
+
+  const envPath = resolveEnvPath();
+  const currentRaw = fs.existsSync(envPath) ? fs.readFileSync(envPath, "utf8") : "";
+  const current = parseEnv(currentRaw);
+  const next = { ...current };
+  const applied = {};
+  const managedKeys = new Set(ALLOWED_KEYS);
+  for (const [k, v] of Object.entries(updates)) {
+    if (!isValidEnvKey(k)) continue;
+    next[k] = String(v ?? "").trim();
+    applied[k] = next[k];
+    managedKeys.add(k);
+  }
+  const rendered = renderEnv(next, managedKeys, currentRaw);
+  fs.mkdirSync(path.dirname(envPath), { recursive: true });
+  fs.writeFileSync(envPath, rendered, { mode: 0o600 });
+
+  res.writeHead(200, { "content-type": "application/json" });
+  return res.end(JSON.stringify({
+    ok: true,
+    envPath,
+    applied,
+    masked: buildMasked(applied),
+    note: "Saved. Forge provider detection refreshes automatically on next requests.",
+  }));
+}
+

package/src/server/routes/skills.mjs

@@ -3,13 +3,72 @@
  */
 
 import fs from "node:fs";
-import os from "node:os";
 import path from "node:path";
 import { ROOT as PROJECT_ROOT } from "../../lib/paths.mjs";
+import { openClawSkillsDirCandidates as resolveOpenClawSkillsDirCandidates } from "../../lib/openclaw-paths.mjs";
 import { getStorage } from "../storage/index.mjs";
 import { requireSkillWriteAuth } from "../middleware/auth.mjs";
 import { collectBody } from "../middleware/body-limit.mjs";
 
+function openClawSkillsDirCandidates() {
+  return resolveOpenClawSkillsDirCandidates();
+}
+
+function getOpenClawSkillsDirForRead() {
+  const candidates = openClawSkillsDirCandidates();
+  const existing = candidates.find((p) => fs.existsSync(p));
+  return existing || candidates[0];
+}
+
+function getOpenClawSkillsDirForWrite() {
+  const candidates = openClawSkillsDirCandidates();
+  return candidates.find((p) => fs.existsSync(p)) || candidates[0];
+}
+
+function parseFrontmatter(content) {
+  const match = String(content || "").match(/^---\n([\s\S]*?)\n---\s*/);
+  if (!match) return { meta: {}, body: String(content || "") };
+  const meta = {};
+  for (const line of match[1].split("\n")) {
+    const idx = line.indexOf(":");
+    if (idx <= 0) continue;
+    const key = line.slice(0, idx).trim();
+    let val = line.slice(idx + 1).trim();
+    if ((val.startsWith('"') && val.endsWith('"')) || (val.startsWith("'") && val.endsWith("'"))) {
+      val = val.slice(1, -1);
+    }
+    if (key) meta[key] = val;
+  }
+  return { meta, body: String(content || "").slice(match[0].length) };
+}
+
+function listOpenClawInstalledSkills(limit = 2000) {
+  const skillsDir = getOpenClawSkillsDirForRead();
+  const out = [];
+  if (!skillsDir || !fs.existsSync(skillsDir)) return { skillsDir, skills: out };
+  let names = [];
+  try { names = fs.readdirSync(skillsDir); } catch { return { skillsDir, skills: out }; }
+  for (const name of names) {
+    if (out.length >= limit) break;
+    const skillMd = path.join(skillsDir, name, "SKILL.md");
+    if (!fs.existsSync(skillMd)) continue;
+    try {
+      const raw = fs.readFileSync(skillMd, "utf8");
+      const { meta, body } = parseFrontmatter(raw);
+      const desc = String(meta.description || body.split(/\r?\n/).find((l) => l.trim()) || "").trim().slice(0, 300);
+      out.push({
+        slug: toSlug(name || meta.name || ""),
+        name: String(meta.name || name).trim() || name,
+        version: safeVersion(meta.version || "") || "",
+        description: desc,
+        source: "openclaw-installed",
+        path: path.join(skillsDir, name),
+      });
+    } catch {}
+  }
+  return { skillsDir, skills: out };
+}
+
 function toSlug(input) {
   return String(input || "").toLowerCase().trim()
     .replace(/®/g, "").replace(/[^a-z0-9]+/g, "-").replace(/^-+|-+$/g, "");
@@ -113,7 +172,8 @@ function upsertUserSkill(store, auth, skillcard, sourceUrl, createdAt) {
 function installOpenClawSkillCard(skillcard, fallbackSlug = "") {
   const slugValue = toSlug(skillcard?.slug || fallbackSlug || skillcard?.name || "");
   if (!slugValue) throw new Error("invalid slug for OpenClaw install");
-  const skillDir = path.join(os.homedir(), ".openclaw", "skills", slugValue);
+  const root = getOpenClawSkillsDirForWrite();
+  const skillDir = path.join(root, slugValue);
   fs.mkdirSync(skillDir, { recursive: true });
   const doc = String(skillcard?.documentation_md || "").trim();
   const name = String(skillcard?.name || slugValue).trim();
@@ -135,7 +195,7 @@ function installOpenClawSkillCard(skillcard, fallbackSlug = "") {
 function uninstallOpenClawSkillBySlug(slug) {
   const s = toSlug(slug || "");
   if (!s) return { removed: null, missing: null };
-  const skillDir = path.join(os.homedir(), ".openclaw", "skills", s);
+  const skillDir = path.join(getOpenClawSkillsDirForWrite(), s);
   const skillMd = path.join(skillDir, "SKILL.md");
   if (!fs.existsSync(skillMd)) {
     return { removed: null, missing: { slug: s, reason: "SKILL.md not found" } };
@@ -148,6 +208,23 @@ function uninstallOpenClawSkillBySlug(slug) {
   return { removed: { slug: s, skillDir }, missing: null };
 }
 
+export function handleOpenClawInstalledSkills(req, res, reqUrl) {
+  try {
+    const limit = Math.min(5000, Math.max(1, Number(reqUrl.searchParams.get("limit") || 2000)));
+    const result = listOpenClawInstalledSkills(limit);
+    res.writeHead(200, { "content-type": "application/json; charset=utf-8" });
+    return res.end(JSON.stringify({
+      ok: true,
+      skillsDir: result.skillsDir || null,
+      total: result.skills.length,
+      skills: result.skills,
+    }));
+  } catch (err) {
+    res.writeHead(500, { "content-type": "application/json; charset=utf-8" });
+    return res.end(JSON.stringify({ ok: false, error: err.message || "openclaw installed scan failed" }));
+  }
+}
+
 export function handleSkillsSearch(req, res, reqUrl) {
   try {
     const store = getStorage();

package/ui/forge/css/forge.css

@@ -65,6 +65,9 @@ a{color:var(--neon-cyan);text-decoration:none}
 .forge-viewport{
   position:relative;flex:1 1 0%;min-height:0;background:#000;overflow:hidden;
 }
+.forge-viewport.forge-drop-active{
+  box-shadow:inset 0 0 0 2px rgba(99,215,255,.55), inset 0 0 32px rgba(99,215,255,.18);
+}
 .forge-viewport canvas{display:block;width:100%;height:100%}
 #forgeLabelLayer{position:absolute;inset:0;pointer-events:none;overflow:hidden}
 #forgeLabelLayer *{pointer-events:none}
@@ -113,12 +116,13 @@ a{color:var(--neon-cyan);text-decoration:none}
   display:grid;grid-template-columns:35fr 65fr;gap:0;
   border-top:1px solid var(--border);
   max-height:320px;min-height:200px;
+  overflow:hidden;
 }
 .forge-panel{
   background:linear-gradient(180deg,rgba(255,255,255,.04),rgba(0,0,0,.3)),var(--surface2);
   border-right:1px solid var(--border);
   box-shadow:var(--panel-shadow);
-  overflow:hidden;display:flex;flex-direction:column;
+  overflow:hidden;display:flex;flex-direction:column;min-height:0;
 }
 .forge-panel:last-child{border-right:none}
 
@@ -172,7 +176,7 @@ a{color:var(--neon-cyan);text-decoration:none}
 .forge-inspector-docs a{color:var(--neon-cyan)}
 
 /* ── Chat ───────────────────────────────────────────────── */
-.forge-chat{display:flex;flex-direction:column}
+.forge-chat{display:flex;flex-direction:column;min-height:0}
 .forge-chat-header{
   padding:10px 16px;font-size:.78rem;font-weight:700;color:var(--text);
   display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--border);
@@ -182,6 +186,31 @@ a{color:var(--neon-cyan);text-decoration:none}
   padding:1px 7px;border-radius:var(--radius);font-size:.6rem;font-weight:600;
   background:rgba(207,255,4,.08);border:1px solid rgba(207,255,4,.2);color:var(--accent);
 }
+.forge-gateway-chip{
+  margin-left:auto;
+  font-family:var(--font-mono);
+  font-size:.58rem;
+  padding:2px 8px;
+  border-radius:999px;
+  border:1px solid var(--border);
+  color:var(--dim);
+  background:rgba(255,255,255,.03);
+}
+.forge-gateway-chip[data-state="ok"]{
+  border-color:rgba(0,255,100,.35);color:#9effc8;background:rgba(0,255,100,.08);
+}
+.forge-gateway-chip[data-state="warn"]{
+  border-color:rgba(255,178,71,.35);color:#ffcf9a;background:rgba(255,178,71,.08);
+}
+.forge-gateway-chip[data-state="err"]{
+  border-color:rgba(255,51,51,.35);color:#ff9e9e;background:rgba(255,51,51,.08);
+}
+.forge-chat-actions{display:flex;align-items:center;gap:6px}
+.forge-chat-action-btn{
+  border:1px solid var(--border);background:rgba(0,0,0,.35);color:var(--dim);
+  border-radius:6px;font-size:.6rem;padding:3px 8px;cursor:pointer;
+}
+.forge-chat-action-btn:hover{color:var(--text);border-color:var(--neon-cyan)}
 .forge-chat-messages{flex:1;overflow-y:auto;padding:8px 12px;display:flex;flex-direction:column;gap:6px}
 .chat-empty{
   display:flex;flex-direction:column;align-items:center;justify-content:center;
@@ -196,6 +225,36 @@ a{color:var(--neon-cyan);text-decoration:none}
 .forge-chat .chat-msg-name{font-size:.72rem;font-weight:700;color:var(--accent)}
 .forge-chat .chat-msg-time{font-family:var(--font-mono);font-size:.58rem;color:var(--dim);margin-left:auto}
 .forge-chat .chat-msg-text{font-size:.75rem;line-height:1.5;color:var(--text);word-break:break-word}
+.forge-chat .chat-msg-text.chat-pending{
+  color:#d3ecff;
+}
+.chat-pending-wrap{
+  display:inline-flex;align-items:center;gap:8px;flex-wrap:wrap;
+  padding:5px 8px;border:1px solid rgba(99,215,255,.26);border-radius:7px;
+  background:linear-gradient(180deg,rgba(99,215,255,.08),rgba(99,215,255,.03));
+}
+.chat-pending-label{
+  font-family:var(--font-mono);font-size:.64rem;letter-spacing:.02em;color:#bce9ff;
+}
+.chat-pending-dots{display:inline-flex;gap:3px;align-items:center}
+.chat-pending-dots i{
+  width:5px;height:5px;border-radius:50%;display:block;background:rgba(99,215,255,.35);
+  animation:forgeChatDotPulse 1.2s ease-in-out infinite;
+}
+.chat-pending-dots i:nth-child(2){animation-delay:.15s}
+.chat-pending-dots i:nth-child(3){animation-delay:.3s}
+.chat-pending-stage{
+  font-size:.62rem;color:var(--dim);font-family:var(--font-mono);
+}
+.chat-pending-time{
+  font-size:.6rem;color:var(--neon-cyan);font-family:var(--font-mono);
+  border:1px solid rgba(99,215,255,.24);padding:1px 6px;border-radius:999px;
+  background:rgba(99,215,255,.08);
+}
+@keyframes forgeChatDotPulse{
+  0%,100%{transform:translateY(0);opacity:.45}
+  50%{transform:translateY(-2px);opacity:1}
+}
 .forge-chat .chat-msg-text strong{color:#eefad6;font-weight:700}
 .forge-chat .chat-msg-text code{
   font-family:var(--font-mono);font-size:.68rem;
@@ -213,6 +272,14 @@ a{color:var(--neon-cyan);text-decoration:none}
   display:flex;gap:8px;padding:10px 12px;border-top:1px solid var(--border);
   background:linear-gradient(180deg,rgba(207,255,4,.02),transparent),var(--surface2);
 }
+.forge-chat-quick{
+  display:flex;gap:6px;flex-wrap:wrap;padding:0 12px 8px;
+}
+.forge-chat-quick-btn{
+  border:1px solid var(--border);background:rgba(255,255,255,.02);color:var(--dim);
+  border-radius:999px;font-size:.58rem;padding:4px 9px;cursor:pointer;
+}
+.forge-chat-quick-btn:hover{color:var(--text);border-color:var(--accent)}
 .forge-chat-input-bar input{
   flex:1;padding:7px 12px;border-radius:var(--radius);border:1px solid var(--border);
   background:#0b1622;color:var(--text);font-family:var(--font-display);font-size:.75rem;
@@ -279,6 +346,9 @@ a{color:var(--neon-cyan);text-decoration:none}
 .forge-footer{
   padding:14px 24px;text-align:center;font-size:.62rem;color:var(--dim);
   border-top:1px solid rgba(207,255,4,.1);background:rgba(0,0,0,.3);
+  flex-shrink:0;
+  position:relative;
+  z-index:2;
 }
 .forge-footer .footer-links{
   display:flex;gap:14px;justify-content:center;margin-top:6px;font-size:.58rem;
@@ -426,6 +496,82 @@ a{color:var(--neon-cyan);text-decoration:none}
 .forge-page-btn:disabled{opacity:.3;cursor:not-allowed}
 .forge-page-info{font-size:.58rem;color:var(--dim);font-family:var(--font-mono)}
 
+/* ── OpenClaw Env Modal ─────────────────────────────────── */
+.forge-env-btn{background:rgba(99,215,255,.08);border-color:rgba(99,215,255,.26);color:var(--neon-cyan)}
+.forge-env-btn:hover{background:rgba(99,215,255,.14)}
+.forge-env-backdrop{
+  position:fixed;inset:0;z-index:17;background:rgba(0,0,0,.55);
+  opacity:0;pointer-events:none;transition:opacity .2s ease;
+}
+.forge-env-backdrop[data-open="1"]{opacity:1;pointer-events:auto}
+.forge-env-modal{
+  position:fixed;top:12%;right:22px;z-index:18;
+  width:min(620px,calc(100vw - 44px));max-height:76vh;
+  display:flex;flex-direction:column;
+  border:1px solid var(--border);border-radius:10px;
+  background:linear-gradient(180deg,rgba(255,255,255,.03),rgba(0,0,0,.25)),var(--surface2);
+  box-shadow:0 18px 44px rgba(0,0,0,.55);
+  transform:translateY(-14px) scale(.98);
+  opacity:0;pointer-events:none;transition:all .2s ease;
+}
+.forge-env-modal[data-open="1"]{transform:translateY(0) scale(1);opacity:1;pointer-events:auto}
+.forge-env-header{
+  padding:11px 14px;border-bottom:1px solid var(--border);
+  display:flex;align-items:center;justify-content:space-between;gap:10px;
+}
+.forge-env-title{font-size:.9rem;font-weight:700;color:var(--text);font-family:var(--font-display)}
+.forge-env-close{
+  width:28px;height:28px;border-radius:7px;border:1px solid var(--border);
+  background:rgba(0,0,0,.45);color:var(--dim);cursor:pointer;
+}
+.forge-env-close:hover{color:var(--text);border-color:var(--neon-pink)}
+.forge-env-note{
+  padding:10px 14px;border-bottom:1px solid var(--border);
+  font-size:.67rem;color:var(--dim);line-height:1.55;
+}
+.forge-env-status{
+  margin:10px 14px 2px;padding:7px 10px;border-radius:7px;
+  border:1px solid var(--border);font-family:var(--font-mono);font-size:.62rem;
+  background:rgba(0,0,0,.25);color:var(--dim);
+}
+.forge-env-status[data-state="ok"]{
+  border-color:rgba(0,255,100,.28);color:#9effc8;background:rgba(0,255,100,.07);
+}
+.forge-env-status[data-state="warn"]{
+  border-color:rgba(255,178,71,.32);color:#ffcf9a;background:rgba(255,178,71,.08);
+}
+.forge-env-status[data-state="err"]{
+  border-color:rgba(255,51,51,.3);color:#ff9e9e;background:rgba(255,51,51,.08);
+}
+.forge-env-form{
+  padding:10px 14px;overflow:auto;display:flex;flex-direction:column;gap:9px;
+}
+.forge-env-row{display:grid;grid-template-columns:220px 1fr;gap:10px;align-items:center}
+.forge-env-key{font-family:var(--font-mono);font-size:.63rem;color:var(--text)}
+.forge-env-value-wrap{display:flex;align-items:center;gap:8px}
+.forge-env-input{
+  width:100%;height:34px;border-radius:7px;border:1px solid var(--border);
+  background:rgba(0,0,0,.35);color:var(--text);padding:0 10px;
+  font-family:var(--font-mono);font-size:.67rem;
+}
+.forge-env-input:focus{outline:none;border-color:var(--accent)}
+.forge-env-subtitle{
+  margin:6px 0 2px;font-family:var(--font-mono);font-size:.62rem;
+  color:var(--dim);text-transform:uppercase;letter-spacing:.04em;
+}
+.forge-env-add-row{display:grid;grid-template-columns:1fr 1fr auto;gap:8px}
+.forge-env-remove{
+  height:34px;padding:0 10px;border-radius:7px;border:1px solid rgba(255,51,51,.3);
+  background:rgba(255,51,51,.08);color:#ff9e9e;font-size:.62rem;cursor:pointer;
+}
+.forge-env-remove:hover{background:rgba(255,51,51,.15)}
+.forge-env-footer{
+  padding:10px 14px;border-top:1px solid var(--border);
+  display:flex;justify-content:flex-end;gap:8px;
+}
+.forge-btn-secondary{border-color:var(--border);color:var(--dim);background:rgba(255,255,255,.03)}
+.forge-btn-secondary:hover{background:rgba(255,255,255,.08);color:var(--text)}
+
 /* ── Toast Notifications ────────────────────────────────── */
 .forge-toast-container{
   position:fixed;bottom:24px;right:24px;z-index:100;
@@ -528,10 +674,15 @@ a{color:var(--neon-cyan);text-decoration:none}
 @media(max-width:979px){
   .forge-viewport{min-height:50vh}
   .forge-header{flex-wrap:wrap;gap:8px}
+  .forge-env-modal{top:8%;right:12px;width:calc(100vw - 24px)}
+  .forge-env-row{grid-template-columns:1fr;gap:5px}
+  .forge-chat-header{flex-wrap:wrap}
+  .forge-gateway-chip{order:3;margin-left:0}
 }
 @media(max-width:639px){
   .forge-viewport{min-height:40vh}
   .forge-hud{top:8px;right:8px}
   .forge-header{padding:10px 14px}
   .forge-progress-bar{width:80px}
+  .forge-env-modal{top:5%;max-height:84vh}
 }

package/ui/forge/index.html

@@ -55,6 +55,9 @@
         <button class="forge-hud-btn forge-share-btn" id="forgeShareBtn" type="button" data-ac-tip="Share to X">
           <svg viewBox="0 0 24 24" width="16" height="16" fill="currentColor"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>
         </button>
+        <button class="forge-hud-btn forge-env-btn" id="forgeEnvBtn" type="button" data-ac-tip="OpenClaw env">
+          <svg viewBox="0 0 24 24" width="16" height="16" fill="none" stroke="currentColor" stroke-width="2"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.7 1.7 0 0 0 .34 1.87l.06.06a2 2 0 1 1-2.83 2.83l-.06-.06A1.7 1.7 0 0 0 15 19.4a1.7 1.7 0 0 0-1 .17 1.7 1.7 0 0 0-.78 1.45V21a2 2 0 1 1-4 0v-.08a1.7 1.7 0 0 0-.78-1.45 1.7 1.7 0 0 0-1-.17 1.7 1.7 0 0 0-1.87.34l-.06.06a2 2 0 1 1-2.83-2.83l.06-.06A1.7 1.7 0 0 0 4.6 15a1.7 1.7 0 0 0-.17-1 1.7 1.7 0 0 0-1.45-.78H3a2 2 0 1 1 0-4h.08a1.7 1.7 0 0 0 1.45-.78 1.7 1.7 0 0 0 .17-1 1.7 1.7 0 0 0-.34-1.87l-.06-.06a2 2 0 1 1 2.83-2.83l.06.06A1.7 1.7 0 0 0 9 4.6a1.7 1.7 0 0 0 1-.17 1.7 1.7 0 0 0 .78-1.45V3a2 2 0 1 1 4 0v.08a1.7 1.7 0 0 0 .78 1.45 1.7 1.7 0 0 0 1 .17 1.7 1.7 0 0 0 1.87-.34l.06-.06a2 2 0 1 1 2.83 2.83l-.06.06A1.7 1.7 0 0 0 19.4 9a1.7 1.7 0 0 0 .17 1 1.7 1.7 0 0 0 1.45.78H21a2 2 0 1 1 0 4h-.08a1.7 1.7 0 0 0-1.45.78 1.7 1.7 0 0 0-.17 1z"/></svg>
+        </button>
       </div>
       <div class="forge-watermark" id="forgeWatermark">
         <span class="forge-watermark-logo">APECLAW</span>
@@ -94,8 +97,13 @@
         <div class="forge-chat-header">
           <span class="icon">&#x1F4AC;</span> Agent Chat
           <span class="badge" id="forgeChatBadge">0</span>
+          <span class="forge-gateway-chip" id="forgeGatewayChip" data-state="loading">Gateway: checking...</span>
+          <div class="forge-chat-actions">
+            <button class="forge-chat-action-btn" id="forgeGatewayRefresh" type="button">Refresh</button>
+            <button class="forge-chat-action-btn" id="forgeGatewayRestart" type="button">Restart</button>
+          </div>
         </div>
-        <div class="forge-chat-agent-indicator" id="forgeChatAgentIndicator" style="display:none;padding:4px 10px;font-size:11px;opacity:.7;font-family:'JetBrains Mono',monospace;">&#x1F99E; Talking to The Clawllector (OpenClaw agent)</div>
+        <div class="forge-chat-agent-indicator" id="forgeChatAgentIndicator" style="display:none;padding:4px 10px;font-size:11px;opacity:.7;font-family:'JetBrains Mono',monospace;">Connected via OpenClaw Gateway (main session)</div>
         <div class="forge-chat-messages" id="forgeChatMessages">
           <div class="chat-empty">
             <div class="chat-empty-icon">&#x1F4AC;</div>
@@ -106,6 +114,11 @@
           <input type="text" id="forgeChatInput" placeholder="Message your agent..." maxlength="500">
           <button class="chat-send-btn" id="forgeChatSendBtn" type="button">Send</button>
         </div>
+        <div class="forge-chat-quick" id="forgeChatQuick">
+          <button class="forge-chat-quick-btn" data-prompt="Show my installed skills and what each one can do.">Installed skills</button>
+          <button class="forge-chat-quick-btn" data-prompt="Check OpenClaw gateway health and summarize any issue.">Gateway health</button>
+          <button class="forge-chat-quick-btn" data-prompt="Recommend three high-impact skills I should install next.">Next skills</button>
+        </div>
         <div class="chat-input-meta">
           <span class="chat-counter" id="forgeChatCounter">0/500</span>
         </div>
@@ -124,7 +137,7 @@
           <input type="text" id="forgeAuthAgentId" placeholder="Agent ID" autocomplete="off">
           <input type="password" id="forgeAuthAgentToken" placeholder="Agent Token" autocomplete="off">
         </div>
-        <div class="forge-auth-hint">Required for install/uninstall. Get from <code>ape-claw clawbot list</code></div>
+        <div class="forge-auth-hint">Optional for local install/uninstall. Add credentials only if you want global dashboard/telemetry posting. Get from <code>ape-claw clawbot list</code></div>
       </div>
       <div class="forge-drawer-search">
         <input type="search" id="forgeSkillSearch" placeholder="Search Library of Alexandria skills..." autocomplete="off">
@@ -150,6 +163,26 @@
       <div class="forge-drawer-pagination" id="forgeDrawerPagination"></div>
     </aside>
 
+    <!-- OpenClaw env modal -->
+    <div class="forge-env-backdrop" id="forgeEnvBackdrop"></div>
+    <aside class="forge-env-modal" id="forgeEnvModal" data-open="0">
+      <div class="forge-env-header">
+        <h2 class="forge-env-title">OpenClaw Gateway Env</h2>
+        <button class="forge-env-close" id="forgeEnvClose" type="button">&times;</button>
+      </div>
+      <div class="forge-env-note" id="forgeEnvNote">
+        Update model/provider env values used by OpenClaw and Forge takeover mode.
+      </div>
+      <div class="forge-env-status" id="forgeEnvProviderStatus" data-state="loading">
+        Checking active provider...
+      </div>
+      <div class="forge-env-form" id="forgeEnvForm"></div>
+      <div class="forge-env-footer">
+        <button class="forge-btn forge-btn-secondary" id="forgeEnvReload" type="button">Reload</button>
+        <button class="forge-btn forge-btn-accent" id="forgeEnvSave" type="button">Save & Apply</button>
+      </div>
+    </aside>
+
     <!-- Toast notifications -->
     <div class="forge-toast-container" id="forgeToasts"></div>
 
@@ -193,8 +226,9 @@
         <div class="forge-offline-step">
           <span class="forge-offline-step-num">2</span>
           <div>
-            <strong>Clone the repo &amp; start the server</strong>
-            <code>git clone https://github.com/simplefarmer69/ape-claw.git && cd ape-claw && npm install && npm run start:ui</code>
+            <strong>Start local Forge (no repo required)</strong>
+            <code>npx ape-claw dashboard</code>
+            <span class="forge-offline-hint">This fetches/runs the packaged Forge UI server from npm and opens your local dashboard.</span>
           </div>
         </div>
         <div class="forge-offline-step">
@@ -202,14 +236,14 @@
           <div>
             <strong>Open the Forge</strong>
             <code>http://localhost:8787/forge</code>
-            <span class="forge-offline-hint">Your installed skills appear as 3D attachments on the robot automatically</span>
+            <span class="forge-offline-hint">Your installed skills appear as 3D attachments on the robot automatically. Optional dev setup: clone GitHub and run <code>npm run start:ui</code>.</span>
           </div>
         </div>
       </div>
       <div class="forge-offline-divider"></div>
       <p class="forge-offline-note">
         The Forge reads skills installed via <code>npx ape-claw skill install</code>.<br>
-        Skills are installed to <code>~/.openclaw/skills/</code> and synced to <code>~/.openclaw/workspace/skills/</code> automatically. <strong>Requires <a href="https://openclaw.ai" style="color:var(--accent)">OpenClaw</a>.</strong>
+        Skills are installed to your active OpenClaw profile (for example <code>~/.openclaw/skills/</code>) and synced to that profile workspace automatically. <strong>Requires <a href="https://openclaw.ai" style="color:var(--accent)">OpenClaw</a>.</strong>
       </p>
       <div class="forge-offline-links">
         <button class="forge-offline-btn forge-offline-btn-agent" id="forgeTryAgent" type="button">&#x1F99E; Try Our Agent</button>