fix(ui): App ShellとRouter境界を安定化する (#577)

[hmjn023]

概要

Server/Tauriで起動・loader待機・route失敗時にもApp Shellを維持し、白画面にならない共通基盤を追加します。

変更内容

• 共通のpending/error/not-found/bootstrap状態UIを追加
• Routerのpending delayを300ms、minimum durationを500msに統一
• ServerのApp Shellをデータ取得用Suspense境界の外へ移動
• 非破壊的なroute progress indicatorを両App Shellへ追加
• TauriでBootstrap Shellを即時renderし、初期化失敗時の再試行経路を追加

検証

• Biome check: pass
• monorepo typecheck: pass
• Server unit tests: 161 pass
• packages/ui tests: 10 pass
• Server production build: pass
• Tauri Web production build: pass
• 全integration tests: 既存のauthor-dedupe 1件のみ失敗（単独実行でも再現）

fixes #577

Summary by CodeRabbit

• 新機能
  • 画面遷移中・読み込み中・エラー・404 の専用表示を追加し、状態が分かりやすくなりました。
  • ルート遷移の状況インジケーターと、保留表示のタイミング制御を導入しました。
  • 起動時の初期化状況に応じて、アプリ本体または案内/エラー画面を切り替え、失敗時は再試行できます。
• 改善
  • 読み込み表示のちらつきと短時間表示を抑えました。
  • 404 画面の文言と導線を見直しました。
• 不具合修正
  • 初期化完了前の表示の不安定さを解消しました。
• テスト
  • 重複排除に関する統合テストの期待値を更新しました。

[coderabbitai]

No actionable comments were generated in the recent review. 🎉

ℹ️ Recent review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: db5cdb9d-2be0-440f-acd5-1f79b8847dff

📥 Commits

Reviewing files that changed from the base of the PR and between 27475f5 and e1476bf.

📒 Files selected for processing (2)

• apps/server/src/tests/integration/repository/author-dedupe.test.ts
• packages/ui/src/router-status.tsx

🚧 Files skipped from review as they are similar to previous changes (1)

• packages/ui/src/router-status.tsx

---

📝 Walkthrough

Walkthrough

Server/TauriのRouterにpending/error/not-foundの既定表示を追加し、共通の状態UIを新設しました。AppShellはstatusIndicatorを受け取るようになり、Tauriは初期化完了までBootstrap画面を表示します。NotFoundScreenも更新されました。

Changes

Router Pending/Error基盤とApp Shell統合

Layer / File(s)	Summary
router-status共通コンポーネント新設 packages/ui/src/router-status.tsx	遷移インジケーター、pending画面、エラー画面、起動状態画面、遅延表示制御が追加される。
AppShellへのstatusIndicator追加とNotFoundScreen刷新 packages/ui/src/layouts/app-shell.tsx, packages/ui/src/screens/not-found-screen.tsx	AppShellにstatusIndicatorが追加され、NotFoundScreenの文言とレイアウトが更新される。
Server RouterとRootへのpending/error組み込み apps/server/src/router.tsx, apps/server/src/routes/__root.tsx	Server側ルーターに既定のpending/error/not-found表示と待機時間が設定され、rootレイアウトがAppShellのstatusIndicatorとSuspense構成に変更される。
Tauri RouterとRootへのpending/error組み込み apps/tauri/src/router.tsx, apps/tauri/src/routes/__root.tsx	Tauri側ルーターに既定のpending/error/not-found表示と待機時間が設定され、rootでRouteTransitionIndicatorがAppShellへ渡される。
Tauri起動フローのBootstrap Shell化 apps/tauri/src/main.tsx	初期化状態を管理するAppが追加され、RouterProviderとBootstrapStatusScreenの表示を切り替える。

Estimated code review effort: 4 (Complex) | ~60 minutes

Possibly related issues

• 共通のSkeleton・Empty・Error・Offline UIを整備する #579: router-status と AppShell に pending/error/404 表示や再試行UIを追加する変更が含まれている。
• UI基盤の安定化とレスポンシブ対応を完遂する #576: Server/Tauriのルーター設定、AppShellの状態表示、Bootstrap表示の組み込みが含まれており、対応内容と一致する。

🚥 Pre-merge checks | ✅ 4 | ❌ 1

❌ Failed checks (1 warning)

Check name	Status	Explanation	Resolution
Out of Scope Changes check	⚠️ Warning	author-dedupeの統合テスト修正はApp Shell/Router境界の対応と関係が薄く、今回の目的から外れています。	このテスト変更が必要な理由を明記するか、関連する変更に限定してください。

✅ Passed checks (4 passed)

Check name	Status	Explanation
Description Check	✅ Passed	Check skipped - CodeRabbit’s high-level summary is enabled.
Title check	✅ Passed	タイトルはApp ShellとRouter境界の安定化という変更点を簡潔に表しており、内容と一致しています。
Linked Issues check	✅ Passed	ServerのApp Shell分離、共通のpending/error/not-found、TauriのBootstrap表示と再試行、遷移インジケーターの追加を満たしています。
Docstring Coverage	✅ Passed	No functions found in the changed files to evaluate docstring coverage. Skipping docstring coverage check.

✨ Finishing Touches

📝 Generate docstrings

• Create stacked PR
• Commit on current branch

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/issue-577-app-shell-router-boundaries

---

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

[coderabbitai]

Actionable comments posted: 1

🤖 Prompt for all review comments with AI agents

Verify each finding against current code. Fix only still-valid issues, skip the
rest with a brief reason, keep changes minimal, and validate.

Inline comments:
In `@packages/ui/src/router-status.tsx`:
- Around line 129-174: BootstrapStatusScreen has conflicting live-region
behavior because the section always sets aria-live to polite even when it
switches to role="alert" in the error state. Update BootstrapStatusScreen so the
live region matches the state: keep the non-error status announcement polite,
but make the error path assertive by adjusting the aria-live value conditionally
alongside the role prop. Use BootstrapStatusScreen, the props.error check, and
the section element as the main points to locate and fix this.

🪄 Autofix (Beta)

Fix all unresolved CodeRabbit comments on this PR:

• Push a commit to this branch (recommended)
• Create a new PR with the fixes

---

ℹ️ Review info

⚙️ Run configuration

Configuration used: Path: .coderabbit.yaml

Review profile: CHILL

Plan: Pro Plus

Run ID: 3e88054b-5230-4927-8e4e-d8d80b4d9875

📥 Commits

Reviewing files that changed from the base of the PR and between da8e900 and 27475f5.

📒 Files selected for processing (8)

• apps/server/src/router.tsx
• apps/server/src/routes/__root.tsx
• apps/tauri/src/main.tsx
• apps/tauri/src/router.tsx
• apps/tauri/src/routes/__root.tsx
• packages/ui/src/layouts/app-shell.tsx
• packages/ui/src/router-status.tsx
• packages/ui/src/screens/not-found-screen.tsx