T-ARPY-persist-pane-state

Status: closed/done · Impact: low · Complexity: medium

Goal

Remember pane widths and collapsed state across reloads, keyed per experience, so a user’s layout survives a restart. Today PaneGroup state is in-memory only. Start with localStorage, but keep the store behind a swappable adapter so a host can later point pane persistence at a single backend — keeping all pane state in one place rather than smeared across two systems.

Today

Location	Role today
packages/ts/panes/src/usePaneGroup.ts	Holds transient width/collapse state; accepts initial widths via config and emits changes, but persists nothing.
packages/ts/shell/app/layouts/default.vue	Hosts the pane group (T-E078-layout-host-pane-shell); has no persistence layer.

Proposed

A small persistence layer in the shell reads each region’s width + collapsed flag from a store adapter, feeds them into the layout-hosted PaneGroup as initial state, and writes changes back — keyed by experience id. The default adapter is localStorage. The adapter is a minimal interface (get/set a serialized snapshot per key), so a host can later swap it for another store (e.g. the settings surface / SettingsTransport) without touching the pane group — one store at a time, no data smeared across systems. @sksizer/panes stays storage-ignorant.

Approach

1. Define a minimal PanePersistenceStore interface — get(key): Snapshot | null and set(key, snapshot) — where a snapshot is the per-region widths + collapsed flags.
2. Ship a localStorage-backed default implementation.
3. Add a shell composable (usePanePersistence) that keys by experience id, hydrates the pane group’s initial widths/collapsed from the store, and writes changes back (debounced).
4. Wire it into the layout-hosted pane group; leave @sksizer/panes storage-free.

Files to touch

Location	Kind	Change
packages/ts/shell/app/composables/usePanePersistence.ts	new	store adapter interface + localStorage default + hydrate/persist
packages/ts/shell/app/layouts/default.vue	modify	key by experience; feed persisted state in, write changes back

Acceptance criteria

• AC-1: Pane widths and collapsed state restore after a reload, scoped to the experience where they were set.
• AC-2: Persistence goes through a PanePersistenceStore adapter with a localStorage default; swapping the adapter changes where state lives without touching PaneGroup.
• AC-3: @sksizer/panes gains no storage dependency.

Out of scope

• A non-localStorage adapter implementation (e.g. settings-backed) — the interface makes it a later drop-in.
• Cross-device sync.

Depends on

T-E078-layout-host-pane-shell, T-IMOO-pane-toggle-keybindings

---

← Back to Tasks