dsh-client-ui-pet: Adding a Q Desktop Pet Overlay to the DSH Web Interface

Preface

DSH supports extending the web interface via plugins. dsh-client-ui-pet is a DSH (DeepSeek Harness) Web GUI plugin that adds a Q pet desktop companion overlay to the page. It maps the current conversation’s activity status into expressions, actions, and dialogue bubbles for the Q-style character, providing intuitive status cues directly on the web page.

What This Is

dsh-client-ui-pet is maintained by qweqwe12382 and licensed under MIT. It is positioned as a Q pet desktop companion overlay for DeepSeek Harness web GUI.

The plugin is split into two halves:

  • Host (lib/index.js): A placeholder empty plugin responsible for attaching the composition rows to the profile, with no host behavior.
  • Browser (lib/client.js): Registers the Q pet desktop companion overlay in the shell.overlay slot, providing sprite frame animations, dialogue bubbles, and local preference persistence.

Core Features

The following confirmed capabilities are described:

  • Renders a Q-style character using a single sprite sheet frame animation.
  • Automatically switches expressions and actions based on the current conversation activity status.
  • Displays resting when idle; switches to corresponding status animations during thinking / reading / editing / working; celebrates upon task completion; shows frustration on errors.
  • Rotates through multiple dialogue bubble texts for each status.
  • Conversation activity is projected into a purely presentational state via the conversationViews private view; components consume only this projection and never touch the original conversation content.
  • Bubbles and animation frames come from the built-in sprite sheet; images are inlined as base64 into the bundle, with no static file routes.
  • Show/hide preferences are stored in browser localStorage under the key dsh.ui-pet.v1.
  • External dependencies are limited to react and @deepseek-ai/dsh-client-runtime/client.

Installation and Activation

The verified installation command is:

dsh plugin --profile web add github:qweqwe12382/dsh-client-ui-pet

After installation, restart DSH or wait for the composition hot-reload, then refresh the web page. Upon success, the Q pet will appear in the bottom-right corner of the page.

Typical Usage

  1. After installation, refresh the DSH web page and view the Q pet in the bottom-right corner.

  2. Observe the pet changing with conversation activity: resting when idle, switching to corresponding animations during thinking / reading / editing / working, showing celebration upon task completion, and displaying frustration on errors.

  3. Check the dialogue bubbles. Each status rotates through multiple texts, with both texts and animation frames sourced from the built-in sprite sheet.

  4. After toggling the show/hide preference, it will be saved in browser localStorage under dsh.ui-pet.v1.

Applicable Scenarios and Notes

Suitable for users who want to add visual feedback for conversation activity to the DSH Web GUI. It only provides presentational states and never touches the original conversation content.

Things to note before use:

  • The host half has no host behavior; primary capabilities reside in the browser half.
  • Images are inlined as base64 into the bundle, with no static file routes.
  • Preferences are stored in browser localStorage under the key dsh.ui-pet.v1.
  • External dependencies are limited to react and @deepseek-ai/dsh-client-runtime/client.
  • The plugin runs with the current dsh process permissions; review the source code and MIT license before installation.

Conclusion

The value of dsh-client-ui-pet lies in turning DSH conversation activity into readable status cues in the bottom-right corner of the page using a built-in set of sprite frame animations. Repository URL: https://github.com/qweqwe12382/dsh-client-ui-pet

羽毛球分组比赛记分
小程序二维码

欢迎使用《羽毛球分组比赛记分》微信小程序

Xiaoye