title pages and ...

src/app/products/[id]/page.tsx

@@ -1,9 +1,10 @@
 import { Suspense } from 'react'
 import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query'
 import { detailServiceQueryOptions } from '../hooks/useProductData'
-import { NextPage } from 'next'
+import { Metadata, NextPage } from 'next'
 import DetailService from '../DetailService'
 import Loading from './loading'
+import { ServiceDetailResponse } from '../types/ProductTypes'
 
 interface PageProps {
     params: Promise<{
@@ -11,6 +12,22 @@ interface PageProps {
     }>
 }
 
+
+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

src/app/products/components/ServiceHeader.tsx

@@ -77,7 +77,7 @@ const ServiceHeader: FC<Props> = (props: Props) => {
                     <div className='text-xs whitespace-nowrap flex gap-1 items-center'>
                         <div className='flex gap-2'>
                             {
-                                finalPrice !== price &&
+                                finalPrice !== price && !!price &&
                                 <div className='line-through text-xs text-description'>
                                     {NumberFormat(Number(price))}
                                 </div>

src/app/products/page.tsx

@@ -7,6 +7,20 @@ import { categoriesQueryOptions, danakServiceSuggestedQueryOptions, servicesQuer
 import Products from './ProductsPage'
 import Loading from './loading'
 
+export const metadata = {
+    title: 'داناک | محصولات',
+    description: 'محصولات و خدمات ما',
+    openGraph: {
+        title: 'داناک | محصولات',
+        description: 'محصولات و خدمات ما',
+        url: 'https://danakcorp.com/products',
+        siteName: 'داناک',
+        locale: 'fa_IR',
+        type: 'website',
+    },
+}
+
+
 const ProductsPage: NextPage = () => {
     return (
         <Suspense fallback={<Loading />}>