feat: Skills.sh marketplace integration + navigation restructure

Skills.sh Marketplace:
- Add marketplace browser with search, detail panel, and install/uninstall
- Search API proxying skills.sh with lock file integration for installed state
- Install/remove APIs using `npx skills` CLI with SSE streaming progress
- SKILL.md content fetching via GitHub Git Trees API with in-memory caching
- MarketplaceSkillCard, MarketplaceSkillDetail, MarketplaceBrowser components
- InstallProgressDialog with real-time SSE log output
- SkillsManager gains "My Skills" / "Marketplace" segmented control
- Type definitions: MarketplaceSkill, SkillLockFile, SkillLockEntry

Navigation restructure:
- Split Extensions page into standalone /skills and /mcp top-level pages
- NavRail: replace single Extensions icon with separate Skills (ZapIcon) and MCP (Plug01Icon) entries
- /extensions page now redirects to /skills or /mcp based on ?tab param
- /plugins redirects updated to point to new routes
- Remove redundant source badges from SkillListItem (section headers suffice)

Other:
- Add WeChat user group QR code to README.md and README_CN.md
- i18n: add 19 marketplace-related keys in en.ts and zh.ts
- Bump version to 0.18.0

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

Author: 7418

README.md

@@ -9,6 +9,12 @@
 
 [中文文档](./README_CN.md) | [日本語](./README_JA.md)
 
+### Join the Community / 加入用户群
+
+<img src="docs/wechat-group-qr.png" width="240" alt="WeChat Group QR Code" />
+
+Scan the QR code to join the WeChat user group for discussions, feedback, and updates.
+
 ---
 
 ## Features

README_CN.md

@@ -9,6 +9,12 @@
 [![Platform](https://img.shields.io/badge/platform-macOS%20%7C%20Windows%20%7C%20Linux-lightgrey)](https://github.com/op7418/CodePilot/releases)
 [![License](https://img.shields.io/badge/license-MIT-blue)](LICENSE)
 
+### 加入用户群
+
+<img src="docs/wechat-group-qr.png" width="240" alt="微信用户群二维码" />
+
+扫描二维码加入微信用户群，交流使用心得、反馈问题和获取最新动态。
+
 ---
 
 ## 功能特性

docs/wechat-group-qr.png

@@ -1,6 +1,6 @@
 {
   "name": "codepilot",
-  "version": "0.17.8",
+  "version": "0.18.0",
   "private": true,
   "author": {
     "name": "op7418",

package-lock.json

@@ -0,0 +1,76 @@
+import { NextResponse } from "next/server";
+import { spawn } from "child_process";
+
+export async function POST(request: Request) {
+  try {
+    const body = await request.json();
+    const { source, global: isGlobal } = body as { source: string; global?: boolean };
+
+    if (!source || typeof source !== "string") {
+      return NextResponse.json(
+        { error: "source is required" },
+        { status: 400 }
+      );
+    }
+
+    const args = ["skills", "add", source, "-y", "--agent", "claude-code"];
+    if (isGlobal !== false) {
+      args.splice(3, 0, "-g");
+    }
+
+    const child = spawn("npx", args, {
+      env: { ...process.env },
+      shell: true,
+    });
+
+    const encoder = new TextEncoder();
+    const stream = new ReadableStream({
+      start(controller) {
+        const send = (event: string, data: string) => {
+          controller.enqueue(
+            encoder.encode(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`)
+          );
+        };
+
+        child.stdout?.on("data", (chunk: Buffer) => {
+          send("output", chunk.toString());
+        });
+
+        child.stderr?.on("data", (chunk: Buffer) => {
+          send("output", chunk.toString());
+        });
+
+        child.on("close", (code) => {
+          if (code === 0) {
+            send("done", "Install completed successfully");
+          } else {
+            send("error", `Process exited with code ${code}`);
+          }
+          controller.close();
+        });
+
+        child.on("error", (err) => {
+          send("error", err.message);
+          controller.close();
+        });
+      },
+      cancel() {
+        child.kill();
+      },
+    });
+
+    return new Response(stream, {
+      headers: {
+        "Content-Type": "text/event-stream",
+        "Cache-Control": "no-cache",
+        Connection: "keep-alive",
+      },
+    });
+  } catch (error) {
+    console.error("[marketplace/install] Error:", error);
+    return NextResponse.json(
+      { error: error instanceof Error ? error.message : "Install failed" },
+      { status: 500 }
+    );
+  }
+}

package.json

@@ -0,0 +1,95 @@
+import { NextRequest, NextResponse } from "next/server";
+
+// In-memory cache: repo source → Map<skillId, raw-content path>
+const treeCache = new Map<string, { paths: Map<string, string>; ts: number }>();
+const CACHE_TTL = 5 * 60 * 1000; // 5 minutes
+
+/**
+ * Use GitHub Git Trees API to find the actual path of a SKILL.md for a given skillId.
+ * Repos have widely varying structures, so we can't guess the path — we scan the tree.
+ */
+async function findSkillPath(
+  source: string,
+  skillId: string,
+  signal: AbortSignal
+): Promise<string | null> {
+  const cached = treeCache.get(source);
+  if (cached && Date.now() - cached.ts < CACHE_TTL) {
+    return cached.paths.get(skillId) ?? null;
+  }
+
+  // Fetch the full recursive tree for the repo's default branch
+  const treeUrl = `https://api.github.com/repos/${source}/git/trees/HEAD?recursive=1`;
+  const res = await fetch(treeUrl, {
+    signal,
+    headers: { Accept: "application/vnd.github+json" },
+  });
+
+  if (!res.ok) return null;
+
+  const data = await res.json();
+  const tree: Array<{ path: string; type: string }> = data.tree || [];
+
+  // Index all SKILL.md files by their parent directory name (= skillId)
+  const paths = new Map<string, string>();
+  for (const item of tree) {
+    if (item.type !== "blob") continue;
+    if (!item.path.endsWith("/SKILL.md")) continue;
+    // Extract the folder name right before SKILL.md
+    const parts = item.path.split("/");
+    const folder = parts[parts.length - 2];
+    if (folder) {
+      // If there are duplicates, prefer shorter paths (closer to root)
+      if (!paths.has(folder) || item.path.length < (paths.get(folder)?.length ?? Infinity)) {
+        paths.set(folder, item.path);
+      }
+    }
+  }
+
+  treeCache.set(source, { paths, ts: Date.now() });
+  return paths.get(skillId) ?? null;
+}
+
+export async function GET(request: NextRequest) {
+  try {
+    const source = request.nextUrl.searchParams.get("source") || "";
+    const skillId = request.nextUrl.searchParams.get("skillId") || "";
+
+    if (!source || !skillId) {
+      return NextResponse.json(
+        { error: "source and skillId are required" },
+        { status: 400 }
+      );
+    }
+
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), 15000);
+
+    try {
+      // 1. Find the actual path via tree API (cached per repo)
+      const skillPath = await findSkillPath(source, skillId, controller.signal);
+
+      if (!skillPath) {
+        return NextResponse.json({ content: null }, { status: 200 });
+      }
+
+      // 2. Fetch the raw SKILL.md content
+      const rawUrl = `https://raw.githubusercontent.com/${source}/HEAD/${skillPath}`;
+      const res = await fetch(rawUrl, { signal: controller.signal });
+
+      if (!res.ok) {
+        return NextResponse.json({ content: null }, { status: 200 });
+      }
+
+      const content = await res.text();
+      return NextResponse.json({ content });
+    } finally {
+      clearTimeout(timeout);
+    }
+  } catch (error) {
+    if (error instanceof Error && error.name === "AbortError") {
+      return NextResponse.json({ content: null }, { status: 200 });
+    }
+    return NextResponse.json({ content: null }, { status: 200 });
+  }
+}

src/app/api/skills/marketplace/install/route.ts

@@ -0,0 +1,76 @@
+import { NextResponse } from "next/server";
+import { spawn } from "child_process";
+
+export async function POST(request: Request) {
+  try {
+    const body = await request.json();
+    const { skill, global: isGlobal } = body as { skill: string; global?: boolean };
+
+    if (!skill || typeof skill !== "string") {
+      return NextResponse.json(
+        { error: "skill name is required" },
+        { status: 400 }
+      );
+    }
+
+    const args = ["skills", "remove", skill, "-y", "--agent", "claude-code"];
+    if (isGlobal !== false) {
+      args.splice(3, 0, "-g");
+    }
+
+    const child = spawn("npx", args, {
+      env: { ...process.env },
+      shell: true,
+    });
+
+    const encoder = new TextEncoder();
+    const stream = new ReadableStream({
+      start(controller) {
+        const send = (event: string, data: string) => {
+          controller.enqueue(
+            encoder.encode(`event: ${event}\ndata: ${JSON.stringify(data)}\n\n`)
+          );
+        };
+
+        child.stdout?.on("data", (chunk: Buffer) => {
+          send("output", chunk.toString());
+        });
+
+        child.stderr?.on("data", (chunk: Buffer) => {
+          send("output", chunk.toString());
+        });
+
+        child.on("close", (code) => {
+          if (code === 0) {
+            send("done", "Uninstall completed successfully");
+          } else {
+            send("error", `Process exited with code ${code}`);
+          }
+          controller.close();
+        });
+
+        child.on("error", (err) => {
+          send("error", err.message);
+          controller.close();
+        });
+      },
+      cancel() {
+        child.kill();
+      },
+    });
+
+    return new Response(stream, {
+      headers: {
+        "Content-Type": "text/event-stream",
+        "Cache-Control": "no-cache",
+        Connection: "keep-alive",
+      },
+    });
+  } catch (error) {
+    console.error("[marketplace/remove] Error:", error);
+    return NextResponse.json(
+      { error: error instanceof Error ? error.message : "Remove failed" },
+      { status: 500 }
+    );
+  }
+}

src/app/api/skills/marketplace/readme/route.ts

@@ -0,0 +1,74 @@
+import { NextRequest, NextResponse } from "next/server";
+import { readLockFile } from "@/lib/skills-lock";
+import type { MarketplaceSkill } from "@/types";
+
+export async function GET(request: NextRequest) {
+  try {
+    const q = request.nextUrl.searchParams.get("q") || "";
+    const limit = request.nextUrl.searchParams.get("limit") || "20";
+
+    // Skills.sh requires query >= 2 chars; use a popular fallback for empty/short queries
+    const query = q.length >= 2 ? q : "claude";
+
+    const url = new URL("https://skills.sh/api/search");
+    url.searchParams.set("q", query);
+    url.searchParams.set("limit", limit);
+
+    const controller = new AbortController();
+    const timeout = setTimeout(() => controller.abort(), 10000);
+
+    let response: Response;
+    try {
+      response = await fetch(url.toString(), { signal: controller.signal });
+    } finally {
+      clearTimeout(timeout);
+    }
+
+    if (!response.ok) {
+      return NextResponse.json(
+        { error: `Skills.sh API returned ${response.status}` },
+        { status: 502 }
+      );
+    }
+
+    const data = await response.json();
+    const results: unknown[] = Array.isArray(data) ? data : (data.results || data.skills || []);
+
+    // Read lock file to mark installed skills
+    const lockFile = readLockFile();
+    const installedSources = new Set(
+      Object.values(lockFile.skills).map((entry) => entry.source)
+    );
+
+    const skills: MarketplaceSkill[] = results.map((item: unknown) => {
+      const r = item as Record<string, unknown>;
+      const source = String(r.source || r.slug || r.name || "");
+      const installedEntry = Object.values(lockFile.skills).find(
+        (entry) => entry.source === source
+      );
+      return {
+        id: String(r.id || r.slug || r.name || ""),
+        skillId: String(r.skillId || r.name || r.slug || ""),
+        name: String(r.name || r.slug || ""),
+        installs: Number(r.installs || r.downloads || 0),
+        source,
+        isInstalled: installedSources.has(source),
+        installedAt: installedEntry?.installedAt,
+      };
+    });
+
+    return NextResponse.json({ skills });
+  } catch (error) {
+    if (error instanceof Error && error.name === "AbortError") {
+      return NextResponse.json(
+        { error: "Skills.sh API request timed out" },
+        { status: 504 }
+      );
+    }
+    console.error("[marketplace/search] Error:", error);
+    return NextResponse.json(
+      { error: error instanceof Error ? error.message : "Search failed" },
+      { status: 502 }
+    );
+  }
+}