From 3d676062af3ed54942a5f92b0958ce3501616c8b Mon Sep 17 00:00:00 2001
From: plebeius <tom@plebbit.com>
Date: Fri, 2 Jan 2026 16:48:21 +0100
Subject: [PATCH] feat(p2p options): add http routers field

---
 .../p2p-options/p2p-options.module.css        |  4 +++
 .../p2p-options/p2p-options.tsx               | 31 +++++++++++++++++++
 2 files changed, 35 insertions(+)

diff --git a/src/components/settings-modal/p2p-options/p2p-options.module.css b/src/components/settings-modal/p2p-options/p2p-options.module.css
index 76ca29ba..9e4567af 100644
--- a/src/components/settings-modal/p2p-options/p2p-options.module.css
+++ b/src/components/settings-modal/p2p-options/p2p-options.module.css
@@ -25,6 +25,10 @@
   height: unset;
 }
 
+.httpRoutersSettings textarea {
+  height: unset;
+}
+
 .blockchainProvidersSettings textarea {
   height: unset;
 }
diff --git a/src/components/settings-modal/p2p-options/p2p-options.tsx b/src/components/settings-modal/p2p-options/p2p-options.tsx
index a8ff1738..969e239d 100644
--- a/src/components/settings-modal/p2p-options/p2p-options.tsx
+++ b/src/components/settings-modal/p2p-options/p2p-options.tsx
@@ -7,6 +7,7 @@ interface SettingsProps {
   ipfsGatewayUrlsRef?: RefObject<HTMLTextAreaElement>;
   mediaIpfsGatewayUrlRef?: RefObject<HTMLInputElement>;
   pubsubProvidersRef?: RefObject<HTMLTextAreaElement>;
+  httpRoutersRef?: RefObject<HTMLTextAreaElement>;
   ethRpcRef?: RefObject<HTMLTextAreaElement>;
   solRpcRef?: RefObject<HTMLTextAreaElement>;
   maticRpcRef?: RefObject<HTMLTextAreaElement>;
@@ -75,6 +76,30 @@ const PubsubProvidersSettings = ({ pubsubProvidersRef }: SettingsProps) => {
   );
 };
 
+const HttpRoutersSettings = ({ httpRoutersRef }: SettingsProps) => {
+  const account = useAccount();
+  const { plebbitOptions } = account || {};
+  const { httpRoutersOptions } = plebbitOptions || {};
+  const plebbitRpc = usePlebbitRpcSettings();
+  const isConnectedToRpc = plebbitRpc?.state === 'connected';
+  const httpRoutersDefaultValue = httpRoutersOptions?.join('\n');
+
+  return (
+    <div className={styles.httpRoutersSettings}>
+      <textarea
+        defaultValue={httpRoutersDefaultValue}
+        ref={httpRoutersRef}
+        disabled={isConnectedToRpc}
+        autoCorrect='off'
+        autoCapitalize='off'
+        autoComplete='off'
+        spellCheck='false'
+        rows={httpRoutersOptions?.length || 1}
+      />
+    </div>
+  );
+};
+
 const BlockchainProvidersSettings = ({ ethRpcRef, solRpcRef, maticRpcRef }: SettingsProps) => {
   const account = useAccount();
   const { plebbitOptions } = account || {};
@@ -278,6 +303,12 @@ const P2pOptions = () => {
           <PubsubProvidersSettings pubsubProvidersRef={pubsubProvidersRef} />
         </span>
       </div>
+      <div className={styles.category}>
+        <span className={styles.categoryTitle}>http routers:</span>
+        <span className={styles.categorySettings}>
+          <HttpRoutersSettings httpRoutersRef={httpRoutersRef} />
+        </span>
+      </div>
       <div className={styles.category}>
         <span className={styles.categoryTitle} style={{ marginBottom: '-5px' }}>
           blockchain providers: