@jiggai/kitchen 0.3.1 → 0.3.3

package/src/app/teams/[teamId]/team-editor/TeamMemoryTab.tsx

@@ -1,349 +0,0 @@
-"use client";
-
-import { useEffect, useMemo, useState } from "react";
-import { errorMessage } from "@/lib/errors";
-
-type MemoryItem = {
-  ts: string;
-  author: string;
-  type: string;
-  content: string;
-  source?: unknown;
-  _file?: string;
-  _line?: number;
-};
-
-type PinnedItem = MemoryItem & {
-  pinnedAt: string;
-  pinnedBy: string;
-  _key: string;
-};
-
-function memoryKey(it: { _file?: string; _line?: number }): string {
-  return `${it._file ?? ""}:${it._line ?? 0}`;
-}
-
-export function TeamMemoryTab({ teamId }: { teamId: string }) {
-  const [loading, setLoading] = useState(false);
-  const [error, setError] = useState("");
-  const [files, setFiles] = useState<string[]>([]);
-  const [pinnedItems, setPinnedItems] = useState<PinnedItem[]>([]);
-  const [items, setItems] = useState<MemoryItem[]>([]);
-
-  const [newType, setNewType] = useState("learning");
-  const [newContent, setNewContent] = useState("");
-  const [newSource, setNewSource] = useState("");
-  const [saving, setSaving] = useState(false);
-  const [pinningKey, setPinningKey] = useState<string | null>(null);
-
-  async function refresh() {
-    setLoading(true);
-    setError("");
-    try {
-      const res = await fetch(`/api/teams/memory?teamId=${encodeURIComponent(teamId)}`, { cache: "no-store" });
-      const json = (await res.json()) as {
-        ok?: boolean;
-        error?: string;
-        files?: string[];
-        pinnedItems?: PinnedItem[];
-        items?: MemoryItem[];
-      };
-      if (!res.ok || !json.ok) throw new Error(json.error || "Failed to load memory");
-      setFiles(Array.isArray(json.files) ? json.files : []);
-      setPinnedItems(Array.isArray(json.pinnedItems) ? json.pinnedItems : []);
-      setItems(Array.isArray(json.items) ? json.items : []);
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-      setFiles([]);
-      setPinnedItems([]);
-      setItems([]);
-    } finally {
-      setLoading(false);
-    }
-  }
-
-  useEffect(() => {
-    void refresh();
-    // eslint-disable-next-line react-hooks/exhaustive-deps -- refresh is defined inline; teamId is the only intended trigger.
-  }, [teamId]);
-
-  const examples = useMemo(
-    () => [
-      { label: "decision", value: "decision" },
-      { label: "learning", value: "learning" },
-      { label: "bug", value: "bug" },
-      { label: "customer", value: "customer" },
-      { label: "release", value: "release" },
-    ],
-    []
-  );
-
-  const pinnedKeySet = useMemo(() => new Set(pinnedItems.map((x) => x._key)), [pinnedItems]);
-
-  async function pin(it: MemoryItem) {
-    const key = memoryKey(it);
-    if (!it._file || !it._line) return;
-
-    setPinningKey(key);
-    setError("");
-    try {
-      const payload = {
-        op: "pin",
-        ts: new Date().toISOString(),
-        actor: `${teamId}-lead`,
-        key: { file: "team.jsonl", line: it._line },
-        item: { ts: it.ts, author: it.author, type: it.type, content: it.content, source: it.source },
-      };
-      const res = await fetch(`/api/teams/memory?teamId=${encodeURIComponent(teamId)}`, {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify(payload),
-      });
-      const json = (await res.json()) as { ok?: boolean; error?: string };
-      if (!res.ok || !json.ok) throw new Error(json.error || "Failed to pin");
-      await refresh();
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setPinningKey(null);
-    }
-  }
-
-  async function unpin(it: { _file?: string; _line?: number }) {
-    const key = memoryKey(it);
-    if (!it._file || !it._line) return;
-
-    setPinningKey(key);
-    setError("");
-    try {
-      const payload = {
-        op: "unpin",
-        ts: new Date().toISOString(),
-        actor: `${teamId}-lead`,
-        key: { file: "team.jsonl", line: it._line },
-      };
-      const res = await fetch(`/api/teams/memory?teamId=${encodeURIComponent(teamId)}`, {
-        method: "POST",
-        headers: { "content-type": "application/json" },
-        body: JSON.stringify(payload),
-      });
-      const json = (await res.json()) as { ok?: boolean; error?: string };
-      if (!res.ok || !json.ok) throw new Error(json.error || "Failed to unpin");
-      await refresh();
-    } catch (e: unknown) {
-      setError(errorMessage(e));
-    } finally {
-      setPinningKey(null);
-    }
-  }
-
-  return (
-    <div className="space-y-4">
-      <div className="ck-glass p-4">
-        <div className="flex items-start justify-between gap-3">
-          <div>
-            <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Team memory (file-first)</div>
-            <div className="mt-1 text-xs text-[color:var(--ck-text-tertiary)]">
-              Stored in <span className="font-mono">shared-context/memory/*.jsonl</span>. Items must be attributable.
-            </div>
-          </div>
-          <button
-            type="button"
-            onClick={refresh}
-            className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-3 py-2 text-sm font-medium text-[color:var(--ck-text-primary)] hover:bg-white/10"
-          >
-            Refresh
-          </button>
-        </div>
-
-        {error ? (
-          <div className="mt-3 rounded border border-red-400/30 bg-red-500/10 p-2 text-sm text-red-100">{error}</div>
-        ) : null}
-
-        <div className="mt-3 text-xs text-[color:var(--ck-text-secondary)]">Files: {files.length ? files.join(", ") : "(none)"}</div>
-      </div>
-
-      <div className="ck-glass p-4">
-        <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Add memory item</div>
-        <div className="mt-3 grid grid-cols-1 gap-3 md:grid-cols-2">
-          <label className="block">
-            <div className="text-[10px] uppercase tracking-wide text-[color:var(--ck-text-tertiary)]">type</div>
-            <select
-              value={newType}
-              onChange={(e) => setNewType(e.target.value)}
-              className="mt-1 w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-2 py-2 text-sm text-[color:var(--ck-text-primary)]"
-            >
-              {examples.map((x) => (
-                <option key={x.value} value={x.value}>
-                  {x.label}
-                </option>
-              ))}
-            </select>
-          </label>
-
-          <label className="block">
-            <div className="text-[10px] uppercase tracking-wide text-[color:var(--ck-text-tertiary)]">source (ticket/pr/path)</div>
-            <input
-              value={newSource}
-              onChange={(e) => setNewSource(e.target.value)}
-              className="mt-1 w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-2 py-2 text-sm text-[color:var(--ck-text-primary)]"
-              placeholder="e.g. ticket 0088, PR https://..., shared-context/DECISIONS.md"
-            />
-          </label>
-
-          <label className="block md:col-span-2">
-            <div className="text-[10px] uppercase tracking-wide text-[color:var(--ck-text-tertiary)]">content</div>
-            <textarea
-              value={newContent}
-              onChange={(e) => setNewContent(e.target.value)}
-              className="mt-1 h-[110px] w-full resize-none rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 p-2 text-sm text-[color:var(--ck-text-primary)]"
-              placeholder="Write a small, specific memory item…"
-            />
-          </label>
-
-          <div className="md:col-span-2">
-            <button
-              type="button"
-              disabled={saving || !newContent.trim()}
-              onClick={async () => {
-                setSaving(true);
-                setError("");
-                try {
-                  const payload = {
-                    op: "append",
-                    ts: new Date().toISOString(),
-                    author: `${teamId}-lead`,
-                    type: newType,
-                    content: newContent.trim(),
-                    source: newSource.trim() ? { text: newSource.trim() } : undefined,
-                    file: "team.jsonl",
-                  };
-                  const res = await fetch(`/api/teams/memory?teamId=${encodeURIComponent(teamId)}`, {
-                    method: "POST",
-                    headers: { "content-type": "application/json" },
-                    body: JSON.stringify(payload),
-                  });
-                  const json = (await res.json()) as { ok?: boolean; error?: string };
-                  if (!res.ok || !json.ok) throw new Error(json.error || "Failed to append memory");
-                  setNewContent("");
-                  setNewSource("");
-                  await refresh();
-                } catch (e: unknown) {
-                  setError(errorMessage(e));
-                } finally {
-                  setSaving(false);
-                }
-              }}
-              className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-3 py-2 text-sm font-medium text-white shadow-[var(--ck-shadow-1)] disabled:opacity-50"
-            >
-              {saving ? "Saving…" : "Append to team.jsonl"}
-            </button>
-          </div>
-        </div>
-      </div>
-
-      <div className="ck-glass p-4">
-        <div className="flex items-center justify-between gap-2">
-          <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Pinned memory</div>
-          <div className="text-xs text-[color:var(--ck-text-tertiary)]">{pinnedItems.length} pinned</div>
-        </div>
-
-        {loading ? <div className="mt-3 text-sm text-[color:var(--ck-text-secondary)]">Loading…</div> : null}
-
-        <div className="mt-3 space-y-3">
-          {pinnedItems.length ? (
-            pinnedItems.map((it) => (
-              <div key={it._key} className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 p-3">
-                <div className="flex flex-wrap items-center justify-between gap-2">
-                  <div className="text-xs text-[color:var(--ck-text-tertiary)]">
-                    <span className="font-mono">{it.ts}</span>
-                    <span className="mx-2">•</span>
-                    <span className="rounded bg-white/5 px-2 py-0.5 font-mono">{it.type}</span>
-                    <span className="mx-2">•</span>
-                    <span className="font-mono">{it.author}</span>
-                    <span className="mx-2">•</span>
-                    <span className="font-mono">pinned {it.pinnedAt}</span>
-                  </div>
-                  <button
-                    type="button"
-                    onClick={() => void unpin(it)}
-                    disabled={pinningKey === it._key}
-                    className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-2 py-1 text-xs font-medium text-[color:var(--ck-text-primary)] hover:bg-white/10 disabled:opacity-50"
-                  >
-                    {pinningKey === it._key ? "Unpinning…" : "Unpin"}
-                  </button>
-                </div>
-
-                <div className="mt-2 whitespace-pre-wrap text-sm text-[color:var(--ck-text-primary)]">{it.content}</div>
-
-                {it.source ? (
-                  <pre className="mt-2 overflow-auto rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/30 p-2 text-[10px] text-[color:var(--ck-text-secondary)]">
-                    {JSON.stringify(it.source, null, 2)}
-                  </pre>
-                ) : null}
-              </div>
-            ))
-          ) : (
-            <div className="text-sm text-[color:var(--ck-text-secondary)]">No pinned items yet.</div>
-          )}
-        </div>
-      </div>
-
-      <div className="ck-glass p-4">
-        <div className="flex items-center justify-between gap-2">
-          <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Recent memory</div>
-          <div className="text-xs text-[color:var(--ck-text-tertiary)]">Showing {items.length} (max 200)</div>
-        </div>
-
-        {loading ? <div className="mt-3 text-sm text-[color:var(--ck-text-secondary)]">Loading…</div> : null}
-
-        <div className="mt-3 space-y-3">
-          {items.length ? (
-            items.map((it) => {
-              const k = memoryKey(it);
-              const isPinned = pinnedKeySet.has(k);
-              return (
-                <div key={`${it._file ?? "?"}:${it._line ?? 0}`} className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 p-3">
-                  <div className="flex flex-wrap items-center justify-between gap-2">
-                    <div className="text-xs text-[color:var(--ck-text-tertiary)]">
-                      <span className="font-mono">{it.ts}</span>
-                      <span className="mx-2">•</span>
-                      <span className="rounded bg-white/5 px-2 py-0.5 font-mono">{it.type}</span>
-                      <span className="mx-2">•</span>
-                      <span className="font-mono">{it.author}</span>
-                    </div>
-                    <div className="flex items-center gap-2">
-                      {it._file ? (
-                        <span className="text-[10px] text-[color:var(--ck-text-tertiary)] font-mono">
-                          {it._file}:{it._line}
-                        </span>
-                      ) : null}
-                      <button
-                        type="button"
-                        onClick={() => void pin(it)}
-                        disabled={isPinned || pinningKey === k || !it._file || !it._line}
-                        className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-2 py-1 text-xs font-medium text-[color:var(--ck-text-primary)] hover:bg-white/10 disabled:opacity-50"
-                      >
-                        {isPinned ? "Pinned" : pinningKey === k ? "Pinning…" : "Pin"}
-                      </button>
-                    </div>
-                  </div>
-
-                  <div className="mt-2 whitespace-pre-wrap text-sm text-[color:var(--ck-text-primary)]">{it.content}</div>
-
-                  {it.source ? (
-                    <pre className="mt-2 overflow-auto rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/30 p-2 text-[10px] text-[color:var(--ck-text-secondary)]">
-                      {JSON.stringify(it.source, null, 2)}
-                    </pre>
-                  ) : null}
-                </div>
-              );
-            })
-          ) : (
-            <div className="text-sm text-[color:var(--ck-text-secondary)]">No memory items yet.</div>
-          )}
-        </div>
-      </div>
-    </div>
-  );
-}

package/src/app/teams/[teamId]/team-editor/TeamRecipeTab.tsx

@@ -1,151 +0,0 @@
-"use client";
-
-import type { RecipeListItem } from "./types";
-
-type TeamRecipeTabProps = {
-  loading?: boolean;
-  fromId: string;
-  setFromId: (v: string) => void;
-  toId: string;
-  setToId: (v: string) => void;
-  toName: string;
-  setToName: (v: string) => void;
-  canEditTargetId: boolean;
-  teamRecipes: RecipeListItem[];
-  lockedFromId: string | null;
-  lockedFromName: string | null;
-  provenanceMissing: boolean;
-  saving: boolean;
-  teamIdValid: boolean;
-  targetIdValid: boolean;
-  targetIsBuiltin: boolean;
-  loadedRecipeHash: string | null;
-  teamMetaRecipeHash: string | null;
-  publishing: boolean;
-  content: string;
-  setContent: (v: string) => void;
-  setLoadedRecipeHash: (v: string | null) => void;
-  recipeLoadError: string;
-  onSaveCustom: (overwrite: boolean) => void;
-  onPublishOpen: () => void;
-  onDeleteOpen: () => void;
-};
-
-export function TeamRecipeTab(props: TeamRecipeTabProps) {
-  const p = props;
-  return (
-    <>
-      <div className="mt-6 grid grid-cols-1 gap-4 lg:grid-cols-2">
-        <div className="ck-glass-strong p-4">
-          <div className="flex items-center justify-between gap-3">
-            <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Custom recipe target</div>
-            {p.loading ? (
-              <div className="text-xs text-[color:var(--ck-text-tertiary)]">Loading team…</div>
-            ) : null}
-          </div>
-          <label className="mt-3 block text-xs font-medium text-[color:var(--ck-text-secondary)]">Team id</label>
-          <input
-            value={p.toId}
-            onChange={(e) => p.setToId(e.target.value)}
-            disabled={!p.canEditTargetId}
-            className="mt-1 w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-3 py-2 text-sm text-[color:var(--ck-text-primary)] disabled:opacity-70"
-          />
-          <div className="mt-1 text-xs text-[color:var(--ck-text-tertiary)]">
-            This is the custom recipe id that will be created when you save.
-          </div>
-          <label className="mt-3 block text-xs font-medium text-[color:var(--ck-text-secondary)]">Team name</label>
-          <input
-            value={p.toName}
-            onChange={(e) => p.setToName(e.target.value)}
-            className="mt-1 w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-3 py-2 text-sm text-[color:var(--ck-text-primary)]"
-          />
-          <div className="mt-4 grid grid-cols-1 gap-2">
-            <button
-              type="button"
-              disabled={p.saving || !p.teamIdValid || !p.targetIdValid || p.targetIsBuiltin}
-              onClick={() => p.onSaveCustom(true)}
-              className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-3 py-2 text-sm font-medium text-white shadow-[var(--ck-shadow-1)] disabled:opacity-50"
-            >
-              {p.saving ? "Saving" : "Save"}
-            </button>
-            <button
-              type="button"
-              disabled={
-                p.saving ||
-                !p.teamIdValid ||
-                !p.targetIdValid ||
-                p.targetIsBuiltin ||
-                !p.loadedRecipeHash ||
-                !p.teamMetaRecipeHash ||
-                p.loadedRecipeHash === p.teamMetaRecipeHash
-              }
-              onClick={p.onPublishOpen}
-              className="rounded-[var(--ck-radius-sm)] bg-emerald-600 px-3 py-2 text-sm font-medium text-white shadow-[var(--ck-shadow-1)] disabled:opacity-50"
-            >
-              {p.publishing ? "Publishing" : "Publish changes"}
-            </button>
-            <button
-              type="button"
-              disabled={p.saving}
-              onClick={p.onDeleteOpen}
-              className="rounded-[var(--ck-radius-sm)] border border-white/10 bg-white/5 px-3 py-2 text-sm font-medium text-[color:var(--ck-text-primary)] disabled:opacity-50"
-            >
-              Delete Team
-            </button>
-          </div>
-        </div>
-        <div className="ck-glass-strong p-4">
-          <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Notes</div>
-          <div className="mt-3 rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/20 p-3">
-            <div className="text-xs font-medium text-[color:var(--ck-text-secondary)]">Parent recipe (locked)</div>
-            <select
-              disabled
-              className="mt-2 w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-3 py-2 text-sm text-[color:var(--ck-text-primary)] disabled:opacity-70"
-              value={p.fromId}
-              onChange={(e) => p.setFromId(e.target.value)}
-            >
-              {p.teamRecipes.map((r) => (
-                <option key={`${r.source}:${r.id}`} value={r.id}>
-                  {r.id} ({r.source})
-                </option>
-              ))}
-            </select>
-            {p.lockedFromId && (
-              <div className="mt-2 text-xs text-[color:var(--ck-text-tertiary)]">
-                <code>{p.lockedFromId}</code>
-                {p.lockedFromName ? ` (${p.lockedFromName})` : ""}
-              </div>
-            )}
-            {!p.lockedFromId && p.provenanceMissing && (
-              <div className="mt-2 text-xs text-[color:var(--ck-text-tertiary)]">
-                Provenance not found for this team.
-              </div>
-            )}
-          </div>
-          <ul className="mt-4 list-disc space-y-1 pl-5 text-sm text-[color:var(--ck-text-secondary)]">
-            <li>Save writes the custom recipe file identified by Team id.</li>
-            <li>Publish changes re-scaffolds this team from your custom recipe.</li>
-            <li>Delete Team runs openclaw recipes remove-team.</li>
-          </ul>
-        </div>
-      </div>
-      <div className="mt-6 ck-glass-strong p-4">
-        <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Recipe markdown</div>
-        {p.recipeLoadError ? (
-          <div className="mt-3 rounded-[var(--ck-radius-sm)] border border-red-400/30 bg-red-500/10 p-3 text-sm text-red-100">
-            {p.recipeLoadError}
-          </div>
-        ) : null}
-        <textarea
-          value={p.content}
-          onChange={(e) => {
-            p.setContent(e.target.value);
-            p.setLoadedRecipeHash(null);
-          }}
-          className="mt-2 h-[55vh] w-full resize-none rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 p-3 font-mono text-xs text-[color:var(--ck-text-primary)]"
-          spellCheck={false}
-        />
-      </div>
-    </>
-  );
-}

package/src/app/teams/[teamId]/team-editor/TeamSkillsTab.tsx

@@ -1,68 +0,0 @@
-"use client";
-
-type TeamSkillsTabProps = {
-  teamId: string;
-  skillsList: string[];
-  availableSkills: string[];
-  skillsLoading: boolean;
-  selectedSkill: string;
-  setSelectedSkill: (v: string) => void;
-  installingSkill: boolean;
-  teamSkillMsg: string;
-  teamSkillError: string;
-  onInstallSkill: () => Promise<void>;
-};
-
-export function TeamSkillsTab(props: TeamSkillsTabProps) {
-  const p = props;
-  return (
-    <div className="mt-6 ck-glass-strong p-4">
-      <div className="text-sm font-medium text-[color:var(--ck-text-primary)]">Skills</div>
-      <p className="mt-2 text-sm text-[color:var(--ck-text-secondary)]">
-        Skills installed in this team workspace. For agent-specific skills, open the agent from the Agents tab.
-      </p>
-      <div className="mt-4">
-        <div className="text-xs font-medium text-[color:var(--ck-text-secondary)]">Installed</div>
-        <ul className="mt-2 list-disc space-y-1 pl-5 text-sm text-[color:var(--ck-text-secondary)]">
-          {p.skillsList.length ? p.skillsList.map((s) => <li key={s}>{s}</li>) : <li>None installed.</li>}
-        </ul>
-      </div>
-      <div className="mt-5 rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/15 p-3">
-        <div className="text-xs font-medium text-[color:var(--ck-text-secondary)]">Add a skill</div>
-        <div className="mt-2 flex flex-col gap-2 sm:flex-row sm:items-center">
-          <select
-            value={p.selectedSkill}
-            onChange={(e) => p.setSelectedSkill(e.target.value)}
-            disabled={p.installingSkill || p.skillsLoading || !p.availableSkills.length}
-            className="w-full rounded-[var(--ck-radius-sm)] border border-white/10 bg-black/25 px-3 py-2 text-sm text-[color:var(--ck-text-primary)]"
-          >
-            {p.availableSkills.length
-              ? p.availableSkills.map((s) => <option key={s} value={s}>{s}</option>)
-              : <option value="">No skills found</option>}
-          </select>
-          <button
-            type="button"
-            disabled={p.installingSkill || p.skillsLoading || !p.selectedSkill}
-            onClick={p.onInstallSkill}
-            className="rounded-[var(--ck-radius-sm)] bg-[var(--ck-accent-red)] px-3 py-2 text-sm font-medium text-white shadow-[var(--ck-shadow-1)] disabled:opacity-50"
-          >
-            {p.installingSkill ? "Adding" : "Add"}
-          </button>
-        </div>
-        {p.teamSkillError && (
-          <div className="mt-3 rounded-[var(--ck-radius-sm)] border border-red-400/30 bg-red-500/10 p-3 text-sm text-red-100">
-            {p.teamSkillError}
-          </div>
-        )}
-        {p.teamSkillMsg && (
-          <div className="mt-3 rounded-[var(--ck-radius-sm)] border border-emerald-400/30 bg-emerald-500/10 p-3 text-sm text-emerald-100">
-            {p.teamSkillMsg}
-          </div>
-        )}
-        <div className="mt-2 text-xs text-[color:var(--ck-text-tertiary)]">
-          Uses openclaw recipes install-skill with team-id {p.teamId}.
-        </div>
-      </div>
-    </div>
-  );
-}