index.tsx raw

   1  import NormalFeed from '@/components/NormalFeed'
   2  import RelayInfo from '@/components/RelayInfo'
   3  import SearchInput from '@/components/SearchInput'
   4  import { useFetchRelayInfo } from '@/hooks'
   5  import { normalizeUrl } from '@/lib/url'
   6  import { useCurrentRelays } from '@/providers/CurrentRelaysProvider'
   7  import { useEffect, useMemo, useState } from 'react'
   8  import { useTranslation } from 'react-i18next'
   9  import NotFound from '../NotFound'
  10  
  11  export default function Relay({ url, className }: { url?: string; className?: string }) {
  12    const { t } = useTranslation()
  13    const { addRelayUrls, removeRelayUrls } = useCurrentRelays()
  14    const normalizedUrl = useMemo(() => (url ? normalizeUrl(url) : undefined), [url])
  15    const { relayInfo } = useFetchRelayInfo(normalizedUrl)
  16    const [searchInput, setSearchInput] = useState('')
  17    const [debouncedInput, setDebouncedInput] = useState(searchInput)
  18  
  19    useEffect(() => {
  20      if (normalizedUrl) {
  21        addRelayUrls([normalizedUrl])
  22        return () => {
  23          removeRelayUrls([normalizedUrl])
  24        }
  25      }
  26    }, [normalizedUrl])
  27  
  28    useEffect(() => {
  29      const handler = setTimeout(() => {
  30        setDebouncedInput(searchInput)
  31      }, 1000)
  32  
  33      return () => {
  34        clearTimeout(handler)
  35      }
  36    }, [searchInput])
  37  
  38    if (!normalizedUrl) {
  39      return <NotFound />
  40    }
  41  
  42    return (
  43      <div className={className}>
  44        <RelayInfo url={normalizedUrl} className="pt-3" />
  45        {relayInfo?.supported_nips?.includes(50) && (
  46          <div className="px-4 py-2">
  47            <SearchInput
  48              value={searchInput}
  49              onChange={(e) => setSearchInput(e.target.value)}
  50              placeholder={t('Search')}
  51            />
  52          </div>
  53        )}
  54        <NormalFeed
  55          subRequests={[
  56            { urls: [normalizedUrl], filter: debouncedInput ? { search: debouncedInput } : {} }
  57          ]}
  58          showRelayCloseReason
  59        />
  60      </div>
  61    )
  62  }
  63