# 画面設計書 1-ルートリダイレクト画面

## 概要

本ドキュメントは、Liam DBアプリケーションのルートURL（`/`）にアクセスした際のリダイレクト処理画面について定義する。

### 本画面の処理概要

ルートリダイレクト画面は、アプリケーションのトップページ（`/`）へのアクセスを適切な画面に振り分けるためのサーバーサイドリダイレクト処理を行う画面である。ユーザーには表示されず、バックグラウンドで認証状態を判定して即座にリダイレクトを実行する。

**業務上の目的・背景**：ユーザーがアプリケーションのルートURLにアクセスした際、認証状態に応じて適切な初期画面へ誘導するため。未認証ユーザーをログイン画面へ、認証済みユーザーをメインのデザインセッション作成画面へ効率的に案内することで、スムーズなユーザー体験を提供する。

**画面へのアクセス方法**：ブラウザでアプリケーションのルートURL（例：`https://app.liambx.com/`）に直接アクセスする。

**主要な操作・処理内容**：
1. Supabase認証クライアントを使用して現在のユーザー情報を取得
2. ユーザーが未認証（エラーまたはユーザー情報なし）の場合、`/login?returnTo=/`へリダイレクト
3. ユーザーが認証済みの場合、`/design_sessions/new`へリダイレクト

**画面遷移**：
- 未認証時 → ログイン画面（`/login`）
- 認証済み時 → デザインセッション新規作成画面（`/design_sessions/new`）

**権限による表示制御**：認証状態のみで判定。ロールによる差異はない。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 25 | ユーザー認証 | 主機能 | 認証状態を確認し、未認証の場合はログイン画面へ、認証済みの場合はデザインセッション新規作成画面へリダイレクト |
| 39 | Supabaseクライアント | API連携 | サーバーサイドでSupabase認証クライアントを使用してユーザー情報を取得 |

## 画面種別

リダイレクト（表示なし）

## URL/ルーティング

- URL: `/`
- ファイル: `frontend/apps/app/app/page.tsx`
- レンダリング: サーバーコンポーネント（`dynamic = 'force-dynamic'`）

## 入出力項目

なし（本画面はリダイレクト専用のため、入出力項目は存在しない）

## 表示項目

なし（リダイレクト処理のみのため、ユーザーに表示される項目はない）

## イベント仕様

### 1-ページ読み込み時リダイレクト処理

ページアクセス時に自動的に以下の処理が実行される：

1. `createClient()`を呼び出してSupabaseサーバークライアントを生成
2. `supabase.auth.getUser()`でユーザー情報を取得
3. エラーまたはユーザー情報がない場合：`/login?returnTo=/`へリダイレクト
4. ユーザー情報が存在する場合：`/design_sessions/new`へリダイレクト

## データベース更新仕様

### 操作別データベース影響一覧

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| ページ読み込み | - | - | データベース更新なし（認証情報の参照のみ） |

本画面はリダイレクト処理のみであり、データベースへの更新操作は行わない。

## メッセージ仕様

なし（リダイレクト処理のみのため、メッセージ表示は行わない）

## 例外処理

| 例外ケース | 処理内容 |
|------------|----------|
| 認証情報取得エラー | `/login?returnTo=/`へリダイレクト |
| ユーザー情報なし | `/login?returnTo=/`へリダイレクト |

## 備考

- Next.js 15のサーバーコンポーネントとして実装されている
- `export const dynamic = 'force-dynamic'`により、毎回サーバーサイドで認証状態を確認
- リダイレクト先の`/login`では、`returnTo`パラメータを使用してログイン後の遷移先を保持

---

## コードリーディングガイド

本画面を理解するために参照すべきファイルと、推奨する読み解き順序を以下に示す。

### 推奨読解順序

#### Step 1: データ構造を理解する

Supabase認証で取得するユーザー情報の構造を把握する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | server.ts | `frontend/apps/app/libs/db/server.ts` | Supabaseクライアントの生成方法、cookieを使用した認証情報の管理 |

**読解のコツ**: `createServerClient`がcookieストアを使用してセッション情報を管理している点に注目。

#### Step 2: エントリーポイントを理解する

ルートページのエントリーポイントを確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | page.tsx | `frontend/apps/app/app/page.tsx` | ルートページの定義、`force-dynamic`設定 |

**主要処理フロー**:
1. **3行目**: `export const dynamic = 'force-dynamic'`で動的レンダリングを強制
2. **5-7行目**: `RootRedirectPage`コンポーネントをレンダリング

#### Step 3: リダイレクトロジックを理解する

実際のリダイレクト処理を行うコンポーネントを確認。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | RootRedirectPage.tsx | `frontend/apps/app/components/RootRedirectPage/RootRedirectPage.tsx` | 認証状態判定とリダイレクト処理 |

**主要処理フロー**:
- **5行目**: `createClient()`でSupabaseクライアントを生成
- **7-10行目**: `supabase.auth.getUser()`でユーザー情報を取得
- **12-13行目**: エラーまたはユーザーなしの場合、`/login?returnTo=/`へリダイレクト
- **16行目**: 認証済みの場合、`/design_sessions/new`へリダイレクト

### プログラム呼び出し階層図

```
app/page.tsx (Page)
    │
    └─ components/RootRedirectPage/RootRedirectPage.tsx
           │
           ├─ libs/db/server.ts (createClient)
           │      └─ @liam-hq/db (createServerClient)
           │
           └─ supabase.auth.getUser()
                  └─ redirect() [next/navigation]
```

### データフロー図

```
[入力]               [処理]                           [出力]

ルートURL(/)  ───▶ RootRedirectPage              ───▶ リダイレクト
     │              │                                    │
     │              ├─ Supabaseクライアント生成          │
     │              │                                    │
     │              ├─ ユーザー情報取得                   │
     │              │                                    │
     │              └─ 認証状態判定                      │
     │                  │                                │
     │                  ├─ 未認証 ──────────────────────▶ /login?returnTo=/
     │                  │
     │                  └─ 認証済み ────────────────────▶ /design_sessions/new
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| page.tsx | `frontend/apps/app/app/page.tsx` | ソース | ルートページのエントリーポイント |
| RootRedirectPage.tsx | `frontend/apps/app/components/RootRedirectPage/RootRedirectPage.tsx` | ソース | リダイレクトロジックの実装 |
| index.ts | `frontend/apps/app/components/RootRedirectPage/index.ts` | ソース | コンポーネントのエクスポート |
| server.ts | `frontend/apps/app/libs/db/server.ts` | ソース | Supabaseクライアント生成 |
