Exploreページコンポーネント

公開された作品を閲覧・検索するためのページを構成するコンポーネント群です。

`ExploreSearchControls`

Exploreページのヘッダーと検索・フィルタリング機能を提供する統合コンポーネントです。

責務:
- 統一されたページヘッダー: Bookshelfページと同じデザインパターンを採用し、一貫したユーザー体験を提供する。
  - アイコン付きのページタイトル（Storeアイコン）
  - 中央配置の検索バー
  - 右側のアクションボタン（Clearボタン）
- レスポンシブデザイン: モバイルとデスクトップで異なるレイアウトを提供。
  - モバイル: 2行レイアウト（タイトル + 検索バー）
  - デスクトップ: 3カラムレイアウト（タイトル + 検索バー + アクションボタン）
- 検索機能: タイトルやあらすじでの作品検索（デバウンス処理付き）
- タグフィルタリング:
  - 横スクロール可能なタグストリップ: 画面の縦幅を占有せず、大量のタグにも対応
  - 検索付きPopoverメニュー: タグが多い場合でも、キーワード検索で瞬時に目的のタグを見つけられる
  - 視覚的フィードバック: アクティブなタグを強調表示し、選択状態を明確に示す
- フィルターのクリア: ワンクリックですべてのフィルター（検索クエリ + タグ）をクリア
主要なProps:
- popularTags: 人気タグのリスト（タグ名と使用回数を含む）
使用している主要なUIコンポーネント:
- Input: 検索バー
- Button: アクションボタン
- ScrollArea: 横スクロール可能なタグストリップ
- Popover: タグフィルタリングメニューのコンテナ
- Command: 検索付きのタグリスト（CommandInput, CommandList, CommandItemなど）
デザイントークン:
- アイコン: Store（Exploreページ）
- カラー: primary/10（アイコン背景）、primary（アクティブタグ）、secondary（非アクティブタグ）
- シャドウ: shadow-sm（検索バー）、shadow-lg（アクティブタグ）
スケーラビリティ:
- タグが100個以上になっても、横スクロールとPopover検索により快適に操作可能
- グラデーションマスク（フェード効果）でスクロール可能性を視覚的に示唆

`ExplorePageClient`

公開作品のグリッド表示とインラインエクスパンダー（詳細パネル）を管理するクライアントコンポーネントです。

責務:
- 作品カードのグリッド表示: レスポンシブなグリッドレイアウトで作品を一覧表示
- インラインエクスパンダー: 作品カードをクリックすると、グリッド内に詳細パネルを展開
  - カバーアート、タイトル、あらすじ、タグ、アクションボタンを表示
  - 選択中のカードを視覚的に強調表示（リング + インジケーター）
  - 展開時に自動スクロールし、詳細パネルを画面中央に配置
- アニメーション: Framer Motionを使用した滑らかな展開・収縮アニメーション
主要なProps:
- projects: 表示する公開作品のリスト
関連Atoms: なし（プロップスベースのコンポーネント）
UI統合:
- ProjectCardコンポーネントを使用して各作品を表示
- ProjectCardにoriginalLanguageプロパティを渡し、作品のオリジナル言語をバッジとして表示
- OriginalLanguageBadgeコンポーネントを活用して多言語対応を強化

`MetadataEditModal`（廃止済み）

~~公開済み作品のメタデータ（タイトル、見出し、あらすじ、タグ、カバー画像）を編集するためのモーダルコンポーネント。~~

廃止日: 2026-05-18

廃止理由: Publishウィザード（/project/[id]/publish）が同等機能（メタデータ編集、カバー画像、既存スロット更新）を上位互換として提供しているため、維持コストに見合わない。

代替手段: メタデータ編集はPublishウィザードのMetadataTabから行う。

削除ファイル: next-app/src/components/MetadataEditModal.tsx

参照元クリーンアップ: ExplorePageClient.tsx, ProfilePageClient.tsx からMetadataEditModal関連のstate/handler/importを除去済み。

Exploreページコンポーネント