44 lines
1.2 KiB
TypeScript
44 lines
1.2 KiB
TypeScript
import React from 'react';
|
|
import CardStack from '@/components/cardStack/CardStack';
|
|
import type { CardStackProps } from '@/components/cardStack/CardStack';
|
|
|
|
interface Testimonial {
|
|
id: string;
|
|
name: string;
|
|
handle: string;
|
|
testimonial: string;
|
|
rating: number;
|
|
imageSrc?: string;
|
|
}
|
|
|
|
interface TestimonialCardTwoProps extends Omit<CardStackProps, 'children'> {
|
|
testimonials: Testimonial[];
|
|
}
|
|
|
|
export const TestimonialCardTwo: React.FC<TestimonialCardTwoProps> = ({
|
|
testimonials,
|
|
...cardStackProps
|
|
}) => {
|
|
const testimonialElements = testimonials.map(testimonial => (
|
|
<div key={testimonial.id} className="testimonial-card">
|
|
{testimonial.imageSrc && (
|
|
<img src={testimonial.imageSrc} alt={testimonial.name} className="avatar" />
|
|
)}
|
|
<p className="testimonial-text">{testimonial.testimonial}</p>
|
|
<div className="author">
|
|
<h4>{testimonial.name}</h4>
|
|
<p>{testimonial.handle}</p>
|
|
</div>
|
|
<div className="rating">{'⭐'.repeat(testimonial.rating)}</div>
|
|
</div>
|
|
));
|
|
|
|
return (
|
|
<CardStack {...cardStackProps}>
|
|
{testimonialElements}
|
|
</CardStack>
|
|
);
|
|
};
|
|
|
|
export default TestimonialCardTwo;
|