Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 | 1x 1x 1x 1x 1x 1x 1x 1x 1x 33x 33x 33x 33x 33x 1x 1x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 32x 33x 33x 33x | 'use client';
import { CheckCircle, Mail, Building2, Link2, Briefcase } from 'lucide-react';
import {
getVerificationLevel,
isVerified,
type TestimonialVerificationType,
} from '@/lib/testimonials/verification';
interface TestimonialVerificationBadgeProps {
verificationType: TestimonialVerificationType;
size?: 'sm' | 'md';
showLabel?: boolean;
}
const VERIFICATION_ICONS = {
unverified: CheckCircle,
email_verified: Mail,
identity_linked: Link2,
domain_verified: Building2,
work_verified: Briefcase,
};
export function TestimonialVerificationBadge({
verificationType,
size = 'sm',
showLabel = true,
}: TestimonialVerificationBadgeProps) {
if (!isVerified(verificationType)) {
return null;
}
const level = getVerificationLevel(verificationType);
const Icon = VERIFICATION_ICONS[verificationType];
const sizeClasses = {
sm: 'text-xs px-2 py-0.5 gap-1',
md: 'text-sm px-3 py-1 gap-1.5',
};
const iconSizes = {
sm: 'h-3 w-3',
md: 'h-4 w-4',
};
return (
<div
className={`inline-flex items-center rounded-full border font-medium ${level.bgColor} ${level.color} ${level.borderColor} ${sizeClasses[size]} `}
title={level.description}
>
<Icon className={iconSizes[size]} />
{showLabel && <span>{level.label}</span>}
</div>
);
}
|