opencode-skills-tracker-plugin 1.0.0

package/LICENSE

@@ -0,0 +1,21 @@
+MIT License
+
+Copyright (c) 2026 neoty
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.

package/README.md

@@ -0,0 +1,36 @@
+# opencode-skills-tracker-plugin
+
+An [OpenCode](https://opencode.ai) TUI plugin that displays loaded skills with their load timestamps in the sidebar footer.
+
+It watches the current session's tool calls for `skill` invocations and lists each skill that has been loaded, along with the time it was last loaded — so you always know which skills are active in your session.
+
+## Features
+
+- Shows every skill loaded in the current session in the sidebar
+- Displays the last load time (`HH:MM:SS`) for each skill
+- Collapsible section — click the `Skills` header to toggle
+- Auto-refreshes every 2 seconds
+
+## Installation
+
+Add the plugin to your OpenCode config (`opencode.json`):
+
+```json
+{
+  "$schema": "https://opencode.ai/config.json",
+  "plugin": ["opencode-skills-tracker-plugin"]
+}
+```
+
+OpenCode installs the package from npm automatically on next launch.
+
+## How it works
+
+The plugin registers a `sidebar_content` slot and scans the active session's
+message parts for completed/running `skill` tool calls. For each unique skill
+name it records the most recent start time and renders the list, sorted by most
+recently loaded.
+
+## License
+
+[MIT](./LICENSE)

package/package.json

@@ -0,0 +1,40 @@
+{
+  "$schema": "https://json.schemastore.org/package.json",
+  "name": "opencode-skills-tracker-plugin",
+  "version": "1.0.0",
+  "description": "An OpenCode TUI plugin that displays loaded skills with their load timestamps in the sidebar footer.",
+  "license": "MIT",
+  "type": "module",
+  "exports": {
+    "./tui": {
+      "default": "./tui.tsx"
+    }
+  },
+  "files": [
+    "tui.tsx",
+    "README.md",
+    "LICENSE"
+  ],
+  "sideEffects": false,
+  "scripts": {
+    "typecheck": "tsc -p tsconfig.json --noEmit"
+  },
+  "keywords": [
+    "opencode",
+    "plugin",
+    "tui",
+    "skills",
+    "tracker"
+  ],
+  "dependencies": {
+    "@opentui/solid": "^0.2.6",
+    "solid-js": "^1.9.12"
+  },
+  "devDependencies": {
+    "@opencode-ai/plugin": "1.14.46",
+    "@opentui/solid": "0.2.6",
+    "@types/node": "24.12.2",
+    "solid-js": "1.9.12",
+    "typescript": "6.0.3"
+  }
+}

package/tui.tsx

@@ -0,0 +1,130 @@
+/** @jsxImportSource @opentui/solid */
+
+import type { TuiPlugin, TuiPluginApi, TuiPluginModule } from "@opencode-ai/plugin/tui"
+import type { Part } from "@opencode-ai/sdk/v2"
+import { createSignal, For, onCleanup, Show } from "solid-js"
+
+const PLUGIN_ID = "opencode-skills-tracker-plugin"
+
+type TrackedSkill = {
+  name: string
+  loadedAt: number
+}
+
+const formatTime = (timestamp: number): string => {
+  const date = new Date(timestamp)
+  const hours = date.getHours().toString().padStart(2, "0")
+  const minutes = date.getMinutes().toString().padStart(2, "0")
+  const seconds = date.getSeconds().toString().padStart(2, "0")
+  return `${hours}:${minutes}:${seconds}`
+}
+
+const SkillsTracker = (props: { api: TuiPluginApi; sessionID: string }) => {
+  const [skills, setSkills] = createSignal<TrackedSkill[]>([])
+  const [collapsed, setCollapsed] = createSignal(false)
+
+  const extractSkillName = (part: Part): string | undefined => {
+    if (part.type !== "tool") return undefined
+    const state = part.state
+    if ("input" in state && state.input && typeof state.input === "object") {
+      const input = state.input as Record<string, unknown>
+      if (typeof input["name"] === "string") {
+        return input["name"]
+      }
+    }
+    return undefined
+  }
+
+  const getPartTimestamp = (part: Part): number => {
+    if (part.type !== "tool") return 0
+    const state = part.state
+    if (state.status === "completed" || state.status === "running" || state.status === "error") {
+      return state.time.start
+    }
+    return Date.now()
+  }
+
+  const processPartsForSkills = () => {
+    const messages = props.api.state.session.messages(props.sessionID)
+    const seen = new Map<string, number>()
+
+    for (const message of messages) {
+      const parts = props.api.state.part(message.id)
+      for (const part of parts) {
+        if (part.type === "tool" && part.tool === "skill") {
+          const skillName = extractSkillName(part)
+          if (skillName) {
+            const time = getPartTimestamp(part)
+            const existing = seen.get(skillName)
+            if (!existing || time > existing) {
+              seen.set(skillName, time)
+            }
+          }
+        }
+      }
+    }
+
+    const tracked: TrackedSkill[] = []
+    for (const [name, loadedAt] of seen) {
+      tracked.push({ name, loadedAt })
+    }
+    tracked.sort((a, b) => b.loadedAt - a.loadedAt)
+    setSkills(tracked)
+  }
+
+  const interval = setInterval(() => {
+    processPartsForSkills()
+    props.api.renderer.requestRender()
+  }, 2000)
+  processPartsForSkills()
+
+  onCleanup(() => {
+    clearInterval(interval)
+  })
+
+  const toggle = () => {
+    setCollapsed((v) => !v)
+    props.api.renderer.requestRender()
+  }
+
+  return (
+    <box flexDirection="column" gap={0} flexShrink={0}>
+      <box flexDirection="row" gap={0} onClick={toggle}>
+        <text fg={props.api.theme.current.text} bold>
+          {collapsed() ? "▶ " : "▼ "}
+        </text>
+        <text fg={props.api.theme.current.text} bold>{"Skills"}</text>
+      </box>
+      <Show when={!collapsed()}>
+        <For each={skills()}>
+          {(skill) => (
+            <box flexDirection="row" gap={1}>
+              <text fg={props.api.theme.current.accent}>{"• " + skill.name}</text>
+              <text fg={props.api.theme.current.textMuted}>{formatTime(skill.loadedAt)}</text>
+            </box>
+          )}
+        </For>
+        {skills().length === 0 && (
+          <text fg={props.api.theme.current.textMuted}>{"  no skills loaded"}</text>
+        )}
+      </Show>
+    </box>
+  )
+}
+
+const tui: TuiPlugin = async (api) => {
+  api.slots.register({
+    slots: {
+      sidebar_content(_ctx, props) {
+        return <SkillsTracker api={api} sessionID={props.session_id} />
+      },
+    },
+  })
+}
+
+const plugin: TuiPluginModule = {
+  id: PLUGIN_ID,
+  tui,
+}
+
+export default plugin