diff --git a/web/src/js/components/Modes/Socks.tsx b/web/src/js/components/Modes/Socks.tsx
index da7f07051..62734e703 100644
--- a/web/src/js/components/Modes/Socks.tsx
+++ b/web/src/js/components/Modes/Socks.tsx
@@ -2,10 +2,16 @@ import * as React from "react";
import { useAppDispatch, useAppSelector } from "../../ducks";
import { getSpec, SocksState } from "../../modes/socks";
import { ServerInfo } from "../../ducks/backendState";
-import { setActive } from "../../ducks/modes/socks";
+import {
+ setActive,
+ setListenHost,
+ setListenPort,
+} from "../../ducks/modes/socks";
import { ModeToggle } from "./ModeToggle";
import { ServerStatus } from "./CaptureSetup";
+import ValueEditor from "../editors/ValueEditor";
+import { Popover } from "./Popover";
export default function Socks() {
const serverState = useAppSelector((state) => state.modes.socks);
@@ -54,7 +60,35 @@ function SocksRow({
}
>
Run SOCKS Proxy
- {/** Add here popover to set listen_host and listen_port */}
+
+ Listen Host
+
+ dispatch(setListenHost({ server, value: host }))
+ }
+ />
+
+ Listen Port
+
+ dispatch(
+ setListenPort({
+ server,
+ value: parseInt(port),
+ }),
+ )
+ }
+ />
+
diff --git a/web/src/js/components/Modes/Transparent.tsx b/web/src/js/components/Modes/Transparent.tsx
index d2ac5c567..41159bfec 100644
--- a/web/src/js/components/Modes/Transparent.tsx
+++ b/web/src/js/components/Modes/Transparent.tsx
@@ -2,10 +2,16 @@ import * as React from "react";
import { useAppDispatch, useAppSelector } from "../../ducks";
import { getSpec, TransparentState } from "../../modes/transparent";
import { ServerInfo } from "../../ducks/backendState";
-import { setActive } from "../../ducks/modes/transparent";
+import {
+ setActive,
+ setListenHost,
+ setListenPort,
+} from "../../ducks/modes/transparent";
import { ModeToggle } from "./ModeToggle";
import { ServerStatus } from "./CaptureSetup";
+import ValueEditor from "../editors/ValueEditor";
+import { Popover } from "./Popover";
export default function Transparent() {
const serverState = useAppSelector((state) => state.modes.transparent);
@@ -60,7 +66,35 @@ function TransparentRow({
}
>
Run Transparent Proxy
- {/** Add here popover to set listen_host and listen_port */}
+
+ Listen Host
+
+ dispatch(setListenHost({ server, value: host }))
+ }
+ />
+
+ Listen Port
+
+ dispatch(
+ setListenPort({
+ server,
+ value: parseInt(port),
+ }),
+ )
+ }
+ />
+