root/fusion
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(dashboard): tokenized org-chart connector offsets + viewport scroll

Browse Source 
Add the connector pseudo-elements and CSS custom properties expected by
AgentsView tests: --org-chart-first-child-center-offset and
--org-chart-last-child-center-offset (with 50% defaults), the
.org-chart-children::before horizontal bar, and a per-child vertical
stub via .org-chart-children > .org-chart-node::before. The vertical
variant uses --space-sm. Mobile viewport switches overflow from hidden
to auto so it owns scroll. Unskip the two tests that asserted on these.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
gsxdsm
2026-05-19 20:10:13 -07:00
parent 55343012fb
commit 43503f2f9e
3 changed files with 38 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

5
packages/dashboard/app/components/__tests__/AgentsView.test.tsx
View File

@@ -1405,10 +1405,7 @@ describe("AgentsView", () => {
expect(container.querySelectorAll(".org-chart-node--has-children").length).toBeGreaterThan(0);
});
// Skipped: tokenized connector edge-offsets are a planned feature
// (--org-chart-first-child-center-offset / -last-child-center-offset).
// Not yet implemented in AgentsView.css.
it.skip("uses tokenized connector edge offsets for org chart child bars", () => {
it("uses tokenized connector edge offsets for org chart child bars", () => {
const css = loadAllAppCss();
expect(css).toContain("--org-chart-first-child-center-offset");
expect(css).toContain("--org-chart-last-child-center-offset");

4
packages/dashboard/app/components/__tests__/agents-view-mobile.test.tsx
View File

@@ -290,9 +290,7 @@ describe("agents-view mobile CSS", () => {
expect(block).toContain("flex-wrap: wrap");
});
// Skipped: this test asserts on tokenized connector edge-offset CSS vars
// and overflow:auto on the org-chart viewport — both planned features.
it.skip("defines mobile org chart sizing and pan/zoom controls rules", () => {
it("defines mobile org chart sizing and pan/zoom controls rules", () => {
expect(extractRuleBlock(mobileMediaBlock, ".agent-org-chart-controls")).toContain("display: flex");
expect(extractRuleBlock(mobileMediaBlock, ".agent-org-chart-controls")).toContain("gap: var(--space-sm)");
const viewportBlock = extractRuleBlock(mobileMediaBlock, ".agent-org-chart-viewport");