"use client" import { useState } from "react" // shadcn import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar" // third-party import { motion, type Variants } from "framer-motion" const testimonials = [ { name: "Sarah Connor", avatar: "https://cdn.uiable.com/block/profile-1.png", position: "Lead DevOps Engineer", description: "This platform has completely transformed how our team manages deployment workflows. The onboarding is incredibly fast and intuitive.", }, { name: "Emily Watson", avatar: "https://cdn.uiable.com/block/profile-4.png", position: "Product Manager at TechFlow", description: "Automating our repetitive tasks has saved us hours of manual coordination. We can now focus on what truly matters.", }, { name: "Marcus Aurelius", avatar: "https://cdn.uiable.com/block/profile-5.png", position: "Chief Operations Officer", description: "Having instant access to detailed insights and performance metrics has empowered our team to make data-driven decisions confidently.", }, { name: "Aria Montgomery", avatar: "https://cdn.uiable.com/block/profile-6.png", position: "Senior UX Designer", description: "Collaboration is seamless here. Real-time updates and shared workspaces have bridged the gap between our design and dev teams.", }, { name: "Sophia Martinez", avatar: "https://cdn.uiable.com/block/profile-7.png", position: "Director of Security", description: "Security is paramount for us. The advanced encryption and role-based access controls keep our sensitive client data fully protected.", }, { name: "James Wilson", avatar: "https://cdn.uiable.com/block/profile-8.png", position: "Integration Architect", description: "The pre-built integrations made it incredibly easy to connect all of our existing tools without breaking any workflows.", }, ] // ------------------------------ | TESTIMONIAL 6 | ------------------------------ // const containerVariants: Variants = { hidden: { opacity: 0 }, visible: { opacity: 1, transition: { staggerChildren: 0.08, delayChildren: 0.1, }, }, } const itemVariants: Variants = { hidden: { y: 20, opacity: 0 }, visible: { y: 0, opacity: 1, transition: { duration: 0.5, ease: [0.16, 1, 0.3, 1] }, }, } export default function Testimonial6() { const [activeIdx, setActiveIdx] = useState(0) return (

Success stories unveiled Explore success stories that highlight how our solutions have helped businesses overcome challenges, improve efficiency, and achieve measurable growth. These real-world examples demonstrate the impact of innovation and collaboration.

{testimonials.map((testimonial, idx) => ( setActiveIdx(idx)} className="col-span-12 cursor-pointer md:col-span-6 lg:col-span-4" >

{testimonial.name.split(" ")[0].charAt(0) + testimonial.name.split(" ")[1].charAt(0)}

{testimonial.name}

{testimonial.position}

{testimonial.description}

))}

) }