# 画面設計書 19-プライバシーポリシー

## 概要

本ドキュメントは、OpenCodeコンソールのプライバシーポリシーページの設計書である。OpenCodeサービスのプライバシーポリシー（個人情報保護方針）を表示する法的文書ページである。

### 本画面の処理概要

プライバシーポリシーページは、OpenCodeサービスにおける個人情報の取り扱いについて説明する法的文書を表示する静的ページである。ユーザーデータの収集、使用、保護に関するポリシーを詳細に記載し、ユーザーの権利と選択肢について説明する。

**業務上の目的・背景**：Webサービスを提供する企業は、法的要件（GDPR、CCPA等）を満たすためにプライバシーポリシーを公開する必要がある。本ページは、OpenCodeがどのように個人情報を取り扱うかをユーザーに明示し、透明性と法令遵守を確保する。

**画面へのアクセス方法**：フッターのリンク、または`/legal/privacy-policy`パスに直接アクセス。認証不要で誰でもアクセス可能な公開ページ。

**主要な操作・処理内容**：
1. プライバシーポリシー文書の閲覧
2. 目次リンクによるセクションへのジャンプ
3. 利用規約ページへのリンク

**画面遷移**：利用規約ページ（/legal/terms-of-service）へのリンクあり。ヘッダーから他の公開ページへ遷移可能。

**権限による表示制御**：公開ページのため、権限による表示制御は存在しない。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 56 | 国際化 | 主機能 | 法的文書の多言語表示 |

## 画面種別

情報表示（静的コンテンツ）

## URL/ルーティング

| 環境 | URL |
|------|-----|
| 本番 | `https://opencode.ai/legal/privacy-policy` |
| 開発 | `http://localhost:3000/legal/privacy-policy` |

ルーティング定義: `packages/console/app/src/routes/legal/privacy-policy/index.tsx`

## 入出力項目

### 入力項目

本画面は静的コンテンツ表示のため、ユーザー入力項目は存在しない。

### 出力項目

| 項目名 | データ型 | 表示条件 | 備考 |
|--------|----------|----------|------|
| ページタイトル | string | 常時 | "OpenCode \| Privacy Policy" |
| 発効日 | string | 常時 | "Effective date: Dec 16, 2025" |
| ポリシー本文 | HTML | 常時 | 静的HTMLコンテンツ |

## 表示項目

### ヘッダーセクション
- サイトロゴ
- ナビゲーションリンク

### コンテンツセクション（プライバシーポリシー本文）

| セクション | 見出し | 内容概要 |
|-----------|--------|---------|
| 導入部 | Privacy Policy | サービス利用に関する同意説明 |
| 定義 | Definitions | 用語定義（Personal Data、Usage Data等） |
| 収集情報 | What Information Do We Collect? | 収集する情報の種類 |
| 情報源 | What Are the Sources of Personal Information? | 情報の収集元 |
| 使用目的 | How Do We Use Your Personal Information? | 情報の使用目的 |
| 共有先 | Will Your Personal Information Be Shared? | 第三者への情報共有 |
| Cookie | Do We Use Cookies and Other Tracking Technologies? | トラッキング技術 |
| 第三者サービス | Third-Party Websites/Applications | 外部サービスへのリンク |
| 保持期間 | How Long Do We Keep Your Personal Information? | データ保持期間 |
| セキュリティ | How Do We Keep Your Personal Information Safe? | セキュリティ対策 |
| 児童保護 | Do We Collect Information from Minors? | 13歳未満の情報収集禁止 |
| ユーザー権利 | What Are Your Privacy Rights? | ユーザーの権利 |
| DNT | Controls for Do-Not-Track Features | DNT設定への対応 |
| カリフォルニア州 | Do California Residents Have Specific Privacy Rights? | CCPA対応 |
| 更新 | Do We Make Updates to This Notice? | ポリシー更新について |
| 連絡先 | How Can You Contact Us? | 問い合わせ先 |
| リクエスト | How Can You Review, Update, or Delete Your Data? | データアクセス要求 |

### フッターセクション
- サイトフッター
- 法的情報リンク

## イベント仕様

### 1-目次リンククリック

| 項目 | 内容 |
|------|------|
| トリガー | 目次内のリンククリック |
| 処理 | ブラウザのアンカーリンク機能 |
| 結果 | 対応するセクションへスクロール |

### 2-利用規約リンククリック

| 項目 | 内容 |
|------|------|
| トリガー | 利用規約へのリンククリック |
| 処理 | language.route("/legal/terms-of-service")でURL生成 |
| 結果 | 利用規約ページへ遷移 |

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

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

本画面は静的コンテンツ表示のため、データベース操作は発生しない。

## メッセージ仕様

本画面のコンテンツは静的HTMLとして直接記述されており、i18n国際化システムは使用していない（将来的な多言語対応の余地あり）。

| 要素 | メッセージ種別 | 内容 |
|------|---------------|------|
| title | ページタイトル | "OpenCode \| Privacy Policy" |
| description | メタ説明 | "OpenCode privacy policy" |

## 例外処理

本画面は静的コンテンツ表示のため、例外処理は存在しない。

## 備考

- 発効日は2025年12月16日
- 法的文書のため、内容変更には法務確認が必要
- 現在のコンテンツは英語のみ（多言語対応は将来課題）
- LocaleLinksコンポーネントで言語別URLを設定
- ブランドページと共通のCSSを使用（brand/index.css）
- 独自のCSSも追加（index.css）

---

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

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

### 推奨読解順序

#### Step 1: 構造を理解する

本コンポーネントは静的HTMLコンテンツを表示するシンプルな構造。

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | index.tsx | `packages/console/app/src/routes/legal/privacy-policy/index.tsx` | コンポーネント全体構造（1-15行目で構造定義、以降HTMLコンテンツ） |

**読解のコツ**: 法的文書は静的HTMLとして直接記述されている。i18n国際化は使用せず、将来的な多言語対応の余地を残している。

#### Step 2: 共通コンポーネントを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | header.tsx | `packages/console/app/src/component/header.tsx` | ヘッダーナビゲーション |
| 2-2 | footer.tsx | `packages/console/app/src/component/footer.tsx` | フッター |
| 2-3 | legal.tsx | `packages/console/app/src/component/legal.tsx` | 法的情報コンポーネント |
| 2-4 | locale-links.tsx | `packages/console/app/src/component/locale-links.tsx` | 多言語リンク |

#### Step 3: スタイリングを理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | index.css | `packages/console/app/src/routes/legal/privacy-policy/index.css` | ページ固有スタイル |
| 3-2 | brand/index.css | `packages/console/app/src/routes/brand/index.css` | 共通ブランドスタイル |

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

```
PrivacyPolicy (index.tsx)
    |
    +-- <Title> -> "OpenCode | Privacy Policy"
    |
    +-- <LocaleLinks path="/legal/privacy-policy" />
    |
    +-- <Meta name="description" />
    |
    +-- <div data-component="container">
            |
            +-- <Header />
            |
            +-- <div data-component="content">
            |       |
            |       +-- <section data-component="brand-content">
            |               |
            |               +-- <article data-component="privacy-policy">
            |                       |
            |                       +-- <h1>Privacy Policy</h1>
            |                       +-- <p class="effective-date">...</p>
            |                       +-- (静的HTMLコンテンツ)
            |
            +-- <Footer />
            |
            +-- <Legal />
```

### データフロー図

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

(なし) ───────────────> 静的コンテンツ描画 ──────────> HTMLページ表示

言語コンテキスト ──────> useLanguage()
                              |
                              v
                        language.route() ─────────────> 利用規約リンクURL生成
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| index.tsx | `packages/console/app/src/routes/legal/privacy-policy/index.tsx` | ソース | メイン画面コンポーネント |
| index.css | `packages/console/app/src/routes/legal/privacy-policy/index.css` | スタイル | ページ固有スタイル |
| brand/index.css | `packages/console/app/src/routes/brand/index.css` | スタイル | 共通ブランドスタイル |
| header.tsx | `packages/console/app/src/component/header.tsx` | ソース | 共通ヘッダー |
| footer.tsx | `packages/console/app/src/component/footer.tsx` | ソース | 共通フッター |
| legal.tsx | `packages/console/app/src/component/legal.tsx` | ソース | 法的情報コンポーネント |
| locale-links.tsx | `packages/console/app/src/component/locale-links.tsx` | ソース | 多言語リンク |
| language.tsx | `packages/console/app/src/context/language.tsx` | ソース | 言語コンテキスト |
