"use client"; import { AnimatePresence, motion } from "motion/react"; import React, { useEffect, useState } from "react"; import { Sparkles, ShieldCheck, Zap, Users } from "lucide-react"; import { SecurityCheckIcon, ZapIcon, UserStoryIcon, SparklesIcon, } from "@hugeicons/core-free-icons"; import { HugeiconsIcon } from "@hugeicons/react"; import { useIsMobile } from "@/hooks/use-mobile"; const INITIAL_CHIPS = [ { id: 1, title: "آمادهٔ تولید", description: "کاملاً تایپ‌سیف و تست‌شده", icon: SecurityCheckIcon, }, { id: 2, title: "حرکت روان", description: "بهینه‌سازی ۶۰ فریم در ثانیه", icon: ZapIcon, }, { id: 3, title: "دسترس‌پذیر", description: "برای همه به‌خوبی کار می‌کند", icon: UserStoryIcon, }, { id: 4, title: "طراحی مدرن", description: "ساخته‌شده برای حس حرفه‌ای", icon: SparklesIcon, }, ]; const Bucket = () => { const [items, setItems] = useState(INITIAL_CHIPS); const isMobile = useIsMobile(); useEffect(() => { const interval = setInterval(() => { setItems((prev) => { const [first, ...rest] = prev; return [...rest, first]; }); }, 2000); return () => clearInterval(interval); }, []); return (

{items.map((chip, index) => { if (index !== 0) return null; return (

{chip.title} {chip.description}

); })}

); }; export default Bucket;