# 通知設計書 41-スケジュール作成成功

## 概要

本ドキュメントは、スケジュール（定期取引）の作成が成功した際にユーザーに表示される成功通知の設計を定義します。

### 本通知の処理概要

この通知は、ユーザーがスケジュール（定期取引）を新規作成した際に、作成が正常に完了したことを知らせるメッセージ通知です。取引編集画面から将来の日付の取引をスケジュールに変換した場合や、スケジュール編集画面から新規スケジュールを作成した場合に表示されます。

**業務上の目的・背景**：スケジュール機能は、定期的な収入や支出（給与、家賃、サブスクリプションなど）を自動的に管理するための重要な機能です。ユーザーがスケジュールを作成した際に、操作が正常に完了したことを明確にフィードバックすることで、ユーザーの操作確信を高め、予算管理の効率化を支援します。

**通知の送信タイミング**：以下のタイミングで通知が送信されます。
1. モバイル版スケジュール編集画面で新規スケジュールを保存した時
2. 取引編集画面で将来日付の取引を「スケジュールに変換」を選択して確定した時
3. デスクトップ版で取引をスケジュールに変換した時

**通知の受信者**：スケジュール作成操作を行った現在のユーザー（ローカル通知）

**通知内容の概要**：「Schedule created successfully」（スケジュールが正常に作成されました）というシンプルな成功メッセージを表示。モバイル版では「Undo」ボタンが付与され、操作の取り消しが可能です。

**期待されるアクション**：ユーザーは通知を確認し、必要に応じてスケジュール一覧画面で作成されたスケジュールを確認できます。モバイル版では、誤って作成した場合にUndoボタンで即座に取り消すことが可能です。

## 通知種別

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

## 送信仕様

### 基本情報

| 項目 | 内容 |
|-----|------|
| 送信方式 | 同期（Redux dispatch） |
| 優先度 | 中 |
| リトライ | 無し |

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

現在操作中のユーザーのみに対してローカル通知を表示します。Redux storeの`notifications`スライスに追加されることで、画面上に通知が表示されます。

## 通知テンプレート

### アプリ内通知の場合

| 項目 | 内容 |
|-----|------|
| 通知タイプ | message |
| タイトル | なし |
| メッセージ | Schedule created successfully |
| タイムアウト | 10秒（モバイル版）/ 6.5秒（デフォルト） |

### 本文テンプレート

```
Schedule created successfully
```

### ボタン（モバイル版のみ）

| ボタン名 | アクション | 説明 |
|---------|----------|------|
| Undo | undo() | 作成したスケジュールを取り消す |

## テンプレート変数

| 変数名 | 説明 | データ取得元 | 必須 |
|--------|------|-------------|-----|
| なし | 固定メッセージのため変数なし | - | - |

## 送信トリガー・条件

### トリガー一覧

| トリガー種別 | トリガーイベント | 送信条件 | 説明 |
|------------|----------------|---------|------|
| 画面操作 | スケジュール保存ボタン押下 | adding === true かつ 保存成功 | 新規スケジュール作成時 |
| 画面操作 | 将来取引のスケジュール変換確定 | onConfirm実行 | 取引からスケジュールへの変換時 |

### 送信抑止条件

| 条件 | 説明 |
|-----|------|
| 既存スケジュールの更新時 | 新規作成時のみ通知、更新時は別メッセージ |
| 保存失敗時 | エラーが発生した場合は通知しない |

## 処理フロー

### 送信フロー

```mermaid
flowchart TD
    A[スケジュール保存操作] --> B{新規作成か?}
    B -->|Yes| C[schedule/create API呼び出し]
    B -->|No| D[schedule/update API呼び出し]
    C --> E{API成功?}
    E -->|Yes| F[showUndoNotification呼び出し]
    E -->|No| G[エラー処理]
    F --> H[Redux addNotification dispatch]
    H --> I[通知表示]
    I --> J{タイムアウト?}
    J -->|Yes| K[通知自動消去]
    J -->|No - Undo押下| L[undo処理実行]
    L --> K
    D --> M[別メッセージ表示]
```

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

### 参照テーブル一覧

| テーブル名 | 用途 | 備考 |
|-----------|------|------|
| schedules | 作成されたスケジュールの確認 | 通知処理自体では直接参照しない |

### 更新テーブル一覧

| テーブル名 | 操作 | 概要 |
|-----------|------|------|
| なし | - | 通知はクライアント側のRedux storeのみ更新 |

## エラー処理

### エラーケース一覧

| エラー種別 | 発生条件 | 対処方法 |
|----------|---------|---------|
| 通知表示失敗 | Redux storeの異常 | 処理継続（通知なしで操作は完了） |

### リトライ仕様

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

## 配信設定

### レート制限

| 項目 | 内容 |
|-----|------|
| 1分あたり上限 | 制限なし |
| 1日あたり上限 | 制限なし |

### 配信時間帯

制限なし（ユーザー操作に即時応答）

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

- ローカル通知のためネットワーク経由での情報漏洩リスクなし
- 個人情報は含まない固定メッセージ

## 備考

- モバイル版とデスクトップ版で挙動が異なる（モバイル版のみUndoボタン付き）
- `useUndo`フックが`isNarrowWidth`をチェックしてモバイル判定を行う
- タイムアウトはモバイル版で10秒に設定されている

---

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

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

### 推奨読解順序

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

通知の型定義と状態管理の構造を理解することが重要です。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | notificationsSlice.ts | `packages/desktop-client/src/notifications/notificationsSlice.ts` | Notification型の定義（9-26行目）、addNotificationアクションの実装（58-68行目） |

**読解のコツ**: ReduxToolkitのcreateSliceパターンを理解していると読みやすい。`Notification`型の`button`プロパティがUndoボタンの定義に対応している。

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

通知を発行するフックの実装を確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | useUndo.ts | `packages/desktop-client/src/hooks/useUndo.ts` | showUndoNotification関数の実装（27-47行目）、モバイル判定ロジック（29-31行目） |

**主要処理フロー**:
1. **29-31行目**: `isNarrowWidth`でモバイル判定、デスクトップなら早期リターン
2. **33-45行目**: `addNotification`をdispatch、`button`にUndoアクションを設定
3. **20行目**: タイムアウト10秒を定数として定義

#### Step 3: 通知発行元を理解する

スケジュール作成時に通知を発行するコンポーネントを確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | MobileScheduleEditPage.tsx | `packages/desktop-client/src/components/mobile/schedules/MobileScheduleEditPage.tsx` | onSave関数内のshowUndoNotification呼び出し（122-126行目） |
| 3-2 | TransactionEdit.tsx | `packages/desktop-client/src/components/mobile/transactions/TransactionEdit.tsx` | 将来取引のスケジュール変換時の通知（735-742行目） |
| 3-3 | TransactionList.tsx | `packages/desktop-client/src/components/transactions/TransactionList.tsx` | promptToConvertToSchedule関数内の通知（357-364行目） |

**主要処理フロー**:
- **MobileScheduleEditPage.tsx 122-126行目**: 新規作成成功時に`showUndoNotification({ message: t('Schedule created successfully') })`を呼び出し
- **TransactionEdit.tsx 735-742行目**: 将来取引からスケジュール変換時に`addNotification`をdispatch
- **TransactionList.tsx 357-364行目**: デスクトップ版での変換時通知

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

```
MobileScheduleEditPage / TransactionEdit / TransactionList
    │
    ├─ useUndo() hook
    │      └─ showUndoNotification(notification)
    │             │
    │             └─ dispatch(addNotification({...}))
    │                    │
    │                    └─ notificationsSlice.reducer
    │                           └─ state.notifications に追加
    │
    └─ Notifications コンポーネント
           └─ 通知を画面に描画
```

### データフロー図

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

スケジュール保存成功 ───▶ showUndoNotification() ───▶ Redux Store更新
                              │                          │
                              └─ Notification オブジェクト生成    │
                                    │                          │
                                    ▼                          ▼
                              addNotification dispatch ───▶ Notifications.tsx
                                                               │
                                                               ▼
                                                         トースト表示
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| notificationsSlice.ts | `packages/desktop-client/src/notifications/notificationsSlice.ts` | ソース | 通知の状態管理（Redux slice） |
| useUndo.ts | `packages/desktop-client/src/hooks/useUndo.ts` | ソース | Undo通知表示のカスタムフック |
| MobileScheduleEditPage.tsx | `packages/desktop-client/src/components/mobile/schedules/MobileScheduleEditPage.tsx` | ソース | モバイル版スケジュール編集画面 |
| TransactionEdit.tsx | `packages/desktop-client/src/components/mobile/transactions/TransactionEdit.tsx` | ソース | モバイル版取引編集画面 |
| TransactionList.tsx | `packages/desktop-client/src/components/transactions/TransactionList.tsx` | ソース | デスクトップ版取引一覧 |
| Notifications.tsx | `packages/desktop-client/src/components/Notifications.tsx` | ソース | 通知表示コンポーネント |
