M5 ship infrastructure: icon, version, release script, README

- scripts/make-icon.py: generates a 1024x1024 source.png — dark
  rounded square + 2x2 tile grid with one active-blue tile and one
  broadcast-orange tile (matches the in-app accent colors).
  Regenerated all desktop icon sizes via 'pnpm tauri icon';
  pruned iOS/Android/UWP outputs.
- Version bump 0.0.1 -> 0.1.0 across package.json, Cargo.toml,
  tauri.conf.json. First real release.
- scripts/release.sh: takes vX.Y.Z, sanity-checks (clean tree,
  on main, in sync, tag matches package.json, installer exists,
  tag not already present), tags + pushes, uploads NSIS .exe to
  Forgejo via tea releases create --asset.
- README rewritten: Install section pointing at Forgejo releases,
  Using-it cheatsheet for all M2-M4 features (splits, broadcast,
  palette, etc.), Develop/Test/Release triplet for the WSL<->Windows
  workflow, icon regen instructions.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
megaproxy 2026-05-22 13:38:29 +01:00
parent b1412287be
commit dd1cf282e6
14 changed files with 270 additions and 59 deletions

127
README.md
View file

@ -1,75 +1,94 @@
# tiletopia
A Windows desktop app for running and arranging many WSL terminals at once. Built primarily to manage multiple `claude` sessions across projects in parallel, but works for any multi-shell workflow.
A Windows desktop app for running and arranging many WSL terminals at once. Built primarily for managing multiple `claude` sessions across projects in parallel; works for any multi-shell workflow.
Status: **early — single-pane M1 works**. Tiling layout (M2), workspace persistence (M3), and cross-pane orchestration (M4) are the next milestones. See `memory.md`.
- Tiling layout — recursive splits, draggable dividers, preset layouts (single / 2-col / 3-col / 2-row / 2×2)
- Per-pane distro + cwd + label, persisted across restarts
- Broadcast input to a group of panes
- Idle detection toasts when a pane goes quiet
- Ctrl+K palette to fuzzy-jump between panes
## Stack
## Install
- **Tauri 2** (Rust backend, WebView2 frontend) — small bundle, native Windows installer via NSIS.
- **Svelte 5** + TypeScript + Vite + pnpm.
- **xterm.js** + `@xterm/addon-fit` for terminal rendering.
- **`portable-pty`** (Rust crate) spawning `wsl.exe -d <distro>` PTYs.
1. Download the latest `tiletopia_<version>_x64-setup.exe` from the [releases page](https://git.rdx4.com/megaproxy/tiletopia/releases).
2. Run it. Windows SmartScreen will warn "unrecognized publisher" — it's not code-signed. **More info → Run anyway**.
3. Launch *tiletopia* from the Start menu. A window opens with one terminal pane bound to your default WSL distro.
## Run
### Requirements
This project targets Windows. Dev requires:
- **Windows 10/11** with [WebView2 Runtime](https://developer.microsoft.com/microsoft-edge/webview2/) (preinstalled on Windows 11; downloadable on Windows 10).
- At least one WSL distro registered (`wsl -l -v` lists them).
- Windows 10/11 + [WebView2 Runtime](https://developer.microsoft.com/microsoft-edge/webview2/) (preinstalled on Win11).
- [MSVC toolchain](https://v2.tauri.app/start/prerequisites/#windows) (VS Build Tools, "C++ build tools" workload).
- [Rust](https://rustup.rs/) on the Windows host.
- Node 20+ and pnpm (`corepack use pnpm@11.2.2`).
- WSL with at least one distro installed.
## Using it
**Location matters.** The source must live on a Windows-native drive (here: `D:\dev\tiletopia\`). Don't run pnpm against the `\\wsl.localhost\...` UNC path — pnpm 11.x crashes inside `isDriveExFat` and the actual error gets swallowed by the crashing error-hint formatter.
- **Split panes**`⇥` in the pane toolbar splits right, `⇣` splits down. New pane inherits the parent's distro + cwd.
- **Close pane**`×`. The sibling expands to fill.
- **Rename pane** — click the label in the toolbar, type, Enter.
- **Change distro** — click the small `Ubuntu ▾` chip; pick a distro from the popover. The pane respawns (old shell is killed).
- **Broadcast** — toggle `📡` on two or more panes (orange border). Typing in any of them mirrors to all.
- **Preset layouts** — titlebar buttons: `1` / `2H` / `3H` / `2V` / `2×2`.
- **Active pane** — click any pane → blue border + keyboard focus.
- **Jump to pane**`Ctrl+K` opens a fuzzy picker over label / distro / cwd. ↑/↓ to navigate, Enter to focus, Esc to close.
- **Idle toasts** — top-right notification appears when a pane goes quiet for 5s. Useful for "I started a long task; tell me when it's done."
From a Windows shell:
Layout + per-pane settings auto-save to `%APPDATA%\com.megaproxy.tiletopia\workspace.json` (debounced 500 ms).
## Develop
Develop the Rust + frontend code in WSL; **build and run on the Windows host** (Tauri targets Windows, Rust toolchain is Windows-side).
**Source location matters.** The project must live on a Windows-native drive (`D:\dev\tiletopia\`). Don't run pnpm against the `\\wsl.localhost\...` UNC path — pnpm 11.x crashes inside `isDriveExFat` (the actual error gets swallowed by the crashing error-hint formatter). The WSL-side symlink at `~/claude/projects/tiletopia` is for editing, not building.
### Prereqs (Windows host)
- Windows 10/11 + WebView2 Runtime
- [MSVC toolchain](https://v2.tauri.app/start/prerequisites/#windows) (VS Build Tools, "C++ build tools" workload)
- [Rust](https://rustup.rs/) on the Windows host
- Node 20+ and pnpm (`corepack use pnpm@11.2.2`)
### Build + iterate
```powershell
cd D:\dev\tiletopia
pnpm install
pnpm tauri dev # iterate
pnpm tauri dev # iterate — auto-reloads frontend on save, recompiles Rust on src-tauri changes
pnpm tauri build # NSIS installer at src-tauri\target\release\bundle\nsis\
```
The WSL-side symlink at `~/claude/projects/tiletopia` points here for in-WSL editing.
### Test (WSL)
## How it works (current state)
- **Backend (`src-tauri/src/pty.rs`):** a `PtyManager` holding a `Mutex<HashMap<PaneId, PaneHandle>>` of `portable-pty` children. Each spawned pane gets a background reader thread that emits `pane://{id}/data` events to the frontend (base64-encoded byte chunks). Counterparts: `write_to_pane`, `resize_pane`, `kill_pane`. Distro enumeration parses `wsl.exe -l -q` (UTF-16LE).
- **Frontend (`src/components/XtermPane.svelte`):** xterm.js + FitAddon mounted into a div. On mount, calls `spawn_pane`, subscribes to the pane's event stream, wires `term.onData``write_to_pane`, and uses a `ResizeObserver` to forward dimension changes to the PTY.
- **App (`src/App.svelte`):** titlebar with clickable distro buttons (auto-picks first non-docker-desktop distro; user can override). One XtermPane wrapped in `{#key selected}` so changing distro destroys + respawns the pane.
## Layout
```
tiletopia/
├── CLAUDE.md, memory.md, README.md
├── .gitignore, pnpm-workspace.yaml
├── package.json, vite.config.ts, svelte.config.js, tsconfig.json, tsconfig.node.json
├── index.html
├── src/
│ ├── main.ts # mounts App, imports xterm.css
│ ├── App.svelte # titlebar + one XtermPane (M1)
│ ├── styles.css
│ ├── ipc.ts # typed Tauri command wrappers
│ └── components/
│ └── XtermPane.svelte
└── src-tauri/
├── Cargo.toml, build.rs, tauri.conf.json
├── capabilities/default.json
├── icons/ # placeholder, copied from claude-usage-widget
└── src/
├── main.rs
├── lib.rs # tauri builder, registers commands, manages PtyManager
├── pty.rs # PtyManager + list_wsl_distros
└── commands.rs # #[tauri::command] surface
```sh
pnpm test # vitest, ~43 cases on the layout tree
pnpm test:watch # rerun on file change
pnpm check # svelte-check
```
## Known gotchas (today)
The test suite covers the pure tree helpers in `src/lib/layout/tree.ts`. UI behavior, broadcast routing, and Tauri integration are still manually tested.
- **Don't `pnpm install` from a UNC path** (`\\wsl.localhost\...`). pnpm 11.x crashes in its `isDriveExFat` probe; the underlying error gets swallowed.
- **Console flash on `wsl.exe -l -q`:** suppressed via the `CREATE_NO_WINDOW` flag in `pty.rs`. The PTY itself doesn't allocate a console (portable-pty uses ConPTY directly).
- **base64 wire format:** xterm.js emits `string` from `onData`; we UTF-8 encode then base64. Not the fastest; switch to typed-array event payloads later if throughput is an issue.
- **No icons of our own:** copied from `claude-usage-widget`. Replace before any release.
- **Cargo build only works on Windows host** — Rust toolchain isn't installed in WSL. `pnpm check` runs in WSL and validates the Svelte/TS side.
### Release
1. Bump version in `package.json`, `src-tauri/Cargo.toml`, `src-tauri/tauri.conf.json`. Commit + push.
2. On Windows: `pnpm tauri build` (produces `src-tauri\target\release\bundle\nsis\tiletopia_<ver>_x64-setup.exe`).
3. From WSL: `scripts/release.sh v0.1.0` — sanity-checks, tags `v0.1.0`, pushes the tag, and uploads the installer to Forgejo as a release via `tea`.
### Regenerate the icon
```sh
python3 scripts/make-icon.py
pnpm tauri icon src-tauri/icons/source.png
# Tauri's icon command writes iOS + Android + UWP outputs too; rm them.
rm -rf src-tauri/icons/{ios,android,Square*.png,StoreLogo.png,64x64.png,icon.png}
```
See `src-tauri/icons/README.md` for details.
## Architecture (quick tour)
- **Backend**`src-tauri/src/pty.rs`: `PtyManager` holding `Mutex<HashMap<PaneId, PaneHandle>>` of `portable-pty` children. Each spawned pane gets a background reader thread that emits `pane://{id}/data` events to the frontend (base64 chunks). Counterparts: `write_to_pane` / `resize_pane` / `kill_pane`. Workspace persistence via `save_workspace` / `load_workspace` writing to `app.path().app_config_dir()` with atomic tmp+rename.
- **Layout**`src/lib/layout/tree.ts`: binary tree of splits. `HSplit | VSplit` internal nodes with a ratio, `Leaf` at the bottom. Same model as i3 / tmux / Zellij — adaptive resize falls out of mutating one parent ratio. Pure helpers (`splitLeaf`, `closeLeaf`, `changeDistro`, etc.) live in `tree.ts`; the rendering chain (`Pane.svelte``SplitNode.svelte` / `LeafPane.svelte`) is thin.
- **Orchestration** — broadcast routing, idle detection, palette, active-pane focus all live in `App.svelte` and are bundled into a `PaneOps` interface (`src/lib/layout/ops.ts`) drilled through the Pane chain.
- **Stack precedent** — mirrors `~/claude/projects/claude-usage-widget/`: same Tauri 2 + Svelte 5 + Vite + pnpm + NSIS Forgejo-release toolchain.
## License
Personal project; no formal license yet.

View file

@ -35,14 +35,21 @@ Durable memory for this project. Read at session start, update before session en
- [x] ~~**Logic tests for `tree.ts`.**~~ Vitest, 43 cases, runs via `pnpm test`. Done 2026-05-22.
- [ ] **Component-level tests** (vitest + jsdom + @testing-library/svelte) — would have caught the M4 active-border reactivity bug. Useful when the Svelte component surface stops being trivial; defer until/unless something else goes sideways.
- [ ] **Multi-workspace tabs.** Several independent layouts the user can switch between. Saved as `workspaces.json` with `{ current: id, list: [{ id, name, tree }] }`. Not on the M0M5 critical path; either bolt on after M5 ship or fold into a "tabs" minor milestone.
- [ ] **M5 — Ship.** Replace placeholder icons, NSIS installer, Forgejo release. Copy `claude-usage-widget`'s release scripts.
- [ ] **M5 — Ship.** Replace placeholder icons, NSIS installer, Forgejo release. Copy `claude-usage-widget`'s release scripts.
- [x] ~~**M5 — Ship infrastructure.**~~ Custom icon, version bumped to 0.1.0, `scripts/release.sh` for one-shot tag+upload, README install section. Done 2026-05-22. **Next step (user action):** run `pnpm tauri build` on Windows then `scripts/release.sh v0.1.0` from WSL to cut the actual release.
- [ ] **Native Windows shells (cmd / pwsh)?** `portable-pty` supports them for free; keep the option open. Decide whether to expose in UI at M3.
- [ ] **Persistent scrollback across app restarts.** Would need an out-of-process mux daemon. Big scope creep; explicitly deferred past v1.
- [ ] **Keybinding philosophy.** Copy tmux, copy WezTerm, or invent? Decide at M3.
## Session log
### 2026-05-22 — M5 ship infrastructure
- New icon: `scripts/make-icon.py` (Pillow) draws a 1024×1024 dark rounded square with a 2×2 grid — one tile in the active-blue, one in the broadcast-orange, two muted. Mirrors the in-app `.leaf.active` / `.leaf.broadcasting` colors so the brand is consistent end-to-end.
- Generated the full icon set via `pnpm tauri icon src-tauri/icons/source.png`. Pruned the iOS/Android/UWP outputs Tauri also emits — kept only `32x32.png`, `128x128.png`, `128x128@2x.png`, `icon.icns`, `icon.ico`, `source.png` (mirrors widget's slim set).
- Version bump 0.0.1 → 0.1.0 across `package.json`, `src-tauri/Cargo.toml`, `src-tauri/tauri.conf.json`. First "real" release.
- `scripts/release.sh`: takes `vX.Y.Z`, sanity-checks (clean tree, on main, in sync with origin, package.json version matches tag, installer exists, tag doesn't already exist), tags + pushes, then `tea releases create --asset <installer>` to attach the NSIS .exe.
- README rewritten with `Install` section pointing at Forgejo releases, `Using it` cheatsheet for all the M2-M4 features, and a `Develop`/`Test`/`Release` triplet that documents the WSL↔Windows split.
### 2026-05-22 — Tests: vitest on tree.ts
- Added vitest 2.x as a devDep; `pnpm test` / `pnpm test:watch` scripts.

View file

@ -1,7 +1,7 @@
{
"name": "tiletopia",
"private": true,
"version": "0.0.1",
"version": "0.1.0",
"type": "module",
"scripts": {
"dev": "vite",

79
scripts/make-icon.py Normal file
View file

@ -0,0 +1,79 @@
"""
Regenerate src-tauri/icons/source.png dark rounded square + 2×2 tile grid
with one tile in the active-blue and one in the broadcast-orange. Matches
the running app's visual identity (the colors used for .leaf.active and
.leaf.broadcasting borders).
Run from the project root:
python3 scripts/make-icon.py
pnpm tauri icon src-tauri/icons/source.png # generates ico/icns/etc
"""
import sys
from pathlib import Path
try:
from PIL import Image, ImageDraw
except ImportError:
sys.stderr.write("Pillow not installed: pip install --user Pillow\n")
sys.exit(2)
SIZE = 1024
# Background: app's dark theme, slightly tinted blue
BG = (12, 14, 20, 255)
BG_RADIUS = 180
BG_PAD = 40
# Inner 2x2 grid
TILE_PAD = 170 # distance from outer edge to first tile
TILE_GAP = 36 # gap between tiles
TILE_RADIUS = 44 # rounded corner of each tile
# Tile colors — match tiletopia's UI accents
TILE_MUTED = (44, 48, 58, 255) # quiet tile (dark gray-blue)
TILE_ACTIVE = (90, 140, 216, 255) # .leaf.active blue
TILE_BCAST = (224, 152, 56, 255) # .leaf.broadcasting orange
def main(out: Path) -> None:
img = Image.new("RGBA", (SIZE, SIZE), (0, 0, 0, 0))
draw = ImageDraw.Draw(img)
# Outer rounded square (the app body)
draw.rounded_rectangle(
[BG_PAD, BG_PAD, SIZE - BG_PAD, SIZE - BG_PAD],
radius=BG_RADIUS,
fill=BG,
)
# 2x2 tile grid inside
inner_left = TILE_PAD
inner_top = TILE_PAD
inner_right = SIZE - TILE_PAD
inner_bottom = SIZE - TILE_PAD
tile_size = ((inner_right - inner_left) - TILE_GAP) // 2
positions = [
(inner_left, inner_top, TILE_ACTIVE), # TL: active
(inner_left + tile_size + TILE_GAP, inner_top, TILE_MUTED), # TR
(inner_left, inner_top + tile_size + TILE_GAP, TILE_MUTED), # BL
(inner_left + tile_size + TILE_GAP, # BR: broadcasting
inner_top + tile_size + TILE_GAP, TILE_BCAST),
]
for (x, y, color) in positions:
draw.rounded_rectangle(
[x, y, x + tile_size, y + tile_size],
radius=TILE_RADIUS,
fill=color,
)
out.parent.mkdir(parents=True, exist_ok=True)
img.save(out, "PNG")
print(f"wrote {out} {SIZE}x{SIZE}")
if __name__ == "__main__":
here = Path(__file__).resolve().parent.parent
main(here / "src-tauri" / "icons" / "source.png")

85
scripts/release.sh Normal file
View file

@ -0,0 +1,85 @@
#!/usr/bin/env bash
#
# Tag a release, find the most recent NSIS installer, and upload it to Forgejo.
#
# Prereqs:
# 1. You've bumped the version in package.json, src-tauri/Cargo.toml and
# src-tauri/tauri.conf.json and committed + pushed to origin/main.
# 2. You've run `pnpm tauri build` on the Windows host so the installer
# exists at src-tauri/target/release/bundle/nsis/*.exe.
# 3. `tea login list` shows the `rdx4` login is active.
#
# Usage:
# scripts/release.sh v0.1.0
#
set -euo pipefail
TAG="${1:-}"
if [[ -z "$TAG" ]]; then
echo "usage: $0 <vX.Y.Z>" >&2
exit 1
fi
if [[ ! "$TAG" =~ ^v[0-9]+\.[0-9]+\.[0-9]+$ ]]; then
echo "tag must look like v0.1.0 (got: $TAG)" >&2
exit 1
fi
cd "$(dirname "$0")/.."
# Sanity checks
if ! git diff --quiet || ! git diff --cached --quiet; then
echo "working tree dirty — commit or stash first" >&2
exit 1
fi
branch="$(git rev-parse --abbrev-ref HEAD)"
if [[ "$branch" != "main" ]]; then
echo "not on main (you're on '$branch') — bail" >&2
exit 1
fi
git fetch origin --quiet
if [[ "$(git rev-parse HEAD)" != "$(git rev-parse origin/main)" ]]; then
echo "HEAD is out of sync with origin/main — push or pull first" >&2
exit 1
fi
# Verify the tag's version matches package.json (catches "I forgot to bump")
pkg_version="$(node -p "require('./package.json').version" 2>/dev/null || true)"
expected_tag="v${pkg_version}"
if [[ "$TAG" != "$expected_tag" ]]; then
echo "package.json says version $pkg_version → expected tag $expected_tag, got $TAG" >&2
echo "bump package.json + src-tauri/Cargo.toml + src-tauri/tauri.conf.json first" >&2
exit 1
fi
# Find the installer
nsis_dir="src-tauri/target/release/bundle/nsis"
if [[ ! -d "$nsis_dir" ]]; then
echo "$nsis_dir not found — did you run 'pnpm tauri build' on Windows yet?" >&2
exit 1
fi
installer="$(ls -1t "$nsis_dir"/*-setup.exe 2>/dev/null | head -n1 || true)"
if [[ -z "$installer" || ! -f "$installer" ]]; then
echo "no *-setup.exe found in $nsis_dir" >&2
exit 1
fi
echo "Installer: $installer"
echo "Size: $(du -h "$installer" | cut -f1)"
# Tag and push
if git rev-parse "$TAG" >/dev/null 2>&1; then
echo "tag $TAG already exists locally — bail (delete it first if intentional)" >&2
exit 1
fi
git tag -a "$TAG" -m "Release $TAG"
git push origin "$TAG"
# Create the release with the installer attached
tea releases create \
--login rdx4 \
--tag "$TAG" \
--title "$TAG" \
--note "tiletopia $TAG. Download the .exe below, run it, accept SmartScreen (\"More info → Run anyway\") — installer isn't code-signed." \
--asset "$installer"
echo
echo "✓ released $TAG → https://git.rdx4.com/megaproxy/tiletopia/releases/tag/$TAG"

View file

@ -1,6 +1,6 @@
[package]
name = "tiletopia"
version = "0.0.1"
version = "0.1.0"
description = "Tiling multi-terminal manager for WSL"
authors = ["megaproxy"]
edition = "2021"

Binary file not shown.

Before

Width:  |  Height:  |  Size: 9.9 KiB

After

Width:  |  Height:  |  Size: 3.2 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 20 KiB

After

Width:  |  Height:  |  Size: 7.2 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.9 KiB

After

Width:  |  Height:  |  Size: 1,022 B

Before After
Before After

21
src-tauri/icons/README.md Normal file
View file

@ -0,0 +1,21 @@
# Icons
`source.png` — 1024×1024 master icon. Dark rounded square + 2×2 tile grid
with one tile in the active-blue and one in the broadcast-orange (matching
the in-app `.leaf.active` and `.leaf.broadcasting` border colors).
Generated by `../../scripts/make-icon.py`.
To regenerate every size + format Tauri's bundler needs:
```sh
python3 scripts/make-icon.py
pnpm tauri icon src-tauri/icons/source.png
```
That populates `32x32.png`, `128x128.png`, `128x128@2x.png`, `icon.icns`,
`icon.ico`, plus Android/iOS sizes (ignored — desktop only).
The generated icons are tracked in git so a clean clone can `pnpm tauri build`
without first running `tauri icon`.
To customize: edit `scripts/make-icon.py` (colors, layout) and rerun.

Binary file not shown.

Binary file not shown.

Before

Width:  |  Height:  |  Size: 836 B

After

Width:  |  Height:  |  Size: 14 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 22 KiB

After

Width:  |  Height:  |  Size: 9.1 KiB

Before After
Before After

View file

@ -1,7 +1,7 @@
{
"$schema": "https://schema.tauri.app/config/2",
"productName": "tiletopia",
"version": "0.0.1",
"version": "0.1.0",
"identifier": "com.megaproxy.tiletopia",
"build": {
"beforeDevCommand": "pnpm dev",