skills.rest
CHENHUI-X
CHENHUI-XCOMMUNITY
Explore all skills by this author →
WebsiteGitHub

hermes-desktop-plugins

Write JavaScript ESM plugins that add UI panes, commands, and statusbar items to the Hermes desktop app.

Updated Jul 3, 2026
Search Tags:#react#javascript#esm#hot reload#hermes#desktop plugins#ui panes
One-click install
npx skills add https://github.com/CHENHUI-X/toolbox --skill hermes-desktop-plugins-chenhui-x
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hermes-desktop-plugins
Source: https://github.com/CHENHUI-X/toolbox/tree/main/custom-skills/uncategorized/hermes-desktop-plugins
Command: npx skills add https://github.com/CHENHUI-X/toolbox --skill hermes-desktop-plugins-chenhui-x

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Extending the Hermes desktop app with custom UI normally requires modifying the application source code. This Skill lets you add panes, statusbar widgets, command-palette commands, keybinds, routes, and themes as standalone JavaScript files that the app loads and hot-reloads at runtime, with no build step or repo changes. ## Core Features & Use Cases - UI Contributions: Register layout panes with placement and docking hints, statusbar chips, command-palette commands, keybinds, sidebar navigation rows, and full routed pages. - Data and State Access: Query the gateway via JSON-RPC with host.request, subscribe to live events with host.onEvent, and use the app's shared React Query client and reactive atoms for state. - Plugin-Scoped Services: Ship your own i18n locale bundles, persist data with namespaced storage, and optionally call a Python backend through ctx.rest and ctx.socket scoped to /api/plugins/<id>. - Use Case: You want a dashboard pane showing live gateway session data docked below the conversation view. You create a plugin folder from the template, register a pane with a dock hint, and the app hot-reloads it into place within seconds. ## Quick Start Create a new Hermes desktop plugin from the template that adds a statusbar chip and a right-side pane, then reload desktop plugins from the command palette.

Frequently Asked Questions about hermes-desktop-plugins

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I create a desktop plugin for the Hermes app?▼

Create a folder under $HERMES_HOME/desktop-plugins/ matching your plugin id and place a plugin.js file inside based on the provided template. The file must default-export an object with id, name, and a register(ctx) function. The app watches the directory and hot-reloads the plugin within seconds of saving.

How do I add a custom pane to a desktop app layout?▼

Register an entry with area 'panes', a title, and a render function, then set data.placement to left, right, bottom, or main so the pane stacks with existing panes of that role. To dock on a specific edge, add a dock object naming a target pane and position, plus an explicit width or height.

Can I use JSX syntax in Hermes desktop plugins?▼

No, JSX syntax will not parse because plugin files load uncompiled as plain ESM. Use jsx() and jsxs() calls imported from react/jsx-runtime instead, and only import from @hermes/plugin-sdk, react, and react/jsx-runtime since other specifiers fail to resolve.

Why does my desktop plugin fail to load with a ReferenceError?▼

A ReferenceError at render usually means a component like StatusDot was used in a jsx() call but never imported from @hermes/plugin-sdk. Check that every identifier in your jsx calls appears in the import line, fix the file, and save to trigger a hot reload.

Can a desktop plugin have its own Python backend?▼

Yes, if the plugin ships a plugin_api.py under ~/.hermes/plugins/<id>/dashboard/ with a manifest declaring it, the frontend can reach it via ctx.rest and ctx.socket scoped to /api/plugins/<id>. Note that ctx.socket is a no-op on OAuth remotes, so keep a polling fallback.

Related Skills

Explore More Software Engineering Skills→
adikpbadikpb
1

hermes-desktop

Create Hermes skins and desktop plugins that theme surfaces and add UI panes.

Community
Intermediate
AtlasOmniaAtlasOmnia
115

hermes-desktop-plugins

Write JavaScript plugins that add UI panes, commands, and routes to the Hermes desktop app.

Community
Intermediate
patty-chowpatty-chow

hermes-desktop-plugins

Write JavaScript ESM plugins that add UI panes and commands to the Hermes desktop app.

Community
Intermediate
Impertio-StudioImpertio-Studio

shadcn-syntax-chart

Build shadcn Chart visualizations with theme-aware CSS variables and RSC-safe client boundaries.

Official
Advanced