# 通知設計書 47-Invalid directory URL

## 概要

本ドキュメントは、OpenCodeアプリケーションにおける「Invalid directory URL」トースト通知の設計を記載する。URLに含まれるディレクトリパラメータが無効な場合に表示されるエラー通知である。

### 本通知の処理概要

URLパラメータとして指定されたディレクトリが無効（Base64デコードに失敗など）な場合にエラー通知を表示し、ユーザーをホームページにリダイレクトする処理を行う。

**業務上の目的・背景**：OpenCodeでは、URLにBase64エンコードされたディレクトリパスが含まれる形式でルーティングを行っている（例：`/{base64EncodedDir}/session/{sessionId}`）。このURLが手動で編集された、ブックマークが古くなった、または外部リンクが壊れている場合に、無効なディレクトリパラメータが渡される可能性がある。この通知により、ユーザーは問題を認識し、正しいURLまたはホームページから再度操作を開始できる。

**通知の送信タイミング**：ディレクトリレイアウトコンポーネント（`directory-layout.tsx`）のマウント時に、URLパラメータ`params.dir`が存在するがデコードに失敗した場合に表示される。

**通知の受信者**：無効なURLでアクセスしたユーザー自身。アプリケーションのアクティブウィンドウにトースト通知が表示される。

**通知内容の概要**：タイトル「Request failed」と、説明「Invalid directory in URL.」が表示される。

**期待されるアクション**：ユーザーは通知を確認後、自動的にホームページ（`/`）にリダイレクトされる。そこから正しいプロジェクトを選択して再度操作を開始する。

## 通知種別

トースト通知（アプリ内通知）

## 送信仕様

### 基本情報

| 項目 | 内容 |
|-----|------|
| 送信方式 | 同期（無効URL検出時に即時表示） |
| 優先度 | 高 |
| リトライ | 無 |

### 送信先決定ロジック

無効なURLでアクセスしたユーザー自身のブラウザ/デスクトップアプリ画面に表示される。送信先の判定は不要（ローカル通知のため）。

## 通知テンプレート

### トースト通知

| 項目 | 内容 |
|-----|------|
| アイコン | なし（デフォルト）またはerrorバリアントのアイコン |
| タイトル | `common.requestFailed`（"Request failed"） |
| 説明 | `directory.error.invalidUrl`（"Invalid directory in URL."） |
| バリアント | error |

### 本文テンプレート

```
タイトル: Request failed
説明: Invalid directory in URL.
```

### 添付ファイル

なし

## テンプレート変数

| 変数名 | 説明 | データ取得元 | 必須 |
|--------|------|-------------|-----|
| - | 固定テキストのみ | i18n | - |

## 送信トリガー・条件

### トリガー一覧

| トリガー種別 | トリガーイベント | 送信条件 | 説明 |
|------------|----------------|---------|------|
| ページ遷移 | directory-layout.tsxマウント | params.dirあり && decode64失敗 | 無効なディレクトリURL時 |

### 送信抑止条件

| 条件 | 説明 |
|-----|------|
| params.dirなし | ディレクトリパラメータがない場合は通知不要 |
| decode64成功 | 正常にデコードできた場合は通知しない |
| 同一URLで既に通知済み | store.invalidに保存済みの場合は重複通知しない |

## 処理フロー

### 送信フロー

```mermaid
flowchart TD
    A[ページアクセス] --> B{params.dir存在?}
    B -->|No| C[通常処理]
    B -->|Yes| D{decode64成功?}
    D -->|Yes| C
    D -->|No| E{既に通知済み?}
    E -->|Yes| F[終了]
    E -->|No| G[store.invalidに保存]
    G --> H[showToast - エラー通知]
    H --> I[navigate / にリダイレクト]
    I --> F
```

## データベース参照・更新仕様

### 参照テーブル一覧

本通知はクライアントサイドで完結するため、データベースへの直接参照は行わない。

### 更新テーブル一覧

本通知はクライアントサイドで完結するため、データベースへの更新は行わない。

## エラー処理

### エラーケース一覧

| エラー種別 | 発生条件 | 対処方法 |
|----------|---------|---------|
| Base64デコード失敗 | 不正なBase64文字列 | エラー通知を表示してホームにリダイレクト |
| 空のデコード結果 | デコード結果が空文字 | エラー通知を表示してホームにリダイレクト |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | 0 |
| リトライ間隔 | - |
| リトライ対象エラー | - |

## 配信設定

### レート制限

| 項目 | 内容 |
|-----|------|
| 同一URLでの重複通知 | store.invalidで制御（1回のみ） |
| 1分あたり上限 | 制限なし |

### 配信時間帯

制限なし（無効URL検出時に即時表示）

## セキュリティ考慮事項

- 無効なURLパラメータの詳細は表示せず、一般的なエラーメッセージのみを表示
- リダイレクト先はホームページ（`/`）に固定され、オープンリダイレクト脆弱性を防止

## 備考

- `replace: true`オプションでナビゲートするため、ブラウザの履歴に無効なURLは残らない
- createEffectで監視しているため、URLパラメータが変更されるたびにチェックが実行される
- Base64デコードには`decode64`ユーティリティ関数を使用

---

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

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

### 推奨読解順序

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

ストアの構造とパラメータの取得方法を理解する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | directory-layout.tsx | `packages/app/src/pages/directory-layout.tsx` | L43のstoreの構造（invalid: string） |

**読解のコツ**: `store.invalid`は同一URLでの重複通知を防ぐために使用される。

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

処理の起点となるエフェクトを特定する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | directory-layout.tsx | `packages/app/src/pages/directory-layout.tsx` | L48-59のcreateEffect |

**主要処理フロー**:
1. **L48**: createEffectでリアクティブに監視
2. **L49**: params.dirの存在確認
3. **L50**: directory()（decode64結果）の確認
4. **L51-52**: 既に同じURLで通知済みかチェック
5. **L53-57**: showToastでエラー通知
6. **L58**: navigate("/", { replace: true })でリダイレクト

#### Step 3: デコード処理を理解する

decode64関数の動作を確認する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | directory-layout.tsx | `packages/app/src/pages/directory-layout.tsx` | L44-46のdirectoryメモ |
| 3-2 | base64.ts | `packages/app/src/utils/base64.ts`（推定） | decode64関数の実装 |

**主要処理フロー**:
- **L44-46**: `decode64(params.dir)`でパラメータをデコード、失敗時は空文字を返す

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

```
directory-layout.tsx Layout Component
    │
    ├─ useParams() → params.dir取得
    │
    ├─ createMemo: directory (L44-46)
    │      └─ decode64(params.dir)
    │             └─ Base64デコード
    │
    └─ createEffect (L48-59)
           ├─ params.dir存在確認
           ├─ directory()空確認
           ├─ store.invalid重複チェック
           │
           ├─ setStore("invalid", params.dir)
           ├─ showToast - エラー通知
           │      ├─ variant: "error"
           │      ├─ title: "common.requestFailed"
           │      └─ description: "directory.error.invalidUrl"
           │
           └─ navigate("/", { replace: true })
```

### データフロー図

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

URL params.dir ───▶ decode64() ───▶ 判定
                         │            │
                         ▼            ├─ [成功] 通常レンダリング
                    デコード結果       │
                         │            └─ [失敗] トースト通知
                         ▼                    → ホームへリダイレクト
                    [空/失敗]
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| directory-layout.tsx | `packages/app/src/pages/directory-layout.tsx` | ソース | ディレクトリレイアウト、無効URL検出 |
| en.ts | `packages/app/src/i18n/en.ts` | 設定 | 英語メッセージ定義（L452） |
| ja.ts | `packages/app/src/i18n/ja.ts` | 設定 | 日本語メッセージ定義 |
| base64.ts | `packages/app/src/utils/base64.ts` | ソース | Base64エンコード/デコードユーティリティ |
