@octo-cyber/ai 0.5.1 → 0.5.3

package/dist/skill/services/skill-registry.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"skill-registry.service.js","sourceRoot":"","sources":["../../../src/skill/services/skill-registry.service.ts"],"names":[],"mappings":"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"}

package/dist/skill/types.d.ts

@@ -0,0 +1,45 @@
+/**
+ * Skill-related type definitions for the SKILL.md generation system.
+ */
+/** Supported AI tool targets for skill installation. */
+export type SkillTarget = 'claude' | 'cursor' | 'codex';
+/** Information about an AI tool installation target. */
+export interface SkillTargetInfo {
+    id: SkillTarget;
+    name: string;
+    /** Base directory for skills (e.g. ~/.claude/skills/) */
+    skillsDir: string;
+    /** How to detect if the tool is installed */
+    detectDir: string;
+    isInstalled: boolean;
+}
+/** Source type for a skill. */
+export type SkillSourceType = 'module' | 'custom';
+/** Parameters for generating a skill from a module. */
+export interface SkillGenerateParams {
+    /** Module name (e.g. 'auth', 'erp'). */
+    module: string;
+    /** Base URL of the Octo server (e.g. 'http://localhost:9988'). */
+    baseUrl: string;
+    /** API Key to embed in the skill (full key string). */
+    apiKey?: string;
+}
+/** Result of skill generation. */
+export interface SkillGenerateResult {
+    name: string;
+    description: string;
+    content: string;
+    sourceModule: string;
+    version: string;
+}
+/** Endpoint info extracted from RouteRegistry for skill generation. */
+export interface EndpointInfo {
+    method: string;
+    path: string;
+    summary: string;
+    permission?: string;
+    controller: string;
+    controllerName?: string;
+    tags?: string[];
+}
+//# sourceMappingURL=types.d.ts.map

package/dist/skill/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/skill/types.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,wDAAwD;AACxD,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,QAAQ,GAAG,OAAO,CAAC;AAExD,wDAAwD;AACxD,MAAM,WAAW,eAAe;IAC9B,EAAE,EAAE,WAAW,CAAC;IAChB,IAAI,EAAE,MAAM,CAAC;IACb,yDAAyD;IACzD,SAAS,EAAE,MAAM,CAAC;IAClB,6CAA6C;IAC7C,SAAS,EAAE,MAAM,CAAC;IAClB,WAAW,EAAE,OAAO,CAAC;CACtB;AAED,+BAA+B;AAC/B,MAAM,MAAM,eAAe,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAElD,uDAAuD;AACvD,MAAM,WAAW,mBAAmB;IAClC,wCAAwC;IACxC,MAAM,EAAE,MAAM,CAAC;IACf,kEAAkE;IAClE,OAAO,EAAE,MAAM,CAAC;IAChB,uDAAuD;IACvD,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB;AAED,kCAAkC;AAClC,MAAM,WAAW,mBAAmB;IAClC,IAAI,EAAE,MAAM,CAAC;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;IACrB,OAAO,EAAE,MAAM,CAAC;CACjB;AAED,uEAAuE;AACvE,MAAM,WAAW,YAAY;IAC3B,MAAM,EAAE,MAAM,CAAC;IACf,IAAI,EAAE,MAAM,CAAC;IACb,OAAO,EAAE,MAAM,CAAC;IAChB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC;CACjB"}

package/dist/skill/types.js

@@ -0,0 +1,6 @@
+"use strict";
+/**
+ * Skill-related type definitions for the SKILL.md generation system.
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/skill/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../src/skill/types.ts"],"names":[],"mappings":";AAAA;;GAEG"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@octo-cyber/ai",
-  "version": "0.5.1",
+  "version": "0.5.3",
   "description": "Octo AI module — Agent + Capability + SyncBridge + client registration",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -22,9 +22,9 @@
     }
   },
   "dependencies": {
-    "@octo-cyber/task": "^0.5.1",
-    "@octo-cyber/core": "^0.5.1",
-    "@octo-cyber/auth": "^0.5.1"
+    "@octo-cyber/core": "^0.5.4",
+    "@octo-cyber/auth": "^0.5.5",
+    "@octo-cyber/task": "^0.5.1"
   },
   "peerDependencies": {
     "react": "^19.0.0",

package/web/components/SkillCard.tsx

@@ -0,0 +1,139 @@
+'use client'
+
+import { useTranslations } from 'next-intl'
+import {
+  Download,
+  Edit,
+  MoreHorizontal,
+  Trash2,
+  ToggleLeft,
+  ToggleRight,
+  CheckCircle2,
+} from 'lucide-react'
+
+import { Badge } from '@octo-cyber/ui/components/ui/badge'
+import { Button } from '@octo-cyber/ui/components/ui/button'
+import {
+  Card,
+  CardContent,
+  CardDescription,
+  CardHeader,
+  CardTitle,
+} from '@octo-cyber/ui/components/ui/card'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger,
+} from '@octo-cyber/ui/components/ui/dropdown-menu'
+
+import type { SkillInfo, SkillTargetInfo } from '../services/skill-service'
+
+interface SkillCardProps {
+  skill: SkillInfo
+  targets: SkillTargetInfo[]
+  onInstall: () => void
+  onEdit: () => void
+  onToggle: () => void
+  onDelete: () => void
+}
+
+export default function SkillCard({
+  skill,
+  targets,
+  onInstall,
+  onEdit,
+  onToggle,
+  onDelete,
+}: SkillCardProps) {
+  const t = useTranslations('aiSkills')
+
+  const installedTargets = skill.installedTargets ?? []
+
+  return (
+    <Card className="flex flex-col">
+      <CardHeader className="flex-row items-start justify-between space-y-0 pb-2">
+        <div className="space-y-1">
+          <CardTitle className="text-base font-semibold">
+            {skill.name}
+          </CardTitle>
+          <CardDescription className="line-clamp-2 text-sm">
+            {skill.description}
+          </CardDescription>
+        </div>
+        <DropdownMenu>
+          <DropdownMenuTrigger asChild>
+            <Button variant="ghost" size="icon" className="h-8 w-8">
+              <MoreHorizontal className="h-4 w-4" />
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent align="end">
+            <DropdownMenuItem onClick={onEdit}>
+              <Edit className="mr-2 h-4 w-4" />
+              {t('actions.edit')}
+            </DropdownMenuItem>
+            <DropdownMenuItem onClick={onToggle}>
+              {skill.isEnabled ? (
+                <ToggleLeft className="mr-2 h-4 w-4" />
+              ) : (
+                <ToggleRight className="mr-2 h-4 w-4" />
+              )}
+              {skill.isEnabled ? t('actions.disable') : t('actions.enable')}
+            </DropdownMenuItem>
+            <DropdownMenuSeparator />
+            <DropdownMenuItem onClick={onDelete} className="text-destructive">
+              <Trash2 className="mr-2 h-4 w-4" />
+              {t('actions.delete')}
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+      </CardHeader>
+
+      <CardContent className="flex flex-1 flex-col justify-between gap-3">
+        {/* Meta info */}
+        <div className="flex flex-wrap items-center gap-2 text-xs text-muted-foreground">
+          <Badge variant={skill.isEnabled ? 'default' : 'secondary'} className="text-xs">
+            {skill.isEnabled ? t('status.enabled') : t('status.disabled')}
+          </Badge>
+          <span>{t('meta.source')}: {skill.sourceModule}</span>
+          <span>v{skill.version}</span>
+          {skill.isEdited && (
+            <Badge variant="outline" className="text-xs">
+              {t('meta.edited')}
+            </Badge>
+          )}
+        </div>
+
+        {/* Install status */}
+        <div className="flex flex-wrap items-center gap-1.5">
+          {targets.filter((tgt) => tgt.isInstalled).map((tgt) => {
+            const isInstalled = installedTargets.includes(tgt.id)
+            return (
+              <Badge
+                key={tgt.id}
+                variant={isInstalled ? 'default' : 'outline'}
+                className="text-xs"
+              >
+                {isInstalled && <CheckCircle2 className="mr-1 h-3 w-3" />}
+                {tgt.name}
+              </Badge>
+            )
+          })}
+        </div>
+
+        {/* Install button */}
+        <Button
+          variant="outline"
+          size="sm"
+          className="w-full"
+          onClick={onInstall}
+          disabled={!skill.isEnabled}
+        >
+          <Download className="mr-2 h-4 w-4" />
+          {t('actions.install')}
+        </Button>
+      </CardContent>
+    </Card>
+  )
+}

package/web/components/SkillEditorDialog.tsx

@@ -0,0 +1,77 @@
+'use client'
+
+import { useState } from 'react'
+import { useTranslations } from 'next-intl'
+import { Loader2 } from 'lucide-react'
+
+import { Button } from '@octo-cyber/ui/components/ui/button'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@octo-cyber/ui/components/ui/dialog'
+import { Textarea } from '@octo-cyber/ui/components/ui/textarea'
+
+import type { SkillInfo } from '../services/skill-service'
+
+interface SkillEditorDialogProps {
+  skill: SkillInfo
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onSave: (id: string, content: string) => Promise<void>
+}
+
+export default function SkillEditorDialog({
+  skill,
+  open,
+  onOpenChange,
+  onSave,
+}: SkillEditorDialogProps) {
+  const t = useTranslations('aiSkills')
+  const tc = useTranslations('common')
+
+  const [content, setContent] = useState(skill.content)
+  const [saving, setSaving] = useState(false)
+
+  const handleSave = async () => {
+    setSaving(true)
+    try {
+      await onSave(skill.id, content)
+    } finally {
+      setSaving(false)
+    }
+  }
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-3xl max-h-[80vh]">
+        <DialogHeader>
+          <DialogTitle>{t('editor.title', { name: skill.name })}</DialogTitle>
+          <DialogDescription>
+            {t('editor.description')}
+          </DialogDescription>
+        </DialogHeader>
+
+        <Textarea
+          value={content}
+          onChange={(e) => setContent(e.target.value)}
+          className="min-h-[400px] font-mono text-sm"
+          placeholder="SKILL.md content..."
+        />
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            {tc('cancel')}
+          </Button>
+          <Button onClick={handleSave} disabled={saving}>
+            {saving && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+            {tc('save')}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}

package/web/components/SkillInstallDialog.tsx

@@ -0,0 +1,134 @@
+'use client'
+
+import { useState, useCallback } from 'react'
+import { useTranslations } from 'next-intl'
+import { toast } from 'sonner'
+import { CheckCircle2, Loader2 } from 'lucide-react'
+
+import { Button } from '@octo-cyber/ui/components/ui/button'
+import { Checkbox } from '@octo-cyber/ui/components/ui/checkbox'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle,
+} from '@octo-cyber/ui/components/ui/dialog'
+import { Label } from '@octo-cyber/ui/components/ui/label'
+
+import { skillService } from '../services/skill-service'
+import type { SkillInfo, SkillTargetInfo } from '../services/skill-service'
+
+interface SkillInstallDialogProps {
+  skill: SkillInfo
+  targets: SkillTargetInfo[]
+  open: boolean
+  onOpenChange: (open: boolean) => void
+  onDone: () => void
+}
+
+export default function SkillInstallDialog({
+  skill,
+  targets,
+  open,
+  onOpenChange,
+  onDone,
+}: SkillInstallDialogProps) {
+  const t = useTranslations('aiSkills')
+  const tc = useTranslations('common')
+
+  const availableTargets = targets.filter((tgt) => tgt.isInstalled)
+  const [selected, setSelected] = useState<string[]>(
+    skill.installedTargets ?? [],
+  )
+  const [installing, setInstalling] = useState(false)
+
+  const toggleTarget = useCallback((id: string) => {
+    setSelected((prev) =>
+      prev.includes(id) ? prev.filter((x) => x !== id) : [...prev, id],
+    )
+  }, [])
+
+  const handleInstall = useCallback(async () => {
+    if (selected.length === 0) return
+    setInstalling(true)
+    try {
+      const result = await skillService.install(skill.id, selected)
+      if (result.failed.length > 0) {
+        toast.error(t('toast.installPartial', {
+          failed: result.failed.map((f) => f.target).join(', '),
+        }))
+      } else {
+        toast.success(t('toast.installed', {
+          targets: selected.join(', '),
+        }))
+      }
+      if (result.apiKeyCreated) {
+        toast.success(t('toast.apiKeyCreated'))
+      }
+      onDone()
+    } catch {
+      toast.error(t('toast.installFailed'))
+    } finally {
+      setInstalling(false)
+    }
+  }, [skill.id, selected, t, onDone])
+
+  return (
+    <Dialog open={open} onOpenChange={onOpenChange}>
+      <DialogContent className="sm:max-w-md">
+        <DialogHeader>
+          <DialogTitle>{t('installDialog.title')}</DialogTitle>
+          <DialogDescription>
+            {t('installDialog.description', { name: skill.name })}
+          </DialogDescription>
+        </DialogHeader>
+
+        <div className="space-y-3 py-4">
+          {availableTargets.length === 0 ? (
+            <p className="text-sm text-muted-foreground">
+              {t('installDialog.noTargets')}
+            </p>
+          ) : (
+            availableTargets.map((tgt) => {
+              const isAlreadyInstalled = (skill.installedTargets ?? []).includes(tgt.id)
+              return (
+                <div key={tgt.id} className="flex items-center space-x-3">
+                  <Checkbox
+                    id={`target-${tgt.id}`}
+                    checked={selected.includes(tgt.id)}
+                    onCheckedChange={() => toggleTarget(tgt.id)}
+                  />
+                  <Label htmlFor={`target-${tgt.id}`} className="flex items-center gap-2 text-sm">
+                    {tgt.name}
+                    {isAlreadyInstalled && (
+                      <CheckCircle2 className="h-3.5 w-3.5 text-green-500" />
+                    )}
+                  </Label>
+                </div>
+              )
+            })
+          )}
+        </div>
+
+        <p className="text-xs text-muted-foreground">
+          {t('installDialog.apiKeyNote')}
+        </p>
+
+        <DialogFooter>
+          <Button variant="outline" onClick={() => onOpenChange(false)}>
+            {tc('cancel')}
+          </Button>
+          <Button
+            onClick={handleInstall}
+            disabled={installing || selected.length === 0}
+          >
+            {installing && <Loader2 className="mr-2 h-4 w-4 animate-spin" />}
+            {t('actions.install')}
+          </Button>
+        </DialogFooter>
+      </DialogContent>
+    </Dialog>
+  )
+}

package/web/index.ts

@@ -14,6 +14,8 @@ export { default as aiMessagesEnUS } from './messages/en-US.json';
 // Pages
 export { default as AiCliToolsPage } from './pages/AiCliToolsPage';
 export { default as WorkspacesPage } from './pages/WorkspacesPage';
+export { default as SkillsPage } from './pages/SkillsPage';
 
 // Services
 export { aiCliService } from './services/ai-cli-service';
+export { skillService } from './services/skill-service';

package/web/manifest.ts

@@ -5,10 +5,11 @@ export const aiFrontendManifest: IFrontendManifest = {
   icon: 'Terminal',
   color: 'cyan',
   position: 'main',
-  titleKey: 'aiCli.title',
-  descriptionKey: 'aiCli.description',
+  titleKey: 'aiTools.title',
+  descriptionKey: 'aiTools.description',
   pages: [
-    { path: '/ai-tools', titleKey: 'aiCli.pages.tools', icon: 'Terminal' },
-    { path: '/ai-tools/workspaces', titleKey: 'aiCli.pages.workspaces', icon: 'Terminal' },
+    { path: '/ai-tools', titleKey: 'aiTools.pages.tools', icon: 'Terminal', component: '@octo-cyber/ai/web/pages/AiCliToolsPage' },
+    { path: '/ai-tools/workspaces', titleKey: 'aiTools.pages.workspaces', icon: 'Terminal', component: '@octo-cyber/ai/web/pages/WorkspacesPage' },
+    { path: '/ai-tools/skills', titleKey: 'aiTools.pages.skills', icon: 'Sparkles', component: '@octo-cyber/ai/web/pages/SkillsPage' },
   ],
 };

package/web/messages/en-US.json

@@ -77,5 +77,58 @@
         "pullFailed": "Pull failed"
       }
     }
+  },
+  "aiSkills": {
+    "title": "AI Skills",
+    "description": "Manage SKILL.md files generated from system APIs, install to Claude Code, Cursor, and more",
+    "empty": "No skills yet. Click the button below to generate.",
+    "tabs": {
+      "all": "All",
+      "enabled": "Enabled",
+      "installed": "Installed"
+    },
+    "status": {
+      "enabled": "Enabled",
+      "disabled": "Disabled"
+    },
+    "meta": {
+      "source": "Source",
+      "edited": "Edited"
+    },
+    "actions": {
+      "generate": "Generate Skills",
+      "install": "Install",
+      "edit": "Edit",
+      "enable": "Enable",
+      "disable": "Disable",
+      "delete": "Delete"
+    },
+    "installDialog": {
+      "title": "Install Skill",
+      "description": "Select AI tools to install {name}",
+      "noTargets": "No installed AI tools detected",
+      "apiKeyNote": "An API Key will be auto-created and embedded in the Skill file. AI tools can call the API directly."
+    },
+    "editor": {
+      "title": "Edit {name}",
+      "description": "Modify SKILL.md content. Saving marks it as 'Edited' to prevent auto-regeneration overwrite."
+    },
+    "toast": {
+      "loadFailed": "Failed to load skills",
+      "generateDone": "Generation complete: {created} created, {updated} updated",
+      "generateFailed": "Generation failed",
+      "installed": "Installed to {targets}",
+      "installFailed": "Installation failed",
+      "installPartial": "Partial installation failure: {failed}",
+      "apiKeyCreated": "API Key auto-created",
+      "saved": "Saved",
+      "saveFailed": "Save failed",
+      "toggleFailed": "Operation failed",
+      "deleted": "Deleted",
+      "deleteFailed": "Delete failed"
+    },
+    "pages": {
+      "skills": "AI Skills"
+    }
   }
 }

package/web/messages/zh-CN.json

@@ -77,5 +77,58 @@
         "pullFailed": "拉取失败"
       }
     }
+  },
+  "aiSkills": {
+    "title": "AI Skills",
+    "description": "管理系统 API 生成的 Skill 文件，安装到 Claude Code、Cursor 等 AI 工具",
+    "empty": "暂无 Skill，点击下方按钮生成",
+    "tabs": {
+      "all": "全部",
+      "enabled": "已启用",
+      "installed": "已安装"
+    },
+    "status": {
+      "enabled": "已启用",
+      "disabled": "已禁用"
+    },
+    "meta": {
+      "source": "来源",
+      "edited": "已编辑"
+    },
+    "actions": {
+      "generate": "生成 Skills",
+      "install": "安装",
+      "edit": "编辑",
+      "enable": "启用",
+      "disable": "禁用",
+      "delete": "删除"
+    },
+    "installDialog": {
+      "title": "安装 Skill",
+      "description": "选择要安装 {name} 的 AI 工具",
+      "noTargets": "未检测到已安装的 AI 工具",
+      "apiKeyNote": "安装时会自动创建 API Key 并写入 Skill 文件，AI 工具可直接调用 API。"
+    },
+    "editor": {
+      "title": "编辑 {name}",
+      "description": "修改 SKILL.md 内容。保存后将标记为「已编辑」，自动生成不会覆盖。"
+    },
+    "toast": {
+      "loadFailed": "加载 Skill 列表失败",
+      "generateDone": "生成完成：{created} 个新建，{updated} 个更新",
+      "generateFailed": "生成失败",
+      "installed": "已安装到 {targets}",
+      "installFailed": "安装失败",
+      "installPartial": "部分安装失败：{failed}",
+      "apiKeyCreated": "已自动创建 API Key",
+      "saved": "已保存",
+      "saveFailed": "保存失败",
+      "toggleFailed": "操作失败",
+      "deleted": "已删除",
+      "deleteFailed": "删除失败"
+    },
+    "pages": {
+      "skills": "AI Skills"
+    }
   }
 }