Introduction¶

The upper part of DSH’s left sidebar features a block: the orca-link skin’s animation, followed by the “Overall Panel” list (Plugin / Task Board / Skill Center / Agent / Git / SSH / More). The list is fixed at 7 items; when content becomes long, the sidebar consumes significant vertical space, pushing the workspace down.

Common modifications are to directly collapse the entire column or change the skin style. The former is a one-size-fits-all approach, requiring another click to expand; the latter modifies the skin file, where the animation stage’s margin-top is easily deleted by mistake, pushing the workspace up to cover the animation. The asdw159632/dsh-panellist-collapse introduced below takes the third path: inserting a very thin collapse strip after the list, which only hides extra rows when collapsed and only reduces height, leaving the animation position completely unmoved.

What is this¶

A local harness plugin bundle, package name @local/dsh-panellist-collapse, maintainer asdw159632, classified as client. The Host side is an empty apply(), the Client side implements all logic: the collapse bar’s DOM, collapse styles, body attribute synchronization, locale dictionary, and using MutationObserver to maintain the injected node position.

The only problem solved is: the sidebar’s “Overall Panel” list is too long, requiring an expand/collapse entry, with the button placed above the “Workspace”, and when collapsed it should not move the skin animation above it.

Core Features¶

The collapse target is not the list container, but the rows inside the list. When collapsing, only the first KEEP_ROWS rows are kept, default is 1 row, meaning only the “Plugin” button remains; the other 6 rows are hidden. The list container and its margin-top remain completely unmoved.

The collapse strip is inserted after the panel list and before the workspace. This position has no official slot, so DOM insertion plus MutationObserver observing document.body is used: automatically re-inserted back if the host re-renders and removes the node, and self-insertion does not trigger a no-change loop.

Keeping the list’s margin-top is the most critical point of this plugin. The orca-link skin’s animation stage relies on this list margin for positioning:

margin-top: calc(var(--orca-stage) - 116px)

If display:none is used to collapse the list, the margin is also deleted, the animation stage collapses, and the workspace pushes up to cover the animation. Therefore, collapse uses height: 0 + overflow: hidden to reduce height, keeping the margin, so the animation stays in place.

The collapse state is written to localStorage['dsh.panellist.collapsed'], persisting after refresh or restart. Text is registered via the Client locale service for zh / en, with tooltips being “Collapse Panel List” and “Expand Panel List”. Under the sidebar narrow bar (rail) mode, the list is inherently invisible, so the collapse strip automatically hides after judging the list width.

To only show a few buttons, modify the constants at the top of client.js, refresh the page to take effect:

const KEEP_ROWS = 1; // 1 = Only "Plugin"; 2 = Plugin + Task Board; 3 = Add Skill Center

Directory Content¶

Runtime-related fields in package.json:

"dsh": {
  "bundle": { "patch": "./cordis.patch.yml" },
  "client": {
    "platform": "web",
    "immediately": true,
    "inject": ["@deepseek-ai/dsh-client-ui-sidebar"]
  }
}

Installation and Enablement¶

The installation and uninstallation commands provided in the README are as follows. Note that here target fills the absolute path of this repository directory, not the repository name:

plugin_manager install_bundle target="<absolute path of this repo directory>"
plugin_manager remove_bundle target="@local/dsh-panellist-collapse"

The local directory uses pnpm link. After modifying client.js, refresh the page to take effect, no need to reinstall.

After installation, check two points according to verification records in README: one is plugin_manager install_bundle returns application: applied, warnings: [], and include:panellist-collapse appears in the Host combination; the other is in the browser, the collapse strip falls below the “More” row and above the workspace title, with a centered arrow.

Typical Usage¶

README records a real test on 2026-10-29, Host 0.2.1-rc.3, Skin orca-link, accessing http://127.0.0.1:1344:

1. Click the collapse strip, only keep “Plugin” row, others hidden;
2. Animation stays in place, workspace is immediately below the remaining row;
3. Click expand again, layout fully restores;
4. Collapse state persists after refresh, console has no errors from this plugin.

Daily usage doesn’t require code changes. The default behavior is to keep only “Plugin” row after collapsing. To add more items, modify KEEP_ROWS, change to 2 for “Plugin + Task Board”, change to 3 to add “Skill Center”, and so on.

Implementation Pitfalls¶

The iteration record in README lists four points, listed here in order of discovery for easy review and secondary development to avoid pitfalls.

1. Button Position: The initial version hung on the sidebar bottom extension slot sidebar.footer.action, feedback said the position was wrong and too far from the list; meanwhile the initial version used display:none to collapse, deleting the list margin together, causing the animation stage to collapse. Later the button was moved between the list and the workspace, and the collapse method was changed to height:0 + overflow:hidden to preserve the margin.
2. Collapse Target: [data-slot="sidebar.panellist"] is the seat for each panel item, hiding it only drops the icon and text remains, it is not the list container. The collapse target was changed to [class*="panelList"].
3. Nav Selector: nav[role="navigation"] did not match, “navigation” is the implicit role of <nav>, not an attribute on the element. Both the selector and findNav() were changed to the existing [class*="panelList"], with a fallback using [data-dsh-surface="sidebar"] nav.
4. Node Removed by Re-render: The host DOM re-render might delete the injected node, so MutationObserver was used to observe document.body, and if the collapse strip is not found after the list, it is re-inserted.

Applicable Scenarios and Notes¶

Suitable for situations where the skin places content relying on list margin at the top of the sidebar, while the panel list items are many and the sidebar vertical space is tight. Directly collapsing the whole column or changing skin style is not suitable.

Three points to note:

1. Depends on Host DOM Structure. Selectors use semantic fragments ([class*="panelList"], [data-dsh-surface="sidebar"], nav), no hash prefix, but if the upstream significantly adjusts the sidebar structure, you need to change a selector line. Switching other skins does not affect position; the collapse strip follows the list.
2. Animation Not Under Its Control. Collapsing or expanding will not change the animation’s style or position, this is a design goal, not an oversight.
3. Plugin runs with current dsh process permissions. Before installation, open the repository to confirm source content and confirm the license (this repository is MIT, Copyright (c) 2026 asdw159632). Additionally, this repository is an independent copy released from the dev workspace DSH-custom/mods/sidebar-panellist-collapse/, and changes follow this repository.

Conclusion¶

The value of this plugin lies not in the number of features, but in a boundary being handled cleanly: collapsing the panel list without touching the skin animation stage. For people with tight sidebar vertical space who don’t want to modify skin files, this is a lightweight solution to install locally and customize kept items by changing one constant line.

• Directory: https://www.skillhub.cn/plugins/asdw159632/dsh-panellist-collapse
• GitHub: https://github.com/asdw159632/dsh-panellist-collapse