docker file

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

@@ -1,24 +1,24 @@
 import { Suspense } from 'react'
 import { dehydrate, HydrationBoundary, QueryClient } from '@tanstack/react-query'
-import { blogSingleQueryOptions } from '../hooks/useBlogsData'
+import { blogSingleQueryOptions, mostVisitedBlogsQueryOptions } from '../hooks/useBlogsData'
 import { NextPage } from 'next'
 import SingleBlogPage from '../components/SingleBlogPage'
 import Loading from './loading'
 
-// interface PageProps {
-//     params: Promise<{
-//         id: string
-//     }>
-// }
+interface PageProps {
+    params: Promise<{
+        id: string
+    }>
+}
 
-const SingleBlog: NextPage = async () => {
+const SingleBlog: NextPage<PageProps> = async ({ params }) => {
 
-    // const { id } = await params
-    // console.log("loading", id);
+    const { id } = await params
+    console.log("loading", id);
 
     return (
         <Suspense fallback={<Loading />}>
-            <BlogContent id={'7539fa00-e8e0-4b2b-a4b5-655284b5e8a1'} />
+            <BlogContent id={id} />
         </Suspense>
     )
 }
@@ -28,8 +28,8 @@ async function BlogContent({ id }: { id: string }) {
     const queryClient = new QueryClient()
 
     await Promise.all([
-        queryClient.prefetchQuery(blogSingleQueryOptions('7539fa00-e8e0-4b2b-a4b5-655284b5e8a1')),
-        // queryClient.prefetchQuery(mostVisitedBlogsQueryOptions)
+        queryClient.prefetchQuery(blogSingleQueryOptions(id)),
+        queryClient.prefetchQuery(mostVisitedBlogsQueryOptions)
     ])
 
     return (