fix(resume): paginate batch details

This commit is contained in:
2026-09-11 17:48:59 +08:00
parent d8f8071bc2
commit 9b8d9c7391
+16 -4
View File
@@ -1,4 +1,4 @@
import { useQuery, useQueryClient } from '@tanstack/react-query' import { useInfiniteQuery, useQuery, useQueryClient } from '@tanstack/react-query'
import { useState } from 'react' import { useState } from 'react'
import { toast } from 'sonner' import { toast } from 'sonner'
import type { ResumeImportItem, ResumeImportOutcome } from '@/api/types' import type { ResumeImportItem, ResumeImportOutcome } from '@/api/types'
@@ -57,13 +57,16 @@ export function ResumeImportBatchDetailSheet({ batchId, onOpenChange }: Props) {
const batch = batchQuery.data?.data const batch = batchQuery.data?.data
const itemsQuery = useQuery({ const itemsQuery = useInfiniteQuery({
queryKey: ['resume-import-items', batchId, outcome], queryKey: ['resume-import-items', batchId, outcome],
queryFn: () => queryFn: ({ pageParam }) =>
fetchImportBatchItems(batchId as string, { fetchImportBatchItems(batchId as string, {
page: pageParam,
page_size: 100, page_size: 100,
...(outcome === 'all' ? {} : { outcome }), ...(outcome === 'all' ? {} : { outcome }),
}), }),
initialPageParam: 1,
getNextPageParam: (lastPage) => lastPage.pagination.next_page ?? undefined,
enabled: batchId !== null, enabled: batchId !== null,
// Follow the batch: keep refreshing the report while rows are still moving. // Follow the batch: keep refreshing the report while rows are still moving.
refetchInterval: batch && (batch.status === 'completed' || batch.status === 'failed') refetchInterval: batch && (batch.status === 'completed' || batch.status === 'failed')
@@ -71,7 +74,7 @@ export function ResumeImportBatchDetailSheet({ batchId, onOpenChange }: Props) {
: POLL_INTERVAL, : POLL_INTERVAL,
}) })
const items = itemsQuery.data?.data ?? [] const items = itemsQuery.data?.pages.flatMap((page) => page.data) ?? []
const refresh = () => { const refresh = () => {
void batchQuery.refetch() void batchQuery.refetch()
void itemsQuery.refetch() void itemsQuery.refetch()
@@ -255,6 +258,15 @@ export function ResumeImportBatchDetailSheet({ batchId, onOpenChange }: Props) {
)} )}
</div> </div>
))} ))}
{itemsQuery.hasNextPage && (
<Button
variant="outline"
onClick={() => void itemsQuery.fetchNextPage()}
disabled={itemsQuery.isFetchingNextPage}
>
{itemsQuery.isFetchingNextPage ? '加载中…' : '加载更多'}
</Button>
)}
</div> </div>
</> </>
)} )}