# 画面設計書 17-EditLink画面

## 概要

本ドキュメントは、Wikipedia iOSアプリにおけるリンク編集画面（EditLinkViewController）の設計仕様を定義するものです。

### 本画面の処理概要

リンク編集画面は、記事編集時に既存の内部リンクを編集するための画面です。ユーザーはリンクの表示テキスト（display text）を変更したり、リンク先の記事を検索して変更したり、リンク自体を削除することができます。

**業務上の目的・背景**：Wikipedia記事の内部リンクは、記事間のナビゲーションを提供する重要な要素です。リンクの表示テキストがリンク先と異なる場合（パイプリンク）や、リンク先を別の記事に変更したい場合など、リンクの編集が必要になることがあります。本画面は、これらの編集操作をシンプルなUIで提供します。

**画面へのアクセス方法**：記事編集画面（EditorViewController）で既存のリンクを選択し、リンク編集ツールバーボタンをタップすることでアクセスします。

**主要な操作・処理内容**：
1. 表示テキスト（display text）の編集
2. リンク先記事の変更（検索機能を使用）
3. リンクの削除
4. 変更の適用（Done/Submit）

**画面遷移**：
- 遷移元: EditorViewController（記事編集画面）
- 遷移先: SearchViewController（リンク先検索）、閉じて呼び出し元に戻る

**権限による表示制御**：特になし。

## 関連機能

| 機能No | 機能名 | 関連種別 | 関連する操作・処理 |
|--------|--------|----------|------------------|
| 25 | リンク挿入/編集 | 主機能 | 既存リンクの編集 |

## 画面種別

編集

## URL/ルーティング

iOSネイティブアプリのため、URLルーティングは適用されません。モーダルまたはNavigationController内で表示されます。

## 入出力項目

| 項目名 | 型 | 入力/出力 | 必須 | 説明 |
|--------|-----|---------|------|------|
| link | Link | 入力 | 必須 | 編集対象のリンク情報 |
| siteURL | URL | 入力 | 任意 | サイトURL（デフォルト: primarySiteURL） |
| dataStore | MWKDataStore | 入力 | 必須 | データストア |
| theme | Theme | 入力 | 必須 | 表示テーマ |
| delegate | EditLinkViewControllerDelegate | 入力 | 必須 | デリゲート |

## 表示項目

| 項目名 | 表示形式 | 説明 |
|--------|---------|------|
| 表示テキストラベル | テキスト | "Display text" |
| 表示テキスト入力 | UITextView | 編集可能な表示テキスト |
| リンク先ラベル | テキスト | "Link target" |
| リンク先記事プレビュー | セル | ArticleRightAlignedImageCollectionViewCellを使用 |
| リンク削除ボタン | ボタン | "Remove link"（赤色） |
| ローディングインジケーター | UIActivityIndicatorView | 記事取得中 |

## イベント仕様

### 1-Submitボタンタップ

リンクの変更を適用する処理。

- 表示テキストとリンク先タイトルを取得
- delegate.editLinkViewController(_:didFinishEditingLink:linkTarget:)を呼び出し

### 2-キャンセルボタンタップ

変更を破棄してモーダルを閉じる処理。

- delegate.editLinkViewController(_:didTapCloseButton:)を呼び出し

### 3-リンク先セルタップ

リンク先を変更するために検索画面を表示。

- SearchViewControllerを生成
- 現在のリンク先タイトルを検索バーに設定
- navigateToSearchResultActionで記事選択時にarticleURLを更新
- 選択後、navigationController?.popViewController()で戻る

### 4-リンク削除ボタンタップ

リンクを削除する処理。

- delegate.editLinkViewControllerDidRemoveLink()を呼び出し

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

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

ローカルデータベースへの直接的な更新はありません。変更内容はdelegateを通じてエディターに返されます。

## メッセージ仕様

| メッセージID | 種別 | メッセージ内容 | 表示条件 |
|-------------|------|--------------|---------|
| edit-link-display-text-title | ラベル | "Display text" | 常時表示 |
| edit-link-link-target-title | ラベル | "Link target" | 常時表示 |
| edit-link-remove-link-title | ボタン | "Remove link" | 常時表示 |
| CommonStrings.editLinkTitle | タイトル | "Edit Link" | ナビゲーションバー |
| CommonStrings.surveySubmitActionTitle | ボタン | "Done"/"Submit" | ナビゲーションバー右 |

## 例外処理

| 例外状況 | 処理内容 |
|---------|---------|
| 記事タイトル抽出失敗 | delegate.editLinkViewController(_:didFailToExtractArticleTitleFromArticleURL:)を呼び出し |
| 記事情報取得失敗 | プレビューが空のまま（ローディング継続） |

## 備考

- ThemeableViewControllerを継承
- WMFNavigationBarConfiguringプロトコルに準拠
- ArticleRightAlignedImageCollectionViewCellを再利用して記事プレビューを表示
- Link構造体からarticleURLを生成
- 表示テキストが未入力の場合はlink.labelまたはlink.pageを使用

---

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

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

### 推奨読解順序

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

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 1-1 | Link.swift | （参照のみ） | Link構造体、page、label、articleURL()メソッド |

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

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 2-1 | EditLinkViewController.swift | `Wikipedia/Code/EditLinkViewController.swift` | init()（35-48行目）、viewDidLoad()（54-68行目） |

**主要処理フロー**:
1. **35-48行目**: init - Link、siteURL、dataStoreの初期化、articleURLの生成
2. **54-68行目**: viewDidLoad - UI設定、テキストビュー設定
3. **70-74行目**: viewWillAppear - 記事情報取得、ナビゲーション設定

#### Step 3: 記事情報取得を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 3-1 | EditLinkViewController.swift | `Wikipedia/Code/EditLinkViewController.swift` | fetchArticle()（86-100行目）、updateView()（102-112行目） |

**主要処理フロー**:
- **86-100行目**: fetchArticle - キャッシュまたはAPIから記事取得
- **102-112行目**: updateView - ArticleRightAlignedImageCollectionViewCellに表示

#### Step 4: リンク先検索を理解する

| 順序 | ファイル | パス | 読解ポイント |
|-----|---------|------|-------------|
| 4-1 | EditLinkViewController.swift | `Wikipedia/Code/EditLinkViewController.swift` | searchArticles()（155-178行目） |

**主要処理フロー**:
- **155-178行目**: SearchViewController生成、navigateToSearchResultAction設定

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

```
EditLinkViewController
    │
    ├─ init(link:siteURL:dataStore:theme:)
    │      └─ link.articleURL(for: siteURL)
    │
    ├─ viewDidLoad()
    │      ├─ displayTextView.text = link.label ?? link.page
    │      └─ articleCell設定
    │
    ├─ viewWillAppear()
    │      ├─ fetchArticle()
    │      │      ├─ [キャッシュあり] updateView(with: article)
    │      │      └─ [キャッシュなし] articleSummaryController.updateOrCreateArticleSummaryForArticle()
    │      │                              └─ updateView(with: article)
    │      └─ configureNavigationBar()
    │
    ├─ finishEditing() [Done button]
    │      └─ delegate?.editLinkViewController(_:didFinishEditingLink:linkTarget:)
    │
    ├─ close() [Cancel button]
    │      └─ delegate?.editLinkViewController(_:didTapCloseButton:)
    │
    ├─ removeLink() [Remove link button]
    │      └─ delegate?.editLinkViewControllerDidRemoveLink()
    │
    └─ searchArticles() [Link target tap]
           └─ SearchViewController
                  └─ navigateToSearchResultAction
                         └─ self.articleURL = articleURL
```

### データフロー図

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

Link                  EditLinkViewController             delegate
(page, label)    ───▶ 表示テキスト編集               ───▶ didFinishEditingLink
                      リンク先変更                         (displayText, linkTarget)
                      リンク削除                          didRemoveLink

articleURL            fetchArticle()                    ArticleCell
                 ───▶ articleSummaryController      ───▶ (プレビュー表示)
```

### 関連ファイル一覧

| ファイル | パス | 種別 | 役割 |
|---------|------|------|------|
| EditLinkViewController.swift | `Wikipedia/Code/EditLinkViewController.swift` | ソース | メインViewController |
| EditLinkViewController.xib | `Wikipedia/Code/EditLinkViewController.xib` | XIB | レイアウト定義 |
| SearchViewController.swift | `Wikipedia/Code/SearchViewController.swift` | ソース | リンク先検索 |
| ArticleRightAlignedImageCollectionViewCell.swift | `Wikipedia/Code/ArticleRightAlignedImageCollectionViewCell.swift` | ソース | 記事プレビューセル |
| ThemeableViewController.swift | `Wikipedia/Code/ThemeableViewController.swift` | ソース | 基底クラス |
| Link.swift | （参照のみ） | ソース | リンクデータ構造 |
