diff --git a/src/components/sections/hero/HeroBillboard.tsx b/src/components/sections/hero/HeroBillboard.tsx index 847bb6d..175ca4d 100644 --- a/src/components/sections/hero/HeroBillboard.tsx +++ b/src/components/sections/hero/HeroBillboard.tsx @@ -5,13 +5,20 @@ import ImageOrVideo from "@/components/ui/ImageOrVideo"; import ScrollReveal from "@/components/ui/ScrollReveal"; import AvatarGroup from "@/components/ui/AvatarGroup"; +type Testimonial = { + name: string; + role: string; + testimonial: string; + imageSrc: string; +}; + type HeroBillboardProps = { tag?: string; title: string; description: string; primaryButton: { text: string; href: string }; secondaryButton: { text: string; href: string }; - avatars?: { src: string }[]; + testimonials?: Testimonial[]; avatarsLabel?: string; } & ({ imageSrc: string; videoSrc?: never } | { videoSrc: string; imageSrc?: never }); @@ -21,7 +28,7 @@ const HeroBillboard = ({ description, primaryButton, secondaryButton, - avatars, + testimonials, avatarsLabel, imageSrc, videoSrc, @@ -31,8 +38,19 @@ const HeroBillboard = ({
- {avatars && avatars.length > 0 ? ( - + {testimonials && testimonials.length > 0 ? ( +
+ ({ src: t.imageSrc }))} label={avatarsLabel} /> +
+ {testimonials.map((testimonial, index) => ( +
+

"{testimonial.testimonial}"

+

{testimonial.name}

+

{testimonial.role}

+
+ ))} +
+
) : tag ? ( {tag} ) : null} @@ -42,7 +60,7 @@ const HeroBillboard = ({ variant="slide-up" gradientText={true} tag="h1" - className="text-6xl font-medium text-balance" + className="text-6xl font-bold text-balance" />