# 画面設計書 42-メールアドレス追加完了画面

## 概要

本ドキュメントは、Fizzyアプリケーションにおけるメールアドレス追加完了画面の設計仕様を定義したものです。ユーザーがメールアドレス変更をリクエストした後、確認メールが送信されたことを通知する画面について記載しています。

### 本画面の処理概要

本画面は、メールアドレス変更リクエストが正常に処理され、確認メールが送信されたことをユーザーに通知する画面です。ユーザーは送信されたメール内のリンクをクリックして、メールアドレスの変更を完了させる必要があります。

**業務上の目的・背景**：メールアドレス変更のセキュリティを確保するため、新しいメールアドレスへの確認メール送信は必須のプロセスです。本画面は、このプロセスが開始されたことをユーザーに明確に伝え、次のステップ（メール確認）への誘導を行います。確認メールを受け取り、リンクをクリックするまで実際のメールアドレス変更は完了しないため、この中間ステップの画面が重要です。

**画面へのアクセス方法**：メールアドレス追加画面（No.41）でフォームを送信し、処理が正常に完了した後に自動的に遷移します。直接URLを入力してアクセスすることはできません。

**主要な操作・処理内容**：
1. 確認メールが送信されたメールアドレスを表示する
2. メール内のリンクをクリックするよう案内する
3. 「Done」ボタンをクリックしてプロフィール編集画面に戻る

**画面遷移**：
- 遷移元：メールアドレス追加画面（No.41）
- 遷移先：プロフィール編集画面（No.39）

**権限による表示制御**：本画面は認証済みユーザーのみアクセス可能です。メールアドレス追加処理が成功した直後のみ表示されます。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 71 | メールアドレス変更 | 主機能 | メールアドレス追加後の確認表示 |

## 画面種別

完了（確認）

## URL/ルーティング

- パス: `/users/:user_id/email_addresses`
- HTTPメソッド: POST（リダイレクト後のレンダリング）
- ルート名: `user_email_addresses_path`
- コントローラ: `Users::EmailAddressesController#create`
- ビュー: `app/views/users/email_addresses/create.html.erb`

## 入出力項目

本画面には入力項目はありません。

## 表示項目

| 項目名 | 説明 | 表示条件 |
|--------|------|----------|
| ページタイトル | "Confirm your new email address" | 常時 |
| ヘッダータイトル | "Check your email" | 常時 |
| 送信先メールアドレス | 確認メール送信先のメールアドレス（強調表示） | 常時 |
| 案内文 | メール内リンクで確認するよう案内 | 常時 |
| 戻るリンク | "My profile" | 常時 |
| Doneボタン | プロフィール編集画面への遷移 | 常時 |

## イベント仕様

### 1-戻るリンク押下

ヘッダーの「My profile」リンクをクリックすると、プロフィール編集画面（`edit_user_path`）に遷移します。キーボードショートカット（左矢印キー、Escキー）でも同様の動作が可能です。

### 2-Doneボタン押下

プロフィール編集画面（`edit_user_path`）に遷移します。

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| - | - | - | 本画面ではデータベース更新は行われない |

本画面は確認メール送信完了の通知のみを行い、データベースへの直接的な更新は行いません。

### テーブル別更新項目詳細

本画面では直接的なデータベース更新はありません。

## メッセージ仕様

| メッセージID | 種別 | メッセージ内容 | 表示条件 |
|-------------|------|---------------|----------|
| MSG-001 | 案内 | We just sent an email to **{メールアドレス}** | 常時表示 |
| MSG-002 | 案内 | Hit the link in the email to confirm this is the email address you want to use with Fizzy going forward. | 常時表示 |

## 例外処理

| 例外ケース | 対応 |
|-----------|------|
| 認証されていない | ログイン画面へリダイレクト |
| 直接アクセス（POSTなし） | 画面が表示されない（createアクション経由でのみアクセス可能） |

## 備考

- 本画面はPOSTリクエストの結果としてレンダリングされる
- 送信先メールアドレスは`params[:email_address]`から取得される
- ブラウザのリロードを行うと、POSTリクエストが再送信される可能性がある点に注意
- メール内の確認リンクには有効期限（30分）がある

---

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

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

### 推奨読解順序

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

本画面で直接扱うデータ構造を理解します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | user.rb | `app/models/user.rb` | Userモデルとaccountの関係を確認 |
| 1-2 | email_address_changeable.rb | `app/models/user/email_address_changeable.rb` | メール送信処理の詳細を確認 |

**読解のコツ**: 本画面は表示のみのため、データ構造の理解は前画面（No.41）と共通です。

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

処理の起点となるコントローラを特定します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | email_addresses_controller.rb | `app/controllers/users/email_addresses_controller.rb` | createアクションがビューをレンダリングする流れを確認 |

**主要処理フロー**:
1. **行8-16**: `create`アクション - 重複チェック後、確認メール送信
2. **行15**: `send_email_address_change_confirmation`呼び出し後、暗黙的にcreate.html.erbがレンダリングされる

#### Step 3: ビューテンプレートを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | create.html.erb | `app/views/users/email_addresses/create.html.erb` | 表示内容とリンク先を確認 |

**主要処理フロー**:
- **行1**: ページタイトルの設定
- **行11**: `params[:email_address]`で送信先メールアドレスを表示
- **行14**: Doneリンクの遷移先

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

```
Users::EmailAddressesController#create
    │
    ├─ set_user (before_action)
    │      └─ Current.identity.users.find(params[:user_id])
    │
    ├─ Identity.find_by_email_address(new_email_address)
    │
    ├─ 重複チェック（既存ユーザー確認）
    │      └─ リダイレクト（エラー時）
    │
    └─ @user.send_email_address_change_confirmation(new_email_address)
           │
           └─ UserMailer.email_change_confirmation.deliver_later
                  │
                  └─ create.html.erb レンダリング
```

### データフロー図

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

前画面からの             EmailAddressesController#create    create.html.erb
email_address ───▶              │                          （確認画面表示）
(params)                        │
                                ├─▶ メール送信
                                │
                                └─▶ params[:email_address]を
                                    ビューに渡す
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| email_addresses_controller.rb | `app/controllers/users/email_addresses_controller.rb` | コントローラ | 画面制御・ビジネスロジック |
| create.html.erb | `app/views/users/email_addresses/create.html.erb` | ビュー | 完了画面の表示 |
| user.rb | `app/models/user.rb` | モデル | ユーザーエンティティ |
| email_address_changeable.rb | `app/models/user/email_address_changeable.rb` | Concern | メールアドレス変更ロジック |
| routes.rb | `config/routes.rb` | 設定 | ルーティング定義（行21-23） |
