# 画面設計書 40-ユーザーアクティビティ画面

## 概要

本ドキュメントは、Fizzyアプリケーションにおけるユーザーアクティビティ画面の設計仕様を記述したものです。

### 本画面の処理概要

ユーザーアクティビティ画面は、特定ユーザーの最近のアクティビティ（イベント履歴）を時系列で表示する画面です。ユーザープロフィール画面内にTurbo Frameとして埋め込まれ、遅延読み込みされます。

**業務上の目的・背景**：チームメンバーが何に取り組んでいるかを把握することは、コラボレーションにおいて重要です。本画面は、特定ユーザーがいつどのカードにコメントしたか、どのカードを作成・更新したかなどのアクティビティを可視化し、チーム内の情報共有を促進します。

**画面へのアクセス方法**：ユーザープロフィール画面の下部に自動的に読み込まれます（Turbo Frame経由）。

**主要な操作・処理内容**：
1. ユーザーの日別アクティビティを確認
2. 過去のアクティビティをページネーションで読み込み
3. アクティビティからカード詳細へ遷移

**画面遷移**：
- 遷移元：ユーザープロフィール画面（Turbo Frameで埋め込み）
- 遷移先：カード詳細画面（イベントクリック時）

**権限による表示制御**：検証済みユーザーの場合のみアクティビティが表示されます。未検証ユーザーの場合はTurbo Frameの読み込み自体がスキップされます。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 62 | タイムライン表示 | 主機能 | 特定ユーザーのアクティビティを表示 |

## 画面種別

一覧（埋め込み）

## URL/ルーティング

- **パス**: `/users/:user_id/events`
- **HTTPメソッド**: GET
- **コントローラ**: `Users::EventsController#show`

## 入出力項目

| 項目名 | 項目ID | 入出力 | データ型 | 必須 | 最大長 | 説明 |
|--------|--------|--------|----------|------|--------|------|
| ユーザーID | user_id | パラメータ | UUID | 必須 | - | 対象ユーザーのID |
| 日付 | day | パラメータ | Date | 任意 | - | 表示開始日（デフォルト:今日） |

## 表示項目

| 項目名 | 説明 | データ取得元 |
|--------|------|-------------|
| セクションタイトル | 「What have you/has {name} been up to?」 | Current.user == @user |
| 日別タイムライン | 日付ごとのイベント一覧 | @day_timeline |
| イベント | 個別のアクティビティ項目 | @day_timeline.events |
| Load moreリンク | 過去のアクティビティ読み込みリンク | @day_timeline.next_day |

## イベント仕様

### 1-イベントクリック

アクティビティに関連するカードへ遷移します。

- **トリガー**: イベント項目をクリック
- **処理フロー**:
  1. イベントに関連付けられたカードを取得
  2. カード詳細画面へ遷移
- **遷移先**: `/cards/:id`

### 2-Load more

過去のアクティビティを読み込みます。

- **トリガー**: 「Load more...」リンクをクリック、または自動ページネーション
- **処理フロー**:
  1. GET `/users/:user_id/events?day=YYYY-MM-DD` を送信
  2. Turbo Frameで追加コンテンツを挿入
- **パラメータ**: day（次の日付）

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

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

| 操作（イベント） | 対象テーブル | 操作種別 | 概要 |
|----------------|-------------|---------|------|
| 画面表示 | events | SELECT | ユーザーのイベントを取得 |

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

この画面ではデータベースの更新は行いません（参照のみ）。

#### events

| 操作 | 項目（カラム名） | 更新値・取得条件 | 備考 |
|-----|-----------------|-----------------|------|
| SELECT | - | creator_id = @user.id | フィルタリング条件 |
| SELECT | - | created_at DESC | 時系列ソート |

## メッセージ仕様

| 種別 | メッセージID | メッセージ内容 | 表示条件 |
|------|------------|---------------|---------|
| タイトル | activity_title_self | What have you been up to? | 自分のアクティビティ |
| タイトル | activity_title_other | What has {name} been up to? | 他ユーザーのアクティビティ |
| リンク | load_more | Load more... | 過去データがある場合 |

## 例外処理

| 例外 | 発生条件 | 処理内容 |
|-----|---------|---------|
| RecordNotFound | ユーザーが存在しない | 404エラーページを表示 |

## 備考

- ユーザープロフィール画面にTurbo Frameとして埋め込まれる
- HTTPキャッシュ（fresh_when）を使用して効率的に更新を検出
- ページネーションはStimulusコントローラ（pagination）で制御
- paginate-on-intersection-valueで自動ページネーション対応
- フィルタリングはcreator_idsで対象ユーザーのイベントに限定

---

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

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

### 推奨読解順序

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

タイムラインとイベントのデータ構造を理解します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | timelined.rb | `app/models/user/timelined.rb` | User::Timelinedモジュール、timeline_forメソッド |
| 1-2 | day_timeline.rb | `app/models/user/day_timeline.rb` | User::DayTimelineクラス |
| 1-3 | schema.rb | `db/schema.rb` | eventsテーブル（281-296行目）の構造 |

**読解のコツ**: `timeline_for`メソッドでDayTimelineオブジェクトを生成。フィルターでcreator_idsを指定してユーザーのイベントに限定。

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

コントローラのshowアクションを確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | events_controller.rb | `app/controllers/users/events_controller.rb` | showアクション、フィルター設定 |

**主要処理フロー**:
1. **4行目**: `before_action :set_user` でユーザーを取得
2. **7行目**: フィルターを作成（creator_ids: [@user.id]）
3. **8行目**: `timeline_for` でDayTimelineを取得
4. **10行目**: `fresh_when` でHTTPキャッシュを設定

#### Step 3: ビューレイヤーを理解する

アクティビティ画面のテンプレート構造を確認します。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | show.html.erb | `app/views/users/events/show.html.erb` | Turbo Frame、タイムライン表示 |

**主要処理フロー**:
- **1行目**: `turbo-frame id="user_events"` でTurbo Frameを定義
- **2行目**: タイトルの文言切り替え（自分 vs 他人）
- **4行目**: Stimulusコントローラ（pagination）を設定
- **5-12行目**: day_timeline_pagination_frame_tagでタイムラインをレンダリング

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

```
Users::EventsController#show
    │
    ├─ set_user
    │      │
    │      └─ Current.account.users.active.find(params[:user_id])
    │
    ├─ @filter = Current.user.filters.new(creator_ids: [@user.id])
    │
    ├─ @day_timeline = Current.user.timeline_for(day_param, filter: @filter)
    │      │
    │      └─ User::DayTimeline.new
    │             │
    │             └─ イベント取得・フィルタリング
    │
    ├─ fresh_when @day_timeline
    │
    └─ render show.html.erb
           │
           ├─ turbo-frame id="user_events"
           │
           ├─ render "events/day", day_timeline: @day_timeline
           │
           └─ link_to "Load more..." (next_dayがある場合)
```

### データフロー図

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

URLパラメータ            EventsController#show
  user_id ──────────────▶ @user 取得
  day ─────────────────▶ day_param
                              │
                        @filter作成
                        (creator_ids: [@user.id])
                              │
                        timeline_for
                              │
                              ▼
                        @day_timeline
                              │
                        fresh_when
                        (HTTPキャッシュ)
                              │
                              ▼
                        show.html.erb
                              │
                        Turbo Frame
                              │
                        ┌─────┼─────┐
                        │           │
                   イベント一覧  Load more
                        │           │
                        │      (next_dayへ)
                        │
                        ▼
                   カード詳細へ
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| events_controller.rb | `app/controllers/users/events_controller.rb` | コントローラ | ユーザーイベント表示 |
| show.html.erb | `app/views/users/events/show.html.erb` | テンプレート | アクティビティ画面 |
| timelined.rb | `app/models/user/timelined.rb` | コンサーン | タイムライン機能 |
| day_timeline.rb | `app/models/user/day_timeline.rb` | モデル | 日別タイムライン |
| _day.html.erb | `app/views/events/_day.html.erb` | パーシャル | 日別イベント表示 |
| routes.rb | `config/routes.rb` | 設定 | ルーティング定義（17行目） |
| schema.rb | `db/schema.rb` | スキーマ | eventsテーブル定義 |
