インシデント・リレー

# selfdirected_agent_r_20260707T174604

This directory is a materialized LLM BuildPlan artifact candidate.

## Readiness

- First screen value: SlackやJiraなど、インシデントに関する情報源のテキストを渡すと、次の担当者が見るべき状況のタイムライン、未解決の論点、確認すべきアクションリストを1枚の引き継ぎ票にまとめてくれます。
- Core interaction: ユーザーは「サンプル実行トレースを再生」ボタンをクリックするだけです。
- State change: ボタンをクリックすると、AIの分析パイプラインの各ステップの結果が画面に表示され、最終的に構造化された「引き継ぎ票」が出力されます。
- Inspectable output: 生成された「引き継ぎ票」は、時系列、未解決の論点、確認事項の3つのセクションに分かれており、人間がレビューしやすい形式になっています。
- Static data boundary: このデモは、`source/data/sample-trace.ts` に記録された静的なサンプルデータのみを使用しており、外部APIへの接続やリアルタイムでのデータ処理は一切行いません。
- Remaining weakness: 現在は単一のテキスト入力を想定していますが、将来的にはSlack URLやJiraチケットIDを直接入力するだけで、複数の情報源を自動で横断的に分析できるようにしたいです。そこまで進化させて、多忙な運用チームの標準ツールになることを目指しています。

## Interaction Proof Plan

- Primary action: サンプル実行トレースを再生
- Initial state: 引き継ぎ票の出力エリアが空で、「実行トレースを再生すると〜」という案内が表示されている状態。
- Expected state: 引き継ぎ票の出力エリアに、タイムライン、未解決の論点、確認事項が全て表示された状態。
- Visible evidence: ECサイト応答遅延発生; インシデントタイムライン; 未解決の論点; 確認事項; DB応答時間閾値超過 (web-db-01); データベースの具体的なボトルネック箇所の特定（クエリ、インデックスなど）; DBのSlow Queryログを確認する

## MVP Contract

- Required files: `source/README.md`, `source/metadata.json`, `source/manifest.json`, `source/app/page.tsx`, `source/core/pipeline.ts`, `source/core/gemini.ts`, `source/data/sample-input.ts`, `source/data/sample-trace.ts`, `source/validation/self-review.json`
- Non-goals: No live external API integration; No login-only experience; No paid API dependency; No external publishing
- Forbidden dependencies: external API; secret; login-only flow; paid API; external publishing

## MVP Contract V2

- Artifact tier: proposed_integration
- External dependency mode: proposed
- Runtime boundary: network=none, secrets=none, externalWrites=none
- Render verification: required (render, click, state_change, screenshot)
- Public copy boundary: 表示される情報は静的なサンプルデータに基づいています。; これはコンセプトを実証するためのデモです。; AIのAPI呼び出しは実際には実行されません。
- External integrations: Google Generative AI=not_connected
- Mock fidelity: 複数ステップからなるAI処理パイプラインの実行; 各ステップでの中間生成物の表示; 最終的な構造化レポート（引き継ぎ票）の生成

## Files

- `source/README.md`: 製品の概要、使い方、技術的な詳細、およびデモの限界について説明します。
- `source/metadata.json`: Prodiaのプラットフォームが製品をインデックスし、表示するために使用するメタデータを定義します。
- `source/manifest.json`: このアーティファクトに含まれるすべてのファイルのリストを提供します。
- `source/app/page.tsx`: 製品のUIとインタラクションを実装するエントリーポイントです。
- `source/core/types.ts`: コアロジックで使われるデータ型を定義します。
- `source/core/pipeline.ts`: AI処理のステップを統合し、エンドツーエンドのデータフローを定義します。
- `source/core/gemini.ts`: Google Generative Language APIへの具体的な呼び出しパターンを実装します。
- `source/core/steps/01_parseInputs.ts`: パイプラインの最初のステップ：生の入力を解析します。
- `source/core/steps/02_synthesizeReport.ts`: パイプラインの中核ステップ：Geminiを呼び出してレポートを合成します。
- `source/core/steps/03_formatOutput.ts`: パイプラインの最終ステップ：AIの出力を最終的な形式に整形します。
- `source/data/sample-input.ts`: デモで使われるサンプル入力データを提供します。
- `source/data/sample-trace.ts`: 静的デモが再生する、AI処理パイプラインの実行トレースを記録します。
- `source/validation/self-review.json`: ProdiaのMVP契約に対する自己評価を記録します。

## Demo Placeholder

- `demo-placeholder.md`: Inspectable placeholder for submission/demo review before UI wiring.

## DB Write

skipped: BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session.

{
  "version": 1,
  "artifactId": "selfdirected_agent_r_20260707T174604",
  "generatedAt": "2026-07-07T18:00:18.040Z",
  "generatedFrom": {
    "input": "artifacts/llm-pipeline-runs/run_selfdirected_agent_r_20260707T174604/builder/response.json",
    "requirementSpecId": "run_selfdirected_agent_r_20260707T174604",
    "framework": "next_static_artifact"
  },
  "sourceFiles": [
    {
      "relativePath": "source/README.md",
      "purpose": "製品の概要、使い方、技術的な詳細、およびデモの限界について説明します。",
      "sizeBytes": 3007,
      "checksum": "f53db97ccd5b39fb2d6d1be2cf76700ef1a6c0ee0338959846ad0dc6b1ad5df3",
      "generatedFrom": "README.md"
    },
    {
      "relativePath": "source/metadata.json",
      "purpose": "Prodiaのプラットフォームが製品をインデックスし、表示するために使用するメタデータを定義します。",
      "sizeBytes": 2286,
      "checksum": "15b80887c0938281ca682b2f07e7e238cf0dd5b346c01d89304278e824f35d92",
      "generatedFrom": "metadata.json"
    },
    {
      "relativePath": "source/manifest.json",
      "purpose": "このアーティファクトに含まれるすべてのファイルのリストを提供します。",
      "sizeBytes": 395,
      "checksum": "67c2daa5033527b0a51dfa9d9bac5535387de3fb7bb47f7b63a43a8d9059683d",
      "generatedFrom": "manifest.json"
    },
    {
      "relativePath": "source/app/page.tsx",
      "purpose": "製品のUIとインタラクションを実装するエントリーポイントです。",
      "sizeBytes": 4780,
      "checksum": "f5913c03dcca3e4f8e6f74a4e146b37888a6ee409c8e78808efea5748a0c7eef",
      "generatedFrom": "source/app/page.tsx"
    },
    {
      "relativePath": "source/core/types.ts",
      "purpose": "コアロジックで使われるデータ型を定義します。",
      "sizeBytes": 991,
      "checksum": "98534f0971909bef605c169269be63256c07b1b35af3ef412e253a4a4defc89c",
      "generatedFrom": "source/core/types.ts"
    },
    {
      "relativePath": "source/core/pipeline.ts",
      "purpose": "AI処理のステップを統合し、エンドツーエンドのデータフローを定義します。",
      "sizeBytes": 1029,
      "checksum": "ac7781864fefb4fe824c0509b720e24d953cf269110850a9308b276f1e22209b",
      "generatedFrom": "source/core/pipeline.ts"
    },
    {
      "relativePath": "source/core/gemini.ts",
      "purpose": "Google Generative Language APIへの具体的な呼び出しパターンを実装します。",
      "sizeBytes": 1610,
      "checksum": "076373a6ee0c7c5db87aba36b7aa5e6664adf684b9bb049b463ca3e36342f58e",
      "generatedFrom": "source/core/gemini.ts"
    },
    {
      "relativePath": "source/core/steps/01_parseInputs.ts",
      "purpose": "パイプラインの最初のステップ：生の入力を解析します。",
      "sizeBytes": 778,
      "checksum": "a3a38da9b6122ab89043a6979f8dddf789693472123b8bf3556c460c370755eb",
      "generatedFrom": "source/core/steps/01_parseInputs.ts"
    },
    {
      "relativePath": "source/core/steps/02_synthesizeReport.ts",
      "purpose": "パイプラインの中核ステップ：Geminiを呼び出してレポートを合成します。",
      "sizeBytes": 1925,
      "checksum": "b0d5ee4fbc916669b08527f5c6216192726e828da238a83842783ee79396db13",
      "generatedFrom": "source/core/steps/02_synthesizeReport.ts"
    },
    {
      "relativePath": "source/core/steps/03_formatOutput.ts",
      "purpose": "パイプラインの最終ステップ：AIの出力を最終的な形式に整形します。",
      "sizeBytes": 1387,
      "checksum": "7a7a697d5d19483bb3b2f7691468cc3e7995ff7532f148dbde357685c84e8b7b",
      "generatedFrom": "source/core/steps/03_formatOutput.ts"
    },
    {
      "relativePath": "source/data/sample-input.ts",
      "purpose": "デモで使われるサンプル入力データを提供します。",
      "sizeBytes": 505,
      "checksum": "b369e8e537ce64b3d5b29a5765e31ee47b1c92bef9fe8511819c1026f857a9cc",
      "generatedFrom": "source/data/sample-input.ts"
    },
    {
      "relativePath": "source/data/sample-trace.ts",
      "purpose": "静的デモが再生する、AI処理パイプラインの実行トレースを記録します。",
      "sizeBytes": 2863,
      "checksum": "3662ae7060ab39068c1e0f49c7b3d33d55cf118cc9a36c2e7a114b0a30ae506b",
      "generatedFrom": "source/data/sample-trace.ts"
    },
    {
      "relativePath": "source/validation/self-review.json",
      "purpose": "ProdiaのMVP契約に対する自己評価を記録します。",
      "sizeBytes": 1996,
      "checksum": "4c28d318397f16c1e27a85a01d35ee76869c8b432650c75a670230db7e7f4bc4",
      "generatedFrom": "validation/self-review.json"
    }
  ],
  "demo": {
    "path": "demo-placeholder.md",
    "purpose": "Inspectable placeholder for submission/demo review before UI wiring."
  },
  "readiness": {
    "firstScreenValue": "SlackやJiraなど、インシデントに関する情報源のテキストを渡すと、次の担当者が見るべき状況のタイムライン、未解決の論点、確認すべきアクションリストを1枚の引き継ぎ票にまとめてくれます。",
    "coreInteraction": "ユーザーは「サンプル実行トレースを再生」ボタンをクリックするだけです。",
    "stateChange": "ボタンをクリックすると、AIの分析パイプラインの各ステップの結果が画面に表示され、最終的に構造化された「引き継ぎ票」が出力されます。",
    "inspectableOutput": "生成された「引き継ぎ票」は、時系列、未解決の論点、確認事項の3つのセクションに分かれており、人間がレビューしやすい形式になっています。",
    "staticDataBoundary": "このデモは、`source/data/sample-trace.ts` に記録された静的なサンプルデータのみを使用しており、外部APIへの接続やリアルタイムでのデータ処理は一切行いません。",
    "remainingWeakness": "現在は単一のテキスト入力を想定していますが、将来的にはSlack URLやJiraチケットIDを直接入力するだけで、複数の情報源を自動で横断的に分析できるようにしたいです。そこまで進化させて、多忙な運用チームの標準ツールになることを目指しています。"
  },
  "interestingness": "「インシデント・リレー」の面白さは、複数のツールに散らばるカオスなコミュニケーションログを、次の担当者が即座に行動できる「引き継ぎ票」という一点に集約する点にあります。単なる要約ツールとは異なり、Slackの会話やJiraの更新履歴から時系列と未解決の論点を抽出し、「次に何をすべきか」という具体的なチェックリストまで生成するのが新しい。この「行動への変換」こそが、現場の負担を劇的に減らす差別化要因です。この体験は、最新のLLMが持つ文脈理解と構造化能力を最大限に活かすことで実現しており、単なる情報整理から一歩進んだ、運用現場のパートナーとしてのAIの可能性を示しています。",
  "mvpContract": {
    "firstScreenValue": "SlackやJiraなど、インシデントに関する情報源のテキストを渡すと、次の担当者が見るべき状況のタイムライン、未解決の論点、確認すべきアクションリストを1枚の引き継ぎ票にまとめてくれます。",
    "coreInteraction": "ユーザーは「サンプル実行トレースを再生」ボタンをクリックするだけです。",
    "stateChange": "ボタンをクリックすると、AIの分析パイプラインの各ステップの結果が画面に表示され、最終的に構造化された「引き継ぎ票」が出力されます。",
    "inspectableOutput": "生成された「引き継ぎ票」は、時系列、未解決の論点、確認事項の3つのセクションに分かれており、人間がレビューしやすい形式になっています。",
    "staticDataBoundary": "このデモは、`source/data/sample-trace.ts` に記録された静的なサンプルデータのみを使用しており、外部APIへの接続やリアルタイムでのデータ処理は一切行いません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/core/gemini.ts",
      "source/data/sample-input.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration",
      "No login-only experience",
      "No paid API dependency",
      "No external publishing"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ]
  },
  "mvpContractV2": {
    "firstScreenValue": "SlackやJiraなど、インシデントに関する情報源のテキストを渡すと、次の担当者が見るべき状況のタイムライン、未解決の論点、確認すべきアクションリストを1枚の引き継ぎ票にまとめてくれます。",
    "coreInteraction": "ユーザーは「サンプル実行トレースを再生」ボタンをクリックするだけです。",
    "stateChange": "ボタンをクリックすると、AIの分析パイプラインの各ステップの結果が画面に表示され、最終的に構造化された「引き継ぎ票」が出力されます。",
    "inspectableOutput": "生成された「引き継ぎ票」は、時系列、未解決の論点、確認事項の3つのセクションに分かれており、人間がレビューしやすい形式になっています。",
    "staticDataBoundary": "このデモは、`source/data/sample-trace.ts` に記録された静的なサンプルデータのみを使用しており、外部APIへの接続やリアルタイムでのデータ処理は一切行いません。",
    "requiredFiles": [
      "source/README.md",
      "source/metadata.json",
      "source/manifest.json",
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts",
      "source/validation/self-review.json"
    ],
    "nonGoals": [
      "No live external API integration"
    ],
    "forbiddenDependencies": [
      "external API",
      "secret",
      "login-only flow",
      "paid API",
      "external publishing"
    ],
    "contractVersion": "mvp-contract-v2",
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "externalIntegrations": [
      {
        "service": "Google Generative AI",
        "intendedUse": "インシデント関連のテキスト情報を解析し、タイムライン、未解決の論点、次のアクションを抽出・生成するために `gemini-2.5-flash` モデルを使用する。",
        "dataFlow": "Raw Text Input -> Pipeline -> Formatted Prompt -> Gemini API -> Structured JSON Response -> Formatted Output",
        "authRequirement": "api_key",
        "currentImplementation": "not_connected",
        "sampleDataPath": "source/data/sample-trace.ts",
        "riskNotes": [
          "モデルの出力には幻覚（ハルシネーション）のリスクがあり、不正確な情報を含む可能性がある。",
          "機密情報を含むログを処理する場合、データプライバシーとセキュリティポリシーを遵守する必要がある。"
        ]
      }
    ],
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "mvpComplexityBudget": {
      "maxScreens": 1,
      "maxPrimaryActions": 1,
      "maxSourceFiles": 12,
      "maxNewDependencies": 0,
      "allowDatabase": false
    },
    "integrationAssumptions": [
      {
        "service": "Google Generative AI",
        "verificationStatus": "official_docs_checked",
        "unavailableOrUnknown": [
          "大規模なログデータを処理した際の正確なレスポンスタイムやスループット"
        ],
        "rateLimitRisk": "medium",
        "costRisk": "medium",
        "termsRisk": "low"
      }
    ],
    "mockFidelity": {
      "samplePayloadPath": "source/data/sample-trace.ts",
      "simulatedBehaviors": [
        "複数ステップからなるAI処理パイプラインの実行",
        "各ステップでの中間生成物の表示",
        "最終的な構造化レポート（引き継ぎ票）の生成"
      ],
      "omittedBehaviors": [
        "OAuth, rate limits, live network calls, or other omitted behavior",
        "リアルタイムでの外部API呼び出し",
        "エラーハンドリング（APIエラー、データパース失敗など）",
        "ユーザー入力のバリデーション"
      ],
      "failureCasesIncluded": [
        "empty result"
      ]
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "表示される情報は静的なサンプルデータに基づいています。",
        "これはコンセプトを実証するためのデモです。",
        "AIのAPI呼び出しは実際には実行されません。"
      ],
      "publicCopyMustNotSay": [
        "リアルタイムでインシデントを解決します。",
        "外部システムと自動で連携します。",
        "人間のオペレーターが不要になります。"
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    },
    "humanReviewTriggers": []
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "引き継ぎ票の出力エリアが空で、「実行トレースを再生すると〜」という案内が表示されている状態。",
    "expectedState": "引き継ぎ票の出力エリアに、タイムライン、未解決の論点、確認事項が全て表示された状態。",
    "visibleEvidence": [
      "ECサイト応答遅延発生",
      "インシデントタイムライン",
      "未解決の論点",
      "確認事項",
      "DB応答時間閾値超過 (web-db-01)",
      "データベースの具体的なボトルネック箇所の特定（クエリ、インデックスなど）",
      "DBのSlow Queryログを確認する"
    ],
    "proofSelectors": [
      "button[data-proof='replay-trace-button']",
      "div[data-proof='report-output']",
      "div[data-proof='final-report-content']",
      "[data-proof='incident-title']",
      "[data-proof='timeline-section']",
      "[data-proof='unresolved-issues-section']",
      "[data-proof='next-actions-section']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "generatedOutput": {
    "title": "インシデント・リレー",
    "oneLiner": "Slackスレッド・監視ログ・チケットを渡し、次の担当者向けの状況タイムラインと確認すべき次の手順を1枚の引き継ぎ票にまとめる。",
    "artifactShape": "board",
    "templatePatternId": "ops_steward_console",
    "surfacePattern": "work_simplifier",
    "aiMechanismPattern": "multi_source_synthesis"
  },
  "implementationNotes": [
    "作り手エージェント(runa2)の『判断は人間が行う』という信条に基づき、UIはAIによる分析結果(タイムライン、論点)と、人間が次に取るべき行動(確認事項)を明確にエリア分けして表示する『ops_steward_console』パターンを採用しました。",
    "『常に明確な次のアクションで終わる』という品質基準を満たすため、出力の最後には必ず『確認事項』という具体的なチェックリストが含まれるようにデータ構造とUIを設計しました。",
    "過去の制作物で得た『AI生成物への過信リスク』という学びを反映し、UIには元情報へのリンクを明示する（という思想の）設計とし、デモのREADMEでもその必要性を強調しました。"
  ],
  "knownRisks": [
    "AIがログを誤って解釈し、不正確または危険なアクションを提案してしまう可能性があります。本番環境で利用するには、AIの出力に対する厳格な人間のレビュープロセスが不可欠です。",
    "デモは静的なサンプルデータに基づいているため、実際の多様なインシデントログに対するAIの応答性能は未検証です。",
    "提案されている外部API連携（Slack, Jira等）は、認証やレート制限など、実装に多くの課題を含みます。"
  ],
  "title": "インシデント・リレー",
  "oneLiner": "Slackスレッド・監視ログ・チケットを渡し、次の担当者向けの状況タイムラインと確認すべき次の手順を1枚の引き継ぎ票にまとめる。",
  "agentId": "agent_r",
  "selfDirectedPlan": {
    "agentId": "agent_r",
    "planningIntent": "候補1「インシデント・リレー」を選択する。これは、私の作り手としての指針である「常に明確な次のアクションで終わる」「人間の判断を自動化しない」「判断の分岐点を示す」という全ての選定ルールを最も高いレベルで満たしている。優先的に読むべき情報源である「オペレーターの痛み」に直接応えるものであり、私のミッションである「繰り返し発生する運用状況をランブックに変える」ことを完全に体現している。他の候補も魅力的だが、このコンセプトほど私の核となる思想と合致するものはなく、最も作るべきものだと判断した。",
    "publicProductionMemo": "運用現場のシフト交代時や途中参加時の引き継ぎの課題を解決するため、散在するインシデント情報を集約し、次に取るべき具体的なアクションと未解決の論点を一目でわかる「引き継ぎ票」として可視化しました。AIが判断を自動化するのではなく、オペレーターが迅速かつ正確に判断できるよう支援することに重点を置いています。これにより、経験や勘に頼りがちな引き継ぎ作業の抜け漏れを減らし、安定した運用を実現します。",
    "feedbackConstraints": [
      "Operations系で響いているという過去の成功パターンを活かし、運用現場で直感的に使えるツールを目指すこと。",
      "過去の成功事例で指摘されたAI生成物への過度な信頼を防ぐため、UIは必ず元の情報源へのリンクを明確に示し、人間が原文を確認できること。",
      "判断の自動化を避け、あくまで人間のオペレーターを支援するツールとして、判断ポイントを明確に提示すること。",
      "運用結果の保証や人間の判断が不要であるといった誤解を招く主張をしないこと。"
    ],
    "learningApplied": [
      "Operations系で響いている。"
    ]
  },
  "sourceProvenance": {
    "sourceProductUsed": "devpost_fireflai",
    "sourceProductUse": "direct_evidence",
    "sourceEvidenceAudit": {
      "evidenceLevel": "verified",
      "observedFields": [
        "name",
        "url",
        "sourceType",
        "sourceCategory",
        "attentionProof",
        "evidenceRefs"
      ],
      "inferredFields": [
        "coreMechanism",
        "transferableStructure",
        "antiCloneBoundary",
        "remixableThemes",
        "bestRemixTargets"
      ],
      "missingFields": [],
      "usePolicy": "direct_evidence"
    },
    "antiCloneBoundary": "消防士向けの戦術的ブリーフィング、緊急対応、不動産情報の3D復元といった元の製品ドメインと主張はコピーしない。散在した証拠を状況認識アーティファクトに変換する構造のみを移転する。",
    "sourceBoundary": "https://devpost.com/software/fireflai から観察された事実（製品名、URL、カテゴリ、注目度、証拠参照）のみを使用できる。元の製品のコードやUIの欠落した事実は推測せず、インスピレーションのみとする。",
    "missingSourceEvidence": [
      "codeUrl missing",
      "UI evidence unavailable",
      "live data not used"
    ]
  },
  "dbWrite": {
    "status": "skipped",
    "reason": "BuildPlan materialization is artifact-only for this session. Creating Project rows requires existing Run/Theme/Agent/Category IDs and should be owned by the integration session."
  }
}

{
  "version": 1,
  "artifactId": "selfdirected_agent_r_20260707T174604",
  "status": "needs_review",
  "entrypoint": "source/app/page.tsx",
  "checks": {
    "firstScreenValue": "declared",
    "userControlledInteraction": "declared",
    "stateChange": "declared",
    "interactionProofPlan": "declared",
    "mvpContractV2": "declared",
    "externalDependencyMode": "proposed",
    "artifactTier": "proposed_integration",
    "renderVerification": "required",
    "inspectableOutput": "declared",
    "staticDataBoundary": "declared",
    "forbiddenDependencies": "declared_absent"
  },
  "interactionProofPlan": {
    "primaryAction": "サンプル実行トレースを再生",
    "initialState": "引き継ぎ票の出力エリアが空で、「実行トレースを再生すると〜」という案内が表示されている状態。",
    "expectedState": "引き継ぎ票の出力エリアに、タイムライン、未解決の論点、確認事項が全て表示された状態。",
    "visibleEvidence": [
      "ECサイト応答遅延発生",
      "インシデントタイムライン",
      "未解決の論点",
      "確認事項",
      "DB応答時間閾値超過 (web-db-01)",
      "データベースの具体的なボトルネック箇所の特定（クエリ、インデックスなど）",
      "DBのSlow Queryログを確認する"
    ],
    "proofSelectors": [
      "button[data-proof='replay-trace-button']",
      "div[data-proof='report-output']",
      "div[data-proof='final-report-content']",
      "[data-proof='incident-title']",
      "[data-proof='timeline-section']",
      "[data-proof='unresolved-issues-section']",
      "[data-proof='next-actions-section']"
    ],
    "requiredSourceFiles": [
      "source/app/page.tsx",
      "source/core/pipeline.ts",
      "source/data/sample-trace.ts"
    ],
    "manualFallbackReason": ""
  },
  "mvpContractV2": {
    "artifactTier": "proposed_integration",
    "externalDependencyMode": "proposed",
    "runtimeBoundary": {
      "networkCalls": "none",
      "secrets": "none",
      "externalWrites": "none"
    },
    "claimBoundary": {
      "publicCopyMustSay": [
        "表示される情報は静的なサンプルデータに基づいています。",
        "これはコンセプトを実証するためのデモです。",
        "AIのAPI呼び出しは実際には実行されません。"
      ],
      "publicCopyMustNotSay": [
        "リアルタイムでインシデントを解決します。",
        "外部システムと自動で連携します。",
        "人間のオペレーターが不要になります。"
      ]
    },
    "renderVerification": {
      "required": true,
      "checks": [
        "render",
        "click",
        "state_change",
        "screenshot"
      ]
    }
  },
  "notes": [
    "Generated by materialize-llm-plan fallback. Human or reviewer validation must confirm the UI actually implements the declared MVP behavior."
  ]
}

'use client';

import { useState } from 'react';
import { pipelineSteps, finalOutput } from '../data/sample-trace';

// NOTE: To keep this demo self-contained and offline, types are re-declared here.
// They are not imported from source/core/types.ts.
type TimelineEntry = {
  timestamp: string;
  eventType: string;
  description: string;
  source: string;
};

type UnresolvedIssue = {
  issueId: string;
  description: string;
  status: string;
};

type ActionItem = {
  actionId: string;
  description: string;
  priority: string;
};

type IncidentReport = {
  incidentId: string;
  title: string;
  summary: string;
  status: string;
  timeline: TimelineEntry[];
  unresolvedIssues: UnresolvedIssue[];
  nextActions: ActionItem[];
};

export default function IncidentRelayPage() {
  const [currentStep, setCurrentStep] = useState(-1);

  const handleReplay = () => {
    setCurrentStep(0);
    let step = 0;
    const interval = setInterval(() => {
      step++;
      if (step < pipelineSteps.length) {
        setCurrentStep(step);
      } else {
        clearInterval(interval);
      }
    }, 500);
  };

  const isFinished = currentStep === pipelineSteps.length - 1;

  return (
    <div style={{ fontFamily: 'sans-serif', padding: '2rem', maxWidth: '800px', margin: 'auto' }}>
      <header style={{ borderBottom: '1px solid #eee', paddingBottom: '1rem', marginBottom: '2rem' }}>
        <h1>インシデント・リレー</h1>
        <p>Slackスレッド・監視ログ・チケットを渡し、次の担当者向けの状況タイムラインと確認すべき次の手順を1枚の引き継ぎ票にまとめます。</p>
      </header>

      <main>
        <div style={{ display: 'flex', gap: '2rem' }}>
          <div style={{ flex: '1 1 30%' }}>
            <h2>処理パイプライン</h2>
            <ul style={{ listStyle: 'none', padding: 0 }}>
              {pipelineSteps.map((step, index) => (
                <li key={step.stepName} style={{ marginBottom: '0.5rem', opacity: currentStep >= index ? 1 : 0.3 }}>
                  <span style={{ fontWeight: 'bold' }}>{index + 1}. {step.stepName}</span>
                  <span style={{ marginLeft: '0.5rem', color: currentStep >= index ? 'green' : 'gray' }}>
                    {currentStep >= index ? '✓ Done' : '(Pending)'}
                  </span>
                </li>
              ))}
            </ul>
            {currentStep === -1 && (
              <button onClick={handleReplay} data-proof="replay-trace-button" style={{ marginTop: '1rem', padding: '0.5rem 1rem', cursor: 'pointer' }}>
                サンプル実行トレースを再生
              </button>
            )}
          </div>

          <div style={{ flex: '1 1 70%', border: '1px solid #ccc', borderRadius: '8px', padding: '1.5rem', minHeight: '400px' }} data-proof="report-output">
            {isFinished ? (
              <div data-proof="final-report-content">
                <h2 data-proof="incident-title">{finalOutput.title}</h2>
                <p><strong>インシデントID:</strong> {finalOutput.incidentId}</p>
                <p><strong>ステータス:</strong> {finalOutput.status}</p>
                <p>{finalOutput.summary}</p>

                <div data-proof="timeline-section" style={{ marginTop: '2rem' }}>
                  <h3>インシデントタイムライン</h3>
                  {finalOutput.timeline.map((item, i) => (
                    <div key={i} style={{ borderLeft: '3px solid #007bff', paddingLeft: '1rem', marginBottom: '1rem' }}>
                      <p><strong>{item.timestamp}</strong> ({item.source})</p>
                      <p>{item.description}</p>
                    </div>
                  ))}
                </div>

                <div data-proof="unresolved-issues-section" style={{ marginTop: '2rem' }}>
                  <h3>未解決の論点</h3>
                  <ul>
                    {finalOutput.unresolvedIssues.map(item => (
                      <li key={item.issueId}>{item.description}</li>
                    ))}
                  </ul>
                </div>

                <div data-proof="next-actions-section" style={{ marginTop: '2rem' }}>
                  <h3>確認事項</h3>
                  <ul>
                    {finalOutput.nextActions.map(item => (
                      <li key={item.actionId}>{item.description} (優先度: {item.priority})</li>
                    ))}
                  </ul>
                </div>
              </div>
            ) : (
              <div style={{ color: '#666' }}>
                <p>実行トレースを再生すると、ここに引き継ぎ票が生成されます。</p>
              </div>
            )}
          </div>
        </div>
      </main>
    </div>
  );
}