kcg-code 0.1.0 → 0.2.0

package/src/server/services/session-manager.ts

@@ -79,8 +79,11 @@ export const MAX_FREE_TEXT_LENGTH = 10000;
 export const TURN_IDLE_TIMEOUT_MS = 300_000;
 export const SHUTDOWN_BUDGET_MS = 5000;
 
-/** v1 headless: hanya opencode (claude-code punya mekanisme headless sendiri). */
-export const SUPPORTED_AGENT_TYPES: readonly AgentType[] = ["opencode"];
+/**
+ * Tipe CLI_Agent yang dikenal. `claude-code` hanya aktif bila
+ * `claudeServers` diinjeksi (lihat `SessionManagerOptions`).
+ */
+export const SUPPORTED_AGENT_TYPES: readonly AgentType[] = ["opencode", "claude-code"];
 
 export interface CreateSessionRequest {
   agentType: AgentType;
@@ -101,6 +104,11 @@ const SKILL_REFRESH_DELAY_MS = 1500;
 export interface SessionManagerOptions {
   store: SessionStore;
   servers: OpenCodeServerManager;
+  /**
+   * Backend Claude Code (Agent SDK) dengan kontrak yang sama dengan
+   * `servers`. Tidak diisi -> Session `claude-code` ditolak.
+   */
+  claudeServers?: OpenCodeServerManager;
   /**
    * Penyimpanan lampiran gambar (upload dari perangkat). Bila tidak diisi,
    * fitur gambar dinonaktifkan — pesan dengan `images` ditolak.
@@ -199,28 +207,28 @@ export interface SessionManager {
    */
   releaseProject(projectId: string): Promise<SimpleResult>;
   /** Daftar model yang tersedia pada server headless milik Project. */
-  listModels(projectId: string): Promise<Result<ModelOption[]>>;
+  listModels(projectId: string, agentType?: AgentType): Promise<Result<ModelOption[]>>;
   /**
    * Daftar agent (mode) opencode milik Project — primary/all saja, siap
    * ditampilkan di pemilih mode composer.
    */
-  listAgents(projectId: string): Promise<Result<AgentOption[]>>;
+  listAgents(projectId: string, agentType?: AgentType): Promise<Result<AgentOption[]>>;
   /** Status MCP server yang terkonfigurasi untuk Project. */
-  listMcp(projectId: string): Promise<Result<McpServerInfo[]>>;
+  listMcp(projectId: string, agentType?: AgentType): Promise<Result<McpServerInfo[]>>;
   /** Skill yang terdaftar untuk Project (global, folder Project, bawaan). */
-  listSkills(projectId: string): Promise<Result<SkillInfo[]>>;
+  listSkills(projectId: string, agentType?: AgentType): Promise<Result<SkillInfo[]>>;
   /**
    * Muat ulang daftar skill server headless Project setelah skill dipasang.
    * Bila ada turn aktif di Project, refresh ditunda (`refreshed: false`) agar
    * chat yang berjalan tidak terganggu — lalu dijalankan OTOMATIS begitu
    * seluruh turn di Project selesai (`onSkillsRefreshed`). Server yang belum
-   * hidup tidak perlu di-refresh.
+   * hidup tidak perlu di-refresh. Claude Code selalu langsung `refreshed`.
    */
-  refreshSkills(projectId: string): Promise<Result<{ refreshed: boolean }>>;
+  refreshSkills(projectId: string, agentType?: AgentType): Promise<Result<{ refreshed: boolean }>>;
   /** Project dengan refresh skill tertunda (menunggu turn selesai). */
   hasPendingSkillRefresh(projectId: string): boolean;
   /** Cari file project untuk autocomplete `@file` di composer. */
-  findFiles(projectId: string, query: string): Promise<Result<string[]>>;
+  findFiles(projectId: string, query: string, agentType?: AgentType): Promise<Result<string[]>>;
   /**
    * Konteks kerja Session untuk panel kanan: perubahan file di worktree,
    * cabang git, dan task list (`todowrite`) agent.
@@ -259,6 +267,17 @@ export interface SessionManager {
 export function createSessionManager(opts: SessionManagerOptions): SessionManager {
   const store = opts.store;
   const servers = opts.servers;
+  const claudeServers = opts.claudeServers;
+
+  /** Server manager backend milik tipe CLI_Agent. */
+  function serversFor(agentType: AgentType): OpenCodeServerManager {
+    return agentType === "claude-code" && claudeServers ? claudeServers : servers;
+  }
+
+  /** Kunci subscription/exit per backend + Project (keduanya bisa hidup). */
+  function backendKey(agentType: AgentType, projectId: string): string {
+    return agentType === "claude-code" ? `claude-code:${projectId}` : projectId;
+  }
   const attachments = opts.attachments;
   const now = opts.now ?? Date.now;
   const shutdownBudgetMs = opts.shutdownBudgetMs ?? SHUTDOWN_BUDGET_MS;
@@ -309,11 +328,11 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
   const ocToSession = new Map<string, string>();
   /** Kebalikan `ocToSession`: id Session lokal -> seluruh ocSessionId miliknya. */
   const sessionOcIds = new Map<string, Set<string>>();
-  /** Project yang event SSE-nya sudah disubscribe (subscription aktif). */
+  /** Backend+Project yang event-nya sudah disubscribe (lihat `backendKey`). */
   const activeSubscriptions = new Map<string, { active: boolean; unsubscribe: () => void }>();
   /** Serialisasi kirim pesan per Session agar turn tidak tumpang tindih. */
   const inflight = new Map<string, Promise<void>>();
-  /** Project yang sudah diproses saat server-nya keluar (hindari duplikasi). */
+  /** Backend+Project yang sudah diproses saat server-nya keluar (hindari duplikasi). */
   const exitNotified = new Set<string>();
   const onMessagePart = opts.onMessagePart;
   const onMessagePartDelta = opts.onMessagePartDelta;
@@ -557,31 +576,34 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
   async function ensureServerFor(
     projectId: string,
     projectPath: string,
-    opts: { refreshConfig?: boolean } = {},
+    opts: { refreshConfig?: boolean; agentType?: AgentType } = {},
   ): Promise<Result<{ client: OpenCodeClient }>> {
-    const prevClient = servers.getServer(projectId)?.client;
+    const agentType = opts.agentType ?? "opencode";
+    const backend = serversFor(agentType);
+    const key = backendKey(agentType, projectId);
+    const prevClient = backend.getServer(projectId)?.client;
     const ensure = opts.refreshConfig
-      ? servers.ensureFreshServer(projectId, projectPath)
-      : servers.ensureServer(projectId, projectPath);
+      ? backend.ensureFreshServer(projectId, projectPath)
+      : backend.ensureServer(projectId, projectPath);
     const res = await ensure;
     if (!res.ok) return { ok: false, error: res.error };
     const handle = res.data;
     // Server headless dapat diganti (crash lalu ensure ulang, resume, atau
     // restart config). Bila client berbeda dari sebelumnya, subscription
     // lama tidak lagi menempel — buang dan subscribe ulang ke instance baru.
-    const sub = activeSubscriptions.get(projectId);
+    const sub = activeSubscriptions.get(key);
     if (prevClient && handle.client !== prevClient) {
       sub?.unsubscribe();
-      activeSubscriptions.delete(projectId);
+      activeSubscriptions.delete(key);
     }
-    if (!activeSubscriptions.get(projectId)?.active) {
-      const prev = activeSubscriptions.get(projectId);
+    if (!activeSubscriptions.get(key)?.active) {
+      const prev = activeSubscriptions.get(key);
       prev?.unsubscribe();
       const unsubscribe = handle.client.subscribeEvents((ev) => handleEvent(projectId, ev));
-      activeSubscriptions.set(projectId, { active: true, unsubscribe });
+      activeSubscriptions.set(key, { active: true, unsubscribe });
     }
     // Server baru (atau hasil restart) — izinkan event exit berikutnya diproses.
-    exitNotified.delete(projectId);
+    exitNotified.delete(key);
     return { ok: true, data: { client: handle.client } };
   }
 
@@ -595,7 +617,10 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
 
   async function createSession(req: CreateSessionRequest): Promise<CreateSessionResult> {
     // (1) tipe CLI_Agent didukung (Requirement 1.3)
-    if (!SUPPORTED_AGENT_TYPES.includes(req.agentType)) {
+    if (
+      !SUPPORTED_AGENT_TYPES.includes(req.agentType) ||
+      (req.agentType === "claude-code" && !claudeServers)
+    ) {
       return { ok: false, error: "UNSUPPORTED_AGENT_TYPE" };
     }
     // (2) Project ada di Session_Store (Requirement 10.10)
@@ -612,7 +637,9 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     if (!dirExists) return { ok: false, error: "PROJECT_DIR_NOT_FOUND" };
 
     // (4) pastikan server headless untuk Project (spawn bila perlu)
-    const serverRes = await ensureServerFor(project.id, project.path);
+    const serverRes = await ensureServerFor(project.id, project.path, {
+      agentType: req.agentType,
+    });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     const client = serverRes.data.client;
 
@@ -680,7 +707,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     if (cur.data.status !== "running") return { ok: false, error: "SESSION_NOT_RUNNING" };
     // Abort turn berjalan (best-effort, tidak menunggu).
     if (cur.data.ocSessionId) {
-      const handle = servers.getServer(cur.data.projectId);
+      const handle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
       void handle?.client.abortSession(cur.data.ocSessionId);
     }
     // Simpan parts yang sudah terkumpul sebelum Session ditutup.
@@ -705,7 +732,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     if (!cur.ok) return { ok: false, error: "SESSION_NOT_FOUND" };
     // Abort turn berjalan (best-effort, tidak menunggu).
     if (cur.data.status === "running" && cur.data.ocSessionId) {
-      const handle = servers.getServer(cur.data.projectId);
+      const handle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
       void handle?.client.abortSession(cur.data.ocSessionId);
     }
     // Buang turn parsial (tidak disimpan) + broadcast turn tidak aktif.
@@ -734,7 +761,9 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
 
     // (1) Pastikan server headless Project hidup (spawn ulang bila perlu).
-    const serverRes = await ensureServerFor(project.data.id, project.data.path);
+    const serverRes = await ensureServerFor(project.data.id, project.data.path, {
+      agentType: cur.data.agentType,
+    });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
 
     // (2) Verifikasi ocSessionId lama; bila tidak dikenal -> sesi remote baru.
@@ -781,13 +810,17 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
       if (!res.ok) return res;
     }
     await servers.stopServer(projectId);
+    await claudeServers?.stopServer(projectId);
     // Subscription SSE ikut dilepas — server-nya sudah tidak ada.
-    const sub = activeSubscriptions.get(projectId);
-    if (sub) {
-      sub.unsubscribe();
-      activeSubscriptions.delete(projectId);
+    for (const agentType of SUPPORTED_AGENT_TYPES) {
+      const key = backendKey(agentType, projectId);
+      const sub = activeSubscriptions.get(key);
+      if (sub) {
+        sub.unsubscribe();
+        activeSubscriptions.delete(key);
+      }
+      exitNotified.delete(key);
     }
-    exitNotified.delete(projectId);
     return { ok: true };
   }
 
@@ -799,12 +832,16 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
    * (opencode serve tidak hot-reload config). Restart ditahan bila ada
    * Session `running` agar turn yang sedang berjalan tidak terputus.
    */
-  async function listModels(projectId: string): Promise<Result<ModelOption[]>> {
+  async function listModels(
+    projectId: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<ModelOption[]>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
     const hasRunning = store.listProjectSessions(projectId).some((s) => s.status === "running");
     const serverRes = await ensureServerFor(project.data.id, project.data.path, {
       refreshConfig: !hasRunning,
+      agentType,
     });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     return serverRes.data.client.listModels();
@@ -817,12 +854,16 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
    * memicu restart server agar daftar ikut terbaru (dengan guard yang sama
    * seperti `listModels`).
    */
-  async function listAgents(projectId: string): Promise<Result<AgentOption[]>> {
+  async function listAgents(
+    projectId: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<AgentOption[]>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
     const hasRunning = store.listProjectSessions(projectId).some((s) => s.status === "running");
     const serverRes = await ensureServerFor(project.data.id, project.data.path, {
       refreshConfig: !hasRunning,
+      agentType,
     });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     return serverRes.data.client.listAgents();
@@ -833,12 +874,16 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
    * daftar MCP dibaca dari config opencode di direktori Project. Config yang
    * berubah memicu restart (guard sama dengan `listModels`).
    */
-  async function listMcp(projectId: string): Promise<Result<McpServerInfo[]>> {
+  async function listMcp(
+    projectId: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<McpServerInfo[]>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
     const hasRunning = store.listProjectSessions(projectId).some((s) => s.status === "running");
     const serverRes = await ensureServerFor(project.data.id, project.data.path, {
       refreshConfig: !hasRunning,
+      agentType,
     });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     return serverRes.data.client.listMcp();
@@ -848,10 +893,13 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
    * Skill yang terdaftar untuk Project. Skill di dalam folder Project
    * ditandai `project` sehingga UI dapat membedakannya dari skill global.
    */
-  async function listSkills(projectId: string): Promise<Result<SkillInfo[]>> {
+  async function listSkills(
+    projectId: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<SkillInfo[]>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
-    const serverRes = await ensureServerFor(project.data.id, project.data.path);
+    const serverRes = await ensureServerFor(project.data.id, project.data.path, { agentType });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     return serverRes.data.client.listSkills(project.data.path);
   }
@@ -900,9 +948,15 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     onSkillsRefreshed?.(projectId);
   }
 
-  async function refreshSkills(projectId: string): Promise<Result<{ refreshed: boolean }>> {
+  async function refreshSkills(
+    projectId: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<{ refreshed: boolean }>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
+    // Claude Code: daftar skill dibaca langsung dari disk dan proses `claude`
+    // memuat skill sendiri — tidak ada cache server yang perlu dibuang.
+    if (agentType === "claude-code") return { ok: true, data: { refreshed: true } };
     const handle = servers.getServer(projectId);
     // Server belum hidup -> skill terbaca saat server di-spawn nanti.
     if (!handle) {
@@ -945,11 +999,13 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     const cur = store.getSession(sessionId);
     if (!cur.ok) return { ok: false, error: "SESSION_NOT_FOUND" };
     const cwd = cur.data.cwd;
-    const handle = servers.getServer(cur.data.projectId);
+    const handle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
+    // Task list disimpan per session REMOTE (opencode `ses_...` / UUID Claude).
+    const remoteId = cur.data.ocSessionId ?? sessionId;
 
     const [git, todos, changes, mcp] = await Promise.all([
       readGitInfo(cwd).catch(() => EMPTY_GIT_INFO),
-      handle ? handle.client.listTodos(sessionId) : Promise.resolve(null),
+      handle ? handle.client.listTodos(remoteId) : Promise.resolve(null),
       handle ? handle.client.fileStatus() : Promise.resolve(null),
       handle ? handle.client.listMcp() : Promise.resolve(null),
     ]);
@@ -967,10 +1023,14 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     };
   }
 
-  async function findFiles(projectId: string, query: string): Promise<Result<string[]>> {
+  async function findFiles(
+    projectId: string,
+    query: string,
+    agentType: AgentType = "opencode",
+  ): Promise<Result<string[]>> {
     const project = store.getProjectById(projectId);
     if (!project.ok) return { ok: false, error: "PROJECT_NOT_FOUND" };
-    const serverRes = await ensureServerFor(project.data.id, project.data.path);
+    const serverRes = await ensureServerFor(project.data.id, project.data.path, { agentType });
     if (!serverRes.ok) return { ok: false, error: serverRes.error };
     return serverRes.data.client.findFiles(query);
   }
@@ -1017,7 +1077,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     turns.finish(sessionId);
     // Bila masih running, abort turn remote agar model berhenti dieksekusi.
     if (cur.data.status === "running" && cur.data.ocSessionId) {
-      const runningHandle = servers.getServer(cur.data.projectId);
+      const runningHandle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
       void runningHandle?.client.abortSession(cur.data.ocSessionId);
     }
     unmapOcSessions(sessionId);
@@ -1028,11 +1088,13 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     //     dan hanya akan dihentikan saat shutdown.
     const ocSessionId = cur.data.ocSessionId;
     if (ocSessionId) {
-      let client = servers.getServer(cur.data.projectId)?.client;
+      let client = serversFor(cur.data.agentType).getServer(cur.data.projectId)?.client;
       if (!client) {
         const project = store.getProjectById(cur.data.projectId);
         if (!project.ok) return { ok: false, error: project.error };
-        const serverRes = await ensureServerFor(project.data.id, project.data.path);
+        const serverRes = await ensureServerFor(project.data.id, project.data.path, {
+          agentType: cur.data.agentType,
+        });
         if (!serverRes.ok) return { ok: false, error: serverRes.error };
         client = serverRes.data.client;
       }
@@ -1073,7 +1135,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     if (!ocSessionId) return { ok: false, error: "SESSION_NOT_ACTIVE" };
 
     // Pastikan server masih hidup SEBELUM menyimpan echo user.
-    const handle = servers.getServer(cur.data.projectId);
+    const handle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
     if (!handle) return { ok: false, error: "SESSION_NOT_ACTIVE" };
 
     // Gambar upload dipetakan ke info + path absolut. Kegagalan resolve
@@ -1202,7 +1264,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
 
     const cur = store.getSession(sessionId);
     if (!cur.ok) return { ok: false, error: "SESSION_NOT_FOUND" };
-    const handle = servers.getServer(cur.data.projectId);
+    const handle = serversFor(cur.data.agentType).getServer(cur.data.projectId);
     if (!handle) return { ok: false, error: "SESSION_NOT_ACTIVE" };
 
     // Kumpulkan request pending yang identik (grup kartu yang sama di UI):
@@ -1316,7 +1378,7 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
     const running = store.listSessions().filter((s) => s.status === "running");
     const results = running.map((s) => store.insertStatusHistory(s.id, "running", now()));
     await raceWithTimeout(Promise.resolve(results), shutdownBudgetMs);
-    await servers.stopAll();
+    await Promise.all([servers.stopAll(), claudeServers?.stopAll()]);
   }
 
   /** Balapan dengan timer budget; timer selalu dibersihkan setelah selesai. */
@@ -1333,19 +1395,22 @@ export function createSessionManager(opts: SessionManagerOptions): SessionManage
   }
 
   // Saat server keluar tak terduga, tandai Session project tsb `crashed`.
-  servers.onServerExit((projectId) => {
-    if (exitNotified.has(projectId)) return;
-    exitNotified.add(projectId);
+  const onBackendExit = (agentType: AgentType) => (projectId: string) => {
+    const key = backendKey(agentType, projectId);
+    if (exitNotified.has(key)) return;
+    exitNotified.add(key);
     const crashedAt = now();
     for (const s of store.listSessions()) {
-      if (s.projectId === projectId && s.status === "running") {
+      if (s.projectId === projectId && s.agentType === agentType && s.status === "running") {
         // Server mati di tengah turn: selamatkan parts yang sudah ter-stream.
         turns.finish(s.id);
         updateStatus(s.id, "crashed", crashedAt);
         unmapOcSessions(s.id);
       }
     }
-  });
+  };
+  servers.onServerExit(onBackendExit("opencode"));
+  claudeServers?.onServerExit(onBackendExit("claude-code"));
 
   return {
     createSession,

package/src/server/services/skill-install-jobs.ts

@@ -12,6 +12,7 @@
  * setelah `FINISHED_TTL_MS` agar memori tidak tumbuh terus.
  */
 import { randomUUID } from "node:crypto";
+import type { AgentType } from "../../types";
 import type { Result } from "../result";
 import type { InstallResult, SkillsRegistry } from "./skills-registry";
 
@@ -28,6 +29,8 @@ export interface InstallJob {
   projectName: string;
   source: string;
   skillId: string;
+  /** Agent tujuan instalasi (`.agents/skills` dan/atau `.claude/skills`). */
+  agentTypes: AgentType[];
   status: InstallJobStatus;
   /** Kode error domain bila `failed`. */
   error: string | null;
@@ -58,6 +61,8 @@ export interface StartInstallInput {
   projectPath: string;
   source: string;
   skillId: string;
+  /** Default `["opencode"]`. */
+  agentTypes?: readonly AgentType[];
 }
 
 export interface SkillInstallJobs {
@@ -84,8 +89,11 @@ export interface SkillInstallJobs {
 
 export interface SkillInstallJobsOptions {
   registry: SkillsRegistry;
-  /** Refresh skill server opencode Project setelah terpasang. */
-  refreshSkills: (projectId: string) => Promise<Result<{ refreshed: boolean }>>;
+  /** Refresh daftar skill agent Project setelah terpasang. */
+  refreshSkills: (
+    projectId: string,
+    agentType: AgentType,
+  ) => Promise<Result<{ refreshed: boolean }>>;
   now?: () => number;
   /** Validasi source/skill sebelum job dibuat. */
   validate: (source: string, skillId: string) => boolean;
@@ -138,6 +146,7 @@ export function createSkillInstallJobs(opts: SkillInstallJobsOptions): SkillInst
         job.skillId,
         (l) => push(st, l),
         signal,
+        job.agentTypes,
       );
     } catch (e) {
       res = { ok: false, error: "SKILL_INSTALL_FAILED" };
@@ -154,12 +163,15 @@ export function createSkillInstallJobs(opts: SkillInstallJobsOptions): SkillInst
       return;
     }
     push(st, "Reloading the agent's skill list…");
-    let refreshed = false;
-    try {
-      const r = await opts.refreshSkills(job.projectId);
-      refreshed = r.ok ? r.data.refreshed : false;
-    } catch {
-      refreshed = false;
+    // Refresh tiap agent tujuan; "aktif" hanya bila semuanya ter-refresh.
+    let refreshed = true;
+    for (const agentType of job.agentTypes) {
+      try {
+        const r = await opts.refreshSkills(job.projectId, agentType);
+        if (!r.ok || !r.data.refreshed) refreshed = false;
+      } catch {
+        refreshed = false;
+      }
     }
     push(
       st,
@@ -186,6 +198,7 @@ export function createSkillInstallJobs(opts: SkillInstallJobsOptions): SkillInst
       projectName: input.projectName,
       source: input.source,
       skillId: input.skillId,
+      agentTypes: [...(input.agentTypes ?? ["opencode"])],
       status: "running",
       error: null,
       refreshed: null,

package/src/server/services/skills-registry.ts

@@ -7,13 +7,16 @@
  * - Audit keamanan: `GET https://skills.sh/api/v1/skills/audit/{id}` (saat
  *   ini dapat diakses tanpa token; 404 = belum pernah diaudit).
  * - Instalasi: `bunx skills@<ver> add <source> --skill <name> --agent
- *   opencode -y --json` di direktori Project. CLI memasang ke
- *   `.agents/skills/<name>/` yang langsung dibaca opencode; server headless
- *   Project perlu `POST /instance/dispose` agar daftar skill ter-refresh.
+ *   <opencode> <claude-code> -y --json` di direktori Project (satu atau
+ *   kedua agent sekaligus). CLI memasang ke
+ *   `.agents/skills/<name>/` (dibaca opencode; server headless Project perlu
+ *   `POST /instance/dispose` agar daftar skill ter-refresh); untuk Claude
+ *   Code ditambah symlink `.claude/skills/<name>/`.
  *
  * Argumen CLI dibangun sebagai array (tanpa shell) dan `source`/`skill`
  * divalidasi ketat sebelum dipakai, sehingga tidak ada celah injeksi.
  */
+import type { AgentType } from "../../types";
 import type { Result } from "../result";
 
 /** Versi CLI `skills` yang dipin (hindari perubahan perilaku mendadak). */
@@ -154,7 +157,11 @@ export function parseAuditResponse(payload: unknown): SkillAudit {
 }
 
 /** Argumen `bunx` untuk instalasi (array — tanpa shell). */
-export function buildInstallArgs(source: string, skillId: string): string[] {
+export function buildInstallArgs(
+  source: string,
+  skillId: string,
+  agentTypes: readonly AgentType[] = ["opencode"],
+): string[] {
   return [
     "bunx",
     `skills@${SKILLS_CLI_VERSION}`,
@@ -162,8 +169,10 @@ export function buildInstallArgs(source: string, skillId: string): string[] {
     source,
     "--skill",
     skillId,
+    // Id agent CLI `skills` kebetulan sama dengan `AgentType`; beberapa
+    // nilai setelah satu `--agent` diterima CLI.
     "--agent",
-    "opencode",
+    ...agentTypes,
     "-y",
     "--json",
   ];
@@ -235,6 +244,8 @@ export interface SkillsRegistry {
     skillId: string,
     onLine?: (line: string) => void,
     signal?: AbortSignal,
+    /** Agent tujuan (`--agent`); default `["opencode"]`. */
+    agentTypes?: readonly AgentType[],
   ): Promise<Result<InstallResult>>;
 }
 
@@ -418,6 +429,7 @@ export function createSkillsRegistry(opts: SkillsRegistryOptions = {}): SkillsRe
     skillId: string,
     onLine?: (line: string) => void,
     signal?: AbortSignal,
+    agentTypes: readonly AgentType[] = ["opencode"],
   ): Promise<Result<InstallResult>> {
     if (!isValidSource(source) || !isValidSkillId(skillId)) {
       return { ok: false, error: "INVALID_SKILL_ID" };
@@ -435,7 +447,7 @@ export function createSkillsRegistry(opts: SkillsRegistryOptions = {}): SkillsRe
       onLine(line);
     };
     try {
-      const args = buildInstallArgs(source, skillId);
+      const args = buildInstallArgs(source, skillId, agentTypes);
       emit(`$ ${args.join(" ")}`);
       const res = await spawn(args, projectPath, INSTALL_TIMEOUT_MS, emit, signal);
       if (signal?.aborted) {

package/src/types/message.ts

@@ -34,7 +34,7 @@ export interface MessagePart {
    * `input` (argumen tool, mis. `filePath` untuk read/edit), dan `output`
    * (hasil). Dipakai renderer untuk menampilkan target tiap tool call.
    */
-  state?: { input?: Record<string, unknown>; output?: unknown };
+  state?: { input?: Record<string, unknown>; output?: unknown; [k: string]: unknown };
   /**
    * Timing asli dari opencode (ReasoningPart, TextPart, ToolState).
    * `start`/`end` adalah Unix ms. Hadir di part yang sudah selesai di-stream;

package/src/components/projects/PanelSection.tsx

@@ -1,102 +0,0 @@
-/**
- * Satu seksi di panel samping halaman Project (Instructions / MCP / Skills).
- *
- * Tiap seksi = satu kartu (gaya boxed list seperti Settings): header di dalam
- * kartu (ikon, judul, ringkasan, aksi, chevron) dan isi di bawah garis
- * pemisah. Status buka/tutup diingat per seksi di `localStorage`.
- *
- * Isi kartu tidak diberi padding otomatis: `PanelList` (baris berdivider),
- * `PanelHint`, dan `PanelBody` mengatur jaraknya sendiri agar baris daftar
- * bisa rata tepi ke tepi.
- */
-import { ChevronDownIcon } from "lucide-react";
-import type { ReactNode } from "react";
-import { useEffect, useState } from "react";
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from "@/components/ui/collapsible";
-import { cn } from "@/lib/utils";
-
-const STORAGE_PREFIX = "kcg.projectPanel.";
-
-/** Buka/tutup seksi yang diingat di localStorage (default terbuka). */
-function usePersistedOpen(id: string): [boolean, (open: boolean) => void] {
-  const [open, setOpen] = useState(() => {
-    try {
-      return localStorage.getItem(STORAGE_PREFIX + id) !== "0";
-    } catch {
-      return true;
-    }
-  });
-  useEffect(() => {
-    try {
-      localStorage.setItem(STORAGE_PREFIX + id, open ? "1" : "0");
-    } catch {
-      // Storage tidak tersedia (mode privat) — cukup state di memori.
-    }
-  }, [id, open]);
-  return [open, setOpen];
-}
-
-export interface PanelSectionProps {
-  /** Id stabil untuk mengingat status lipat (mis. "mcp"). */
-  id: string;
-  title: string;
-  /** Ikon seksi di kiri judul. */
-  icon: ReactNode;
-  /** Hitungan / ringkasan kecil di bawah judul. */
-  meta?: ReactNode;
-  /** Tombol aksi kecil di kanan header (tidak ikut melipat). */
-  action?: ReactNode;
-  children: ReactNode;
-}
-
-export function PanelSection({ id, title, icon, meta, action, children }: PanelSectionProps) {
-  const [open, setOpen] = usePersistedOpen(id);
-  return (
-    <Collapsible open={open} onOpenChange={setOpen} asChild>
-      <section
-        aria-label={title}
-        className="overflow-hidden rounded-xl border bg-card text-card-foreground shadow-xs"
-      >
-        <div className="flex items-center gap-1 pr-2">
-          <CollapsibleTrigger className="group flex min-h-14 min-w-0 flex-1 items-center gap-3 py-2.5 pl-3.5 text-left outline-none transition-colors hover:bg-muted/40 focus-visible:bg-muted/40 focus-visible:ring-[3px] focus-visible:ring-ring/40 focus-visible:ring-inset">
-            <span
-              className="flex size-8 shrink-0 items-center justify-center rounded-lg bg-muted text-muted-foreground [&_svg]:size-4"
-              aria-hidden
-            >
-              {icon}
-            </span>
-            <span className="flex min-w-0 flex-1 flex-col">
-              <span className="text-sm font-semibold leading-5 tracking-tight">{title}</span>
-              {meta !== undefined && (
-                <span className="truncate text-xs tabular-nums text-muted-foreground">{meta}</span>
-              )}
-            </span>
-            <ChevronDownIcon
-              className="mr-1.5 size-4 shrink-0 text-muted-foreground transition-transform duration-200 group-data-[state=open]:rotate-180"
-              aria-hidden
-            />
-          </CollapsibleTrigger>
-          {action && <div className="flex shrink-0 items-center">{action}</div>}
-        </div>
-        <CollapsibleContent className="overflow-hidden data-[state=closed]:animate-collapsible-up data-[state=open]:animate-collapsible-down">
-          <div className="border-t">{children}</div>
-        </CollapsibleContent>
-      </section>
-    </Collapsible>
-  );
-}
-
-/** Isi kartu dengan padding standar (form, pencarian, teks). */
-export function PanelBody({ className, children }: { className?: string; children: ReactNode }) {
-  return <div className={cn("px-3.5 py-3", className)}>{children}</div>;
-}
-
-/** Baris-baris berdivider, rata tepi ke tepi di dalam kartu. */
-export function PanelList({ className, children }: { className?: string; children: ReactNode }) {
-  return <ul className={cn("flex flex-col divide-y", className)}>{children}</ul>;
-}
-
-/** Keterangan saat daftar kosong — satu gaya untuk semua seksi. */
-export function PanelHint({ children }: { children: ReactNode }) {
-  return <p className="px-3.5 py-3.5 text-xs leading-relaxed text-muted-foreground">{children}</p>;
-}