page id link on main banner fixed

app/(main)/[page_id]/page.tsx

@@ -42,8 +42,9 @@ const PageItem = ({ params }: IParams) => {
         </div>
 
         <div className="main-news flex md:flex-row flex-col gap-6">
-          {data?.data.image && data.data.title ? (
+          {data?.data.image &&
-            responsive && data.data.mobile_image ? (
+            data.data.title &&
+            (responsive && data.data.mobile_image ? (
               <div className="relative">
                 <Image
                   src={data?.data.mobile_image}
@@ -69,10 +70,7 @@ const PageItem = ({ params }: IParams) => {
                   className="w-full h-full object-cover"
                 />
               </div>
-            )
+            ))}
-          ) : (
-            <Loader />
-          )}
           <div className="flex flex-col gap-3 text-black text-lg">
             {data?.data.content ? (
               <p

components/home/MainSwiper.tsx

@@ -7,6 +7,7 @@ import { useQuery } from '@tanstack/react-query';
 import Loader from '../Loader';
 import { v4 } from 'uuid';
 import Link from 'next/link';
+import page from '@/app/(main)/live/page';
 
 const MainSwiper = () => {
   const { data, isFetching, error } = useQuery({
@@ -30,18 +31,31 @@ const MainSwiper = () => {
         className="h-full w-full">
         {data!.data.map((item) => (
           <SwiperSlide key={v4()} className="w-full h-full">
-            <Link
+            {item.url || item.page_id ? (
-              href={item.url ? item.url : ''}
+              <Link
-              className="flex justify-center items-center relative w-full lg:h-full h-[400px]">
+                href={item.url ? item.url : `/${item.page_id}`}
-              <Image
+                className="flex justify-center items-center relative w-full lg:h-full h-[400px]">
-                src={item.image}
+                <Image
-                alt={item.title}
+                  src={item.image}
-                fill
+                  alt={item.title}
-                unoptimized
+                  fill
-                unselectable="off"
+                  unoptimized
-                className="pointer-events-none"
+                  unselectable="off"
-              />
+                  className="pointer-events-none"
-            </Link>
+                />
+              </Link>
+            ) : (
+              <div className="flex justify-center items-center relative w-full lg:h-full h-[400px]">
+                <Image
+                  src={item.image}
+                  alt={item.title}
+                  fill
+                  unoptimized
+                  unselectable="off"
+                  className="pointer-events-none"
+                />
+              </div>
+            )}
           </SwiperSlide>
         ))}
       </Swiper>