Clean up forms a bit

This commit is contained in:
Owen
2026-05-13 21:16:00 -07:00
parent 013af49137
commit 4b4c86b4b7
3 changed files with 12 additions and 102 deletions

View File

@@ -37,7 +37,6 @@ type FormState = {
password: string;
hostname: string;
domain: string;
authtoken: string;
kdcProxyUrl: string;
pcb: string;
desktopWidth: number;
@@ -60,7 +59,6 @@ export default function RdpClient() {
password: "Password123!",
hostname: "172.31.3.58:3389",
domain: "",
authtoken: "pangolin-browser-gateway-dev",
kdcProxyUrl: "",
pcb: "",
desktopWidth: 1280,
@@ -159,16 +157,6 @@ export default function RdpClient() {
return;
}
if (form.authtoken === "") {
toast({
variant: "destructive",
title: "Missing auth token",
description:
"An auth token is required to connect through the gateway"
});
return;
}
toast({
title: "Connecting...",
description: "Connection in progress"
@@ -235,7 +223,7 @@ export default function RdpClient() {
`${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.host}/gateway/rdp`
)
.withServerDomain(form.domain)
.withAuthToken(form.authtoken)
.withAuthToken("test-token")
.withDesktopSize({
width: form.desktopWidth,
height: form.desktopHeight
@@ -341,15 +329,7 @@ export default function RdpClient() {
}
/>
</Field>
{/* <Field label="Auth Token" id="authtoken">
<Input
id="authtoken"
value={form.authtoken}
onChange={(e) =>
update("authtoken", e.target.value)
}
/>
</Field>
{/*
<Field label="Pre Connection Blob (optional)" id="pcb">
<Input
id="pcb"

View File

@@ -7,22 +7,18 @@ import { Input } from "@/components/ui/input";
import { Label } from "@/components/ui/label";
type FormState = {
gatewayAddress: string;
hostname: string;
port: string;
username: string;
password: string;
authToken: string;
};
export default function SshClient() {
const [form, setForm] = useState<FormState>({
gatewayAddress: "ws://localhost:7171/jet/ssh",
hostname: "",
port: "22",
username: "",
password: "",
authToken: "abc123"
password: ""
});
const [connected, setConnected] = useState(false);
@@ -122,7 +118,8 @@ export default function SshClient() {
setError(null);
setConnecting(true);
const url = new URL(form.gatewayAddress);
const proxyAddress = `${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.host}/gateway/ssh`;
const url = new URL(proxyAddress);
// Pass connection parameters as query params so the proxy can route
// before any application-level framing is needed.
url.searchParams.set("host", form.hostname);
@@ -130,7 +127,7 @@ export default function SshClient() {
url.searchParams.set("username", form.username);
// Auth token is sent as a query param; the proxy validates it before
// forwarding any data.
url.searchParams.set("authToken", form.authToken);
url.searchParams.set("authToken", "test-token");
const ws = new WebSocket(url.toString(), ["ssh"]);
wsRef.current = ws;
@@ -195,27 +192,6 @@ export default function SshClient() {
{!connected && (
<div className="bg-neutral-900 rounded-lg p-6 max-w-lg w-full mx-auto flex flex-col gap-4">
<div className="grid grid-cols-2 gap-4">
<div className="col-span-2 flex flex-col gap-1">
<Label
htmlFor="gatewayAddress"
className="text-neutral-300"
>
Gateway Address
</Label>
<Input
id="gatewayAddress"
value={form.gatewayAddress}
onChange={(e) =>
setForm({
...form,
gatewayAddress: e.target.value
})
}
placeholder="ws://localhost:7171/jet/ssh"
className="bg-neutral-800 border-neutral-700 text-white"
/>
</div>
<div className="flex flex-col gap-1">
<Label
htmlFor="hostname"
@@ -293,26 +269,6 @@ export default function SshClient() {
className="bg-neutral-800 border-neutral-700 text-white"
/>
</div>
<div className="col-span-2 flex flex-col gap-1">
<Label
htmlFor="authToken"
className="text-neutral-300"
>
Auth Token
</Label>
<Input
id="authToken"
value={form.authToken}
onChange={(e) =>
setForm({
...form,
authToken: e.target.value
})
}
className="bg-neutral-800 border-neutral-700 text-white"
/>
</div>
</div>
{error && <p className="text-red-400 text-sm">{error}</p>}
@@ -320,10 +276,7 @@ export default function SshClient() {
<Button
onClick={connect}
disabled={
connecting ||
!form.hostname ||
!form.username ||
!form.authToken
connecting || !form.hostname || !form.username
}
className="w-full"
>

View File

@@ -7,20 +7,16 @@ import { Label } from "@/components/ui/label";
import { toast } from "@app/hooks/useToast";
type FormState = {
proxyAddress: string;
host: string;
port: string;
password: string;
authToken: string;
};
export default function VncClient() {
const [form, setForm] = useState<FormState>({
proxyAddress: "ws://localhost:7171/jet/vnc",
host: "",
port: "5900",
password: "",
authToken: "abc123"
password: ""
});
const [connected, setConnected] = useState(false);
@@ -83,11 +79,12 @@ export default function VncClient() {
// Build the proxy WebSocket URL:
// ws://<proxyAddress>?authToken=<token>&host=<host>&port=<port>
const base = form.proxyAddress.replace(/\/$/, "");
const proxyAddress = `${window.location.protocol === "https:" ? "wss" : "ws"}://${window.location.host}/gateway/vnc`;
const base = proxyAddress.replace(/\/$/, "");
const params = new URLSearchParams({
authToken: form.authToken,
host: form.host,
port: form.port
port: form.port,
authToken: "test-token"
});
const wsUrl = `${base}?${params.toString()}`;
@@ -176,26 +173,6 @@ export default function VncClient() {
/>
</Field>
<Field label="Proxy Address" id="proxyAddress">
<Input
id="proxyAddress"
value={form.proxyAddress}
onChange={(e) =>
update("proxyAddress", e.target.value)
}
/>
</Field>
<Field label="Auth Token" id="authToken">
<Input
id="authToken"
value={form.authToken}
onChange={(e) =>
update("authToken", e.target.value)
}
/>
</Field>
<Button onClick={connect} className="w-full">
Connect
</Button>