feat(opencode): add OpenCode toggle switches to MCP and Skills panels

- Add opencode to AppType and SkillApps interfaces in skills.ts
- Add OpenCode Switch component to UnifiedMcpPanel list items
- Add OpenCode Switch component to UnifiedSkillsPanel list items
- Include OpenCode in enabled counts and header statistics for both panels

src/components/mcp/UnifiedMcpPanel.tsx

@@ -59,11 +59,12 @@ const UnifiedMcpPanel = React.forwardRef<
 
   // Count enabled servers per app
   const enabledCounts = useMemo(() => {
-    const counts = { claude: 0, codex: 0, gemini: 0 };
+    const counts = { claude: 0, codex: 0, gemini: 0, opencode: 0 };
     serverEntries.forEach(([_, server]) => {
       if (server.apps.claude) counts.claude++;
       if (server.apps.codex) counts.codex++;
       if (server.apps.gemini) counts.gemini++;
+      if (server.apps.opencode) counts.opencode++;
     });
     return counts;
   }, [serverEntries]);
@@ -148,7 +149,8 @@ const UnifiedMcpPanel = React.forwardRef<
           {t("mcp.serverCount", { count: serverEntries.length })} ·{" "}
           {t("mcp.unifiedPanel.apps.claude")}: {enabledCounts.claude} ·{" "}
           {t("mcp.unifiedPanel.apps.codex")}: {enabledCounts.codex} ·{" "}
-          {t("mcp.unifiedPanel.apps.gemini")}: {enabledCounts.gemini}
+          {t("mcp.unifiedPanel.apps.gemini")}: {enabledCounts.gemini} ·{" "}
+          {t("mcp.unifiedPanel.apps.opencode")}: {enabledCounts.opencode}
         </div>
       </div>
 
@@ -337,6 +339,22 @@ const UnifiedMcpListItem: React.FC<UnifiedMcpListItemProps> = ({
             }
           />
         </div>
+
+        <div className="flex items-center justify-between gap-3">
+          <label
+            htmlFor={`${id}-opencode`}
+            className="text-sm text-foreground/80 cursor-pointer"
+          >
+            {t("mcp.unifiedPanel.apps.opencode")}
+          </label>
+          <Switch
+            id={`${id}-opencode`}
+            checked={server.apps.opencode}
+            onCheckedChange={(checked: boolean) =>
+              onToggleApp(id, "opencode", checked)
+            }
+          />
+        </div>
       </div>
 
       {/* 右侧：操作按钮 */}

src/components/skills/UnifiedSkillsPanel.tsx

@@ -52,12 +52,13 @@ const UnifiedSkillsPanel = React.forwardRef<
 
   // Count enabled skills per app
   const enabledCounts = useMemo(() => {
-    const counts = { claude: 0, codex: 0, gemini: 0 };
+    const counts = { claude: 0, codex: 0, gemini: 0, opencode: 0 };
     if (!skills) return counts;
     skills.forEach((skill) => {
       if (skill.apps.claude) counts.claude++;
       if (skill.apps.codex) counts.codex++;
       if (skill.apps.gemini) counts.gemini++;
+      if (skill.apps.opencode) counts.opencode++;
     });
     return counts;
   }, [skills]);
@@ -139,7 +140,8 @@ const UnifiedSkillsPanel = React.forwardRef<
           {t("skills.installed", { count: skills?.length || 0 })} ·{" "}
           {t("skills.apps.claude")}: {enabledCounts.claude} ·{" "}
           {t("skills.apps.codex")}: {enabledCounts.codex} ·{" "}
-          {t("skills.apps.gemini")}: {enabledCounts.gemini}
+          {t("skills.apps.gemini")}: {enabledCounts.gemini} ·{" "}
+          {t("skills.apps.opencode")}: {enabledCounts.opencode}
         </div>
       </div>
 
@@ -308,6 +310,22 @@ const InstalledSkillListItem: React.FC<InstalledSkillListItemProps> = ({
             }
           />
         </div>
+
+        <div className="flex items-center justify-between gap-3">
+          <label
+            htmlFor={`${skill.id}-opencode`}
+            className="text-sm text-foreground/80 cursor-pointer"
+          >
+            {t("skills.apps.opencode")}
+          </label>
+          <Switch
+            id={`${skill.id}-opencode`}
+            checked={skill.apps.opencode}
+            onCheckedChange={(checked: boolean) =>
+              onToggleApp(skill.id, "opencode", checked)
+            }
+          />
+        </div>
       </div>
 
       {/* 右侧：删除按钮 */}

src/lib/api/skills.ts

@@ -2,13 +2,14 @@ import { invoke } from "@tauri-apps/api/core";
 
 // ========== 类型定义 ==========
 
-export type AppType = "claude" | "codex" | "gemini";
+export type AppType = "claude" | "codex" | "gemini" | "opencode";
 
 /** Skill 应用启用状态 */
 export interface SkillApps {
   claude: boolean;
   codex: boolean;
   gemini: boolean;
+  opencode: boolean;
 }
 
 /** 已安装的 Skill（v3.10.0+ 统一结构） */