SpecialFollowButton.tsx raw

   1  import { Button } from '@/components/ui/button'
   2  import { useNostr } from '@/providers/NostrProvider'
   3  import { usePinnedUsers } from '@/providers/PinnedUsersProvider'
   4  import { Loader, Star } from 'lucide-react'
   5  import { useMemo, useState } from 'react'
   6  import { useTranslation } from 'react-i18next'
   7  import { toast } from 'sonner'
   8  
   9  export default function SpecialFollowButton({ pubkey }: { pubkey: string }) {
  10    const { t } = useTranslation()
  11    const { pubkey: accountPubkey, checkLogin } = useNostr()
  12    const { isPinned, togglePin } = usePinnedUsers()
  13    const [updating, setUpdating] = useState(false)
  14    const pinned = useMemo(() => isPinned(pubkey), [isPinned, pubkey])
  15  
  16    if (!accountPubkey || (pubkey && pubkey === accountPubkey)) return null
  17  
  18    const onToggle = async (e: React.MouseEvent) => {
  19      e.stopPropagation()
  20      checkLogin(async () => {
  21        setUpdating(true)
  22        try {
  23          await togglePin(pubkey)
  24        } catch (error) {
  25          if (pinned) {
  26            toast.error(t('Unfollow failed') + ': ' + (error as Error).message)
  27          } else {
  28            toast.error(t('Follow failed') + ': ' + (error as Error).message)
  29          }
  30        } finally {
  31          setUpdating(false)
  32        }
  33      })
  34    }
  35  
  36    return (
  37      <Button
  38        variant="secondary"
  39        size="icon"
  40        className="rounded-full"
  41        onClick={onToggle}
  42        disabled={updating}
  43      >
  44        {updating ? (
  45          <Loader className="animate-spin" />
  46        ) : (
  47          <Star className={pinned ? 'fill-primary stroke-primary' : ''} />
  48        )}
  49      </Button>
  50    )
  51  }
  52