# 通知設計書 11-エントリ公開失敗通知

## 概要

本ドキュメントは、Decap CMS の編集ワークフローにおいて、エントリの公開処理が失敗した場合に表示されるエラートースト通知の設計を記述する。

### 本通知の処理概要

エントリ公開失敗通知は、編集ワークフロー内で「準備完了（Ready）」状態のエントリを本番環境に公開する際に、バックエンドとの通信エラーやデータ不整合等の理由で公開処理が正常に完了しなかった場合に、ユーザーに対してエラー情報を即座にフィードバックするトースト通知である。

**業務上の目的・背景**：コンテンツ管理ワークフローにおいて、エントリの公開はコンテンツを本番サイトに反映する最終かつ最重要のステップである。公開処理が失敗した場合、ユーザーが失敗に気づかずにコンテンツが未反映のまま放置されることを防ぐ必要がある。本通知により、公開失敗を即座に認知させ、再試行や原因調査を促す。

**通知の送信タイミング**：`publishUnpublishedEntry` アクション内で `backend.publishUnpublishedEntry(entry)` の呼び出しが例外をスローした時点で送信される。具体的には、ワークフローボード上でエントリを「公開」操作した際、またはエントリエディタから直接公開を実行した際に発生する。

**通知の受信者**：公開操作を実行した現在のログインユーザー（ブラウザ上のセッションユーザー）。クライアントサイドのアプリ内通知であるため、操作を実行した本人のみが受信する。

**通知内容の概要**：i18nキー `ui.toast.onFailToPublishEntry` に対応するローカライズされたエラーメッセージが表示される。英語では "Failed to publish: %{details}"、日本語では "エントリの公開に失敗しました。%{details}" となる。`%{details}` にはバックエンドから返されたエラーオブジェクトの内容が埋め込まれる。

**期待されるアクション**：ユーザーはエラー内容を確認し、ネットワーク接続の確認、ブラウザのリロード、再度の公開操作の試行、または管理者への報告を行うことが期待される。

## 通知種別

アプリ内トースト通知（react-toastify ベース）

## 送信仕様

### 基本情報

| 項目 | 内容 |
|-----|------|
| 送信方式 | 同期（Redux dispatch） |
| 優先度 | 高 |
| リトライ | なし（通知自体のリトライはなし。公開操作の再試行はユーザー操作に依存） |

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

操作を実行した現在のブラウザセッションユーザーに対して、クライアントサイドで直接トースト通知を表示する。Redux ストアの `notifications` ステートに通知が追加され、`Notifications` コンポーネントが react-toastify を通じてUIに描画する。

## 通知テンプレート

### メール通知の場合

該当なし（本通知はアプリ内トースト通知のみ）

### 本文テンプレート

```
Failed to publish: {details}
```

日本語の場合：
```
エントリの公開に失敗しました。{details}
```

### 添付ファイル

該当なし

## テンプレート変数

| 変数名 | 説明 | データ取得元 | 必須 |
|--------|------|-------------|-----|
| details | エラーの詳細情報 | `backend.publishUnpublishedEntry()` がスローした Error オブジェクト | Yes |

## 送信トリガー・条件

### トリガー一覧

| トリガー種別 | トリガーイベント | 送信条件 | 説明 |
|------------|----------------|---------|------|
| 画面操作 | ワークフローボードまたはエディタからのエントリ公開操作 | `backend.publishUnpublishedEntry(entry)` が例外をスローした場合 | `publishUnpublishedEntry` thunkアクション内の catch ブロックで発火 |

### 送信抑止条件

| 条件 | 説明 |
|-----|------|
| 公開処理が成功した場合 | 成功時は `ui.toast.entryPublished` の成功通知が表示され、本エラー通知は表示されない |

## 処理フロー

### 送信フロー

```mermaid
flowchart TD
    A[ユーザーがエントリ公開を実行] --> B[publishUnpublishedEntry thunk dispatch]
    B --> C[UNPUBLISHED_ENTRY_PUBLISH_REQUEST dispatch]
    C --> D[backend.publishUnpublishedEntry 呼び出し]
    D --> E{公開結果}
    E -->|成功| F[成功通知 entryPublished dispatch]
    E -->|失敗 catch| G[addNotification dispatch - onFailToPublishEntry]
    G --> H[UNPUBLISHED_ENTRY_PUBLISH_FAILURE dispatch]
    F --> I[UNPUBLISHED_ENTRY_PUBLISH_SUCCESS dispatch]
    H --> J[トースト表示 8秒後自動消去]
    I --> K[終了]
    J --> K
```

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

### 参照テーブル一覧

該当なし（クライアントサイドのみの処理。バックエンドAPIとの通信結果のみ使用）

### 更新テーブル一覧

| テーブル名 | 操作 | 概要 |
|-----------|------|------|
| Redux Store: notifications | INSERT | 通知オブジェクトを notifications 配列に追加 |
| Redux Store: editorialWorkflow | UPDATE | UNPUBLISHED_ENTRY_PUBLISH_FAILURE により公開リクエスト状態をリセット |

#### Redux Store 更新詳細

| 操作 | 項目 | 更新値 | 備考 |
|-----|------|-------|------|
| INSERT | notifications.notifications[] | `{ id: uuid(), message: { key: 'ui.toast.onFailToPublishEntry', details: error }, type: 'error', dismissAfter: 8000 }` | uuid v4 で一意ID生成 |

## エラー処理

### エラーケース一覧

| エラー種別 | 発生条件 | 対処方法 |
|----------|---------|---------|
| バックエンドAPI通信エラー | ネットワーク障害、サーバーエラー等 | エラー詳細をトースト通知で表示し、UNPUBLISHED_ENTRY_PUBLISH_FAILURE を dispatch |
| 認証エラー | トークン期限切れ等 | エラー詳細をトースト通知で表示（別途セッション切断通知が発生する可能性あり） |

### リトライ仕様

| 項目 | 内容 |
|-----|------|
| リトライ回数 | 0回（自動リトライなし） |
| リトライ間隔 | 該当なし |
| リトライ対象エラー | 該当なし（ユーザーによる手動再試行のみ） |

## 配信設定

### レート制限

| 項目 | 内容 |
|-----|------|
| 1分あたり上限 | なし（明示的な制限なし） |
| 1日あたり上限 | なし |

### 配信時間帯

制限なし（ユーザー操作に応じて随時発生）

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

- エラーメッセージにバックエンドの内部情報（スタックトレース等）が含まれる可能性がある。ただし、クライアントサイドのトースト通知であり、操作ユーザー本人のブラウザにのみ表示されるため、情報漏洩リスクは限定的である。
- エラーオブジェクトの `details` がそのまま `%{details}` テンプレート変数に埋め込まれるため、バックエンドAPIのエラーレスポンス設計に依存する。

## 備考

- テストコード `editorialWorkflow.spec.js` にて、公開失敗時の通知 dispatch が検証されている（行169-214）。
- 本通知の i18nキーは `ui.toast.onFailToPublishEntry` であり、多言語対応済みである。
- `dismissAfter: 8000` が設定されており、8秒後に自動消去される。

---

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

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

### 推奨読解順序

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

まず、通知のデータ構造と型定義を理解することが重要である。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | notifications.ts (actions) | `packages/decap-cms-core/src/actions/notifications.ts` | `NotificationPayload` インターフェース（行8-12）で通知データの型を理解する。`message` が `string | NotificationMessage` の union 型であること、`dismissAfter` と `type` フィールドの役割を把握する |
| 1-2 | notifications.ts (reducers) | `packages/decap-cms-core/src/reducers/notifications.ts` | `Notification` 型（行17-22）と `NotificationsState` 型（行24-26）でストア内の通知状態構造を理解する |

**読解のコツ**: `NotificationMessage` は `key` と `details` を持つオブジェクトで、`key` はi18nのローカライズキーとして `react-polyglot` の `t()` 関数で翻訳される。

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

公開処理の起点となる thunk アクションを特定する。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | editorialWorkflow.ts | `packages/decap-cms-core/src/actions/editorialWorkflow.ts` | `publishUnpublishedEntry` 関数（行482-523）が公開処理のエントリーポイント。`collectionName` と `slug` を受け取り、バックエンドAPIを呼び出す |

**主要処理フロー**:
1. **行487**: `selectUnpublishedEntry` でReduxストアから対象エントリを取得
2. **行488**: `unpublishedEntryPublishRequest` を dispatch（ローディング状態開始）
3. **行490**: `backend.publishUnpublishedEntry(entry)` でバックエンドAPIを呼び出し
4. **行512-520**: catch ブロックで `addNotification` を dispatch（**本通知の発火箇所**）
5. **行520**: `unpublishedEntryPublishError` を dispatch（エラー状態への遷移）

#### Step 3: 通知ディスパッチの仕組みを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | notifications.ts (actions) | `packages/decap-cms-core/src/actions/notifications.ts` | `addNotification` 関数（行18-19）が `NOTIFICATION_SEND` アクションを生成する仕組みを理解する |
| 3-2 | notifications.ts (reducers) | `packages/decap-cms-core/src/reducers/notifications.ts` | `NOTIFICATION_SEND` ケース（行40-47）で uuid を付与して通知配列に追加する処理を理解する |

#### Step 4: UIレンダリングを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | Notifications.tsx | `packages/decap-cms-core/src/components/UI/Notifications.tsx` | `useEffect` 内（行30-52）で新規通知を検出し、`toast()` で react-toastify のトーストを表示する。`t()` 関数でi18nキーを翻訳している（行37）。`dismissAfter` が `autoClose` に渡される（行39） |

#### Step 5: i18nメッセージを確認する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 5-1 | index.js (en) | `packages/decap-cms-locales/src/en/index.js` | 行278: `onFailToPublishEntry: 'Failed to publish: %{details}'` |
| 5-2 | index.js (ja) | `packages/decap-cms-locales/src/ja/index.js` | 行265: `onFailToPublishEntry: 'エントリの公開に失敗しました。%{details}'` |

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

```
publishUnpublishedEntry (editorialWorkflow.ts:482)
    |
    +-- unpublishedEntryPublishRequest (editorialWorkflow.ts:194)
    |
    +-- backend.publishUnpublishedEntry (バックエンドAPI呼び出し)
    |       |
    |       +-- [失敗時] catch ブロック (editorialWorkflow.ts:512)
    |               |
    |               +-- addNotification (notifications.ts:18)
    |               |       |
    |               |       +-- NOTIFICATION_SEND → reducer (reducers/notifications.ts:40)
    |               |               |
    |               |               +-- Notifications.tsx useEffect (Notifications.tsx:30)
    |               |                       |
    |               |                       +-- toast() (react-toastify)
    |               |
    |               +-- unpublishedEntryPublishError (editorialWorkflow.ts:208)
```

### データフロー図

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

ユーザー公開操作 ──────> publishUnpublishedEntry thunk ──────> Redux dispatch
  (collectionName,               |                                    |
   slug)                 backend.publishUnpublishedEntry              |
                                 |                            NOTIFICATION_SEND
                         [例外スロー]                                 |
                                 |                            reducer: notifications
                         Error オブジェクト                           |
                                 |                            Notifications コンポーネント
                         addNotification({                           |
                           message: {                          react-toastify toast()
                             key: 'ui.toast.                         |
                               onFailToPublishEntry',         トースト表示（8秒後自動消去）
                             details: error
                           },
                           type: 'error',
                           dismissAfter: 8000
                         })
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| editorialWorkflow.ts | `packages/decap-cms-core/src/actions/editorialWorkflow.ts` | ソース | 公開処理のthunkアクション。エラー時に通知を dispatch する |
| notifications.ts (actions) | `packages/decap-cms-core/src/actions/notifications.ts` | ソース | `addNotification` アクションクリエーター |
| notifications.ts (reducers) | `packages/decap-cms-core/src/reducers/notifications.ts` | ソース | 通知ステートの管理リデューサー |
| Notifications.tsx | `packages/decap-cms-core/src/components/UI/Notifications.tsx` | ソース | トースト通知のUIコンポーネント |
| index.js (en) | `packages/decap-cms-locales/src/en/index.js` | i18n | 英語翻訳定義 |
| index.js (ja) | `packages/decap-cms-locales/src/ja/index.js` | i18n | 日本語翻訳定義 |
| editorialWorkflow.spec.js | `packages/decap-cms-core/src/actions/__tests__/editorialWorkflow.spec.js` | テスト | 公開失敗時の通知dispatchを検証するテスト |
