landing api

src/app/blogs/components/BigBlogItem.tsx

@@ -1,13 +1,20 @@
 import { FC } from 'react'
 import Image from 'next/image'
 import { ArrowLeft, Calendar2, Profile } from 'iconsax-react'
-const BigBlogItem: FC = () => {
+import { Blog } from '../types/BlogTypes'
+import { toJalaliDate } from '@/config/func'
+
+interface BigBlogItemProps {
+    item: Blog
+}
+
+const BigBlogItem: FC<BigBlogItemProps> = ({ item }) => {
     return (
         <div className='w-full rounded-4xl bg-white p-7 flex xl:flex-row flex-col gap-6'>
-            <Image src='https://picsum.photos/seed/picsum/200/300' alt='blog' width={300} height={300} className='size-[150px] object-cover mx-auto xl:mx-0 rounded-4xl' />
+            <Image src={item.imageUrl} alt='blog' width={300} height={300} className='size-[150px] object-cover mx-auto xl:mx-0 rounded-4xl' />
             <div className='flex-1'>
                 <h4 className='font-bold text-sm leading-6'>
-                    سفارش نرم‌افزار اختصاصی: سرمایه‌ای برای آینده یا فقط هزینه‌ای برای امروز؟
+                    {item.title}
                 </h4>
 
                 <div className='mt-3 flex gap-3 text-xs'>
@@ -17,7 +24,7 @@ const BigBlogItem: FC = () => {
                             color='#7D818C'
                         />
                         <h6 className='text-sm'>
-                            نویسنده
+                            {item.author.firstName} {item.author.lastName}
                         </h6>
                     </div>
                     <div className='flex text-[#7D818C] items-center gap-1'>
@@ -26,13 +33,13 @@ const BigBlogItem: FC = () => {
                             color='#7D818C'
                         />
                         <h6 className='text-sm'>
-                            ۱۴۰۳/۱۲/۰۱
+                            {toJalaliDate(item.createdAt)}
                         </h6>
                     </div>
                 </div>
 
                 <p className='mt-3 text-sm leading-5'>
-                    لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است چاپگرها و متون بلکه...
+                    {item.previewContent}
                 </p>
 
                 <div className='mt-3 flex gap-1 text-sm text-[#8C90A3]'>