Skip to content

Apply the workspace redesign to the sidebar and pane canvas - #61

Merged
BunsDev merged 5 commits into
mainfrom
feat/workspace-redesign
Aug 10, 2026
Merged

Apply the workspace redesign to the sidebar and pane canvas#61
BunsDev merged 5 commits into
mainfrom
feat/workspace-redesign

Conversation

@BunsDev

@BunsDev BunsDev commented Aug 10, 2026

Copy link
Copy Markdown
Member

Implements the Psyche Workspace Redesign in the macOS Tauri app, over the 2D pane tiling already on this branch.

The design ships as an interactive prototype plus ten spec boards covering the audit, tokens, component anatomy, the status matrix, the keyboard model and the responsive rules. This lands the sidebar and pane-canvas half of it.

The redesign

Tokens. The default theme now states the spec's neutral ramp (#0B0B0D → #1E1E24) and reserves violet for one job: marking where keyboard input goes. Selection became a neutral raised fill and status a worded chip, so the three signals that used to share one accent are finally distinct. The theme picker, vibrancy toggle and opacity slider keep working — the other five themes just restate their own ramp.

Session row. 44px, border-box. The leading glyph reports the lane's git state rather than duplicating the pane kind, which moves to the meta line beside the branch. Rows carry focus-set membership swatches — squares, so they can't be read as status dots — and the focused pane's row gets a violet bar layered over the neutral selection fill.

Pane frame. A 32px six-track header whose buttons never clip, with a span cycle (tiled → full column → full row) and a maximise/restore control. Panes degrade on their own width through container queries rather than the window's, dropping the meta line below 460px and the status word below 300px.

Focus sets. Multi-select from the + menu, a pick bar that exists only while picking, and a colour-coded subset that scopes the canvas. Clicking a member scopes to its set; the project header returns to all panes. Inside a set, × removes from the set rather than hiding the pane.

Focus mode + minimap. Maximise draws one pane and a 78px rail keeps the rest reachable. Esc restores the tiling.

Span, focus mode and set scoping are all derived layouts — spanLayout() and retainThreads() build them from the tiled tree without touching it. Leaving a mode restores exactly the tiling you had, and a pane opened or closed mid-mode lands in the tiling underneath.

Bugs found along the way

The first click on any pane-header button was swallowed. Focusing a pane on pointerdown re-rendered the canvas, which detaches and re-appends the panes — so the click target left the document before pointerup and no click fired. The close button had been special-cased for this; the guard now covers every header button. Caught in the browser, not in tests.

native/ was gitignored while 51 files under it were tracked. git add refused those files unless forced, and git add -A silently skipped every change to the desktop and iOS apps. Replaced with rules for what is actually generated (cargo's target, SwiftPM's .build, the Xcode derived-data path, Tauri's generated schemas). That ignore is also how editor.bundle.js came to be deleted from a working tree while index.html still had a script tag pointing at it — the app couldn't load its editor and git status had nothing to say about it. It's now tracked alongside its two siblings, with a test that fails if any bundle drifts from its sources.

Verification

  • Full suite 1496 passed, 3 failed — all three are the pre-existing release-signing failures (appStoreConnect, releaseWorkflow), which fail identically on a clean tree. Typecheck clean.
  • 57 tests added: spanLayout/retainThreads unit tests, span/maximise/set-scoping through the derived-root path, the container-query tiers, the row anatomy, the timed close confirm, and the bundle freshness check.
  • Driven live in headless Chromium with a stubbed Tauri bridge, no console errors: the 44px row, the six-track header (19px 698px 7px 22px 22px 22px), meta hiding at 363px, all buttons still visible at the 200px floor, span producing a full-height column, pick mode → create → scoped canvas → project header restoring all panes, and focus mode with a working minimap.
  • The freshness check was verified by breaking it three ways — a bundle edited in place, a source edited without rebuilding, and a referenced bundle deleted — and confirming each fails with a message naming the file and the fix.

Notes for review

🤖 Generated with Claude Code

BunsDev and others added 5 commits August 10, 2026 09:07
Two passes of the Psyche workspace redesign, covering the token layer, the
session row, the pane frame, focus sets and the focus-mode minimap.

Tokens. The default theme now states the spec's neutral ramp (#0B0B0D ->
goes. Selection became a neutral raised fill and status a worded chip, so
the three signals that used to share one accent are finally distinct. The
theme picker, vibrancy toggle and opacity slider keep working.

Session row. 44px, border-box. The leading glyph reports the lane's git
state rather than duplicating the pane kind, which moves to the meta line
beside the branch. Rows carry focus-set membership swatches -- squares, so
they cannot be read as status dots -- and the focused pane's row gets a
violet bar layered over the neutral selection fill.

Pane frame. A 32px six-track header whose buttons never clip, with a span
cycle (tiled -> full column -> full row) and a maximise/restore control.
Panes degrade on their own width through container queries instead of the
window's. Span, focus mode and set scoping are all derived layouts: none
of them edits the tiled tree, so leaving a mode restores exactly the
tiling you had, and a pane opened or closed mid-mode lands in the tiling
underneath.

Focus sets. Multi-select from the + menu, a pick bar that exists only
while picking, and a colour-coded subset that scopes the canvas. Clicking
a member scopes to its set; the project header returns to all panes.

Also fixes a latent bug: focusing a pane on pointerdown re-rendered the
canvas and detached the click target before pointerup, so the first click
on any pane-header button was swallowed. The close button had been
special-cased for this; the guard now covers every header button.

The pane header's retry button had already been dropped in this
checkout by concurrent work. That removal and its matching test update
overlap the header rewrite, so they are unavoidably part of this commit.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
native/ holds the macOS Tauri app and the iOS app, and 51 files under it
are tracked -- but the blanket `native/` rule meant git pruned the whole
directory during a worktree scan. Two consequences: `git add native/...`
refused tracked files unless forced, and `git add -A` silently skipped
every change in the desktop and iOS apps. Anyone committing here had to
know to reach for -f, and anyone who did not simply lost the change.

Replaced with rules for what is actually generated: cargo's target dir,
SwiftPM's .build, the Xcode derived-data path, and Tauri's generated
capability schemas, plus the usual Xcode user-state directories. The
tauri package's node_modules was already covered by the global rule.

Verified no tracked file became ignored, the 4.6G target tree and the
82M .build tree are still ignored, and `git add` now works unforced.

This surfaces two files the blanket rule had been hiding, both left
untracked pending a call on them: the tauri package's pnpm-lock.yaml,
and web/editor.bundle.js -- whose two siblings, sessions.bundle.js and
panes.bundle.js, are both tracked.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
native/macos/psyche-build-tauri is a pnpm workspace member and there is no
shared-workspace-lockfile override, so the root pnpm-lock.yaml is the one
pnpm reads -- it already carries an importer entry pinning every dependency
of the desktop app.

The lockfile sitting inside the member is a leftover from running
`pnpm install` in that directory. Nothing consumes it, nothing keeps it in
step with the root, and tracking it would offer a second and silently
drifting answer to which versions the desktop app builds against.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
index.html loads three bundles -- editor, sessions, panes -- but only two
were tracked. The odd one out was invisible to git, which is how it came to
be deleted from a working tree while index.html still had a script tag
pointing at it, leaving the app unable to load its editor with nothing in
`git status` to say why.

The blanket `native/` ignore is what hid the gap: the file could never have
shown up as untracked while that rule stood, so the inconsistency had no way
to surface. With that rule gone, tracking it restores the invariant that
everything index.html references is in the repo.

esbuild's output is deterministic here -- two consecutive `pnpm build:web`
runs produce byte-identical bundles -- so this does not add diff churn.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
The three web bundles are build output that lives in the repo, so nothing
stopped a commit landing with an edited source and a stale bundle beside it
-- the app would load last build's code and the diff would look right.

Rebuilds each bundle and compares bytes. The esbuild flags come from parsing
package.json's build:web rather than being restated here, so changing the
build cannot leave the check validating a command that no longer runs; the
rebuild simply follows it. Output goes to a temp dir, never over the tracked
bundle.

Also asserts every script index.html references exists on disk. That is the
failure the blanket `native/` ignore allowed: a referenced bundle was
deleted from a working tree with nothing in `git status` to show for it,
leaving the app unable to load its editor.

Verified by breaking it three ways -- a bundle edited in place, a source
edited without rebuilding, and a referenced bundle deleted -- and confirming
each fails with a message naming the file and the fix. Equal-length drift is
the usual shape, so the message reports the first differing byte rather than
just the size.

Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com>
Copilot AI lite review requested due to automatic review settings August 10, 2026 14:11
@vercel

vercel Bot commented Aug 10, 2026

Copy link
Copy Markdown

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

Project Deployment Actions Updated (UTC)
psyche-build-docs Ready Ready Preview Aug 10, 2026 2:11pm

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

Applies the Psyche Workspace Redesign to the macOS Tauri app’s sidebar session rail and the pane canvas, adding focus sets, pane spanning/maximize modes, and updated visual tokens while keeping the underlying tiling tree as the source-of-truth.

Changes:

  • Redesigns sidebar session rows (new row anatomy, git-state glyphs, membership swatches, timed close confirm) and pane chrome (six-track header, container-query tiers, focused styling).
  • Adds derived-layout helpers to the pane tree (retainThreads, spanLayout) and wires them into rendering/resizing for span/maximize/scoped views.
  • Adds a committed-bundle freshness test and updates ignore rules so tracked native/ changes are no longer silently skipped.

Reviewed changes

Copilot reviewed 10 out of 13 changed files in this pull request and generated 2 comments.

Show a summary per file
File Description
native/macos/psyche-build-tauri/web/styles.css Redesign tokens and UI styling for session rows, panes, focus sets, and minimap; adds container-query tiers.
native/macos/psyche-build-tauri/web/panes/pane-tree.mjs Adds derived tree transforms for focus-set scoping and span layouts.
native/macos/psyche-build-tauri/web/panes/pane-entry.js Re-exports new pane-tree helpers for bundling/consumers.
native/macos/psyche-build-tauri/web/panes.bundle.js Updates generated bundle output to include new pane-tree exports.
native/macos/psyche-build-tauri/web/main.js Implements focus sets, span/maximize modes, minimap, git-state glyphs, and timed close confirmation; integrates derived roots into rendering/resizing.
native/macos/psyche-build-tauri/web/index.html Adds a “Focus set — pick panes” entry to the New pane menu.
.gitignore Replaces blanket native/ ignore with specific build-output ignores; ignores nested pnpm lock in the Tauri member.
tests/tauriWebBundles.test.ts Adds a test to rebuild and byte-compare committed web bundles and verify index.html references exist.
tests/tauriPhysicalPanes.test.ts Updates tests for new minimums and adds coverage for span/focus/set-scoping behaviors and header interactions.
tests/tauriPaneTree.test.ts Adds unit tests for retainThreads and spanLayout.
tests/tauriCovenSessionSiderail.test.ts Updates session-rail tests for git-state glyphs, focus sets, and timed close confirm behavior.
tests/tauriCovenLaunch.test.ts Updates closeThread harness plumbing for focus-set cleanup hook.

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

Comment on lines +1848 to +1854
function toggleSetPick(threadId) {
if (!setPicking) return;
var at = setPicking.picked.indexOf(threadId);
if (at === -1) setPicking.picked.push(threadId);
else setPicking.picked.splice(at, 1);
refreshSidebar();
}
Comment on lines +3150 to +3152
.session-glyph.git-dirty { color: var(--warn); }
.session-glyph.git-staged { color: var(--ok); }
.session-glyph.git-clean { color: var(--muted); }
@BunsDev
BunsDev merged commit 9b3c418 into main Aug 10, 2026
4 checks passed
@BunsDev
BunsDev deleted the feat/workspace-redesign branch August 10, 2026 14:22
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants