"use client";

import Marquee from "react-fast-marquee";
import Title from "../tools/title";
import { Gehl, Hyundai, JCB, Lonking, Mitsubishi, XCMG } from "@/assets";
import Image, { StaticImageData } from "next/image";

const slideImage: StaticImageData[] = [
  Lonking,
  Hyundai,
  Gehl,
  JCB,
  Mitsubishi,
  XCMG,
];

export default function Texnika() {
  return (
    <div className="flex flex-col items-center justify-center gap-20 mt-20 max-w-[1200px] w-full mx-auto">
      <Title text="brand-h2" />
      <Marquee
        direction="left"
        className="ml-20"
      >
        {slideImage.map((item, index) => (
          <div
            key={index}
            className="mx-10 min-w-[200px] flex items-center justify-center"
          >
            <Image
              src={item}
              alt={`Brand ${index}`}
              width={200}
              height={200}
              className="object-contain"
            />
          </div>
        ))}
      </Marquee>
    </div>
  );
}