dsh-panel-scroll: Add scrolling to DSH sidebar

Introduction

After using DeepSeek Harness (DSH) for a while, you might encounter two UI issues: the left panel list takes up as many lines as there are items; if there are many options, the “Workspace” at the bottom gets squeezed out of the window. The right sidebar has some tab content taller than the container, but it gets clipped by overflow: hidden/clip, so it’s invisible and unscrollable. Neither of these is a configuration item; the plugin registration interface only accepts id / order / label and no size parameters. The gusong1729/dsh-panel-scroll introduced below is a client-side plugin that directly patches these two gaps at the DOM level.

What is it

dsh-panel-scroll is maintained by gusong1729. It is categorized as a client-side plugin, acting as a small layout patch for the DSH Web/Desktop interface: the left panel list is capped at 4 rows, and the rest are scrolled out with the wheel; the right sidebar’s clipped content container is changed to be vertically scrollable. The repository address is https://github.com/gusong1729/dsh-panel-scroll, and the community directory page is https://www.skillhub.cn/plugins/gusong1729/dsh-panel-scroll . The license is MIT, and the version number in package.json is 0.2.4.

Core Features

  1. Left Panel List Capped: By default, only 4 rows are displayed (Learning / Plugins / Plugin Market / Automation Tasks, etc.), and the rest are scrolled out with the wheel. The “Workspace” moves up, and the session list shows a few more items.
  2. Right Sidebar No Longer Clips Content: For any container in the right sidebar where “content is taller than the box but clipped by overflow: hidden/clip”, change it to be vertically scrollable. Scrolling to the bottom allows you to see items that were originally out of reach.

Installation and Enablement

The README provides two installation methods. Method 1 is local directory, suitable for development or personal use; hand the absolute path of the plugin to dsh plugin add:

dsh plugin --profile <your profile> add /absolute/path/dsh-panel-scroll

Alternatively, in DSH, you can ask the agent to use plugin_manager’s install_bundle pointing to that directory. Method 2 is npm, marked in README as “if published”:

dsh plugin --profile <your profile> add dsh-panel-scroll

Regardless of the method, you must restart DSH once after installation for it to take effect, because client plugin code is loaded at startup.

Configuration

Configuration is entirely handled by localStorage. Refresh the page after changes; no restart is needed. There are two available keys:

Key Default Description
dsh-panel-scroll:rows 4 How many rows to display in the panel list, value 1–20. When set to 3, it counts the “Learning” row, making exactly 4 rows.
dsh-panel-scroll:unclog On Set to "off" to disable the right sidebar scroll fix, keeping only the left 4-row cap.

Change the value in DevTools Console and refresh:

localStorage['dsh-panel-scroll:rows'] = 3
location.reload()

How it Works

The approach for the left column is to register an invisible marker row in sidebar.panellist. Its DOM node must fall within the actual panel list. The plugin walks up from this anchor point to find “its own row” and “the row list”. The criterion is whether it has siblings with the same tag and class, rather than hardcoded class names. It then publishes a stylesheet rule max-height: N × row_gap. Here, stylesheets with !important are deliberately used instead of inline styles, because the shell’s re-rendering overwrites inline values.

The approach for the right column is to first ignore class names and locate the right column based on “the widest container stuck to the viewport’s right edge with height ≥ 70% of the viewport”. Then, scan its subtree: containers where content is taller than the box and clipped by hidden/clip are changed to overflow-y: auto. Additionally, it handles starting overflow—when using justify-content: flex-end/center or similar end or center alignment, extra content falls outside the container’s top boundary. scrollHeight isn’t counted, and no scrollTop can reach it, manifesting as “scrolling to the top doesn’t show the first item”. Such containers are often still overflow: visible, so this criterion is executed before the overflow check: if a child element is detected running above the container’s top boundary, the alignment is first changed to flex-start, allowing the overflow to become normal bottom overflow and become scrollable.

Applicable Scenarios and Notes

Suitable for those who keep multiple panels open in DSH for a long time, have long content in the right sidebar, and don’t want to modify the shell source code. You should check the source code and license before installing. Below are the known limitations listed in the README:

  1. Relies on the shell’s DOM structure. The plugin deliberately avoids class names (DSH uses CSS Module hashed class names), but if the shell changes the hierarchy, the plugin might become ineffective. Ineffectiveness appears as “no effect” and does not break the interface.
  2. Verified on dsh 0.2.1-rc.2, package.json declares dsh.engines.dsh as >=0.2.1-rc.2 <0.3.0.
  3. When the right sidebar is closed, the “strip stuck to the right” is the main area; therefore, the right sidebar rules also apply to the main area. Set dsh-panel-scroll:unclog to "off" if you don’t want this.
  4. The registered marker item’s label is empty and appears in the panel list’s “More” menu and accessibility tree as an empty item.
  5. The left cap logic doesn’t work when there are fewer than 2 panels, as there are no sibling rows to judge by.
  6. Containers with height less than 60px are not processed; the threshold is an area where the scrollbar is taller than the content, and fixing it makes it worse.
  7. When developing, changing client.js and refreshing the page is sufficient; restarting DSH is not needed.

Acceptance and Development

The plugin package is installed to the profile via link:, and related files are all in client.js. It exposes apply/inject via window.__ModuleLoader__.load({ id, factory }). Neither verification method requires installing into DSH:

node tests/smoke.mjs

This command loads client.js with a dependency-free smoke test and runs apply()/registration/destruction. The browser acceptance page tests/harness.html replicates the shell skeleton; opening it prints HARNESS PASS at the bottom. You can also run it with headless Edge and take a screenshot:

msedge --headless=new --disable-gpu --window-size=1400,900 \
  --screenshot=harness.png tests/harness.html

Uninstall

dsh plugin --profile <your profile> remove dsh-panel-scroll

Or turn off or uninstall dsh-panel-scroll on the Plugins page. All plugin effects go through injected stylesheets and added classes. When uninstalling, the stylesheet is removed, and added classes are cleared in dispose(), leaving no residue. The README mentions that versions 0.2.2 and earlier used inline styles, and the left column would remain capped until refresh after uninstall; this was fixed in 0.2.3.

Summary

The value of dsh-panel-scroll lies not in new features, but in patching two interface issues at the DOM level that have no configuration options available: left column capping scrolling and right sidebar unclipping. The change scope is small, and the rollback is clean. It is suitable for those who need a more compact panel list and want long content on the right to be scrollable. Directory page: https://www.skillhub.cn/plugins/gusong1729/dsh-panel-scroll , Source code: https://github.com/gusong1729/dsh-panel-scroll .

Note: The community directory is an independent site with no official affiliation to DeepSeek / Hypothesis, and is not an official app store.

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

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

Xiaoye