# 画面遷移図

## デスクトップアプリ（app）

```mermaid
flowchart TD
    subgraph App["デスクトップアプリ"]
        AppRoot["/"] --> Home["ホーム画面<br/>home.tsx"]
        AppRoot --> DirLayout["/:dir<br/>ディレクトリレイアウト"]

        DirLayout --> SessionIndex["/:dir/session<br/>新規セッション"]
        DirLayout --> Session["/:dir/session/:id<br/>セッション画面"]

        Home -->|プロジェクト選択| DirLayout
        SessionIndex -->|セッション作成| Session
        Session -->|別セッション選択| Session

        ErrorBoundary["エラー画面<br/>error.tsx"]
    end

    subgraph Layout["レイアウト構造"]
        Layout1["Layout<br/>layout.tsx"]
        Layout1 --> Sidebar["サイドバー"]
        Sidebar --> ProjectList["プロジェクト一覧"]
        Sidebar --> SessionList["セッション一覧"]
        Sidebar --> WorkspaceList["ワークスペース一覧"]
    end

    subgraph SessionComponents["セッション画面コンポーネント"]
        Session --> MessageTimeline["メッセージタイムライン"]
        Session --> ReviewPanel["レビューパネル"]
        Session --> TerminalPanel["ターミナルパネル"]
        Session --> FileTabs["ファイルタブ"]
    end
```

## コンソール（console）

```mermaid
flowchart TD
    subgraph PublicPages["公開ページ"]
        ConsoleRoot["/"] --> Landing["ランディングページ<br/>index.tsx"]
        ConsoleRoot --> Download["/download<br/>ダウンロードページ"]
        ConsoleRoot --> Zen["/zen<br/>Zen紹介ページ"]
        ConsoleRoot --> Changelog["/changelog<br/>更新履歴ページ"]
        ConsoleRoot --> Brand["/brand<br/>ブランドページ"]
        ConsoleRoot --> Enterprise["/enterprise<br/>エンタープライズページ"]
        ConsoleRoot --> Docs["/docs<br/>ドキュメント"]
        ConsoleRoot --> Privacy["/legal/privacy-policy<br/>プライバシーポリシー"]
        ConsoleRoot --> Terms["/legal/terms-of-service<br/>利用規約"]

        Landing -->|Get Started| Zen
        Landing -->|Download| Download
        Zen -->|Sign Up| Auth["/auth<br/>認証"]
    end

    subgraph AuthenticatedPages["認証済みページ"]
        Auth -->|ログイン成功| WorkspaceLayout["/workspace<br/>ワークスペースレイアウト"]

        WorkspaceLayout --> WorkspaceDetail["/workspace/:id<br/>ワークスペース詳細"]

        WorkspaceDetail --> Dashboard["ダッシュボード<br/>/workspace/:id"]
        WorkspaceDetail --> Keys["/workspace/:id/keys<br/>APIキー管理"]
        WorkspaceDetail --> Members["/workspace/:id/members<br/>メンバー管理"]
        WorkspaceDetail --> Billing["/workspace/:id/billing<br/>請求管理"]
        WorkspaceDetail --> Settings["/workspace/:id/settings<br/>設定"]

        Dashboard --> Keys
        Dashboard --> Members
        Keys --> Members
        Members --> Billing
        Billing --> Settings
    end

    NotFound["404エラーページ"]
```

## エンタープライズ（enterprise）

```mermaid
flowchart TD
    subgraph Enterprise["エンタープライズアプリ"]
        EnterpriseRoot["/"] --> EnterpriseIndex["インデックス"]
        EnterpriseRoot --> ShareLayout["/share<br/>シェアレイアウト"]

        ShareLayout --> ShareDetail["/share/:shareID<br/>シェア詳細"]

        NotFound["404エラーページ"]
    end
```

## TUI（ターミナルUI）

```mermaid
flowchart TD
    subgraph TUI["ターミナルUI"]
        TUIHome["ホーム画面<br/>home.tsx"]
        TUISession["セッション画面<br/>session/index.tsx"]

        TUIHome -->|セッション選択| TUISession
        TUISession -->|戻る| TUIHome

        subgraph SessionComponents["セッション関連"]
            TUISession --> Question["質問ダイアログ"]
            TUISession --> Permission["権限ダイアログ"]
            TUISession --> Timeline["タイムライン"]
            TUISession --> Subagent["サブエージェント"]
            TUISession --> Message["メッセージ"]
            TUISession --> ForkTimeline["フォーク"]
        end
    end
```

## 全体構成

```mermaid
flowchart LR
    subgraph Applications["アプリケーション"]
        App["デスクトップアプリ<br/>(packages/app)"]
        Console["コンソール<br/>(packages/console)"]
        Enterprise["エンタープライズ<br/>(packages/enterprise)"]
        TUI["TUI<br/>(packages/opencode)"]
    end

    subgraph SharedUI["共通UIコンポーネント"]
        UI["@opencode-ai/ui<br/>(packages/ui)"]
    end

    subgraph Backend["バックエンド"]
        Server["opencode server<br/>(packages/opencode/src/server)"]
    end

    App --> UI
    Console --> UI
    App --> Server
    TUI --> Server
```
