73 lines
2.1 KiB
JavaScript
73 lines
2.1 KiB
JavaScript
import { useState, useEffect } from "react";
|
|
|
|
import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
|
|
import { faCheck, faSpinner, faTriangleExclamation } from "@fortawesome/free-solid-svg-icons";
|
|
|
|
import './Nip05.css'
|
|
|
|
export function useIsVerified(nip05, pubkey) {
|
|
const [isVerified, setIsVerified] = useState(false)
|
|
const [couldNotVerify, setCouldNotVerify] = useState(false)
|
|
const [name, domain] = nip05 ? nip05.split('@') : []
|
|
|
|
useEffect(() => {
|
|
if (!nip05 || !pubkey) {
|
|
return
|
|
}
|
|
setCouldNotVerify(false)
|
|
setIsVerified(false)
|
|
|
|
fetch(`https://${domain}/.well-known/nostr.json?name=${name}`)
|
|
.then((res) => res.json())
|
|
.then(({ names }) => {
|
|
if (names && names[name]) {
|
|
setIsVerified(names[name] === pubkey)
|
|
}
|
|
})
|
|
.catch((err) => {
|
|
setCouldNotVerify(true)
|
|
console.error("Couldn't verifiy nip05")
|
|
})
|
|
}, [nip05, pubkey])
|
|
|
|
return { name, domain: domain?.toLowerCase(), isVerified, couldNotVerify }
|
|
}
|
|
|
|
const Nip05 = ({ name, domain, isVerified, couldNotVerify }) => {
|
|
const isDefaultUser = name === '_'
|
|
|
|
return (
|
|
<div className="flex nip05" onClick={(ev) => ev.stopPropagation()}>
|
|
{!isDefaultUser && <div className="nick">{name}</div>}
|
|
<div className={`domain ${isVerified ? 'text-gradient' : ''}`} data-domain={isVerified ? domain : ''}>
|
|
{domain}
|
|
</div>
|
|
<span className="badge">
|
|
{!isVerified && !couldNotVerify && (
|
|
<FontAwesomeIcon
|
|
color={"var(--fg-color)"}
|
|
icon={faSpinner}
|
|
size="xs"
|
|
/>
|
|
)}
|
|
{isVerified && (
|
|
<FontAwesomeIcon
|
|
color={"var(--success)"}
|
|
icon={faCheck}
|
|
size="xs"
|
|
/>
|
|
)}
|
|
{couldNotVerify && (
|
|
<FontAwesomeIcon
|
|
color={"var(--error)"}
|
|
icon={faTriangleExclamation}
|
|
size="xs"
|
|
/>
|
|
)}
|
|
</span>
|
|
</div>
|
|
)
|
|
}
|
|
|
|
export default Nip05
|