claudeup 4.32.1 → 4.34.0

package/src/ui/screens/SkillsScreen.tsx

@@ -15,8 +15,8 @@ import {
   installSkill,
   uninstallSkill,
 } from "../../services/skills-manager.js";
-import { searchSkills } from "../../services/skillsmp-client.js";
-import { DEFAULT_SKILL_REPOS, RECOMMENDED_SKILLS, RECOMMENDED_SKILL_SETS, classifyStarReliability } from "../../data/skill-repos.js";
+import { fetchCuratedSkillsCatalog, searchSkills } from "../../services/skillsmp-client.js";
+import { DEFAULT_SKILL_REPOS, classifyStarReliability, type RecommendedSkill } from "../../data/skill-repos.js";
 import type { SkillInfo, SkillSetInfo, SkillSource } from "../../types/index.js";
 import { buildSkillBrowserItems } from "../adapters/skillsAdapter.js";
 import type { SkillBrowserItem } from "../adapters/skillsAdapter.js";
@@ -28,6 +28,9 @@ export function SkillsScreen() {
   const { skills: skillsState } = state;
   const modal = useModal();
   const dimensions = useDimensions();
+  const [curatedSkills, setCuratedSkills] = useState<RecommendedSkill[]>([]);
+  const [skillSets, setSkillSets] = useState<SkillSetInfo[]>([]);
+  const [expandedSets, setExpandedSets] = useState<Set<string>>(new Set());
 
   const isSearchActive =
     state.isSearching &&
@@ -39,9 +42,30 @@ export function SkillsScreen() {
   const fetchData = useCallback(async () => {
     dispatch({ type: "SKILLS_DATA_LOADING" });
     try {
+      const catalog = await fetchCuratedSkillsCatalog();
+      setCuratedSkills(catalog.skills);
+      setSkillSets((previous) =>
+        catalog.skillSets.map((skillSet) => {
+          const existing = previous.find((item) => item.repo === skillSet.repo);
+          return existing
+            ? { ...existing, ...skillSet, id: skillSet.repo }
+            : {
+                id: skillSet.repo,
+                name: skillSet.name,
+                description: skillSet.description,
+                repo: skillSet.repo,
+                icon: skillSet.icon,
+                stars: skillSet.stars,
+                skills: [],
+                loaded: false,
+                loading: false,
+              };
+        }),
+      );
       const skills = await fetchAvailableSkills(
         DEFAULT_SKILL_REPOS,
         state.projectPath,
+        catalog.skills,
       );
       dispatch({ type: "SKILLS_DATA_SUCCESS", skills });
     } catch (error) {
@@ -159,20 +183,6 @@ export function SkillsScreen() {
 
   // ── Skill Sets state ──────────────────────────────────────────────────────
 
-  const [skillSets, setSkillSets] = useState<SkillSetInfo[]>(() =>
-    RECOMMENDED_SKILL_SETS.map((rs) => ({
-      id: rs.repo,
-      name: rs.name,
-      description: rs.description,
-      repo: rs.repo,
-      icon: rs.icon,
-      stars: rs.stars,
-      skills: [],
-      loaded: false,
-      loading: false,
-    })),
-  );
-  const [expandedSets, setExpandedSets] = useState<Set<string>>(new Set());
 
   // Re-mark installed status on child skills when disk state changes
   useEffect(() => {
@@ -261,10 +271,12 @@ export function SkillsScreen() {
       showStatus(`Installing ${toInstall.length} skills from ${set.name}...`);
       let installed = 0;
       let failed = 0;
+      let degraded = 0;
       for (const skill of toInstall) {
         try {
-          await installSkill(skill, scope, state.projectPath);
+          const result = await installSkill(skill, scope, state.projectPath);
           installed++;
+          if (result.degraded) degraded++;
         } catch {
           failed++;
         }
@@ -272,6 +284,13 @@ export function SkillsScreen() {
       await scanDisk();
       if (failed > 0) {
         showStatus(`Installed ${installed}/${toInstall.length} (${failed} failed)`, "error");
+      } else if (degraded > 0) {
+        // Incomplete is not the same as installed. Say so rather than let a
+        // batch of half-written skills report a clean success.
+        showStatus(
+          `Installed ${installed} skills from ${set.name} to ${scope} — ${degraded} incomplete (missing supporting files)`,
+          "error",
+        );
       } else {
         showStatus(`Installed ${installed} skills from ${set.name} to ${scope}`);
       }
@@ -282,7 +301,7 @@ export function SkillsScreen() {
   // ── Derived data ──────────────────────────────────────────────────────────
 
   const staticRecommended = useMemo((): SkillInfo[] => {
-    return RECOMMENDED_SKILLS.map((r) => {
+    return curatedSkills.map((r) => {
       const slug = r.name.toLowerCase().replace(/[^a-z0-9]+/g, "-").replace(/^-|-$/g, "");
       const isUser = installedFromDisk.user.has(slug) || installedFromDisk.user.has(r.name);
       const isProj = installedFromDisk.project.has(slug) || installedFromDisk.project.has(r.name);
@@ -302,7 +321,7 @@ export function SkillsScreen() {
         starReliability: classifyStarReliability(r.repo, r.stars),
       };
     });
-  }, [installedFromDisk]);
+  }, [curatedSkills, installedFromDisk]);
 
   const mergedRecommended = useMemo((): SkillInfo[] => {
     if (skillsState.skills.status !== "success") return staticRecommended;
@@ -433,9 +452,20 @@ export function SkillsScreen() {
   const handleInstall = useCallback(async (scope: "user" | "project") => {
     if (!selectedSkill) return;
     try {
-      await installSkill(selectedSkill, scope, state.projectPath);
+      const result = await installSkill(selectedSkill, scope, state.projectPath);
       await scanDisk(); // Re-scan disk only — no network re-fetch needed
-      showStatus(`Installed ${selectedSkill.name} to ${scope}`);
+      const files =
+        result.fileCount === 1 ? "1 file" : `${result.fileCount} files`;
+      // An install that silently dropped supporting files used to report plain
+      // success, so a half-installed skill looked identical to a good one.
+      if (result.degraded) {
+        showStatus(
+          `Installed ${selectedSkill.name} to ${scope} (${files}) — ${result.degraded}`,
+          "error",
+        );
+      } else {
+        showStatus(`Installed ${selectedSkill.name} to ${scope} (${files})`);
+      }
     } catch (error) {
       showStatus(`Failed: ${error}`, "error");
     }