feat(dystopia): open post details in a sheet and fade tab content

[panicboat]

Why

#1517 のモックの「詳細は右からスライドするシートで開く」を、投稿詳細に当てます。第 4 段（カルテ以外の画面）を 4 つに分けたうちの 4a（投稿まわり）です。stack: #1521 → #1542 → #1544 → 本 PR。

Decisions

• 投稿詳細は、アプリ内では右からのシートで開き、/posts/[id] を直接開いたときはページで出す。中身（投稿・コメント入力・コメント一覧）は 1 つの部品をシートとページで使う
• 開くのは、修飾キーのない左クリックのときだけ。Ctrl・⌘・Shift・Alt 付きや中クリックは今までどおりリンクとして動く（新しいタブで開ける）
• 投稿カードは多くの一覧に出るため、シートは AppShell に 1 つだけ置き、小さな store から開く
• シートの中のリンクは、第 1 段の規則どおり router.replace で移動し、今のページへのリンクならシートを閉じるだけにする
• ホームと検索のタブ切り替えをフェードさせ、ホームのカルテ・レビュータブの説明文、検索の見出し、ブックマークが空のときの文言をモックに合わせる

Bug fix found while verifying

シートやページで書いたコメントが、一覧を作り直すまで出ませんでした。コメントの追加・削除のあとの取り直しが SWR の全体 mutate にキーを絞る関数を渡す形で、swr 2.5.1 はこの形で useSWRInfinite のキーを対象から外すためです（4a より前からある不具合）。一覧と同じキーを unstable_serialize で作って取り直す形に直しました。返信の一覧と削除も同じです。

Known limitations

• シートでコメントしたあと、裏の一覧のカードのコメント数は、一覧を取り直すまで古いまま（以前はページへ移って戻ると取り直されていた）
• 2 ページ目以降のコメントを削除しても、一覧から消えない（SWR の無限スクロールは全体の取り直しで 1 ページ目しか取り直さない）
• /search のようにパスが同じでクエリだけ違う移動（シート内のハッシュタグ）では、シートが開いたまま残る。次の PR（4b）で直す

Verification

• frontend: pnpm exec vitest run → 171 files / 741 tests passed、pnpm exec tsc --noEmit エラーなし、pnpm exec next build 成功
• 実機（使い捨て DB + bin/grpc + next dev、puppeteer）: 14 項目通過
  • ホームでコメントアイコン・本文を押すとシートが開き、URL は変わらない。戻る操作で閉じる
  • シートでコメントを書くと一覧に出る
  • ⌘ クリックはシートを開かず新しいタブで開く。/posts/<id> を直接開くとページで出る
  • プロフィールの返信タブから元の投稿をシートで開ける
  • シート内のリンクで別のページへ移るとシートが閉じ、戻る 1 回で元のページに戻る。今のページへのリンクではシートが閉じる
  • ホームのカルテ・レビュータブの説明文、検索の見出し
  • サーバーに ERROR なし

Docs

• spec: docs/superpowers/specs/2026-10-16-dystopia-post-screens-design.md
• plan: docs/superpowers/plans/2026-10-16-dystopia-post-screens.md

Refs #1517

🤖 Generated with Claude Code

https://claude.ai/code/session_01DA9qTtJtm2tPquKk7hyPR5

[coderabbitai]

Important

• 🔍 Trigger review

This repository does not receive automatic reviews because it has fewer than 10 stars.

⚙️ Run configuration

• Configuration used: Organization UI
• Review profile: CHILL
• Plan: Advanced
• Run ID: e9db14ae-38af-4378-8656-6e5ddb1ce87f

• Autofix · Keep fixing CodeRabbit findings and required CI, and resolving merge conflicts

Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out.

❤️ Share

• X
• Mastodon
• Reddit
• LinkedIn

_{Comment @coderabbitai help to get the list of available commands.}

[github-actions]

Kustomize Diff

Service: frontend
Environment: production

No changes