frontend: Server Component の React Query prefetch パターンを共通化する - #129
Merged
Conversation
…ndary, withServerFetcher) Deduplicate React Query server-side prefetch patterns across 8 page components into shared helpers in lib/api/server-prefetch.ts. No behavioral changes — Streaming SSR, hydration, and notFound semantics remain identical. Closes #113
Add optional errorMessage parameter to withServerFetcher so that secondary prefetch failures throw Error with the same descriptive messages as before the refactoring. Primary fetches remain unchanged since fetchPrimary catches errors via .catch(() => null).
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
概要
Server Component (page.tsx) に分散していた React Query の prefetch ボイラープレートを共通ヘルパーに抽出するリファクタリングです。挙動変更はありません。
Closes #113
要件
pnpm typecheckとpnpm lintが通る調査結果
対象ページ 8 ファイルで以下の定型コードが繰り返されていた:
getQueryClient()+createServerClient()の初期化 (全8ファイル)$api.queryOptions()で options 定義 →serverClient.GET()で queryFn を手書き (path/params の二重記述)prefetchQuery()で queryFn 手書き (全8ファイル、計12箇所)HydrationBoundary state={dehydrate(queryClient)}ラッパー (全8ファイル)実装概要
新規ファイル
boardflow/src/lib/api/server-prefetch.ts— 3つのヘルパー関数:fetchPrimary<T>prefetchSecondarywithServerFetcher<T>変更ファイル (8ページ)
repositories/page.tsxrepositories/[repositoryId]/page.tsxboards/[boardProjectId]/page.tsxboards/[boardProjectId]/runs/page.tsxsettings/tokens/page.tsxruns/[boardRunId]/page.tsxruns/[boardRunId]/diff/page.tsxruns/[boardRunId]/checks/[checkKind]/page.tsx変更しないファイル
テスト結果
pnpm typecheckpnpm lintpnpm build挙動維持の確認
prefetchSecondaryは await しないため、secondary リソースの Streaming SSR 挙動は変更前と同一fetchPrimaryは同期的に await + notFound() するため、primary リソース不在時の 404 タイミングは変更なしHydrationBoundary state={dehydrate(queryClient)}パターンを維持withServerFetcherにerrorMessageを明示指定し、ログメッセージが失われないことを確認更新ドキュメント
docs/frontend/summary.md— prefetch パターンの記述を実装に合わせて更新 (共通ヘルパーの追記、primary error handling の実態記述に修正)docs/logs/113/worklog.md— 作業ログ外部調査メモ
残リスク
なし。純粋なリファクタリングで Streaming SSR / hydration / notFound のタイミングは変更前と同一。
レビュー / ドキュメント確認
pr_ready: true(review エージェント確認済み)docs_ready: true(docs エージェント確認済み)