feat: Remember panel state per workspace (Vibe Kanban) (#2064)

* I've successfully implemented workspace-specific panel state persistence. Here's a summary of the changes:

## Summary

### Changes Made

1. **`frontend/src/stores/useUiPreferencesStore.ts`**
   - Added `WorkspacePanelState` type to track `rightMainPanelMode` and `isLeftMainPanelVisible` per workspace
   - Added `workspacePanelStates: Record<string, WorkspacePanelState>` to store state keyed by workspace ID
   - Updated `toggleLeftMainPanel`, `toggleRightMainPanelMode`, `setRightMainPanelMode`, and `setLeftMainPanelVisible` to accept an optional `workspaceId` parameter
   - Added `getWorkspacePanelState` and `setWorkspacePanelState` actions
   - Added `useWorkspacePanelState(workspaceId)` hook for easy consumption
   - Updated `partialize` to persist `workspacePanelStates` to localStorage

2. **`frontend/src/components/ui-new/containers/WorkspacesLayout.tsx`**
   - Changed from using `useUiPreferencesStore` directly to using `useWorkspacePanelState(workspaceId)` hook
   - Panel state is now workspace-specific

3. **`frontend/src/components/ui-new/actions/useActionVisibility.ts`**
   - Updated to use `useWorkspacePanelState` for visibility context

4. **`frontend/src/components/ui-new/actions/index.ts`**
   - Updated `ToggleLeftMainPanel`, `ToggleChangesMode`, `ToggleLogsMode`, `TogglePreviewMode`, and `ToggleDevServer` actions to pass `currentWorkspaceId` when toggling panel modes

### Scope

**Workspace-specific:**
- `rightMainPanelMode` - Which panel (Preview/Changes/Logs) is open
- `isLeftMainPanelVisible` - Whether the chat panel is visible

**Stays global:**
- `isLeftSidebarVisible` - Workspace list sidebar (navigation element)
- `isRightSidebarVisible` - Git/Settings sidebar (global actions)
- Panel sizes (already work correctly)

### Testing

Verified the feature works:
1. Opened Preview panel in Workspace A
2. Navigated to Workspace B → Preview panel is closed (default state)
3. Navigated back to Workspace A → Preview panel is still open ✓

* Cleanup script changes for workspace c8b73e59-ac41-4c0f-be78-7b6499d514f9

* The refactoring is complete. Let me provide a summary of the changes:

## Summary

Refactored `useUiPreferencesStore.ts` to remove duplicate code paths for workspace-specific panel state:

### Changes Made

1. **`frontend/src/stores/useUiPreferencesStore.ts`**
   - Removed legacy global state (`isLeftMainPanelVisible`, `rightMainPanelMode`) from State type and initialization
   - Simplified 4 panel state actions by removing `else` branches for legacy behavior:
     - `toggleLeftMainPanel` - now early-returns if no workspaceId
     - `toggleRightMainPanelMode` - simplified to single set() call
     - `setRightMainPanelMode` - simplified to single set() call
     - `setLeftMainPanelVisible` - simplified
   - Removed `resetForCreateMode` action (was only setting legacy state)
   - Removed unused `useIsRightMainPanelVisible` hook

2. **`frontend/src/contexts/WorkspaceContext.tsx`**
   - Removed the `useEffect` that called `resetForCreateMode()` on create mode
   - Removed unused `useUiPreferencesStore` import

3. **`frontend/src/contexts/LogsPanelContext.tsx`**
   - Updated to use `useWorkspacePanelState` with workspace ID from context

4. **`frontend/src/components/ui-new/containers/SessionChatBoxContainer.tsx`**
   - Updated to use `useWorkspacePanelState` with workspace ID

### Impact

- **~50 lines removed** from the codebase
- **Cleaner code** - no more `if (workspaceId) ... else ...` branching in every action
- **Same behavior** - all callers were already passing workspaceId

* Cleanup script changes for workspace c8b73e59-ac41-4c0f-be78-7b6499d514f9
This commit is contained in:
Louis Knight-Webb
2026-01-15 12:29:17 +00:00
committed by GitHub
parent 1e8783331c
commit e1b0ef70a4
7 changed files with 273 additions and 101 deletions

View File

@@ -29,7 +29,7 @@ import {
type ExecutionStatus,
} from '../primitives/SessionChatBox';
import {
useUiPreferencesStore,
useWorkspacePanelState,
RIGHT_MAIN_PANEL_MODES,
} from '@/stores/useUiPreferencesStore';
import { Actions, type ActionDefinition } from '../actions';
@@ -102,7 +102,8 @@ export function SessionChatBoxContainer({
const { executeAction } = useActions();
const actionCtx = useActionVisibilityContext();
const { rightMainPanelMode, setRightMainPanelMode } = useUiPreferencesStore();
const { rightMainPanelMode, setRightMainPanelMode } =
useWorkspacePanelState(workspaceId);
const handleViewCode = useCallback(() => {
setRightMainPanelMode(