Preface

DeepSeek Harness (DSH) is an agent development environment based on a plugin architecture. During long debugging sessions or while running an Agent, the lack of visual state feedback can reduce the work experience. dsh-client-ui-pet is a client-side desktop pet plugin for this system. It injects a draggable desktop pet into the bottom-right corner of the interface. Inspired by the Codex Pets design, it uses state following and a light nurturing system to provide developers with a companion-style interaction experience.

Core Features

Codex-Style State Companionship

The plugin uses MutationObserver to listen for DOM changes in the Harness Web UI, detects real activity signals, and switches pet actions:

  • typing: When typing in [data-composer-seat] or textarea, the pet watches the keyboard.
  • thinking: When [data-state="running"] or a stop-generation button appears, it enters a thinking state.
  • working: When [data-streaming] is detected, it enters a busy state.
  • done: When generation finishes, a celebration animation is triggered, mood +2, intimacy +1.
  • error: When [data-error] is detected, it enters a worried state, mood -3.
  • sleep: When idle for longer than the configured time, it falls asleep and Zzz particles appear; any activity or interaction wakes the pet.

Light Nurturing System

The pet has independent data storage:

  • Mood: 0–100 points, slowly decays over time, and can be restored through interaction. When below 30, it actively seeks attention.
  • Intimacy: 0–100 points, only increases and never decreases, recording the bond built from working together.
  • Interaction statistics: Records the number of petting, feeding, and playing actions.
  • Data storage: All nurturing data is saved only in the browser’s localStorage.

User-Customizable Interface

Click the gear button in the pet toolbar to open the settings panel, which includes 5 tabs:

  1. Pet: Select a built-in or custom pet. Supports corner positioning, reset, or hiding.
  2. Appearance: Set a nickname, adjust body size, and change colors using a color picker (not supported in some modes).
  3. Behavior: Control state following, bubble messages, particle effects, and the auto-sleep switch (options: 1/3/5/10 minutes).
  4. Nurturing: View progress bars for mood and intimacy as well as interaction statistics. Supports resetting data.
  5. Studio: Import/export custom pet definition JSON.

The pet can be dragged directly, and WCAG 2.2-compatible alternative operations are also provided (corner buttons, keyboard Enter/Space for petting).

JPG Main-Image Pet (Raster Mode)

Do not want to use hand-drawn SVG? The plugin supports using JPG/PNG/WebP as the pet’s main image. The engine overlays state animations on the image (breathing, nodding, bouncing, etc.). Bubbles, particles, and the nurturing system are shared.

  • Limitation: JPG main images do not support color changing; other appearance options remain available.
  • Sources: Supports Base64, HTTP/HTTPS URLs, or same-origin paths starting with /.
  • Creation: Use the make-raster-pet.py script to remove the background, compress, and generate a definition.

Full Developer Customization: dshPetDefinition

Through the dshPetDefinition JSON object, developers can fully customize the pet’s actions, behaviors, and presentation. The definition supports SVG drawing, CSS keyframe animations, state machine configuration, and custom triggers. Built-in triggers include activity:typing, activity:done, interaction:pet, and more. Custom triggers can also be invoked via window.dshPet.trigger("your:custom-trigger").

Installation and Enablement

This plugin is a standard dsh.client dual-part package (the Host side is an empty Loader; the Browser side injects the UI).

Edit <DSH_HOME>/profiles/web/package.json and add the dependency and bundle configuration:

{
  "dependencies": {
    "dsh-client-ui-pet": "file:D:/Softwares/CodeSoftWares/Agents/dsh-client-ui-pet"
  },
  "dsh": {
    "profile": {
      "bundles": [
        "@deepseek-ai/dsh-base",
        "@deepseek-ai/dsh-web-app",
        "dsh-client-ui-pet"
      ]
    }
  }
}

After installing the dependency, restart DeepSeek Harness Web (or simply refresh already-open pages).

Method B: Manually insert a Loader line

  1. Copy the plugin directory to <DSH_HOME>/profiles/web/node_modules/dsh-client-ui-pet.
  2. Edit <DSH_HOME>/profiles/web/cordis.patch.yml:
- insert:
    - id: ui-pet
      name: 'dsh-client-ui-pet'
      config:
        enabled: true
  1. Refresh the Harness Web page.

Verification: A DeepSeek whale girl appears in the bottom-right corner. Clicking pets it. Hovering reveals the toolbar. The gear opens the settings panel.

Typical Usage

  1. Drag and interact: Hold the pet to drag it to any position on the screen. Click the petting, feeding, or playing buttons to interact.
  2. Custom pet: In the “Studio” tab of the settings panel, paste a JSON definition and import the custom pet.
  3. Raster pet: Place an image in the assets/<petid>/ directory, use the script to generate a definition and embed it, or reference it by URL.

Notes

  • Privacy and security: This is a pure browser-side plugin. It does not read API keys, does not modify model inputs, and does not upload any data. All data is saved only in local localStorage.
  • JPG limitation: JPG-format main images do not support the color-changing feature.
  • Host updates: If the Host-side code is updated, restart Harness Web for new configurations to take effect.

Summary

dsh-client-ui-pet provides visual state feedback and companionship features for DeepSeek Harness. It does not depend on backend data, runs entirely locally in the browser, and supports highly customizable development. Whether using the built-in whale girl or creating a custom pet through the developer API, it can enhance the work experience in the DSH environment.

Plugin catalog page | GitHub repository