From 817f7cf41d2ca93a5c3a3d2f761a2b080de5b5ae Mon Sep 17 00:00:00 2001
From: Jiang Bohan <bhjiang@outlook.com>
Date: Tue, 14 Apr 2026 17:45:31 +0800
Subject: [PATCH] feat(views): replace inline text with info banner for local
 skills hint

The "local runtime skills are always available" message was buried in
the description text and easy to miss. Move it into a visible info
callout banner with an icon so users notice it immediately.
---
 packages/views/agents/components/tabs/skills-tab.tsx | 11 +++++++++--
 1 file changed, 9 insertions(+), 2 deletions(-)

diff --git a/packages/views/agents/components/tabs/skills-tab.tsx b/packages/views/agents/components/tabs/skills-tab.tsx
index 25f92233d..def6b4011 100644
--- a/packages/views/agents/components/tabs/skills-tab.tsx
+++ b/packages/views/agents/components/tabs/skills-tab.tsx
@@ -1,7 +1,7 @@
 "use client";
 
 import { useState } from "react";
-import { Plus, FileText, Trash2 } from "lucide-react";
+import { Plus, FileText, Trash2, Info } from "lucide-react";
 import type { Agent } from "@multica/core/types";
 import {
   Dialog,
@@ -65,7 +65,7 @@ export function SkillsTab({
         <div>
           <h3 className="text-sm font-semibold">Skills</h3>
           <p className="text-xs text-muted-foreground mt-0.5">
-            Workspace skills assigned to this agent. Local runtime skills are always available automatically.
+            Workspace skills assigned to this agent.
           </p>
         </div>
         <Button
@@ -79,6 +79,13 @@ export function SkillsTab({
         </Button>
       </div>
 
+      <div className="flex items-start gap-2 rounded-md border border-info/20 bg-info/5 px-3 py-2.5">
+        <Info className="h-3.5 w-3.5 shrink-0 text-info mt-0.5" />
+        <p className="text-xs text-muted-foreground">
+          Local runtime skills (from your CLI&apos;s skills directory) are always available automatically — no need to add them here.
+        </p>
+      </div>
+
       {agent.skills.length === 0 ? (
         <div className="flex flex-col items-center justify-center rounded-lg border border-dashed py-12">
           <FileText className="h-8 w-8 text-muted-foreground/40" />