Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 | 65x 65x 442x 442x 442x 442x 12x 12x 12x 442x 442x 442x 2x 12x 442x 12x 2x 1x 1x 442x 12x 12x 65x 34x | import { useCallback, type ReactNode } from 'react'
import { useNavigate, useParams } from 'react-router-dom'
import { useEntityDetail } from '../../L1/entityResolver'
import { useEntityCoordinator } from '../../L2W/coordinatorResolver'
import { DetailSurface } from '../surfaces/DetailSurface'
import type { DetailConfig, RouteContext } from '../../interfaces'
export interface EntityDetailProps {
config: DetailConfig
extra?: ReactNode
}
export function EntityDetail({ config, extra }: EntityDetailProps) {
const navigate = useNavigate()
const { id } = useParams<{ id: string }>()
const detailRouteContext: RouteContext = id
? { page: 'detail', id }
: { page: 'collection' }
const { data: entity, isLoading, error } = useEntityDetail(
I config.entityPath,
id ?? '',
)
const { snapshot } = useEntityCoordinator(
config.entityPath,
[],
I detailRouteContext,
)
const handleDeleteSuccess = useCallback(() => {
if (config.onDeleteSuccess) {
config.onDeleteSuccess()
} else {
navigate('/' + config.entityPath, { replace: true })
}
}, [config, navigate])
Iif (!id) {
return <div data-testid="detail-no-id">No ID provided</div>
}
return (
<DetailSurface
config={config}
routeContext={detailRouteContext}
entity={entity as (Record<string, unknown> & { id: string }) | null}
isLoading={isLoading}
error={error}
navigate={navigate}
onDeleteSuccess={handleDeleteSuccess}
coordinatorSnapshot={snapshot}
extra={extra}
/>
)
}
|