feat: sync relay sets

src/components/RelaySettings/TemporaryRelayGroup.tsx

@@ -1,81 +0,0 @@
-import { Button } from '@/components/ui/button'
-import { useFetchRelayInfos } from '@/hooks'
-import { useRelaySettings } from '@/providers/RelaySettingsProvider'
-import client from '@/services/client.service'
-import { Save, SearchCheck } from 'lucide-react'
-import { useEffect, useState } from 'react'
-import { useTranslation } from 'react-i18next'
-
-export default function TemporaryRelayGroup() {
-  const { t } = useTranslation()
-  const { temporaryRelayUrls, relayGroups, addRelayGroup, switchRelayGroup } = useRelaySettings()
-  const [relays, setRelays] = useState<
-    {
-      url: string
-      isConnected: boolean
-    }[]
-  >(temporaryRelayUrls.map((url) => ({ url, isConnected: false })))
-  const { relayInfos } = useFetchRelayInfos(relays.map((relay) => relay.url))
-
-  useEffect(() => {
-    const interval = setInterval(() => {
-      const connectionStatusMap = client.listConnectionStatus()
-      setRelays((pre) => {
-        return pre.map((relay) => {
-          const isConnected = connectionStatusMap.get(relay.url) || false
-          return { ...relay, isConnected }
-        })
-      })
-    }, 1000)
-
-    return () => clearInterval(interval)
-  }, [])
-
-  useEffect(() => {
-    setRelays(temporaryRelayUrls.map((url) => ({ url, isConnected: false })))
-  }, [temporaryRelayUrls])
-
-  if (!relays.length) {
-    return null
-  }
-
-  const handleSave = () => {
-    const existingTemporaryIndexes = relayGroups
-      .filter((group) => /^Temporary \d+$/.test(group.groupName))
-      .map((group) => group.groupName.split(' ')[1])
-      .map(Number)
-      .filter((index) => !isNaN(index))
-    const nextIndex = Math.max(...existingTemporaryIndexes, 0) + 1
-    const groupName = `Temporary ${nextIndex}`
-    addRelayGroup(groupName, temporaryRelayUrls)
-    switchRelayGroup(groupName)
-  }
-
-  return (
-    <div className={`w-full border border-dashed rounded-lg p-4 border-highlight bg-highlight/5`}>
-      <div className="flex justify-between items-center">
-        <div className="h-8 font-semibold">Temporary</div>
-        <Button title="save" size="icon" variant="ghost" onClick={handleSave}>
-          <Save />
-        </Button>
-      </div>
-      {relays.map((relay, index) => (
-        <div key={index} className="flex items-center justify-between">
-          <div className="flex gap-2 items-center">
-            {relay.isConnected ? (
-              <div className="text-green-500 text-xs">●</div>
-            ) : (
-              <div className="text-red-500 text-xs">●</div>
-            )}
-            <div className="text-muted-foreground text-sm">{relay.url}</div>
-            {relayInfos[index]?.supported_nips?.includes(50) && (
-              <div title={t('supports search')} className="text-highlight">
-                <SearchCheck size={14} />
-              </div>
-            )}
-          </div>
-        </div>
-      ))}
-    </div>
-  )
-}