41 lines
1.2 KiB
JavaScript
41 lines
1.2 KiB
JavaScript
import React from 'react';
|
||
import './VerifiedDomainBadge.css';
|
||
|
||
/**
|
||
* Displays verified domain badge on user profile
|
||
* @param {Object} props
|
||
* @param {string} props.verifiedDomain - The verified domain name
|
||
* @param {string} props.verificationType - Type of verification (dns or blockchain)
|
||
* @param {Date} props.verifiedAt - When the domain was verified
|
||
*/
|
||
export default function VerifiedDomainBadge({
|
||
verifiedDomain,
|
||
verificationType = 'dns',
|
||
verifiedAt
|
||
}) {
|
||
if (!verifiedDomain) return null;
|
||
|
||
return (
|
||
<div className="verified-domain-badge">
|
||
<div className="badge-content">
|
||
<span className="domain-text">{verifiedDomain}</span>
|
||
<span
|
||
className="checkmark"
|
||
title={`Verified via ${verificationType === 'blockchain' ? 'blockchain' : 'DNS'}`}
|
||
>
|
||
✓
|
||
</span>
|
||
</div>
|
||
{verificationType === 'blockchain' && (
|
||
<span className="blockchain-indicator" title="Verified via blockchain">
|
||
⛓️
|
||
</span>
|
||
)}
|
||
{verifiedAt && (
|
||
<div className="verified-info">
|
||
Verified {new Date(verifiedAt).toLocaleDateString()}
|
||
</div>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|