feat: show skills in status and sidebar

packages/opencode/src/cli/cmd/tui/component/dialog-status.tsx

@@ -157,6 +157,28 @@ export function DialogStatus() {
           </For>
         </box>
       </Show>
+      <Show when={sync.data.skill.length > 0} fallback={<text fg={theme.text}>No Skills</text>}>
+        <box>
+          <text fg={theme.text}>{sync.data.skill.length} Skills</text>
+          <For each={sync.data.skill}>
+            {(item) => (
+              <box flexDirection="row" gap={1}>
+                <text
+                  flexShrink={0}
+                  style={{
+                    fg: theme.success,
+                  }}
+                >
+                  •
+                </text>
+                <text wrapMode="word" fg={theme.text}>
+                  <b>{item.name}</b>
+                </text>
+              </box>
+            )}
+          </For>
+        </box>
+      </Show>
     </box>
   )
 }

packages/opencode/src/cli/cmd/tui/context/sync.tsx

@@ -16,6 +16,7 @@ import type {
   ProviderAuthMethod,
   VcsInfo,
 } from "@opencode-ai/sdk/v2"
+import { Skill } from "@/skill"
 import { createStore, produce, reconcile } from "solid-js/store"
 import { useSDK } from "@tui/context/sdk"
 import { Binary } from "@opencode-ai/util/binary"
@@ -63,6 +64,7 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
         [key: string]: McpStatus
       }
       formatter: FormatterStatus[]
+      skill: Skill.Info[]
       vcs: VcsInfo | undefined
       path: Path
     }>({
@@ -88,6 +90,7 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
       lsp: [],
       mcp: {},
       formatter: [],
+      skill: [],
       vcs: undefined,
       path: { state: "", config: "", worktree: "", directory: "" },
     })
@@ -293,6 +296,7 @@ export const { use: useSync, provider: SyncProvider } = createSimpleContext({
             sdk.client.lsp.status().then((x) => setStore("lsp", x.data!)),
             sdk.client.mcp.status().then((x) => setStore("mcp", x.data!)),
             sdk.client.formatter.status().then((x) => setStore("formatter", x.data!)),
+            sdk.client.skill.status().then((x) => setStore("skill", x.data!)),
             sdk.client.session.status().then((x) => setStore("session_status", x.data!)),
             sdk.client.provider.auth().then((x) => setStore("provider_auth", x.data ?? {})),
             sdk.client.vcs.get().then((x) => setStore("vcs", x.data)),

packages/opencode/src/cli/cmd/tui/routes/session/footer.tsx

@@ -79,6 +79,11 @@ export function Footer() {
                 {mcp()} MCP
               </text>
             </Show>
+            <Show when={sync.data.skill.length > 0}>
+              <text fg={theme.text}>
+                <span style={{ fg: theme.success }}>•</span> {sync.data.skill.length} Skills
+              </text>
+            </Show>
             <text fg={theme.textMuted}>/status</text>
           </Match>
         </Switch>

packages/opencode/src/cli/cmd/tui/routes/session/sidebar.tsx

@@ -25,11 +25,14 @@ export function Sidebar(props: { sessionID: string }) {
     diff: true,
     todo: true,
     lsp: true,
+    skill: true,
   })
 
   // Sort MCP servers alphabetically for consistent display order
   const mcpEntries = createMemo(() => Object.entries(sync.data.mcp).sort(([a], [b]) => a.localeCompare(b)))
 
+  const skillEntries = createMemo(() => sync.data.skill.toSorted((a, b) => a.name.localeCompare(b.name)))
+
   // Count connected and error MCP servers for collapsed header display
   const connectedMcpCount = createMemo(() => mcpEntries().filter(([_, item]) => item.status === "connected").length)
   const errorMcpCount = createMemo(
@@ -200,6 +203,34 @@ export function Sidebar(props: { sessionID: string }) {
                 </For>
               </Show>
             </box>
+            <Show when={skillEntries().length > 0}>
+              <box>
+                <box
+                  flexDirection="row"
+                  gap={1}
+                  onMouseDown={() => skillEntries().length > 2 && setExpanded("skill", !expanded.skill)}
+                >
+                  <Show when={skillEntries().length > 2}>
+                    <text fg={theme.text}>{expanded.skill ? "▼" : "▶"}</text>
+                  </Show>
+                  <text fg={theme.text}>
+                    <b>Skills</b>
+                  </text>
+                </box>
+                <Show when={skillEntries().length <= 2 || expanded.skill}>
+                  <For each={skillEntries()}>
+                    {(item) => (
+                      <box flexDirection="row" gap={1}>
+                        <text flexShrink={0} style={{ fg: theme.success }}>
+                          •
+                        </text>
+                        <text fg={theme.textMuted}>{item.name}</text>
+                      </box>
+                    )}
+                  </For>
+                </Show>
+              </box>
+            </Show>
             <Show when={todo().length > 0 && todo().some((t) => t.status !== "completed")}>
               <box>
                 <box

packages/opencode/src/server/server.ts

@@ -18,6 +18,7 @@ import { Config } from "../config/config"
 import { File } from "../file"
 import { LSP } from "../lsp"
 import { Format } from "../format"
+import { Skill } from "../skill"
 import { MessageV2 } from "../session/message-v2"
 import { TuiRoute } from "./tui"
 import { Permission } from "../permission"
@@ -2242,6 +2243,27 @@ export namespace Server {
           return c.json(await Format.status())
         },
       )
+      .get(
+        "/skill",
+        describeRoute({
+          summary: "Get skill status",
+          description: "Get all loaded skills",
+          operationId: "skill.status",
+          responses: {
+            200: {
+              description: "List of loaded skills",
+              content: {
+                "application/json": {
+                  schema: resolver(Skill.Info.array()),
+                },
+              },
+            },
+          },
+        }),
+        async (c) => {
+          return c.json(await Skill.status())
+        },
+      )
       .post(
         "/tui/append-prompt",
         describeRoute({

packages/opencode/src/skill/skill.ts

@@ -80,4 +80,8 @@ export namespace Skill {
   export async function all() {
     return state().then((x) => Object.values(x))
   }
+
+  export async function status() {
+    return all()
+  }
 }

packages/sdk/js/src/v2/gen/sdk.gen.ts

@@ -121,6 +121,7 @@ import type {
   SessionUnshareResponses,
   SessionUpdateErrors,
   SessionUpdateResponses,
+  SkillStatusResponses,
   SubtaskPartInput,
   TextPartInput,
   ToolIdsErrors,
@@ -2334,6 +2335,27 @@ export class Formatter extends HeyApiClient {
   }
 }
 
+export class Skill extends HeyApiClient {
+  /**
+   * Get skill status
+   *
+   * Get all loaded skills
+   */
+  public status<ThrowOnError extends boolean = false>(
+    parameters?: {
+      directory?: string
+    },
+    options?: Options<never, ThrowOnError>,
+  ) {
+    const params = buildClientParams([parameters], [{ args: [{ in: "query", key: "directory" }] }])
+    return (options?.client ?? this.client).get<SkillStatusResponses, unknown, ThrowOnError>({
+      url: "/skill",
+      ...options,
+      ...params,
+    })
+  }
+}
+
 export class Control extends HeyApiClient {
   /**
    * Get next TUI request
@@ -2701,6 +2723,8 @@ export class OpencodeClient extends HeyApiClient {
 
   formatter = new Formatter({ client: this.client })
 
+  skill = new Skill({ client: this.client })
+
   tui = new Tui({ client: this.client })
 
   auth = new Auth({ client: this.client })

packages/sdk/js/src/v2/gen/types.gen.ts

@@ -4000,6 +4000,28 @@ export type FormatterStatusResponses = {
 
 export type FormatterStatusResponse = FormatterStatusResponses[keyof FormatterStatusResponses]
 
+export type SkillStatusData = {
+  body?: never
+  path?: never
+  query?: {
+    directory?: string
+  }
+  url: "/skill"
+}
+
+export type SkillStatusResponses = {
+  /**
+   * List of loaded skills
+   */
+  200: Array<{
+    name: string
+    description: string
+    location: string
+  }>
+}
+
+export type SkillStatusResponse = SkillStatusResponses[keyof SkillStatusResponses]
+
 export type TuiAppendPromptData = {
   body?: {
     text: string