mpckit/pull-requests/m4-app-shell/m4-app-shell.md

M4: app shell

Branch: m4-app-shell → main

What changed

• Wails v3.1.0 app (latest stable; the plan said 3.0.0). It needs Go 1.26, so go.mod now says go 1.26.0.
  • main.go: one 1280×860 window (minimum 760×600) with the mockup's background colour, the app.Service, and the embedded frontend/dist.
  • Taskfile.yml and build/ come from wails3 init -t svelte, without the Android, iOS and Docker parts. build/config.yml names the product mpckit, (c) 2026 bajdev, "Not affiliated with Akai Professional"; the Windows version info was regenerated from it. Icons are still the Wails defaults (M9).
• internal/app: the Wails service (build plan 4.6, 5). For M4: New(), State(), Version(), About(). State holds the project name, the dirty flag, all 128 pads (label A01…H16, sample, tuning, mute group, has-notes), the sequences, counts, and the device limits (mute groups 0–16, BPM 20–999, tuning ±24/±90) so the UI never hard-codes them. Version is set with -ldflags (M9) and is dev until then.
• Frontend (Svelte 5 + TypeScript + Vite), following the mockup:
  • Title row with About; project name; New / Load / Export zip / Export to folder; Pads and Sequences tabs.
  • Each tab has bank buttons A–H with per-bank counts, the 4×4 grid (pad 1 bottom-left), a settings panel for the selected slot, and a footer with counts.
  • lib/store.svelte.ts holds the Go state (replaced after each call) and UI-only state (tab, bank, selection, About).
  • Components: BankBar, SlotGrid (shared by both tabs), PadPanel, SequencePanel, AboutModal.
  • The About modal shows version, licence, the repo link (opens in the system browser) and the no-affiliation note. It closes with Escape, the Close button or a click outside.
  • Fonts (Inter, Space Grotesk, IBM Plex Mono, all OFL) come from @fontsource packages, so the app needs no network.
• Bindings in frontend/bindings, generated by wails3 generate bindings -ts -i (regenerated on every build).
• frontend/dist/.gitkeep is committed so go build / go test ./... work in a fresh clone (main.go embeds dist). A small Vite plugin puts it back after each build.
• README: development setup (Go 1.26, Node LTS, wails3, wails3 dev). The build plan's Wails version and setup lines are updated.

What works in M4 and what doesn't yet

Working: data comes from Go (State() on start, New() from the New button); tabs (click or arrow keys); bank switching; selecting pads and sequence slots; the settings panels showing the selected slot's values; About.

Shown but disabled until their milestone, with a note in each panel: Load, Export (M5/M8), the name field, all pad controls (M5/M6), all sequence controls (M7).

Testing

On the server:

• go vet and go test pass for all Go packages. internal/app has tests for the new-project state, its JSON shape and About.
• The main package vets and builds for Windows (GOOS=windows, an 18 MB mpckit.exe), and vets for Linux and macOS with -tags purego.

Not tested on the server: it has no Node.js, so the frontend has not been built, type-checked (svelte-check) or seen running. Please check on the laptop:

1. wails3 doctor is happy; wails3 dev builds and opens a window titled mpckit (the first run does npm install).
2. The page matches the mockup's layout and colours. Project name "NewKit"; footer "0 of 128 samples", "1 of 128 sequences".
3. Pads tab: bank A selected, 16 empty pads with A01 at bottom-left and A16 at top-right; clicking a pad moves the orange outline and the settings panel shows "This pad is empty". Bank buttons switch banks.
4. Sequences tab: A01 shows "Sequence 01", "128 · 2 bars". Selecting it shows name, BPM 128, 2 bars. Empty slots show "No sequence in this slot".
5. About opens and closes (Escape, Close, click outside); the repo link opens your browser.
6. New resets the state (no visible change on a new project, but there should be no error).
7. npm run check in frontend (svelte-check) reports no errors.

Please send screenshots or errors. Anything wrong in the Svelte side I'll fix on this branch.