Louis Knight-Webb 572e9706e5 Prevent WorkspacesSidebar re-render on workspace switch (Vibe Kanban) (#1973) ...

* The refactoring is complete. Here's a summary of what was changed:

## Summary

**File modified:** `vibe-kanban/frontend/src/components/ui-new/containers/WorkspacesLayout.tsx`

**Change:** Restructured `renderContent()` so that `WorkspacesSidebar` is rendered **outside** the `ExecutionProcessesProvider`.

### Before:
```tsx
<ExecutionProcessesProvider key={`${selectedWorkspace?.id}-${selectedSessionId}`}>
  <ReviewProvider>
    <Allotment>
      <Allotment.Pane>{renderSidebar()}</Allotment.Pane>  // Inside provider
      <Allotment.Pane>...</Allotment.Pane>
      <Allotment.Pane>...</Allotment.Pane>
      <Allotment.Pane>...</Allotment.Pane>
    </Allotment>
  </ReviewProvider>
</ExecutionProcessesProvider>
```

### After:
```tsx
<Allotment>
  <Allotment.Pane>{renderSidebar()}</Allotment.Pane>  // OUTSIDE provider - won't remount

  <ExecutionProcessesProvider key={`${selectedWorkspace?.id}-${selectedSessionId}`}>
    <ReviewProvider>
      <>
        <Allotment.Pane>...</Allotment.Pane>
        <Allotment.Pane>...</Allotment.Pane>
        <Allotment.Pane>...</Allotment.Pane>
      </>
    </ReviewProvider>
  </ExecutionProcessesProvider>
</Allotment>
```

**Result:** When switching workspaces, the `ExecutionProcessesProvider`'s key changes, which unmounts/remounts only panes 2-4. The sidebar pane stays mounted and won't re-render unnecessarily.

* The implementation is complete. Here's a summary of what was changed:

## Summary

**File modified:** `vibe-kanban/frontend/src/components/ui-new/containers/WorkspacesLayout.tsx`

### Changes:

1. **Created nested Allotments structure:**
   - **Outer Allotment** (2 panes): Sidebar + Content container
   - **Inner Allotment** (3 panes): Main + Changes/Logs + Git Panel

2. **Separated resize handlers:**
   - `handleOuterPaneResize`: Handles sidebar width only
   - `handleInnerPaneResize`: Handles main, changes/logs, and git panel widths

3. **Removed old `handlePaneResize`** which was designed for the flat 4-pane structure

### Result:
```
Outer Allotment
├── Sidebar Pane (OUTSIDE providers - won't remount)
└── Content Pane
    └── ExecutionProcessesProvider (keyed)
        └── ReviewProvider
            └── Inner Allotment
                ├── Main Pane
                ├── Changes/Logs Pane
                └── Git Panel Pane
```

Now when switching workspaces:
- The `ExecutionProcessesProvider` with its key will remount the inner Allotment (ensuring clean state)
- The sidebar stays mounted because it's outside the keyed provider
- Layout looks the same as before (sidebar on left, 3 panes on right)

2026-01-12 17:14:48 +00:00

..

public

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

src

Prevent WorkspacesSidebar re-render on workspace switch (Vibe Kanban) (#1973)

2026-01-12 17:14:48 +00:00

.eslintrc.cjs

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

.prettierrc.json

…

CLAUDE.md

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

components.json

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

components.legacy.json

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

index.html

…

package.json

chore: bump version to 0.0.149

2026-01-12 16:57:54 +00:00

postcss.config.cjs

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

tailwind.legacy.config.js

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

tailwind.new.config.js

fix hash render in diff file names in the workspaces UI (#1864)

2026-01-09 07:49:23 +01:00

tsconfig.json

…

tsconfig.node.json

…

vite.config.ts

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00

vite.config.ts.timestamp-1767510231763-e5a8246a3d225.mjs

Workspaces FE (#1733)

2026-01-08 22:14:38 +00:00