From 2a2082233d9e8bda4674ce596f04b61b3b32522d Mon Sep 17 00:00:00 2001
From: Alex Yaroshuk <34632190+alexyaroshuk@users.noreply.github.com>
Date: Sat, 28 Feb 2026 09:18:14 +0800
Subject: [PATCH] fix(app): display skill name in skill tool call (#15413)

---
 packages/ui/src/components/message-part.tsx | 27 +++++++++++++++++++++
 1 file changed, 27 insertions(+)

diff --git a/packages/ui/src/components/message-part.tsx b/packages/ui/src/components/message-part.tsx
index 5c110ccd6..6b6dfe2e5 100644
--- a/packages/ui/src/components/message-part.tsx
+++ b/packages/ui/src/components/message-part.tsx
@@ -250,6 +250,11 @@ export function getToolInfo(tool: string, input: any = {}): ToolInfo {
         icon: "bubble-5",
         title: i18n.t("ui.tool.questions"),
       }
+    case "skill":
+      return {
+        icon: "brain",
+        title: input.name || "skill",
+      }
     default:
       return {
         icon: "mcp",
@@ -1900,3 +1905,25 @@ ToolRegistry.register({
     )
   },
 })
+
+ToolRegistry.register({
+  name: "skill",
+  render(props) {
+    const title = createMemo(() => props.input.name || "skill")
+    const running = createMemo(() => props.status === "pending" || props.status === "running")
+
+    const titleContent = () => <TextShimmer text={title()} active={running()} />
+
+    const trigger = () => (
+      <div data-slot="basic-tool-tool-info-structured">
+        <div data-slot="basic-tool-tool-info-main">
+          <span data-slot="basic-tool-tool-title" class="capitalize agent-title">
+            {titleContent()}
+          </span>
+        </div>
+      </div>
+    )
+
+    return <BasicTool icon="brain" status={props.status} trigger={trigger()} hideDetails />
+  },
+})