src/Element/Relays.tsx

@@ -2,16 +2,12 @@ import "./Relays.css";
 import Nostrich from "nostrich.webp";
 import { useState } from "react";
 
+import { RelaySettings } from "Nostr";
 import Read from "Icons/Read";
 import Write from "Icons/Write";
 
-export interface RelaySpec {
-  url: string;
-  settings: { read: boolean; write: boolean };
-}
-
 interface RelaysProps {
-  relays: RelaySpec[];
+  relays: RelaySettings[];
 }
 
 const RelayFavicon = ({ url }: { url: string }) => {
@@ -19,6 +15,7 @@ const RelayFavicon = ({ url }: { url: string }) => {
     .replace("wss://relay.", "https://")
     .replace("wss://nostr.", "https://")
     .replace("wss://", "https://")
+    .replace("ws://", "http://")
     .replace(/\/$/, "");
   const [faviconUrl, setFaviconUrl] = useState(`${cleanUrl}/favicon.ico`);
 

src/Feed/EventPublisher.ts

@@ -109,6 +109,16 @@ export default function useEventPublisher() {
         }
       }
     },
+    /**
+     * Write event to all given relays.
+     */
+    broadcastAll: (ev: NEvent | undefined, relays: string[]) => {
+      if (ev) {
+        for (const k of relays) {
+          System.WriteOnceToRelay(k, ev);
+        }
+      }
+    },
     muted: async (keys: HexKey[], priv: HexKey[]) => {
       if (pubKey) {
         const ev = NEvent.ForPubKey(pubKey);

src/Feed/RelaysFeed.tsx

@@ -1,7 +1,6 @@
 import { useMemo } from "react";
-import { HexKey } from "Nostr";
+import { HexKey, RelaySettings } from "Nostr";
 import EventKind from "Nostr/EventKind";
-import { RelaySpec } from "Element/Relays";
 import { Subscriptions } from "Nostr/Subscriptions";
 import useSubscription from "./Subscription";
 
@@ -33,5 +32,5 @@ export default function useRelaysFeed(pubkey: HexKey) {
       ];
     }
     return rs;
-  }, [] as RelaySpec[]);
+  }, [] as RelaySettings[]);
 }

src/Nostr/Connection.ts

@@ -179,7 +179,7 @@ export default class Connection {
         }
         case "OK": {
           // feedback to broadcast call
-          console.debug("OK: ", msg);
+          console.debug(`${this.Address} OK: `, msg);
           const id = msg[1];
           if (this.EventsCallback.has(id)) {
             const cb = unwrap(this.EventsCallback.get(id));

src/Nostr/index.ts

@@ -69,3 +69,8 @@ export type UserMetadata = {
 export enum Lists {
   Muted = "mute",
 }
+
+export interface RelaySettings {
+  url: string;
+  settings: { read: boolean; write: boolean };
+}

src/Pages/Layout.tsx

@@ -2,10 +2,11 @@ import "./Layout.css";
 import { useEffect, useMemo, useState } from "react";
 import { useDispatch, useSelector } from "react-redux";
 import { Outlet, useLocation, useNavigate } from "react-router-dom";
+
+import { randomSample } from "Util";
 import Envelope from "Icons/Envelope";
 import Bell from "Icons/Bell";
 import Search from "Icons/Search";
-
 import { RootState } from "State/Store";
 import { init, setRelays } from "State/Login";
 import { System } from "Nostr/System";
@@ -147,8 +148,7 @@ export default function Layout() {
       const rsp = await fetch("https://api.nostr.watch/v1/online");
       if (rsp.ok) {
         const online: string[] = await rsp.json();
-        const pickRandom = online.sort(() => (Math.random() >= 0.5 ? 1 : -1)).slice(0, 4); // pick 4 random relays
-
+        const pickRandom = randomSample(online, 4);
         const relayObjects = pickRandom.map(a => [a, { read: true, write: true }]);
         newRelays = Object.fromEntries(relayObjects);
         dispatch(

src/Pages/messages.ts

@@ -33,4 +33,7 @@ export default defineMessages({
   NostrPlebsNip: {
     defaultMessage: `Nostr Plebs is one of the first NIP-05 providers in the space and offers a good collection of domains at reasonable prices`,
   },
+  Relays: {
+    defaultMessage: "Relays",
+  },
 });

src/Pages/settings/Relays.tsx

@@ -2,6 +2,7 @@ import { useState } from "react";
 import { FormattedMessage } from "react-intl";
 import { useDispatch, useSelector } from "react-redux";
 
+import { randomSample } from "Util";
 import Relay from "Element/Relay";
 import useEventPublisher from "Feed/EventPublisher";
 import { RootState } from "State/Store";
@@ -20,8 +21,14 @@ const RelaySettingsPage = () => {
     const ev = await publisher.saveRelays();
     publisher.broadcast(ev);
     publisher.broadcastForBootstrap(ev);
-    const settingsEv = await publisher.saveRelaysSettings();
-    publisher.broadcast(settingsEv);
+    try {
+      const relays = await fetch("https://api.nostr.watch/v1/online").then(r => r.json());
+      const settingsEv = await publisher.saveRelaysSettings();
+      publisher.broadcast(ev);
+      publisher.broadcastAll(settingsEv, randomSample(relays, 20));
+    } catch (error) {
+      console.error(error);
+    }
   }
 
   function addRelay() {

src/Pages/settings/messages.ts

@@ -55,4 +55,6 @@ export default defineMessages({
   DisplayName: { defaultMessage: "Display name" },
   Buy: { defaultMessage: "Buy" },
   Nip05: { defaultMessage: "NIP-05" },
+  ReactionEmoji: { defaultMessage: "Reaction emoji" },
+  ReactionEmojiHelp: { defaultMessage: "Emoji to send when reactiong to a note" },
 });

src/Util.ts

@@ -185,3 +185,8 @@ export function unwrap<T>(v: T | undefined | null): T {
   }
   return v;
 }
+
+export function randomSample<T>(coll: T[], size: number) {
+  const random = [...coll];
+  return random.sort(() => (Math.random() >= 0.5 ? 1 : -1)).slice(0, size);
+}