OwlCyberSecurity - MANAGER

Edit File: BannerTurkey.tsx

"use client";
import React from "react";
import { Carousel } from "react-responsive-carousel";
import "react-responsive-carousel/lib/styles/carousel.min.css";
// import { BannerData } from "@/components/BannerData";
// import Image from "next/image";
import Link from "next/link";
import { slidersDataType } from "@/typing";
import useDetectMobile from "../components/hooks/DetectMobile";
import Image from "next/image";

interface pageProps {
  sliders: slidersDataType[];
}

function BannerTurkey({ sliders }: pageProps) {
  const isMobile = useDetectMobile();
  return (
    <div className="relative md:max-w-[92vw] m-auto">
      <div className="absolute w-full z-20" />
      <Carousel
        className="ltr"
        showArrows={false}
        infiniteLoop={true}
        showStatus={false}
        emulateTouch={true}
        showThumbs={false}
        autoPlay
        interval={5000}
        showIndicators={false}
        swipeScrollTolerance={isMobile ? 20 : 5}
        preventMovementUntilSwipeScrollTolerance={isMobile ? true : false}
      >
        {sliders.map((item, index) =>
          item.target ? (
            <a
              className="h-full block"
              key={item.id}
              target="_blank"
              href={item.link}
            >
              <img
                className="md:rounded-b-3xl"
                width={1440}
                height={473}
                src={item.path}
                alt={item.title}
                loading={index === 0 ? "eager" : "lazy"}
              />
            </a>
          ) : (
            <Link className="h-full block" key={item.id} href={item.link}>
              <img
                className="md:rounded-b-3xl"
                width={1440}
                height={473}
                src={item.path}
                alt={item.title}
                loading={index === 0 ? "eager" : "lazy"}
              />
            </Link>
          )
        )}
      </Carousel>
    </div>
  );
}

export default BannerTurkey;