hamid zarghami
56 lines
1.5 KiB
TypeScript
56 lines
1.5 KiB
TypeScript
import { Suspense } from 'react'
|
|
import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query'
|
|
import { detailServiceQueryOptions } from '../hooks/useProductData'
|
|
import { Metadata, NextPage } from 'next'
|
|
import DetailService from '../DetailService'
|
|
import Loading from './loading'
|
|
import { ServiceDetailResponse } from '../types/ProductTypes'
|
|
|
|
interface PageProps {
|
|
params: Promise<{
|
|
id: string
|
|
}>
|
|
}
|
|
|
|
|
|
export async function generateMetadata(
|
|
{ params }: PageProps
|
|
): Promise<Metadata> {
|
|
const { id } = await params
|
|
const queryClient = new QueryClient()
|
|
|
|
await queryClient.prefetchQuery(detailServiceQueryOptions(id))
|
|
const service = queryClient.getQueryData(detailServiceQueryOptions(id).queryKey) as ServiceDetailResponse
|
|
|
|
return {
|
|
title: 'مجله داناک' + ' | ' + service.data.danakService.name,
|
|
description: service.data.danakService.metaDescription,
|
|
}
|
|
}
|
|
|
|
const SingleService: NextPage<PageProps> = async ({ params }) => {
|
|
|
|
const { id } = await params
|
|
|
|
return (
|
|
<Suspense fallback={<Loading />}>
|
|
<SingleServicePage id={id} />
|
|
</Suspense>
|
|
)
|
|
}
|
|
|
|
async function SingleServicePage({ id }: { id: string }) {
|
|
const queryClient = new QueryClient()
|
|
|
|
await Promise.all([
|
|
queryClient.prefetchQuery(detailServiceQueryOptions(id)),
|
|
])
|
|
|
|
return (
|
|
<HydrationBoundary state={dehydrate(queryClient)}>
|
|
<DetailService id={id} />
|
|
</HydrationBoundary>
|
|
)
|
|
}
|
|
|
|
export default SingleService |