test(hub-ui): cover collapsed edge logo positions

[dvcolomban]

Background (Why)

Collapsed edge docks need explicit visual fixtures for both vertical positions. The logo orientation fix is already on main in 0.9.12, but the existing Storybook coverage only exercised the bottom edge.

Changes (What)

Add CollapsedLeft and CollapsedRight stories through a shared collapsed-edge story helper. The existing bottom fixture remains available as CollapsedIdle, and the floating Minimized story continues to cover the upright floating logo.

Verification (Testing)

ESLint and the @devframes/hub-ui typecheck pass. The Storybook production build completes and includes both new stories. Matched browser checks against the parent of the logo fix show the left and right logo wrapper changing from a 270-degree transform to no transform; the floating minimized logo remains upright.

[coldtea-pr-lens]

◈ PR Lens

🟢 +0 new · 🟠 ~1 changed · 🔴 -0 removed · 0 flows · 1 file · commit 05a9efe

Architecture

1 component touched across 3 lanes.

Open full size

Data flow

No data-flow sequence changed in this PR.

Drill down

Client Runtimes ＆ UI — 1 component

🟡 CHANGED Dock UI ＆ Web Component

Provides the dock container, edge positioning, and collapsible toolbars for devframe tools.

• packages/hub-ui/src/client/components/dock/DockEdge.stories.ts:75-105

View

• Architecture lens
• Data flow lens
• Expand every detail
• Show unchanged neighbours

Tip

Run PR Lens on your own machine: npx skills add coldteadotai/pr-lens installs the agent skill. Then tell your coding agent: "Diagram the change you just made with PR Lens and attach it to the pull request."

🪧 More tips

• Draw a diff before it is even a pull request: npx @coldtea/pr-lens-cli analyze --base origin/main reads the diff with your own model key, and npx @coldtea/pr-lens-cli render .pr-lens/graph.json draws the same lenses on your machine.
• The boxes under View are live. Tick Architecture lens or Data flow lens to choose which diagrams appear, or Expand every detail to open every drill-down at once. The comment redraws in place a few seconds later.
• Show unchanged neighbours lists the components this change did not touch alongside the ones it did, so the drill-down shows what the changed code sits next to.
• GitHub will not let you zoom an image in a comment. The link under each diagram opens it full size on a page of its own, where you can.
• The CLI's render picks up .github/pr-lens.yml automatically and applies your corrections (renames, exclusions, lane pins) at draw time.
• Would you rather run it from CI on a key of your own? Add .github/workflows/pr-lens.yml with coldteadotai/pr-lens/packages/action@v0 and a model key in your repository secrets, say GEMINI_API_KEY. The Action asks Gemini by default, or OpenAI and any endpoint speaking /chat/completions through its provider input.
• PR Lens is free for open source. A star on the repository is what keeps it going.
• Push a new commit and the whole comment re-renders for the new head. An older run never overwrites a newer one, so a slow render cannot put a stale diagram back.
• The diagrams follow your GitHub theme, so dark mode gets the dark render and light mode the light one, and the moving dots show this pull request's data in motion.

---

◈ Rendered by PR Lens · crafted with ❤️ by the Coldtea team · Come say hi on Discord

[vercel]

The latest updates on your projects. Learn more about Vercel for GitHub.

1 Skipped Deployment

Project	Deployment	Actions	Updated
devframe	Skipped		Sep 5, 2026 2:05pm UTC

[Copilot]

🟢 Approval recommended

The change is isolated to Storybook stories and cleanly expands fixture coverage without affecting runtime code paths.

Pull request overview

Adds Storybook visual fixtures for collapsed edge docks on the left and right positions, strengthening regression coverage for the dock-edge logo orientation behavior in @devframes/hub-ui.

Changes:

• Introduced a shared collapsedEdgeStory() helper for edge-mode “idle-collapsed” fixtures.
• Refactored the existing CollapsedIdle story to use the helper.
• Added new CollapsedLeft and CollapsedRight stories to cover both vertical dock-edge positions.

File summaries

File	Description
packages/hub-ui/src/client/components/dock/DockEdge.stories.ts	Refactors collapsed-edge Storybook setup into a helper and adds left/right collapsed fixtures for visual coverage.

Review details

• Files reviewed: 1/1 changed files
• Comments generated: 0
• Review effort level: Lite

---

💡 Add a code-review agent skill or configure MCP servers for context-aware, tailored reviews. Learn more in the docs.