picoclaw/todo/TASKS-4.md
dj-oyu 81a8abf1f2 docs: split CLAUDE.md tasks into parallel todo tracks
Extract all unimplemented design plans and tasks from CLAUDE.md into
5 independent todo files, each targeting a separate branch for parallel
implementation:

- TASKS-1: Memory & Performance Optimization
- TASKS-2: Subagent Orchestration (Container Model)
- TASKS-3: Session DAG (SQLite Store)
- TASKS-4: Mini App & Static Serving
- TASKS-5: Heartbeat Worktree Management

CLAUDE.md now retains only implemented references, coding guidelines,
and a summary table linking to each todo file.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
2026-03-04 21:20:50 +09:00

2.4 KiB

TASKS-4: Mini App & Static Serving

Mini App のフロントエンド改善。バックエンドの変更に依存しない。

現状

pkg/miniapp/static/
  index.html   ← すべての JS/CSS をインライン
  map.js       ← オーケストレーションルーム描画

Go 側: //go:embed static/index.html static/map.js + 個別ルートで配信。


タスク一覧

1. Static file serving の汎用化

個別ルート (serveIndex, serveMapJS) を http.FileServer(http.FS(staticFS)) に統合。

やること:

  • //go:embed static でディレクトリごと embed
  • /miniapp/ 以下を http.FileServer で一括配信
  • 新規ファイル追加時にルート登録が不要になる
  • serveIndexORCH_ENABLED 注入は text/template に移行

対象ファイル: pkg/miniapp/handler.go


2. バンドラ導入 (Vite / esbuild)

inline JS/CSS を外部ファイルに分離し、ビルドステップで bundle する。

やること:

  • pkg/miniapp/frontend/ に source を配置
  • esbuild (軽量、Go 製) でビルド → pkg/miniapp/static/dist/ に出力
  • Go 側は //go:embed static/dist で embed
  • ORCH_ENABLED はビルド時の環境変数注入 (define) で対応
  • Makefile / go:generate でビルドステップを統合

検討事項:

  • esbuild は Go 製でクロスコンパイル環境に影響しない
  • Vite は機能豊富だが Node.js 依存が増える

3. Log viewer のフロントエンドテスト

renderLogs() (index.html 内の inline JS) のテストが皆無。 Fields 表示バグが検出されずに ship された前科あり。

やること:

  • index.html から JS を外部ファイルに抽出 (タスク 2 と連動)
  • renderLogs(), renderFields() 等の unit test を追加
  • DOM 操作のテストは jsdom (vitest) or happy-dom
  • CI で pnpm test を実行

最低限のテストケース:

  • メッセージの正常レンダリング
  • Fields の表示 (空/1件/複数件)
  • サニタイズ (XSS 防止)
  • ログのフィルタリング・ページネーション

完了基準

  • 新規 JS/CSS ファイルの追加がルート登録なしで配信される
  • ORCH_ENABLED の注入がテンプレートまたはビルド時変数で動作
  • renderLogs() のユニットテストが CI で実行される
  • go build ./... が変わらず動作 (embed パスの整合性)