Home

2026-01-25 file selector all folders plan

File Selector 全フォルダ対応 実装計画

概要

Web UIの「File (optional)」ドロップダウンを、コマンドに関係なく開発フォルダ内のすべてのファイルを選べるように修正する。

現状

現在の実装では、コマンドごとに表示するフォルダが限定されている:

コマンド表示されるフォルダ
/plan実装/実装待ち, 実装/完了
/discuss検討中, 資料
/research検討中, 実装/実装待ち
その他ドロップダウン非表示

問題点: /plan 選択時に「アーカイブ」フォルダのファイルを参照したい場合など、目的のファイルが見つからない。

要件

  • すべてのコマンドでファイルセレクターを表示する
  • 開発フォルダ内のすべてのサブフォルダを対象にする
  • 優先順位の概念を廃止し、フォルダをアルファベット順(または固定順)で表示

変更方針

バックエンド変更

internal/handler/files.goDevFolders を拡張:

var DevFolders = []string{
    "実装/実装待ち",
    "実装/完了",
    "検討中",
    "資料",
    "アーカイブ",  // 追加
}

フロントエンド変更

web/index.html の変更点:

  1. COMMAND_FOLDER_PRIORITY の削除/変更 - すべてのフォルダを全コマンドで表示

  2. 条件分岐の削除 - if (COMMAND_FOLDER_PRIORITY[command]) を削除し、常にドロップダウンを表示

  3. 表示フォルダ順序の固定 - 全フォルダを固定順序で表示


バックエンド計画

変更ファイル一覧

ファイル変更内容
internal/handler/files.goDevFolders に「アーカイブ」を追加

実装ステップ

Step 1: DevFolders 拡張

internal/handler/files.goDevFolders 変数を変更:

変更前:

var DevFolders = []string{
    "実装/実装待ち",
    "実装/完了",
    "検討中",
    "資料",
}

変更後:

var DevFolders = []string{
    "実装/実装待ち",
    "実装/完了",
    "検討中",
    "資料",
    "アーカイブ",
}

フロントエンド計画

変更ファイル一覧

ファイル変更内容
web/index.htmlファイルセレクター表示ロジックの変更

実装ステップ

Step 1: COMMAND_FOLDER_PRIORITY を ALL_DEV_FOLDERS に変更

変更前:

const COMMAND_FOLDER_PRIORITY = {
    'plan': ['実装/実装待ち', '実装/完了'],
    'discuss': ['検討中', '資料'],
    'research': ['検討中', '実装/実装待ち']
};

変更後:

// 開発フォルダ内の全フォルダ(表示順)
// バックエンドの DevFolders と同じ順序
const ALL_DEV_FOLDERS = [
    '実装/実装待ち',
    '実装/完了',
    '検討中',
    '資料',
    'アーカイブ'
];

Step 2: updateFileDropdown 関数の変更

変更前:

function updateFileDropdown(files, command) {
    // ...
    const priorities = COMMAND_FOLDER_PRIORITY[command] || [];
    for (const folder of priorities) {
        // ...
    }
}

変更後:

function updateFileDropdown(files) {
    fileSelect.innerHTML = '<option value="">-- Select a file or type below --</option>';

    for (const folder of ALL_DEV_FOLDERS) {
        const folderFiles = files[folder] || [];
        if (folderFiles.length === 0) continue;

        const optgroup = document.createElement('optgroup');
        optgroup.label = folder;
        for (const file of folderFiles) {
            const option = document.createElement('option');
            option.value = file.path;
            option.textContent = file.name;
            optgroup.appendChild(option);
        }
        fileSelect.appendChild(optgroup);
    }
}

Step 3: onCommandChange 関数の変更

変更前:

async function onCommandChange() {
    const command = commandSelect.value;

    if (COMMAND_FOLDER_PRIORITY[command]) {
        fileSelectGroup.style.display = 'block';
        const project = document.getElementById('project').value.trim();
        if (project) {
            const data = await fetchDevFiles(project);
            if (data.success) {
                updateFileDropdown(data.files, command);
            }
        }
    } else {
        fileSelectGroup.style.display = 'none';
    }
}

変更後:

async function onCommandChange() {
    // 常にファイルセレクターを表示
    fileSelectGroup.style.display = 'block';
    const project = document.getElementById('project').value.trim();
    if (project) {
        const data = await fetchDevFiles(project);
        if (data.success) {
            updateFileDropdown(data.files);
        }
    }
}

注意事項

  • 初期化処理(ページロード時の onCommandChange() 呼び出し)は変更不要
  • // Command-folder priority mapping コメントも削除すること

テスト計画

手動テスト

  1. /plan コマンドを選択 → 5つのフォルダ全てが表示されることを確認
  2. /fullstack コマンドを選択 → 同様に5つのフォルダ全てが表示されることを確認
  3. /go コマンドを選択 → 同様に5つのフォルダ全てが表示されることを確認
  4. アーカイブフォルダのファイルを選択 → Argumentsに正しくパスが設定されることを確認

APIテスト

# アーカイブフォルダが含まれることを確認
curl "http://localhost:8080/api/files?project=/Users/user/Ghostrunner"

懸念点と対応

1. 既存のユーザー体験の変化

懸念: コマンドごとに関連フォルダだけを見せていた方がユーザーにとって便利だったかもしれない

対応: ユーザーの要望に従い、全フォルダを表示する。将来的に必要なら「お気に入り」「最近使用」などの機能を追加検討

2. フォルダ順序

懸念: どの順序でフォルダを表示するか

対応: バックエンドの DevFolders と同じ順序で表示(実装/実装待ち → 実装/完了 → 検討中 → 資料 → アーカイブ)

3. バックエンドとフロントエンドの同期

懸念: フォルダ名がバックエンドとフロントエンドで重複定義されている

対応: 既存設計を踏襲。コメントで「バックエンドの DevFolders と同期が必要」と明記


変更サマリー

箇所変更内容
バックエンドDevFolders に「アーカイブ」追加(1行追加)
フロントエンドCOMMAND_FOLDER_PRIORITYALL_DEV_FOLDERS に変更
フロントエンドonCommandChange の条件分岐削除(常に表示)
フロントエンドupdateFileDropdown の引数から command 削除

影響範囲: 軽微。既存機能の拡張のみ。


計画レビュー結果

レビュー日: 2026-01-25

結果: Critical な問題なし。実装に進んでよい。

Warning(軽微):

  1. Step 4 の記述が Step 2 と重複 → 「注意事項」に整理
  2. プロジェクトパス空の場合のエッジケース → 現状動作で問題なし(空ドロップダウン表示)
  3. 初期化動作について明記 → 計画書に追記済み

変更箇所サマリー(コード行番号付き)

ファイル行番号変更内容
internal/handler/files.go15-20行DevFolders に「アーカイブ」追加
web/index.html457-463行COMMAND_FOLDER_PRIORITYALL_DEV_FOLDERS に変更
web/index.html499-517行updateFileDropdown から command 引数削除
web/index.html520-535行onCommandChange の条件分岐削除
web/index.html529行updateFileDropdown 呼び出しから command 引数削除

バックエンド実装完了レポート

実装サマリー

  • 実装日: 2026-01-25
  • 変更ファイル数: 3 files

変更ファイル一覧

ファイル変更内容
internal/handler/files.goDevFolders 変数に「アーカイブ」フォルダを追加(1行追加)
docs/BACKEND_API.mdスキャン対象フォルダ一覧とレスポンス例に「アーカイブ」を追加
internal/handler/doc.goスキャン対象フォルダ一覧とレスポンス例に「アーカイブ」を追加

実装内容の詳細

1. internal/handler/files.go (15-21行)

var DevFolders = []string{
    "実装/実装待ち",
    "実装/完了",
    "検討中",
    "資料",
    "アーカイブ",  // 追加
}

計画書通り、DevFolders スライスに「アーカイブ」を追加。

2. docs/BACKEND_API.md

Files API のスキャン対象フォルダ一覧とレスポンス例に「アーカイブ」を追加。

3. internal/handler/doc.go

パッケージドキュメントのスキャン対象フォルダ一覧とレスポンス例に「アーカイブ」を追加。

計画からの変更点

特になし。計画書通りの実装。

実装時の課題

特になし。

レビュー結果

項目結果
Criticalなし
Warningなし
go buildPASS
go vetPASS
go fmtPASS

動作確認フロー

1. バックエンドサーバーを起動
   cd /Users/user/Ghostrunner && go run ./cmd/server

2. Files API を呼び出し
   curl "http://localhost:8080/api/files?project=/Users/user/Ghostrunner"

3. レスポンスに「アーカイブ」フォルダが含まれることを確認
   - "アーカイブ": [...] がレスポンスJSONに存在すること

残存する懸念点

特になし。

次のステップ

フロントエンド実装(web/index.html の変更)を実施する。


フロントエンド実装完了レポート

実装サマリー

  • 実装日: 2026-01-25
  • 変更ファイル数: 1 file

変更ファイル一覧

ファイル変更内容
web/index.htmlファイルセレクター表示ロジックの変更(全フォルダ対応)

実装内容の詳細

1. COMMAND_FOLDER_PRIORITYALL_DEV_FOLDERS に変更 (457-465行)

変更前:

const COMMAND_FOLDER_PRIORITY = {
    'plan': ['実装/実装待ち', '実装/完了'],
    'discuss': ['検討中', '資料'],
    'research': ['検討中', '実装/実装待ち']
};

変更後:

// All development folders (display order)
// Must be synchronized with backend DevFolders in internal/handler/files.go
const ALL_DEV_FOLDERS = [
    '実装/実装待ち',
    '実装/完了',
    '検討中',
    '資料',
    'アーカイブ'
];

2. updateFileDropdown 関数の変更 (500-518行)

  • command 引数を削除
  • COMMAND_FOLDER_PRIORITY[command] の参照を ALL_DEV_FOLDERS に変更
  • 全フォルダを固定順序で表示するように変更

3. onCommandChange 関数の変更 (520-531行)

  • if (COMMAND_FOLDER_PRIORITY[command]) の条件分岐を削除
  • 常に fileSelectGroup.style.display = 'block' を実行
  • updateFileDropdown 呼び出しから command 引数を削除

計画からの変更点

特になし。計画書通りの実装。

実装時の課題

特になし。

レビュー結果

項目結果
Criticalなし
Warningなし

動作確認フロー

1. Ghost Runner Web UI を開く
   http://localhost:8080/

2. 任意のコマンドを選択(/plan, /fullstack, /go など)

3. 「File (optional)」ドロップダウンが表示されることを確認

4. ドロップダウン内に以下の5フォルダが全て表示されることを確認:
   - 実装/実装待ち
   - 実装/完了
   - 検討中
   - 資料
   - アーカイブ

5. 別のコマンドに切り替えても同じ5フォルダが表示されることを確認

6. アーカイブフォルダ内のファイルを選択し、
   Arguments に正しくパスが設定されることを確認

残存する懸念点

特になし。

デプロイ後の確認事項

  • 本番環境で全コマンドでファイルセレクターが表示されること
  • アーカイブフォルダのファイルが選択・参照できること