Add reset relays button

src/contexts/AccountContext.tsx

@@ -38,7 +38,7 @@ import LoginModal from "../components/LoginModal/LoginModal";
 import { logError, logInfo, logWarning } from "../lib/logger";
 import { useToastContext } from "../components/Toaster/Toaster";
 import { useIntl } from "@cookbook/solid-intl";
-import { account as tAccount, followWarning, forgotPin } from "../translations";
+import { account as tAccount, followWarning, forgotPin, settings } from "../translations";
 import { getMembershipStatus } from "../lib/membership";
 import ConfirmModal from "../components/ConfirmModal/ConfirmModal";
 
@@ -104,6 +104,7 @@ export type AccountContextStore = {
     checkNostrKey: () => void,
     fetchBookmarks: () => void,
     updateBookmarks: (bookmarks: string[]) => void,
+    resetRelays: (relays: Relay[]) => void,
   },
 }
 
@@ -306,8 +307,14 @@ export function AccountProvider(props: { children: JSXElement }) {
     return !!store.publicKey;
   };
 
-  const setRelaySettings = (settings: NostrRelays, replace?: boolean) => {
+  const resetRelays = (relays: Relay[]) => {
+    const settings = relays.reduce((acc, r) => ({ ...acc, [r.url]: { write: true, read: true }}), {});
 
+    setRelaySettings({ ...settings }, true);
+    connectToRelays({ ...settings }, true);
+  };
+
+  const setRelaySettings = (settings: NostrRelays, replace?: boolean) => {
     if (replace) {
       for (let url in store.relaySettings) {
         if (settings[url]) {
@@ -324,7 +331,7 @@ export function AccountProvider(props: { children: JSXElement }) {
 
       updateStore('relaySettings', () => ({...settings}));
       saveRelaySettings(store.publicKey, settings);
-      return;
+      return true;
     }
 
     const rs = store.relaySettings;
@@ -338,11 +345,12 @@ export function AccountProvider(props: { children: JSXElement }) {
     }, rs);
 
     if (Object.keys(toSave).length === 0) {
-      return;
+      return true;
     }
 
     updateStore('relaySettings', () => ({ ...toSave }));
-    saveRelaySettings(store.publicKey, toSave)
+    saveRelaySettings(store.publicKey, toSave);
+    return true;
   }
 
   const attachDefaultRelays = (relaySettings: NostrRelays) => {
@@ -355,7 +363,7 @@ export function AccountProvider(props: { children: JSXElement }) {
     updateStore('connectToPrimaryRelays', () => flag);
   }
 
-  const connectToRelays = (relaySettings: NostrRelays) => {
+  const connectToRelays = (relaySettings: NostrRelays, sendRelayList?: boolean) => {
 
     if (Object.keys(relaySettings).length === 0) {
       getDefaultRelays(`default_relays_${APP_ID}`);
@@ -375,6 +383,10 @@ export function AccountProvider(props: { children: JSXElement }) {
     }
 
     const onConnect = (connectedRelay: Relay) => {
+      if (sendRelayList) {
+        sendRelays([connectedRelay], relaySettings);
+      }
+
       if (store.relays.find(r => r.url === connectedRelay.url)) {
         return;
       }
@@ -1559,6 +1571,7 @@ const [store, updateStore] = createStore<AccountContextStore>({
     checkNostrKey,
     fetchBookmarks,
     updateBookmarks,
+    resetRelays,
   },
 });
 

src/pages/Settings/Network.tsx

@@ -20,7 +20,6 @@ import { createStore } from 'solid-js/store';
 import Checkbox from '../../components/Checkbox/Checkbox';
 import ConfirmModal from '../../components/ConfirmModal/ConfirmModal';
 import { interpretBold } from '../../translationHelpers';
-import { useSettingsContext } from '../../contexts/SettingsContext';
 import HelpTip from '../../components/HelpTip/HelpTip';
 import PageTitle from '../../components/PageTitle/PageTitle';
 import ButtonLink from '../../components/Buttons/ButtonLink';
@@ -138,6 +137,10 @@ const Network: Component = () => {
     }
   }
 
+  const resetRelays = () => {
+    account?.actions.resetRelays(recomendedRelays);
+  }
+
   const onCachingServiceInput = () => {
     if (!cachingServiceInput || cachingServiceInput.value === '') {
       return;
@@ -235,27 +238,14 @@ const Network: Component = () => {
         />
       </Show>
 
-      <Show when={otherRelays().length > 0}>
-        <div class={`${styles.settingsCaption} ${styles.secondCaption}`}>
-          {intl.formatMessage(t.network.recomended)}
-        </div>
-
-        <For each={otherRelays()}>
-          {url => (
-            <button class={styles.relayItem} onClick={() => onAddRelay(url)}>
-              <div class={styles.relayEntry}>
-                <div class={styles.addIcon}></div>
-                <div class={styles.webIcon}></div>
-                <span>
-                  {url}
-                </span>
-              </div>
-              <div class={styles.add}>{intl.formatMessage(tActions.addRelay)}</div>
-            </button>
-          )}
-        </For>
-
-      </Show>
+      <div class={styles.resetRelays}>
+        <ButtonLink onClick={resetRelays}>
+          {intl.formatMessage(tActions.resetRelays)}
+        </ButtonLink>
+        <HelpTip>
+          <span>{intl.formatMessage(tPlaceholders.resetRelaysHelp)}</span>
+        </HelpTip>
+      </div>
 
       <div class={styles.settingsContentBorderless}>
         <div class={`${styles.settingsCaption} ${styles.secondCaption}`}>

src/pages/Settings/Settings.module.scss

@@ -19,6 +19,14 @@
   }
 }
 
+.resetRelays {
+  margin-top: 12px;
+  padding-inline: 20px;
+  display: flex;
+  align-items: center;
+  gap: 2px;
+}
+
 .bigCaption {
   color: var(--text-primary);
   font-size: 20px;

src/translations.ts

@@ -137,6 +137,11 @@ export const pin = {
 };
 
 export const actions = {
+  resetRelays: {
+    id: 'actions.resetRelays',
+    defaultMessage: 'Reset relays',
+    description: 'Reset relays label',
+  },
   seeMore: {
     id: 'actions.seeMore',
     defaultMessage: 'see more',
@@ -1049,6 +1054,11 @@ export const placeholders = {
     defaultMessage: 'Client will randomly connect to one of the caching services in this pool. This helps with fail-over if some of the services are down. You can add or remove services. If you wish to always connect to exatly one caching service, you should leave only one entry in this pool.',
     description: 'text for caching pool help bubble',
   },
+  resetRelaysHelp: {
+    id: 'placeholders.resetRelaysHelp',
+    defaultMessage: 'This action will disconnect you from any relays you are currently connected to and connect you to a set of recomended relays. THIS CHANGE WILL BE PROPAGETED TO THE NOSTR NETWOK NOSTR.',
+    description: 'text for caching pool help bubble',
+  },
   comingSoon: {
     id: 'placeholders.comingSoon',
     defaultMessage: 'Coming soon. Seriously. Help is on the way. ;)',