index.tsx raw

   1  import { Skeleton } from '@/components/ui/skeleton'
   2  import { useFetchProfile } from '@/hooks'
   3  import { useFetchNip05 } from '@/hooks/useFetchNip05'
   4  import { toNoteList } from '@/lib/link'
   5  import { SecondaryPageLink } from '@/PageManager'
   6  import { BadgeAlert, BadgeCheck } from 'lucide-react'
   7  import { Favicon } from '../Favicon'
   8  
   9  export default function Nip05({ pubkey, append }: { pubkey: string; append?: string }) {
  10    const { profile } = useFetchProfile(pubkey)
  11    const { nip05IsVerified, nip05Name, nip05Domain, isFetching } = useFetchNip05(
  12      profile?.nip05,
  13      pubkey
  14    )
  15  
  16    if (isFetching) {
  17      return (
  18        <div className="flex items-center py-1">
  19          <Skeleton className="h-3 w-16" />
  20        </div>
  21      )
  22    }
  23  
  24    if (!profile?.nip05 || !nip05Name || !nip05Domain) return null
  25  
  26    return (
  27      <div
  28        className="flex items-center gap-1 truncate [&_svg]:!size-3.5 [&_svg]:shrink-0"
  29        onClick={(e) => e.stopPropagation()}
  30      >
  31        {nip05Name !== '_' ? (
  32          <span className="text-sm text-muted-foreground truncate">@{nip05Name}</span>
  33        ) : null}
  34        {nip05IsVerified ? (
  35          <Favicon
  36            domain={nip05Domain}
  37            className="w-3.5 h-3.5 rounded-full"
  38            fallback={<BadgeCheck className="text-primary" />}
  39          />
  40        ) : (
  41          <BadgeAlert className="text-muted-foreground" />
  42        )}
  43        <SecondaryPageLink
  44          to={toNoteList({ domain: nip05Domain })}
  45          className={`hover:underline truncate text-sm ${nip05IsVerified ? 'text-primary' : 'text-muted-foreground'}`}
  46        >
  47          {nip05Domain}
  48        </SecondaryPageLink>
  49        {append && <span className="text-sm text-muted-foreground truncate">{append}</span>}
  50      </div>
  51    )
  52  }
  53