Add integrated terminal with PTY backend and xterm.js frontend (Vibe Kanban) (#2104)

* integrated terminal

* ci

* persist terminal

* Done! I've moved the TerminalPanelContainer from the main panel area to the right sidebar. Here's a summary of the changes:

- Added `isTerminalVisible: boolean` to global state (defaults to `true`)
- Added `toggleTerminal()` and `setTerminalVisible(value)` actions
- Added `isTerminalVisible` to the persisted state and the `useWorkspacePanelState` hook

- Imported `TerminalPanelContainer` and `useUiPreferencesStore`
- Restructured the component to always include a terminal section at the bottom (when not in create mode and `isTerminalVisible` is true)
- Dynamic flex ratios:
  - With upper content + terminal: flex-4 (content) / flex-2 (git) / flex-4 (terminal)
  - Without upper content + terminal: flex-3 (git) / flex-7 (terminal)
  - When terminal is hidden: original ratios preserved

- Removed the `TerminalPanelContainer` import
- Removed the TERMINAL case from the right main panel rendering

- Added `isTerminalVisible` to `ActionVisibilityContext` interface
- Updated `ToggleTerminalMode` action to use `toggleTerminal()` and check `isTerminalVisible`

- Added `isTerminalVisible` from `panelState` to the visibility context

The terminal now appears permanently at the bottom of the right sidebar (when visible), and the toggle button collapses/expands just the terminal section within the sidebar. The visibility state is persisted to localStorage.

* Frontend ESLint passes with no errors. The backend Rust error (`crates/utils/src/shell.rs:31`) is a pre-existing issue in the codebase, not related to my changes.

* `cargo check` passes now. The fix was adding `.to_path_buf()` to convert the `&Path` reference to an owned `PathBuf`.

* The code compiles. Done! I've added three environment variables in `crates/local-deployment/src/pty.rs:73-75`:

1. `ZDOTDIR=/nonexistent` - prevents zsh from loading `~/.zshrc`
2. `PS1="$ "` - sets the bash prompt
3. `PROMPT="$ "` - sets the zsh prompt

The terminal prompt will now show just `$ ` instead of `lkw@Louiss-MacBook-Pro vibe-kanban %`. Run `pnpm run dev:qa` and open the terminal panel to verify.

* Cleanup script changes for workspace 928e696e-5f40-4603-9227-798f0520e07f

* Done! The fix is simpler - using `cmd.arg("-f")` to tell zsh/bash to skip loading config files. This:

1. Removes the `ZDOTDIR=/nonexistent` that was causing errors
2. Adds `-f` flag which skips `.zshrc`/`.bashrc` loading
3. Keeps `PS1` and `PROMPT` env vars which will now be respected

Run `pnpm run dev:qa` and open the terminal to verify the prompt shows `$ `.

* Cleanup script changes for workspace 928e696e-5f40-4603-9227-798f0520e07f

* I've implemented the terminal theme integration. Here's a summary of the changes:

## Changes Made

**1. Created `frontend/src/utils/terminalTheme.ts`**
- `hslToHex()` function to convert HSL CSS variable format (`"210 40% 98%"`) to hex colors
- `getCssVariable()` helper to read CSS variables from the `.new-design` element
- `getTerminalTheme()` function that builds an xterm.js `ITheme` object from CSS variables:
  - Uses `--console-background` and `--console-foreground` for main colors
  - Uses `--console-success` and `--console-error` for green/red ANSI colors
  - Provides appropriate ANSI color palettes for both light and dark modes

**2. Updated `frontend/src/components/ui-new/terminal/XTermInstance.tsx`**
- Imported `useTheme` hook and `getTerminalTheme` utility
- Replaced hardcoded Tokyo Night theme with dynamic `getTerminalTheme()` call
- Added effect to update terminal theme when app theme changes (`terminal.options.theme = getTerminalTheme()`)

The terminal will now:
- Initialize with colors matching the current theme
- Automatically update colors when switching between light and dark mode
- Use the console color variables defined in `index.css`

* Cleanup script changes for workspace 928e696e-5f40-4603-9227-798f0520e07f

* Now I understand the issue clearly. Here are the relevant variables:

| Variable | Light Mode | Dark Mode | Purpose |
|----------|------------|-----------|---------|
| `--_primary` | `0 0% 5%` (dark) | `240 4.8% 95.9%` (light) | Button background - **inverted** |
| `--_console-background` | `0 0% 100%` (white) | `0 0% 0%` (black) | Terminal background - **correct** |
| `--_console-foreground` | `0 0% 5%` (dark) | `210 40% 98%` (light) | Terminal text - **correct** |
| `--bg-primary` | `0 0% 100%` (white) | `0 0% 13%` (dark gray) | Page background |

The code was changed to use `--primary` but that's the wrong variable. For the terminal, you should use:
- `--console-background` / `--_console-background` for the background
- `--console-foreground` / `--_console-foreground` for the text

Or if you prefer to match other UI elements:
- `--bg-primary` for background
- `--text-high` for foreground text

Which approach would you prefer? The original `--console-*` variables were specifically designed for terminal styling, or we can use `--bg-primary`/`--text-high` to match the general UI background.

* Cleanup script changes for workspace 928e696e-5f40-4603-9227-798f0520e07f

* Done. The terminal will now use `--bg-primary` for the background and `--text-high` for the foreground text. This means:

- **Light mode**: White background (`0 0% 100%`) with dark text (`0 0% 5%`)
- **Dark mode**: Dark gray background (`0 0% 13%`) with light text (`0 0% 96%`)

* Done. The terminal will now use `--bg-secondary` for the background and `--text-high` for the foreground text. This means:

- **Light mode**: Light gray background (`0 0% 95%`) with dark text (`0 0% 5%`)
- **Dark mode**: Darker gray background (`0 0% 11%`) with light text (`0 0% 96%`)

* Let me know if you find any issues during testing or need adjustments!

* Cleanup script changes for workspace 928e696e-5f40-4603-9227-798f0520e07f

* terminal

* sidebar cleanup

* fix chat collapse

Amp-Thread-ID: https://ampcode.com/threads/T-019bc754-8db9-712a-a915-58d74d210cad
Co-authored-by: Amp <amp@ampcode.com>

* for the terminal on windows we need to default to powershell if avalibale for the pty  (vibe-kanban 049dbf73)

only if powershell.exe cannot be resolved, we should use cmd.

* he colour theme used for the terminal ui isn't visible enough in light mode (vibe-kanban 5f50878a)

t I think we either don't override the ANSI colour mapping with our own, or it's not contrasted enough

* fmt

---------

Co-authored-by: Gabriel Gordon-Hall <ggordonhall@gmail.com>
Co-authored-by: Amp <amp@ampcode.com>
Co-authored-by: Solomon <abcpro11051@disroot.org>

frontend/package.json

@@ -79,7 +79,11 @@
     "tailwind-merge": "^2.2.0",
     "tailwind-scrollbar": "^3.1.0",
     "tailwindcss-animate": "^1.0.7",
+    "react-use-websocket": "^4.13.0",
     "vibe-kanban-web-companion": "^0.0.4",
+    "@xterm/addon-fit": "^0.10.0",
+    "@xterm/addon-web-links": "^0.11.0",
+    "@xterm/xterm": "^5.5.0",
     "wa-sqlite": "^1.0.0",
     "zustand": "^4.5.4"
   },