diff --git a/src/components/Sponsors.tsx b/src/components/Sponsors.tsx index d778ff0..7606edd 100644 --- a/src/components/Sponsors.tsx +++ b/src/components/Sponsors.tsx @@ -1,8 +1,36 @@ +"use client"; + +import { useState, useEffect, useCallback } from "react"; import { vipnagorgialla } from "@/components/Vipnagorgialla"; import { useTranslations } from "next-intl"; import Image from "next/image"; import NextLink from "next/link"; +interface Sponsor { + href: string; + src: string; + alt: string; + width: number; + height: number; + className?: string; +} + +const sponsors: Sponsor[] = [ + { href: "https://taltech.ee", src: "/sponsors/taltech-color.png", alt: "Taltech (Tallinna Tehnikaülikool)", width: 192, height: 192 }, + { href: "https://www.redbull.com/ee-et/", src: "/sponsors/redbull.png", alt: "Redbull", width: 80, height: 80 }, + { href: "https://www.facebook.com/bfglOfficial", src: "/sponsors/BFGL.png", alt: "BFGL", width: 192, height: 192 }, + { href: "https://www.tomorrow.ee/", src: "/sponsors/nt.png", alt: "Network Tomorrow", width: 300, height: 200 }, + { href: "https://k-space.ee/", src: "/sponsors/k-space_ee-white.png", alt: "K-Space", width: 200, height: 200, className: "not-dark:invert" }, + { href: "https://globalproductions.ee/", src: "/sponsors/Global-productions.png", alt: "Global Productions", width: 200, height: 200 }, +]; + +// Split sponsors into slides (6 per slide) +const SPONSORS_PER_SLIDE = 6; +const slides: Sponsor[][] = []; +for (let i = 0; i < sponsors.length; i += SPONSORS_PER_SLIDE) { + slides.push(sponsors.slice(i, i + SPONSORS_PER_SLIDE)); +} + interface SponsorsProps { showTitle?: boolean; className?: string; @@ -13,191 +41,65 @@ export default function Sponsors({ className = "", }: SponsorsProps) { const t = useTranslations(); + const [current, setCurrent] = useState(0); + + const next = useCallback(() => setCurrent((c) => (c + 1) % slides.length), []); + + useEffect(() => { + const id = setInterval(next, 5000); + return () => clearInterval(id); + }, [next]); return (