mcpField
T
transcript-viewer

transcript-viewer

github.com/rysweetエージェントワークフロー7667 回インストール21 週間前に更新
リポジトリ

transcript-viewer について

transcript-viewerは、Claude CodeとGitHub Copilot CLIのセッション記録を閲覧するスキルです。開発者が現在や過去の会話を確認し、バックグラウンドエージェントの出力を調べたり、MarkdownまたはHTMLで表示したりできます。

主な機能

  1. 01Claude CodeとCopilot CLIの検出
  2. 02現在または指定した記録の表示
  3. 03バックグラウンドエージェント出力の閲覧
  4. 04日付範囲によるセッション絞り込み
  5. 05MarkdownまたはHTMLでの表示

活用シーン

  1. 01現在のコーディングセッションの確認
  2. 02セッションIDによる記録の検索
  3. 03バックグラウンドエージェント出力の確認
  4. 04期間を指定したセッションの絞り込み

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/rysweet/amplihack --skill transcript-viewer

インストール後、Claude Code で/transcript-viewerを入力して読み込まれたか確認します。

同梱ファイルtests/test_transcript_viewer.sh

詳細

トランスクリプトビューアースキル

目的

このスキルは、サポート対象の2つのツールのセッショントランスクリプトを変換し、閲覧できるようにします。

  • Claude Code — ~/.claude/projects/ に自動保存される JSONL ログ
  • GitHub Copilot CLI — ~/.copilot/session-state/*/events.jsonl に自動保存される JSONL ログ

次の4つの閲覧モードを提供します。

  1. 現在のセッション — アクティブなセッションのトランスクリプトを表示します
  2. 特定のセッション — ID を指定してセッションを表示します
  3. エージェントの出力 — サブエージェントが生成したバックグラウンドタスクの出力ファイルを表示します
  4. すべてのセッション — 日付範囲で絞り込むオプションを使って、プロジェクトのすべてのセッションを閲覧します

ツールコンテキストの自動検出

閲覧する前に、アクティブなツールを検出してデフォルトのログパスを設定します。 ディレクトリによる検出のほうが信頼性が高いため、こちらを優先します。ディレクトリが存在しない場合は、 src/amplihack/hooks/launcher_detector.py の環境変数を使用します。

# Primary: directory-based detection (most reliable)
if [[ -d "$HOME/.copilot/session-state" ]]; then
  # Check if there are any sessions present
  COPILOT_SESSIONS=$(ls -d "$HOME/.copilot/session-state/"*/ 2>/dev/null | wc -l)
  CLAUDE_SESSIONS=$(ls "$HOME/.claude/projects/"*/*.jsonl 2>/dev/null | wc -l)
  if [[ "$COPILOT_SESSIONS" -gt 0 && "$CLAUDE_SESSIONS" -eq 0 ]]; then
    TOOL_CONTEXT="copilot"
    DEFAULT_LOG_DIR="$HOME/.copilot/session-state"
  elif [[ "$CLAUDE_SESSIONS" -gt 0 ]]; then
    TOOL_CONTEXT="claude-code"
    DEFAULT_LOG_DIR="$HOME/.claude/projects"
  else
    # Both dirs exist but empty — use env vars to decide
    TOOL_CONTEXT="claude-code"
    DEFAULT_LOG_DIR="$HOME/.claude/projects"
  fi
elif [[ -d "$HOME/.claude/projects" ]]; then
  TOOL_CONTEXT="claude-code"
  DEFAULT_LOG_DIR="$HOME/.claude/projects"
# Fallback: env var detection (same vars as launcher_detector.py)
elif [[ -n "${CLAUDE_CODE_SESSION:-}${CLAUDE_SESSION_ID:-}${ANTHROPIC_API_KEY:-}" ]]; then
  TOOL_CONTEXT="claude-code"
  DEFAULT_LOG_DIR="$HOME/.claude/projects"
elif [[ -n "${GITHUB_COPILOT_TOKEN:-}${COPILOT_SESSION:-}" ]]; then
  # Note: GITHUB_TOKEN is intentionally excluded — it's too generic and
  # appears in non-Copilot CI contexts, causing false positives.
  TOOL_CONTEXT="copilot"
  DEFAULT_LOG_DIR="$HOME/.copilot/session-state"
else
  # Default to claude-code — safe fallback (most users)
  TOOL_CONTEXT="claude-code"
  DEFAULT_LOG_DIR="$HOME/.claude/projects"
fi

~/.copilot/session-state/ と ~/.claude/projects/ の両方にセッションがある場合は、ユーザーに選択肢を提示します。「Claude Code と GitHub Copilot CLI の両方のセッションが見つかりました。 どちらを閲覧しますか? [1] Claude Code [2] GitHub Copilot CLI」

ユーザーはいつでも明示的なパスを指定して上書きできます。

ログ形式の自動検出

ファイルパスが指定された場合は、処理する前に形式を検出します。

detect_log_format() {
  local file="$1"
  if [[ "$file" == *.jsonl ]]; then
    echo "jsonl"
  elif [[ "$file" == *.md ]]; then
    # Check for Copilot /share export signature — specific header only
    # Note: do NOT match on "/share" alone (too generic — appears in docs, READMEs)
    if grep -q "Copilot Session Export\|copilot-session" "$file" 2>/dev/null; then
      echo "copilot-markdown"
    else
      echo "markdown"
    fi
  elif [[ "$file" == *.log ]]; then
    # .log files may be plain text or agent JSONL; check content
    local first_char
    first_char=$(head -c 1 "$file" 2>/dev/null)
    if [[ "$first_char" == "{" ]]; then
      echo "jsonl"
    else
      echo "plain-log"
    fi
  else
    # Inspect first byte for other extensions
    local first_char
    first_char=$(head -c 1 "$file" 2>/dev/null)
    if [[ "$first_char" == "{" ]]; then
      echo "jsonl"
    else
      echo "unknown"
    fi
  fi
}
形式ハンドラー
jsonlclaude-code-log に渡します
copilot-markdownインラインで表示します(すでに読み取り可能な Markdown です)
markdownインラインで表示します
unknown警告を表示して生データを表示します

ツールの検出

コマンドを実行する前に、claude-code-log が利用可能か確認します。

# Step 1: direct install check
which claude-code-log 2>/dev/null

# Step 2: npx fallback
npx --yes claude-code-log --version 2>/dev/null

解決されたコマンドを CCL に設定します。

if which claude-code-log &>/dev/null; then
  CCL="claude-code-log"
elif npx --yes claude-code-log --version &>/dev/null 2>&1; then
  CCL="npx claude-code-log"
else
  CCL=""
fi
ツールが見つからない場合 — エラーを適切に処理する

CCL が空の場合は、このメッセージを表示して停止します。

claude-code-log is not installed.

To install it globally:
  npm install -g claude-code-log

Or run without installing (requires npx):
  npx claude-code-log --help

After installing, retry your request.

自動でインストールしようとしないでください。

モード

モード1:現在のセッション

トリガーフレーズ:「view current transcript」、「show my current session」、「current log」

実行内容:

Claude Code(TOOL_CONTEXT="claude-code")の場合:

  1. ~/.claude/projects/ 以下で、最終更新日時が最も新しい JSONL ファイルを探します。
    ls -t ~/.claude/projects/*/*.jsonl 2>/dev/null | head -1
    
  2. 次を実行します。
    $CCL <path-to-jsonl> --format markdown
    
  3. Markdown 出力をインラインで表示します。

GitHub Copilot CLI(TOOL_CONTEXT="copilot")の場合:

  1. ~/.copilot/session-state/ 以下で、最終更新日時が最も新しいセッションディレクトリを探します。
    ls -dt ~/.copilot/session-state/*/ 2>/dev/null | head -1
    
  2. そのディレクトリの events.jsonl を読み込みます。
    LATEST_SESSION=$(ls -dt ~/.copilot/session-state/*/ 2>/dev/null | head -1)
    $CCL "${LATEST_SESSION}events.jsonl" --format markdown
    
  3. Markdown 出力をインラインで表示します。

出力例:

# Session: 2025-11-23 19:32
**Model**: claude-sonnet-4-6
**Messages**: 42

---

**User**: Fix the authentication bug in login.py
**Assistant**: I'll examine the file...
...
モード2:ID で特定のセッションを指定

トリガーフレーズ:「view session 」、「show transcript 」、「open log 」

実行内容:

Claude Code(TOOL_CONTEXT="claude-code")の場合:

  1. セッション ID に一致する JSONL ファイルを検索します。
    find ~/.claude/projects -name "*.jsonl" | xargs grep -l "<SESSION_ID>" 2>/dev/null | head -1
    
    または、ID がファイル名の一部のように見える場合は、次を使用します。
    ls ~/.claude/projects/*/ | grep "<SESSION_ID>"
    
  2. 次を実行します。
    $CCL <path-to-jsonl> --format markdown
    
  3. 出力を表示します。一致するファイルがない場合は、次のように報告します。
    No session found with ID: <SESSION_ID>
    Available sessions: run "view all sessions" to list them.
    

GitHub Copilot CLI(TOOL_CONTEXT="copilot")の場合:

  1. セッション ID は ~/.copilot/session-state/ 以下のディレクトリ名です。直接確認します。
    SESSION_DIR="$HOME/.copilot/session-state/<SESSION_ID>"
    if [[ -d "$SESSION_DIR" ]]; then
      EVENTS_FILE="$SESSION_DIR/events.jsonl"
    fi
    
    ID 全体がわからない場合は、一部が一致するものを検索します。
    ls -d ~/.copilot/session-state/*/ 2>/dev/null | grep "<SESSION_ID>"
    
  2. 次を実行します。
    $CCL "$EVENTS_FILE" --format markdown
    
  3. 一致するディレクトリがない場合は、出力を表示して次のように報告します。
    No Copilot session found with ID: <SESSION_ID>
    Available sessions: run "browse all sessions" to list them.
    
モード3:エージェントのバックグラウンドタスク出力

トリガーフレーズ:「view agent output」、「show background task output」、「agent log」

実行内容:

  1. バックグラウンドエージェントタスクが作成した .log または .jsonl ファイルを探します。通常は 現在の作業ディレクトリ、または .agent-step-*.log などの名前が付いた 一時パスに書き込まれます。
    ls -t .agent-step-*.log 2>/dev/null
    ls -t /tmp/*.agent*.log 2>/dev/null
    
  2. 見つかった各ファイルについて、detect_log_format <file> を実行し、形式を判定します。
    • jsonl → $CCL <file> --format markdown を実行します
    • plain-log → cat で直接表示します
  3. これにより、JSONL 形式の .log ファイル(まれですが、存在する可能性があります)も適切にレンダリングされます。
  4. エージェントの出力ファイルが見つからない場合:
    No agent background task output files found in the current directory.
    Background agents write their output to files named .agent-step-<ID>.log.
    
モード 4:すべてのセッション(参照)

トリガーフレーズ:「すべてのセッションを参照」「トランスクリプトを一覧表示」「すべてのセッションを表示」 「セッション履歴を表示」

実行する内容:

Claude Code(TOOL_CONTEXT="claude-code")の場合:

  1. ~/.claude/projects/ 以下にあるすべての JSONL ファイルを一覧表示します:
    find ~/.claude/projects -name "*.jsonl" -printf "%T@ %p\n" 2>/dev/null \
      | sort -rn | awk '{print $2}'
    
  2. 各ファイルからセッションの日付と最初のユーザーメッセージを抽出します:
    $CCL <file> --format markdown --summary
    # If --summary flag is not supported, just show filename and date
    head -1 <file> | python3 -c "import sys,json; d=json.loads(sys.stdin.read()); print(d.get('timestamp',''))"
    
  3. 要約テーブルを表示します:
    Available Sessions (Claude Code)
    =================================
    #   Date                  Session ID / File
    1   2025-11-23 19:32:36   ~/.claude/projects/foo/abc123.jsonl
    2   2025-11-22 14:10:05   ~/.claude/projects/foo/def456.jsonl
    ...
    
  4. 特定のセッションを開くよう促します:「そのセッションを表示するには、番号を入力してください。」

GitHub Copilot CLI(TOOL_CONTEXT="copilot")の場合:

  1. ~/.copilot/session-state/ 以下のすべてのセッションディレクトリを、更新日時の順に一覧表示します:
    ls -dt ~/.copilot/session-state/*/ 2>/dev/null
    
  2. 各セッションディレクトリの events.jsonl を読み取り、タイムスタンプを抽出します:
    for session_dir in $(ls -dt ~/.copilot/session-state/*/); do
      session_id=$(basename "$session_dir")
      events_file="$session_dir/events.jsonl"
      if [[ -f "$events_file" ]]; then
        timestamp=$(head -1 "$events_file" | python3 -c \
          "import sys,json; d=json.loads(sys.stdin.read()); print(d.get('timestamp',''))" 2>/dev/null)
        echo "$timestamp  $session_id"
      fi
    done
    
  3. 要約テーブルを表示します:
    Available Sessions (GitHub Copilot CLI)
    ========================================
    #   Date                  Session ID
    1   2025-11-23 19:32:36   abc1234567890abcdef1234567890abcd
    2   2025-11-22 14:10:05   def4567890abcdef1234567890abcdef
    ...
    
  4. 特定のセッションを開くよう促します:「そのセッションを表示するには、番号を入力してください。」
日付範囲による絞り込み

ユーザーが日付範囲を指定した場合(例:「過去 7 日間」「2025-11-01 から 2025-11-30 まで」):

# Filter by modification time (last N days)
find ~/.claude/projects -name "*.jsonl" -mtime -7

# Filter by date range using find -newer
find ~/.claude/projects -name "*.jsonl" \
  -newer /tmp/start_date_ref \
  ! -newer /tmp/end_date_ref

touch -d で参照ファイルを作成します:

touch -d "2025-11-01" /tmp/start_date_ref
touch -d "2025-11-30" /tmp/end_date_ref

出力形式

Markdown(デフォルト)

claude-code-log に --format markdown を渡します。出力は会話内にインラインで表示されます。ターミナルや Claude Code ですばやく読むのに適しています。

HTML

claude-code-log に --format html を渡します。出力をファイルに書き込み、開きます:

$CCL <file> --format html > /tmp/transcript-view.html
open /tmp/transcript-view.html 2>/dev/null \
  || xdg-open /tmp/transcript-view.html 2>/dev/null \
  || echo "HTML saved to /tmp/transcript-view.html — open it in your browser."

ユーザーは「トランスクリプトを HTML で表示」または「HTML にエクスポート」のように、HTML を明示的に要求できます。

GitHub Copilot CLI のサポート

ログの自動保存

GitHub Copilot CLI は、セッションデータを次の場所に自動的に保存します:

~/.copilot/session-state/{session-id}/

各セッションディレクトリには、次のものが含まれます:

  • events.jsonl — JSONL 形式のセッション履歴(Claude Code のログと類似した形式)
  • workspace.yaml — セッションのメタデータ(作業ディレクトリ、セッション ID など)
  • plan.md — セッションの実装計画
  • checkpoints/ — コンパクション履歴(古いイベントのスナップショット)

レガシーセッションは ~/.copilot/history-session-state/ にも存在する場合があります。

JSONL 形式

Copilot の events.jsonl には、Claude Code の形式と同様に、1 行につき 1 つの JSON オブジェクトが含まれています:

{"type":"user","message":{"role":"user","content":[{"type":"text","text":"Fix the bug"}]},"timestamp":"2025-11-23T19:32:36Z","sessionId":"abc1234567890"}
{"type":"assistant","message":{"role":"assistant","content":[{"type":"text","text":"I'll examine the file..."}]},"timestamp":"2025-11-23T19:32:40Z","sessionId":"abc1234567890"}

形式に互換性があるため、claude-code-log がこれらのファイルの解析を処理します。

Copilot セッションの表示

ユーザーが Copilot セッションの表示を希望した場合(ディレクトリの検出または明示的なパスの指定):

  1. セッションの events.jsonl を特定します:
    # Current session (most recent)
    LATEST_SESSION=$(ls -dt ~/.copilot/session-state/*/ 2>/dev/null | head -1)
    EVENTS_FILE="${LATEST_SESSION}events.jsonl"
    
    # Specific session by ID
    EVENTS_FILE="$HOME/.copilot/session-state/<SESSION_ID>/events.jsonl"
    
  2. 次を実行します:
    $CCL "$EVENTS_FILE" --format markdown
    
  3. 出力をインラインで表示します。
利用可能なセッションの検出

Copilot セッションが存在するか確認するには:

if [[ -d "$HOME/.copilot/session-state" ]]; then
  SESSION_COUNT=$(ls -d "$HOME/.copilot/session-state/"*/ 2>/dev/null | wc -l)
  if [[ "$SESSION_COUNT" -gt 0 ]]; then
    echo "Found $SESSION_COUNT Copilot session(s)"
  fi
fi

ワークフロー全体

ユーザーがこのスキルを呼び出したら、次の判断フローに従います:

0. Detect tool context (directory-based first, then env var fallback):
   - ~/.copilot/session-state/ exists with sessions → copilot
   - ~/.claude/projects/ exists with sessions       → claude-code
   - Both exist with sessions → offer user a choice
   - Directory detection fails, use env vars:
     - CLAUDE_CODE_SESSION / CLAUDE_SESSION_ID / ANTHROPIC_API_KEY set → claude-code
     - GITHUB_COPILOT_TOKEN / COPILOT_SESSION set → copilot
   - Neither → default to claude-code (safe fallback)

1. Detect CCL (which claude-code-log / npx fallback)
   → If missing: show install instructions and STOP
   → Required for ALL modes (both Claude Code and Copilot use JSONL format)

2. If user provides an explicit file path:
   a. Detect its format (detect_log_format function above)
   b. jsonl or events.jsonl → pass to $CCL
   c. unknown → warn and display raw

3. Determine mode from user message:
   - mentions "current" or no session specified → Mode 1 (Current Session)
   - mentions a session ID or hash             → Mode 2 (Specific Session)
   - mentions "agent" or "background"          → Mode 3 (Agent Output)
   - mentions "all", "browse", "list"          → Mode 4 (All Sessions)

4. Determine output format:
   - "as HTML" or "export HTML" → html
   - default                    → markdown

5. Execute the appropriate mode (using TOOL_CONTEXT to choose correct paths) and display results.

エラー処理

状況対応
claude-code-log がインストールされていないインストール手順を表示して終了します
JSONL ファイルが見つからない「 にセッションファイルが見つかりません」
セッション ID が見つからない「ID が のセッションが見つかりません。'browse all sessions' を実行して、利用可能なセッションを一覧表示してください。」
エージェントの出力ファイルがない「現在のディレクトリにエージェントのバックグラウンドタスク出力が見つかりません。」
JSONL ファイルが空「セッションファイルが空です。表示するメッセージはありません。」
日付範囲に該当する結果がない「 から までのセッションが見つかりません。」
claude-code-log が 0 以外の終了コードを返すstderr を表示し、--help の使用を提案します
~/.copilot/session-state/ は存在するが空「Copilot セッションが見つかりません。ログを作成するには、GitHub Copilot CLI でセッションを開始してください。」
Copilot のセッションディレクトリは存在するが、events.jsonl がない「セッションディレクトリは見つかりましたが、 に events.jsonl がありません」
不明なファイル形式ユーザーに警告し、未加工の内容を表示します

実装メモ

セッション ID の検出

Claude Code のセッション ID は UUID に似た文字列です。ユーザーが「セッション abc123 を表示」や「ログ def456 を表示」のように入力した場合、最後の単語をセッション ID として扱い、一致する JSONL ファイルを検索します。

JSONL 構造(Claude Code)

Claude Code のセッション JSONL ファイルには、1 行につき 1 つの JSON オブジェクトが含まれています:

{"type":"user","message":{"role":"user","content":[{"type":"text","text":"..."}]},"timestamp":"...","sessionId":"..."}
{"type":"assistant","message":{"role":"assistant","content":[{"type":"text","text":"..."}]},"timestamp":"..."}

解析は claude-code-log が処理するため、このスキルでは再実装しません。

Copilot JSONL の構造(GitHub Copilot CLI)

Copilot CLI の events.jsonl ファイルには、1 行につき 1 つの JSON オブジェクトが含まれており、次の場所に保存されます。 ~/.copilot/session-state/{session-id}/events.jsonl:

{"type":"user","message":{"role":"user","content":[{"type":"text","text":"..."}]},"timestamp":"...","sessionId":"..."}
{"type":"assistant","message":{"role":"assistant","content":[{"type":"text","text":"..."}]},"timestamp":"...","sessionId":"..."}

この形式は claude-code-log と互換性があります。セッションごとの追加ファイル:

  • workspace.yaml — セッションのメタデータ
  • plan.md — 実装計画
  • checkpoints/ — コンパクション履歴(古いスナップショット)

レガシーセッションは、同じ構造で ~/.copilot/history-session-state/ に保存されている場合があります。

哲学との整合性
  • 薄いラッパー:すべての JSONL(Claude Code と Copilot の両方)の処理を claude-code-log に委任します
  • 適切な縮退:ツールが見つからない場合や、セッションが見つからない場合に明確なエラーメッセージを表示します
  • 単一責任:トランスクリプトの表示と変換のみを行い、変更は行いません
  • 隠れた状態がない:すべてのファイルパスをユーザーに表示します

制限事項

  • JSONL(Claude Code と Copilot の両方)を HTML/Markdown に変換するには、claude-code-log(npm)または npx が必要です
  • リモートマシンのトランスクリプトは表示できません
  • 日付フィルタリングでは、セッションのタイムスタンプではなく、ファイルシステムの更新日時を使用します
  • --summary フラグの利用可否は claude-code-log のバージョンによって異なります
  • ~/.copilot/history-session-state/ にあるレガシー Copilot セッションは自動検出されません(明示的なパスを指定する必要があります)
  • Claude Code と Copilot の両方のセッションがある場合、スキルはそれらを統合せず、ユーザーに選択を促します

クイックリファレンス

ユーザーの発言ツールモードコマンド
"view current transcript"Claude Code現在のセッション$CCL <latest.jsonl> --format markdown
"show session abc123"Claude Code特定のセッション$CCL ~/.claude/projects/**/*abc123*.jsonl --format markdown
"view agent output"Claude Codeエージェントの出力cat .agent-step-*.log or $CCL *.jsonl
"browse all sessions"Claude Codeすべてのセッション~/.claude/projects/**/*.jsonl をすべて一覧表示して要約
"view transcript as HTML"Claude Code任意のセッション+HTML$CCL <file> --format html > /tmp/view.html
"last 7 days"(閲覧時)Claude Code日付フィルターfind ... -mtime -7
"view current copilot session"Copilot現在のセッション$CCL ~/.copilot/session-state/<latest>/events.jsonl --format markdown
"show copilot session abc123"Copilot特定のセッション$CCL ~/.copilot/session-state/abc123/events.jsonl --format markdown
"browse copilot sessions"Copilotすべてのセッション~/.copilot/session-state/ のディレクトリを一覧表示し、セッション ID を表示
"view copilot session as HTML"Copilot任意のセッション+HTML$CCL <events.jsonl> --format html > /tmp/view.html

コメント