import DirectionImage from "./DirectionImage";
import { DirectionImageType } from "../../types";

const directionImages: DirectionImageType[] = [
  {
    id: 1,
    image: "/images/directions/direction-1.jpg",
    title: "НЕДВИЖИМОСТЬ",
    desctiption: "Покажет квартиры на этапе строительства",
  },
  {
    id: 2,
    image: "/images/directions/direction-2.jpg",
    title: "ТРЕНАЖЁРЫ",
    desctiption: "Обучит работе с оборудованием",
  },
  {
    id: 3,
    image: "/images/directions/direction-3.jpg",
    title: "ТЕХНИКА",
    desctiption: "Презентует технику в 3D",
  },
  {
    id: 4,
    image: "/images/directions/direction-4.jpg",
    title: "ВЫСТАВКИ",
    desctiption: "Вовлечёт посетителей стенда",
  },
  {
    id: 5,
    image: "/images/directions/direction-5.jpg",
    title: "ОНЛАЙН МЕРОПРИЯТИЯ",
    desctiption: "Соберёт аудиторию со всего мира",
  },
];

const DirectionImageContainer = () => {
  return (
    <div className="w-[1440px] mx-auto py-20 grid grid-cols-3 gap-5 h-fit">
      {directionImages.map((dir) => (
        <DirectionImage
          title={dir.title}
          description={dir.desctiption}
          image={dir.image}
          key={dir.id}
        />
      ))}
    </div>
  );
};

export default DirectionImageContainer;
