Relay firehose browser tools: https://compare.hose.cam
3
fork

Configure Feed

Select the types of activity you want to include in your feed.

support custom relays (via url text entry)

+46 -1
+46 -1
src/App.tsx
··· 32 32 const [keepalive, setKeepalive] = useState(() => () => {}); 33 33 const [rateBars, setRateBars] = useState({ series: [] } as any); 34 34 const [died, setDied] = useState(false); 35 + const [customRelayHost, setCustomRelayHost] = useState(""); 35 36 36 37 useEffect(() => { 37 38 let lastChangeover = performance.now(); ··· 118 119 keepalive(); 119 120 } 120 121 122 + function getCustomRelayURL(): string { 123 + if (!customRelayHost) return ""; 124 + 125 + try { 126 + let url: URL; 127 + if (customRelayHost.includes("://")) { 128 + url = new URL(customRelayHost); 129 + } else { 130 + url = new URL("https://" + customRelayHost); 131 + } 132 + url.protocol = url.protocol === "https:" ? "wss:" : "ws:"; 133 + 134 + return url.origin; 135 + } catch (err) { 136 + return ""; 137 + } 138 + } 139 + 121 140 return ( 122 141 <> 123 142 <h1>compare hoses</h1> ··· 137 156 </label> 138 157 </p> 139 158 ))} 159 + 160 + <p style={{margin: 0}}> 161 + <label> 162 + <input 163 + type='checkbox' 164 + onChange={e => { 165 + const url = getCustomRelayURL(); 166 + if (url) showRelay(url, e.target.checked); 167 + }} 168 + checked={relays.includes(getCustomRelayURL())} 169 + /> 170 + {` `} 171 + <input 172 + type='text' 173 + placeholder='wss://…' 174 + value={customRelayHost} 175 + onChange={(e) => { 176 + const oldURL = getCustomRelayURL(); 177 + setRelays(relays => relays.includes(oldURL) ? relays.filter(u => u !== oldURL) : relays); 178 + setCustomRelayHost(e.target.value); 179 + }} 180 + /> 181 + {` `} 182 + {customRelayHost && (<code>{getCustomRelayURL()}</code>)} 183 + </label> 184 + </p> 140 185 </form> 141 186 142 187 <div style={{ display: 'flex', flexWrap: 'wrap', gap: '2em', textAlign: 'left' }}> 143 188 {relays.map(url => { 144 - const { desc } = knownRelays.find((r: Relay) => r.url === url)!; 189 + const { desc } = knownRelays.find((r: Relay) => r.url === url) ?? { desc: "custom relay" }; 145 190 return ( 146 191 <div key={url}> 147 192 <Relay