ads and invoce

src/pages/service/DetailService.tsx

@@ -1,5 +1,4 @@
 import { FC, Fragment } from 'react'
-import RobotImage from '../../assets/images/robot.jpeg'
 import { useTranslation } from 'react-i18next'
 import Button from '../../components/Button'
 import Rate from 'rc-rate'
@@ -12,11 +11,14 @@ import { useGetDetailService } from './hooks/useServiceData'
 import { useParams } from 'react-router-dom'
 import PageLoading from '../../components/PageLoading'
 import moment from 'moment-jalaali'
+import { useGetAds } from '../ads/hooks/useAdsData'
+import { AdsDisplayLocation } from '../ads/types/AdsTypes'
 
 const DetailService: FC = () => {
 
     const { id } = useParams()
     const { t } = useTranslation('global')
+    const getAdsLeft = useGetAds(AdsDisplayLocation.SINGLE_SERVICE_PAGE)
 
     const getDetailService = useGetDetailService(id ? id : '')
 
@@ -204,18 +206,23 @@ const DetailService: FC = () => {
                                 </div>
                             </div>
                         </div>
-                        <div className='bg-white w-sidebar h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
-                            <img
-                                src={RobotImage}
-                                className='w-full backdrop-blur-[100px] h-[550px] object-cover'
-                            />
 
-                            <div className='absolute flex items-center px-4 w-full bottom-0 h-[86px] bg-black bg-opacity-5 backdrop-blur-[14px]'>
-                                <div className='max-w-[80%] text-sm leading-6 text-white'>
-                                    سفارش نرم‌افزار اختصاصی: سرمایه‌ای برای آینده یا فقط هزینه‌ای برای امروز؟
+
+                        {
+                            getAdsLeft.isSuccess && getAdsLeft.data.data.ads[0] &&
+                            <a href={getAdsLeft.data?.data?.ads[0].link} target='_blank' className='bg-white w-sidebar h-fit hidden xl:block rounded-3xl overflow-hidden relative'>
+                                <img
+                                    src={getAdsLeft.data.data.ads[0].imageUrl}
+                                    className='w-full backdrop-blur-[100px] h-[550px] object-cover'
+                                />
+
+                                <div className='absolute flex items-center px-4 w-full bottom-0 h-[86px] bg-black bg-opacity-5 backdrop-blur-[14px]'>
+                                    <div className='max-w-[80%] text-sm leading-6 text-white'>
+                                        {getAdsLeft.data.data.ads[0].title}
+                                    </div>
                                 </div>
-                            </div>
-                        </div>
+                            </a>
+                        }
                     </Fragment>
             }