feat(rcon): unify terminal workspace

.env.example

@@ -25,9 +25,7 @@ PROXYCHECK_API_KEY=
 IP_INTELLIGENCE_CACHE_HOURS=48
 BLOCK_HOSTING_IPS=false
 
-# Internal RCON proxy. Endpoints must be exact host:port pairs.
+# Optional independent 32-byte base64 RCON keys. When omitted, domain-separated keys are derived from AUTH_SECRET.
-RCON_ALLOWED_ENDPOINTS=season4.somc.svc.cluster.local:25575
-# Optional independent 32-byte base64 keys. When omitted, domain-separated keys are derived from AUTH_SECRET.
 RCON_CREDENTIAL_KEY=
 RCON_AUDIT_KEY=
 

README.md

@@ -76,7 +76,7 @@ The token is displayed once and stored only as a SHA-256 hash.
 
 - PostgreSQL and Drizzle ORM
 - Keycloak OIDC for admin access with the `minecraft-account-manager-admin` role
-- Admin user search, account management, event exploration, DAU and confirmed-connection metrics, toggleable Natural Earth/OpenStreetMap user-location views, internal RCON connection management and command proxying, and automatic Discord nickname synchronization
+- Admin user search, account management, event exploration, DAU and confirmed-connection metrics, toggleable Natural Earth/OpenStreetMap user-location views, RCON server-address management and command proxying, and automatic Discord nickname synchronization
 - Exclusive group admission: unassigned users fall back to protected `everyone`, and administrators manage effective membership, access, recurring UTC login windows, and VPN/proxy/Tor exceptions through confirmed group workflows
 - Deployment-managed Discord guild ID and invite URL
 - discord.js bot with `/register` and `/account`

apps/web/src/app/admin/(console)/rcon/page.tsx

@@ -1,14 +1,7 @@
 import { rconServers } from "@minecraft-account-manager/database";
 import { asc } from "drizzle-orm";
-import { RconConsole } from "@/components/rcon-console";
+import { RconConsole, type RconTerminalNotice } from "@/components/rcon-console";
 import { db } from "@/lib/database";
-import {
-  createRconServer,
-  deleteRconServer,
-  setRconServerEnabled,
-  testSavedRconServer,
-  updateRconServer,
-} from "./actions";
 
 export const dynamic = "force-dynamic";
 
@@ -22,7 +15,7 @@ const savedMessages: Record<string, string> = {
 };
 
 const errorMessages: Record<string, string> = {
-  "invalid-connection": "Enter a valid allowlisted hostname, port, name, and password.",
+  "invalid-connection": "Enter a valid DNS hostname, port, name, and password.",
   "duplicate-name": "Connection names must be unique.",
   configuration: "RCON credential encryption is not configured.",
   "save-failed": "The RCON connection could not be saved.",
@@ -46,13 +39,17 @@ export default async function RconPage({
   const query = await searchParams;
   const saved = queryValue(query.saved);
   const error = queryValue(query.error);
+  const notice: RconTerminalNotice | undefined = error
+    ? { status: "error", message: errorMessages[error] ?? "The RCON operation failed." }
+    : saved
+      ? { status: "success", message: savedMessages[saved] ?? "RCON settings saved." }
+      : undefined;
   const servers = await db.select({
     id: rconServers.id,
     name: rconServers.name,
     host: rconServers.host,
     port: rconServers.port,
     enabled: rconServers.enabled,
-    updatedAt: rconServers.updatedAt,
   }).from(rconServers).orderBy(asc(rconServers.name));
 
   return (
@@ -60,88 +57,19 @@ export default async function RconPage({
       <header className="border-b border-line pb-8">
         <p className="font-mono text-xs font-bold uppercase tracking-[0.25em] text-accent">Server operations</p>
         <h1 className="mt-4 font-display text-5xl font-black uppercase sm:text-7xl">RCON</h1>
-        <p className="mt-5 max-w-2xl text-sm leading-6 text-muted">Run commands through the portal backend. RCON endpoints remain internal and credentials are never sent to the browser.</p>
+        <p className="mt-5 max-w-2xl text-sm leading-6 text-muted">Select and manage a connection, then run commands through the portal backend. Credentials are never sent to the browser.</p>
       </header>
 
-      {saved && <p className="mt-7 border-l-2 border-signal bg-panel px-5 py-4 font-mono text-xs font-bold uppercase tracking-wider" role="status">{savedMessages[saved] ?? "RCON settings saved."}</p>}
+      <section className="mt-10">
-      {error && <p className="mt-7 border-l-2 border-accent bg-panel px-5 py-4 text-sm text-accent" role="alert">{errorMessages[error] ?? "The RCON operation failed."}</p>}
+        <div className="flex flex-col gap-3 sm:flex-row sm:items-end sm:justify-between">
-
-      <div className="mt-10 grid gap-10 lg:grid-cols-[1.1fr_0.9fr]">
-        <section className="border border-line bg-panel p-6 shadow-[6px_6px_0_var(--color-shadow)]">
-          <p className="font-mono text-[9px] font-bold uppercase tracking-widest text-muted">Command proxy</p>
-          <h2 className="mt-2 font-display text-3xl font-black uppercase">Console</h2>
-          <p className="mt-3 text-xs leading-5 text-muted">Only the latest bounded response is shown. Commands and responses are not saved as console history.</p>
-          <RconConsole servers={servers.filter((server) => server.enabled).map(({ id, name }) => ({ id, name }))} />
-        </section>
-
-        <section>
-          <p className="font-mono text-[9px] font-bold uppercase tracking-widest text-muted">Configuration</p>
-          <h2 className="mt-2 font-display text-3xl font-black uppercase">Add connection</h2>
-          <form action={createRconServer} className="mt-5 space-y-4 border border-line bg-panel p-6">
-            <ConnectionFields prefix="new" />
-            <label className="flex items-center gap-3 font-mono text-[10px] font-bold uppercase"><input className="size-4" name="enabled" type="checkbox" value="yes" />Enable immediately</label>
-            <button className="border border-ink bg-ink px-5 py-3 font-mono text-[10px] font-bold uppercase tracking-wider text-canvas" type="submit">Add connection</button>
-          </form>
-        </section>
-      </div>
-
-      <section className="mt-12">
-        <div className="flex items-end justify-between border-b border-line pb-4">
-          <div><p className="font-mono text-[9px] font-bold uppercase tracking-widest text-muted">Saved endpoints</p><h2 className="mt-2 font-display text-3xl font-black uppercase">Connections</h2></div>
-          <span className="font-mono text-xs text-muted">{servers.length} configured</span>
-        </div>
-        <div className="divide-y divide-line">
-          {servers.map((server) => (
-            <article className="grid gap-5 py-6 lg:grid-cols-[1fr_auto] lg:items-start" key={server.id}>
           <div>
-                <div className="flex flex-wrap items-center gap-3"><h3 className="font-mono text-lg font-bold">{server.name}</h3><span className={`px-2 py-1 font-mono text-[9px] font-bold uppercase ${server.enabled ? "bg-signal text-ink" : "border border-line text-muted"}`}>{server.enabled ? "Enabled" : "Disabled"}</span></div>
+            <p className="font-mono text-[9px] font-bold uppercase tracking-widest text-muted">Command proxy</p>
-                <p className="mt-2 font-mono text-[10px] text-muted">{server.host}:{server.port}</p>
+            <h2 className="mt-2 font-display text-3xl font-black uppercase">Terminal</h2>
-                <p className="mt-1 font-mono text-[9px] text-muted">Updated {server.updatedAt.toISOString()}</p>
           </div>
-              <div className="flex flex-wrap items-start gap-4">
+          <p className="max-w-xl text-xs leading-5 text-muted">Only the latest bounded response is shown. Commands and responses are not saved as console history.</p>
-                <form action={testSavedRconServer}><input name="serverId" type="hidden" value={server.id} /><button className="font-mono text-[9px] font-bold uppercase underline underline-offset-4" type="submit">Test</button></form>
-                <form action={setRconServerEnabled}><input name="serverId" type="hidden" value={server.id} /><input name="enabled" type="hidden" value={server.enabled ? "no" : "yes"} /><button className="font-mono text-[9px] font-bold uppercase underline underline-offset-4" type="submit">{server.enabled ? "Disable" : "Enable"}</button></form>
-                <details className="relative">
-                  <summary className="cursor-pointer list-none font-mono text-[9px] font-bold uppercase underline underline-offset-4">Edit</summary>
-                  <form action={updateRconServer} className="relative z-10 mt-3 w-[min(28rem,80vw)] space-y-4 border border-line bg-panel p-5 shadow-[5px_5px_0_var(--color-shadow)] lg:absolute lg:right-0">
-                    <input name="serverId" type="hidden" value={server.id} />
-                    <ConnectionFields defaults={server} prefix={server.id} />
-                    <label className="flex items-center gap-3 font-mono text-[10px] font-bold uppercase"><input className="size-4" defaultChecked={server.enabled} name="enabled" type="checkbox" value="yes" />Enabled</label>
-                    <button className="border border-ink px-4 py-2 font-mono text-[9px] font-bold uppercase" type="submit">Save connection</button>
-                  </form>
-                </details>
-                <details className="relative">
-                  <summary className="cursor-pointer list-none font-mono text-[9px] font-bold uppercase text-accent underline underline-offset-4">Delete</summary>
-                  <form action={deleteRconServer} className="relative z-10 mt-3 w-64 border border-accent bg-panel p-5 shadow-[5px_5px_0_var(--color-accent)] lg:absolute lg:right-0">
-                    <input name="serverId" type="hidden" value={server.id} /><input name="confirmation" type="hidden" value={server.id} />
-                    <p className="text-xs leading-5">Delete {server.name}? Its encrypted credential will be removed.</p>
-                    <button className="mt-4 bg-accent px-4 py-2 font-mono text-[9px] font-bold uppercase text-canvas" type="submit">Confirm deletion</button>
-                  </form>
-                </details>
-              </div>
-            </article>
-          ))}
-          {!servers.length && <p className="py-8 text-sm text-muted">No RCON connections configured.</p>}
         </div>
+        <RconConsole notice={notice} servers={servers} />
       </section>
     </main>
   );
 }
-
-function ConnectionFields({
-  prefix,
-  defaults,
-}: {
-  prefix: string;
-  defaults?: { name: string; host: string; port: number };
-}) {
-  const fieldClass = "mt-2 block w-full border border-line bg-canvas px-4 py-3 font-mono text-sm outline-none focus:border-accent";
-  return (
-    <>
-      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-name`}>Name<input className={fieldClass} defaultValue={defaults?.name} id={`${prefix}-rcon-name`} maxLength={100} name="name" required /></label>
-      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-host`}>Internal hostname<input autoCapitalize="none" autoCorrect="off" className={fieldClass} defaultValue={defaults?.host} id={`${prefix}-rcon-host`} maxLength={253} name="host" placeholder="season4.somc.svc.cluster.local" required spellCheck={false} /></label>
-      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-port`}>Port<input className={fieldClass} defaultValue={defaults?.port ?? 25575} id={`${prefix}-rcon-port`} max={65535} min={1} name="port" required type="number" /></label>
-      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-password`}>{defaults ? "Replacement password" : "Password"}<input autoComplete="new-password" className={fieldClass} id={`${prefix}-rcon-password`} maxLength={512} name="password" required={!defaults} type="password" />{defaults && <span className="mt-2 block font-sans text-[10px] font-normal normal-case text-muted">Leave blank to preserve the current password.</span>}</label>
-    </>
-  );
-}

apps/web/src/components/rcon-console.test.tsx

@@ -2,22 +2,58 @@ import { renderToStaticMarkup } from "react-dom/server";
 import { describe, expect, it, vi } from "vitest";
 
 vi.mock("@/app/admin/(console)/rcon/actions", () => ({
+  createRconServer: vi.fn(),
+  deleteRconServer: vi.fn(),
   executeRconCommand: vi.fn(),
+  setRconServerEnabled: vi.fn(),
+  testSavedRconServer: vi.fn(),
+  updateRconServer: vi.fn(),
 }));
 
 import { RconConsole } from "./rcon-console";
 
+const server = {
+  id: "11111111-1111-4111-8111-111111111111",
+  name: "Season 4",
+  host: "season4.somc.svc.cluster.local",
+  port: 25575,
+  enabled: true,
+};
+
 describe("RconConsole", () => {
-  it("renders labelled keyboard-operable controls without history", () => {
+  it("renders one wide terminal workspace with connection controls and modal forms", () => {
-    const markup = renderToStaticMarkup(<RconConsole servers={[{ id: "one", name: "Season 4" }]} />);
+    const markup = renderToStaticMarkup(<RconConsole servers={[server]} />);
+    expect(markup).toContain('aria-label="RCON terminal"');
     expect(markup).toContain('for="rcon-console-server"');
     expect(markup).toContain('for="rcon-command"');
+    expect(markup).toContain("w-full");
     expect(markup).toContain("Season 4");
-    expect(markup).toContain("Run command");
+    expect(markup).toContain("server://");
+    expect(markup).toContain("Awaiting command");
+    expect(markup).toContain("Add");
+    expect(markup).toContain("Edit");
+    expect(markup).toContain("Test");
+    expect(markup).toContain("Disable");
+    expect(markup).toContain("Delete");
+    expect(markup).toContain("Add RCON connection");
+    expect(markup).toContain("Edit Season 4");
+    expect(markup).toContain("Delete Season 4?");
+    expect(markup).toContain("Enter ↵");
     expect(markup).not.toContain("Latest response");
   });
 
-  it("explains when no enabled connection is available", () => {
+  it("renders connection operation notices inside the terminal viewport", () => {
-    expect(renderToStaticMarkup(<RconConsole servers={[]} />)).toContain("Enable an RCON connection");
+    const markup = renderToStaticMarkup(<RconConsole notice={{ status: "error", message: "RCON authentication timed out." }} servers={[server]} />);
+    expect(markup).toContain("RCON authentication timed out.");
+    expect(markup).toContain('role="alert"');
+  });
+
+  it("keeps the terminal and add action available when no connection exists", () => {
+    const markup = renderToStaticMarkup(<RconConsole servers={[]} />);
+    expect(markup).toContain('aria-label="RCON terminal"');
+    expect(markup).toContain("No connections configured");
+    expect(markup).toContain("Add");
+    expect(markup).not.toContain("Edit");
+    expect(markup).not.toContain("Delete");
   });
 });

apps/web/src/components/rcon-console.tsx

@@ -1,39 +1,202 @@
 "use client";
 
-import { useActionState } from "react";
+import { useActionState, useState } from "react";
-import { executeRconCommand, type RconCommandState } from "@/app/admin/(console)/rcon/actions";
+import {
+  createRconServer,
+  deleteRconServer,
+  executeRconCommand,
+  setRconServerEnabled,
+  testSavedRconServer,
+  type RconCommandState,
+  updateRconServer,
+} from "@/app/admin/(console)/rcon/actions";
+import { AdminModalForm } from "@/components/admin-modal-form";
 
 const initialState: RconCommandState = { status: "idle", message: "", serverId: "" };
 
-type ServerOption = { id: string; name: string };
+export type RconServerOption = {
+  id: string;
+  name: string;
+  host: string;
+  port: number;
+  enabled: boolean;
+};
 
-export function RconConsole({ servers }: { servers: ServerOption[] }) {
+export type RconTerminalNotice = {
+  status: "success" | "error";
+  message: string;
+};
+
+export function RconConsole({
+  notice,
+  servers,
+}: {
+  notice?: RconTerminalNotice;
+  servers: RconServerOption[];
+}) {
+  const [selectedId, setSelectedId] = useState(servers[0]?.id ?? "");
   const [state, action, pending] = useActionState(executeRconCommand, initialState);
+  const selected = servers.find((server) => server.id === selectedId) ?? servers[0];
   const responseServer = servers.find((server) => server.id === state.serverId);
-
+  const output = terminalOutput({ notice, pending, responseServer, selected, state });
-  if (!servers.length) {
-    return <p className="mt-5 text-sm text-muted">Enable an RCON connection before opening the console.</p>;
-  }
 
   return (
-    <form action={action} className="mt-6 space-y-4">
+    <section aria-label="RCON terminal" className="mt-8 w-full overflow-hidden border-2 border-ink bg-panel shadow-[8px_8px_0_var(--color-shadow)]">
-      <label className="block font-mono text-[10px] font-bold uppercase tracking-wider" htmlFor="rcon-console-server">
+      <div className="flex flex-col gap-4 border-b-2 border-ink bg-canvas px-4 py-4 lg:flex-row lg:items-center lg:justify-between">
-        Server
+        <div className="flex min-w-0 flex-wrap items-center gap-3">
-        <select className="mt-2 block w-full border border-line bg-canvas px-4 py-3 font-sans text-sm font-normal normal-case" defaultValue={state.serverId || servers[0]?.id} id="rcon-console-server" name="serverId" required>
+          <div className="flex items-center gap-2 font-mono text-[10px] font-bold uppercase tracking-wider text-muted">
-          {servers.map((server) => <option key={server.id} value={server.id}>{server.name}</option>)}
+            <span aria-hidden="true" className={`size-2 rounded-full shadow-[0_0_0_1px_var(--color-ink)] ${selected?.enabled ? "bg-signal" : "bg-line"}`} />
+            <span>server://</span>
+          </div>
+          {servers.length ? (
+            <label className="flex min-w-0 items-center gap-2 font-mono text-[9px] font-bold uppercase tracking-wider" htmlFor="rcon-console-server">
+              <span className="sr-only">Server</span>
+              <select
+                className="max-w-full border border-line bg-panel px-3 py-2 font-mono text-xs font-bold normal-case outline-none focus:border-accent"
+                id="rcon-console-server"
+                onChange={(event) => setSelectedId(event.target.value)}
+                value={selected?.id}
+              >
+                {servers.map((server) => <option key={server.id} value={server.id}>{server.name}{server.enabled ? "" : " — disabled"}</option>)}
               </select>
             </label>
-      <label className="block font-mono text-[10px] font-bold uppercase tracking-wider" htmlFor="rcon-command">
+          ) : (
-        Command
+            <span className="font-mono text-xs font-bold text-muted">no-target</span>
-        <input autoComplete="off" className="mt-2 block w-full border border-line bg-canvas px-4 py-3 font-mono text-sm outline-none focus:border-accent" id="rcon-command" maxLength={1024} name="command" placeholder="list" required spellCheck={false} />
-      </label>
-      <button className="border border-ink bg-ink px-5 py-3 font-mono text-[10px] font-bold uppercase tracking-wider text-canvas disabled:cursor-wait disabled:opacity-60" disabled={pending} type="submit">{pending ? "Running…" : "Run command"}</button>
-      {state.status !== "idle" && (
-        <div aria-live="polite" className={`border-l-2 bg-canvas p-4 ${state.status === "error" ? "border-accent" : "border-signal"}`} role={state.status === "error" ? "alert" : "status"}>
-          <p className="font-mono text-[9px] font-bold uppercase tracking-wider text-muted">Latest response{responseServer ? ` — ${responseServer.name}` : ""}</p>
-          <pre className="mt-2 max-h-80 overflow-auto whitespace-pre-wrap break-words font-mono text-xs leading-5">{state.message}</pre>
-        </div>
           )}
+          {selected && <span className="font-mono text-[9px] text-muted">{selected.host}:{selected.port}</span>}
+        </div>
+
+        <div className="flex flex-wrap items-center gap-2">
+          <ConnectionModal mode="add" />
+          {selected && (
+            <>
+              <form action={testSavedRconServer}>
+                <input name="serverId" type="hidden" value={selected.id} />
+                <HeaderButton label="Test" />
               </form>
+              <form action={setRconServerEnabled}>
+                <input name="serverId" type="hidden" value={selected.id} />
+                <input name="enabled" type="hidden" value={selected.enabled ? "no" : "yes"} />
+                <HeaderButton label={selected.enabled ? "Disable" : "Enable"} />
+              </form>
+              <ConnectionModal mode="edit" server={selected} />
+              <AdminModalForm
+                action={deleteRconServer}
+                description={`Delete ${selected.name} and its encrypted credential. This cannot be undone.`}
+                intent="danger"
+                submitLabel="Delete connection"
+                title={`Delete ${selected.name}?`}
+                triggerClassName="border border-accent px-3 py-2 font-mono text-[9px] font-bold uppercase tracking-wider text-accent"
+                triggerLabel="Delete"
+              >
+                <input name="serverId" type="hidden" value={selected.id} />
+                <input name="confirmation" type="hidden" value={selected.id} />
+              </AdminModalForm>
+            </>
+          )}
+        </div>
+      </div>
+
+      <div aria-live="polite" aria-relevant="additions text" className="min-h-72 max-h-[32rem] overflow-auto p-5 font-mono text-xs leading-5" role={output.status === "error" ? "alert" : "status"}>
+        <p className={`text-[9px] font-bold uppercase tracking-wider ${output.status === "error" ? "text-accent" : "text-muted"}`}>{output.label}</p>
+        <pre className="mt-3 whitespace-pre-wrap break-words font-mono text-xs leading-5">{output.message}</pre>
+      </div>
+
+      <form action={action} className="flex items-center gap-3 border-t-2 border-ink bg-canvas p-3">
+        <input name="serverId" type="hidden" value={selected?.id ?? ""} />
+        <span aria-hidden="true" className="font-mono text-lg font-black text-accent">$</span>
+        <label className="sr-only" htmlFor="rcon-command">Command</label>
+        <input
+          autoComplete="off"
+          autoFocus
+          className="min-w-0 flex-1 bg-transparent px-1 py-2 font-mono text-sm outline-none placeholder:text-muted focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50"
+          disabled={!selected?.enabled || pending}
+          id="rcon-command"
+          key={selected?.id ?? "no-server"}
+          maxLength={1024}
+          name="command"
+          placeholder={selected ? (selected.enabled ? "list" : "Enable this connection to run commands") : "Add a connection to begin"}
+          required
+          spellCheck={false}
+        />
+        <button className="border border-ink bg-ink px-4 py-2 font-mono text-[9px] font-bold uppercase tracking-wider text-canvas disabled:cursor-not-allowed disabled:opacity-50" disabled={!selected?.enabled || pending} type="submit">{pending ? "Running…" : "Enter ↵"}</button>
+      </form>
+    </section>
+  );
+}
+
+function terminalOutput({
+  notice,
+  pending,
+  responseServer,
+  selected,
+  state,
+}: {
+  notice?: RconTerminalNotice;
+  pending: boolean;
+  responseServer?: RconServerOption;
+  selected?: RconServerOption;
+  state: RconCommandState;
+}) {
+  if (pending) return { status: "success" as const, label: "Executing", message: "Command in progress…" };
+  if (state.status !== "idle") return {
+    status: state.status,
+    label: `${state.status === "error" ? "Error" : "Response"}${responseServer ? ` — ${responseServer.name}` : ""}`,
+    message: state.message,
+  };
+  if (notice) return { ...notice, label: notice.status === "error" ? "Connection error" : "Connection update" };
+  if (!selected) return { status: "success" as const, label: "Ready", message: "No connections configured. Use Add to create a server connection." };
+  if (!selected.enabled) return { status: "error" as const, label: `Disabled — ${selected.name}`, message: "Enable this connection before testing commands." };
+  return { status: "success" as const, label: `Ready — ${selected.name}`, message: "Awaiting command" };
+}
+
+function HeaderButton({ label }: { label: string }) {
+  return <button className="border border-line px-3 py-2 font-mono text-[9px] font-bold uppercase tracking-wider hover:border-ink" type="submit">{label}</button>;
+}
+
+function ConnectionModal({
+  mode,
+  server,
+}: {
+  mode: "add" | "edit";
+  server?: RconServerOption;
+}) {
+  const editing = mode === "edit" ? server : undefined;
+  return (
+    <AdminModalForm
+      action={editing ? updateRconServer : createRconServer}
+      description={editing ? `Update ${editing.name}. Leave the password blank to preserve its encrypted credential.` : "Add an internal or external RCON server address. The password is encrypted before storage."}
+      submitLabel={editing ? "Save connection" : "Add connection"}
+      title={editing ? `Edit ${editing.name}` : "Add RCON connection"}
+      triggerClassName={editing ? "border border-line px-3 py-2 font-mono text-[9px] font-bold uppercase tracking-wider" : "border border-ink bg-ink px-3 py-2 font-mono text-[9px] font-bold uppercase tracking-wider text-canvas"}
+      triggerLabel={editing ? "Edit" : "Add"}
+    >
+      <div className="space-y-4">
+        {editing && <input name="serverId" type="hidden" value={editing.id} />}
+        <ConnectionFields defaults={editing} prefix={editing?.id ?? "new"} />
+        <label className="flex items-center gap-3 font-mono text-[10px] font-bold uppercase">
+          <input className="size-4" defaultChecked={editing?.enabled ?? false} name="enabled" type="checkbox" value="yes" />
+          {editing ? "Enabled" : "Enable immediately"}
+        </label>
+      </div>
+    </AdminModalForm>
+  );
+}
+
+function ConnectionFields({
+  defaults,
+  prefix,
+}: {
+  defaults?: { name: string; host: string; port: number };
+  prefix: string;
+}) {
+  const fieldClass = "mt-2 block w-full border border-line bg-canvas px-4 py-3 font-mono text-sm outline-none focus:border-accent";
+  return (
+    <>
+      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-name`}>Name<input className={fieldClass} defaultValue={defaults?.name} id={`${prefix}-rcon-name`} maxLength={100} name="name" required /></label>
+      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-host`}>Server address<input autoCapitalize="none" autoCorrect="off" className={fieldClass} defaultValue={defaults?.host} id={`${prefix}-rcon-host`} maxLength={253} name="host" placeholder="minecraft.example.com" required spellCheck={false} /></label>
+      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-port`}>Port<input className={fieldClass} defaultValue={defaults?.port ?? 25575} id={`${prefix}-rcon-port`} max={65535} min={1} name="port" required type="number" /></label>
+      <label className="block font-mono text-[10px] font-bold uppercase" htmlFor={`${prefix}-rcon-password`}>{defaults ? "Replacement password" : "Password"}<input autoComplete="new-password" className={fieldClass} id={`${prefix}-rcon-password`} maxLength={512} name="password" required={!defaults} type="password" />{defaults && <span className="mt-2 block font-sans text-[10px] font-normal normal-case text-muted">Leave blank to preserve the current password.</span>}</label>
+    </>
   );
 }

apps/web/src/lib/rcon-validation.test.ts

@@ -1,32 +1,36 @@
 import { describe, expect, it } from "vitest";
 import { sanitizeRconOutput, validateRconCommand, validateRconConnection } from "./rcon-validation";
 
-const allowed = "season4.somc.svc.cluster.local:25575,creative.somc.svc.cluster.local:25576";
-
 describe("RCON validation", () => {
-  it("normalizes an allowlisted internal endpoint", () => {
+  it("normalizes any valid DNS hostname and port without deployment configuration", () => {
     expect(validateRconConnection({
       name: " Season 4 ",
       host: "SEASON4.SOMC.SVC.CLUSTER.LOCAL",
       port: "25575",
       password: "correct horse battery staple",
-    }, { allowedEndpoints: allowed, passwordRequired: true })).toEqual({
+    }, { passwordRequired: true })).toEqual({
       name: "Season 4",
       host: "season4.somc.svc.cluster.local",
       port: 25575,
       password: "correct horse battery staple",
     });
+
+    expect(validateRconConnection({
+      name: "Creative",
+      host: "creative.example.net",
+      port: "43210",
+      password: "secret",
+    }, { passwordRequired: true })).toEqual({
+      name: "Creative",
+      host: "creative.example.net",
+      port: 43210,
+      password: "secret",
+    });
   });
 
-  it("rejects unlisted hosts, ports, IP literals, and suffix confusion", () => {
+  it("rejects IP literals and malformed DNS hostnames", () => {
-    for (const [host, port] of [
+    for (const host of ["10.0.0.1", "2001:db8::1", "season4.", "-season4.example", "season4..example"]) {
-      ["postgres.somc.svc.cluster.local", "5432"],
+      expect(validateRconConnection({ name: "Server", host, port: "25575", password: "secret" }, {
-      ["season4.somc.svc.cluster.local", "5432"],
-      ["season4.somc.svc.cluster.local.attacker.example", "25575"],
-      ["10.0.0.1", "25575"],
-    ]) {
-      expect(validateRconConnection({ name: "Server", host, port, password: "secret" }, {
-        allowedEndpoints: allowed,
         passwordRequired: true,
       })).toBeNull();
     }
@@ -34,11 +38,9 @@ describe("RCON validation", () => {
 
   it("allows a blank replacement password only while editing", () => {
     expect(validateRconConnection({ name: "Server", host: "season4.somc.svc.cluster.local", port: "25575", password: "" }, {
-      allowedEndpoints: allowed,
       passwordRequired: false,
     })?.password).toBeNull();
     expect(validateRconConnection({ name: "Server", host: "season4.somc.svc.cluster.local", port: "25575", password: "" }, {
-      allowedEndpoints: allowed,
       passwordRequired: true,
     })).toBeNull();
   });

apps/web/src/lib/rcon-validation.ts

@@ -12,25 +12,19 @@ export type ValidRconConnection = {
   password: string | null;
 };
 
-function endpointSet(value: string) {
-  return new Set(value.split(",").map((endpoint) => endpoint.trim().toLowerCase()).filter(Boolean));
-}
-
 export function validateRconConnection(
   input: { name: unknown; host: unknown; port: unknown; password: unknown },
-  options: { allowedEndpoints?: string; passwordRequired: boolean },
+  options: { passwordRequired: boolean },
 ): ValidRconConnection | null {
   const name = typeof input.name === "string" ? input.name.trim() : "";
   const host = typeof input.host === "string" ? input.host.trim().toLowerCase() : "";
   const portText = typeof input.port === "string" || typeof input.port === "number" ? String(input.port).trim() : "";
   const passwordText = typeof input.password === "string" ? input.password : "";
   const port = Number(portText);
-  const allowed = endpointSet(options.allowedEndpoints ?? process.env.RCON_ALLOWED_ENDPOINTS ?? "");
 
   if (!name || name.length > 100 || CONTROL_PATTERN.test(name)) return null;
   if (!host || host.endsWith(".") || isIP(host) !== 0 || !HOST_PATTERN.test(host)) return null;
   if (!Number.isInteger(port) || port < 1 || port > 65_535) return null;
-  if (!allowed.has(`${host}:${port}`)) return null;
   if (passwordText.length > 512 || CONTROL_PATTERN.test(passwordText)) return null;
   if (options.passwordRequired && !passwordText) return null;
 

design/index.md

@@ -34,7 +34,7 @@ This OKF bundle is the product record for implemented and proposed behavior. Sto
 * [US-018 — Monitor community account activity](us-018-admin-dashboard.md) - Administrators review daily users, confirmed connections, locations, denials, and risky networks.
 * [US-019 — Manage groups efficiently](us-019-admin-group-management.md) - Administrators manage group identity, policies, membership, and creation through focused confirmed workflows.
 * [US-020 — Schedule group access in UTC](us-020-scheduled-group-access.md) - Enabled groups may be restricted to recurring weekly UTC windows with static denial-message templates.
-* [US-021 — Manage RCON server connections](us-021-rcon-connections.md) - Administrators manage encrypted internal Minecraft RCON endpoints.
+* [US-021 — Manage RCON server connections](us-021-rcon-connections.md) - Administrators manage encrypted Minecraft RCON server addresses.
 * [US-022 — Operate servers through an RCON console](us-022-rcon-console.md) - Administrators execute bounded commands through the server-side portal proxy.
 
 # Tracking

design/log.md

@@ -4,6 +4,10 @@
 
 * **Verify**: Added encrypted, allowlisted administrator RCON connection management with credential-safe audits and a generated Drizzle migration.
 * **Implement**: Added a bounded server-side RCON command console with safe output and error handling; internal-only deployment verification remains pending.
+* **Refine**: Removed deployment-managed RCON endpoint allowlisting so administrators may configure any valid DNS hostname and port, while retaining IP-literal rejection and documenting the outbound-connectivity trust boundary.
+* **Verify**: Confirmed the RCON console uses an authenticated internal ClusterIP deployment with secret-backed credentials and no public RCON exposure.
+* **Refine**: Renamed RCON host configuration to server addresses, documented internal and external targets, and redesigned the console as a portal-colored terminal with a target bar, command prompt, and latest-response viewport.
+* **Refine**: Consolidated RCON connection management into a full-width terminal workspace with header controls, modal add/edit/delete flows, terminal-contained notices, and no duplicate configuration panels.
 
 ## 2026-08-07
 

design/us-021-rcon-connections.md

@@ -1,9 +1,9 @@
 ---
 type: User Story
 title: Manage RCON server connections
-description: Administrators manage encrypted connection settings for internal Minecraft RCON endpoints.
+description: Administrators manage encrypted connection settings for Minecraft RCON server addresses.
 tags: [admin, rcon, minecraft, security, operations]
-timestamp: 2026-08-08T01:36:00Z
+timestamp: 2026-08-08T13:40:43Z
 story_id: US-021
 status: verified
 ---
@@ -14,23 +14,23 @@ As an administrator, I want to manage one or more Minecraft RCON connections, so
 
 # Acceptance Criteria
 
-- [x] Existing account-manager administrators can list, add, edit, test, enable or disable, and delete RCON server connections.
+- [x] Existing account-manager administrators use the terminal header to select, add, edit, test, enable or disable, and delete RCON server connections.
-- [x] Each connection has a unique display name, internal hostname, port, enabled state, and write-only password.
+- [x] Each connection has a unique display name, server address, port, enabled state, and write-only password.
 - [x] RCON passwords are encrypted with an authenticated cipher using a deployment-managed master key and are never returned to the browser, audit events, or application logs.
 - [x] Updating a connection preserves its password unless an administrator explicitly supplies a replacement.
-- [x] Connection host and port pairs must match a deployment-managed exact internal endpoint allowlist, and IP literals are rejected.
+- [x] Administrators can save any syntactically valid DNS hostname and port without deployment-managed endpoint configuration; IP literals remain rejected.
 - [x] Testing a connection authenticates through the server-side RCON proxy and reports a safe success or failure result.
-- [x] Deleting a connection requires explicit confirmation.
+- [x] Add and edit use accessible modal forms, and deleting a connection requires an explicit danger-confirmation modal.
 - [x] Connection mutations independently recheck administrator authorization and create credential-safe audit events.
 - [x] Database changes use a generated versioned Drizzle migration rather than schema push.
 
 # Implementation
 
-The administrator RCON page and server actions manage allowlisted endpoints, preserve write-only passwords, encrypt credentials with connection-bound AES-256-GCM, and emit credential-safe audit events. The `rcon_servers` table is delivered through generated migration `0006_curious_lester.sql`.
+The unified terminal header selects connections and exposes add, test, enable or disable, edit, and delete controls. Add and edit use reusable accessible modal forms, while delete uses a danger-confirmation modal. Server actions manage endpoints without deployment-managed endpoint configuration, preserve write-only passwords, encrypt credentials with connection-bound AES-256-GCM, and emit credential-safe audit events. The `rcon_servers` table is delivered through generated migration `0006_curious_lester.sql`.
 
 # Validation
 
-Verified with RCON validation, encryption, gateway, component, and server-action tests; full workspace tests and type checks; web lint; OKF validation; and a production Next.js build on 2026-08-08. Action tests confirm independent authorization, password preservation, enabled-state rechecks, safe failures, and command audit redaction.
+Verified with RCON validation, encryption, gateway, component, and server-action tests; full workspace tests and type checks; web lint; OKF validation; Semgrep; dependency audit; and a production Next.js build on 2026-08-08. Validation confirms arbitrary valid internal or external DNS server addresses and ports no longer require deployment configuration while IP literals and malformed hostnames remain rejected. Action tests confirm independent authorization, password preservation, enabled-state rechecks, safe failures, and command audit redaction.
 
 # Related Stories
 

design/us-022-rcon-console.md

@@ -3,34 +3,36 @@ type: User Story
 title: Operate servers through an RCON console
 description: Administrators execute bounded RCON commands through the server-side portal proxy.
 tags: [admin, rcon, minecraft, console, security]
-timestamp: 2026-08-08T01:36:00Z
+timestamp: 2026-08-08T13:40:43Z
 story_id: US-022
-status: in-progress
+status: verified
 ---
 
 # User Story
 
-As an administrator, I want an RCON console in the portal, so that I can operate internal Minecraft servers without exposing RCON publicly.
+As an administrator, I want an RCON console in the portal, so that I can operate configured Minecraft servers without exposing credentials to the browser.
 
 # Acceptance Criteria
 
 - [x] Existing account-manager administrators can select an enabled connection and execute an RCON command from the admin UI.
-- [x] Browsers never connect to RCON directly; commands pass through the authenticated Next.js server runtime to an internal endpoint.
+- [x] Browsers never connect to RCON directly; commands pass through the authenticated Next.js server runtime to the configured endpoint.
 - [x] Every command independently rechecks administrator authorization and the selected connection's enabled state.
 - [x] Commands are length-limited, reject control characters, execute with bounded concurrency and a timeout, and return bounded output.
 - [x] Command responses are displayed safely and are not persisted in console history, audit data, or application logs.
 - [x] Audit events record the administrator, connection, command verb and digest, success, and duration without recording complete commands or responses.
 - [x] Authentication, timeout, and connection failures return safe operator-facing messages without credentials or stack traces.
-- [x] The console is keyboard accessible and clearly identifies the selected server.
+- [x] The console spans the available content width and uses the portal color palette to present a terminal-style server header with connection controls, a single keyboard-accessible prompt, pending state, and scrollable latest-response viewport.
-- [ ] RCON remains internal to the cluster and is not exposed through public ingress or a load balancer.
+- [x] Configured server addresses may be internal or external, and operators receive guidance that RCON network exposure and transport security remain their responsibility.
+- [x] Command responses, connection errors, and connection-operation results appear in the terminal viewport, including an actionable empty state when no connection exists.
+- [x] The page has no duplicate connection form or connection-list panel outside the terminal workspace.
 
 # Implementation
 
-The client console invokes an authenticated server action that revalidates the enabled allowlisted connection, decrypts its credential only in the server runtime, and executes one bounded command. The gateway limits each process to one operation per server and eight total operations, applies a five-second end-to-end deadline plus bounded cleanup, sanitizes and truncates output, and records keyed command lifecycle audits without command or response content.
+The full-width portal-colored terminal workspace identifies and manages the selected server in its header, accepts one command through a keyboard-focused prompt, and displays command responses plus connection-operation notices in one scrollable viewport. It retains an actionable terminal and Add control when no connections exist, with no duplicate configuration panels. The client invokes an authenticated server action that revalidates the enabled connection, decrypts its credential only in the server runtime, and executes one bounded command. The gateway limits each process to one operation per server and eight total operations, applies a five-second end-to-end deadline plus bounded cleanup, sanitizes and truncates output, and records keyed command lifecycle audits without command or response content.
 
 # Validation
 
-Application behavior is verified with gateway, validation, component, credential, and server-action tests; full workspace tests and type checks; web lint; OKF validation; and a production Next.js build on 2026-08-08. Deployment-level verification remains pending because this repository has no Minecraft Kubernetes Service, NetworkPolicy, ingress, or load-balancer manifests with which to prove that the RCON port is internal-only.
+Application behavior is verified with gateway, validation, component, credential, and server-action tests; full workspace tests and type checks; web lint; OKF validation; Semgrep; dependency audit; and a production Next.js build on 2026-08-08. Component validation confirms the full-width workspace, labelled server and command controls, header actions, accessible modal forms, terminal-contained notices, and the actionable no-server state. The SoMC GitOps deployment verifies Season 4 RCON through an authenticated internal ClusterIP Service backed by a Kubernetes Secret while product guidance also covers external server addresses.
 
 # Related Stories
 

docs/architecture.md

@@ -10,7 +10,7 @@ User authentication begins with an opaque, short-lived, single-use token created
 
 ### RCON administration
 
-The administrator console stores one or more internal Minecraft RCON endpoints with write-only AES-GCM-encrypted passwords. Browser requests invoke authenticated server actions; only the Next.js runtime opens RCON TCP connections. Exact deployment-managed endpoint allowlisting prevents the connection registry from becoming an arbitrary internal network proxy. Commands and responses are bounded and ephemeral, while credential-safe audit events retain the operator, server, command verb, keyed digest, outcome, and duration. RCON is exposed only through internal cluster services and never through public ingress.
+The administrator console stores one or more RCON server addresses with write-only AES-GCM-encrypted passwords. Browser requests invoke authenticated server actions; only the Next.js runtime opens RCON TCP connections. Administrators may configure any syntactically valid internal or external DNS hostname and port without deployment-managed endpoint configuration; IP literals remain rejected. Commands and responses are bounded and ephemeral, while credential-safe audit events retain the operator, server, command verb, keyed digest, outcome, and duration. Operators remain responsible for endpoint exposure and transport security.
 
 ### Discord bot
 
@@ -30,7 +30,7 @@ The admission decision is fail closed. Unknown players, disabled effective group
 - Velocity requests use hashed per-server bearer credentials, timestamps, and database-unique request IDs for authentication and replay prevention.
 - Session and one-time-code values are random and stored only as hashes.
 - Exact IP addresses are sensitive data and require an explicit retention policy before production deployment.
-- RCON hostnames and ports must match the deployment allowlist on save and use; passwords never cross the browser trust boundary.
+- RCON endpoints require syntactically valid DNS hostnames and ports; passwords never cross the browser trust boundary. Cluster egress policy and administrator authorization constrain the resulting outbound-connectivity trust boundary.
 - RCON commands and responses are untrusted, bounded, rendered only as text, and excluded from persistent history and logs.
 
 ## Database invariants

docs/rcon.md

@@ -4,19 +4,15 @@ The administrator RCON console proxies commands through the Next.js server runti
 
 ## Application configuration
 
-Set `RCON_ALLOWED_ENDPOINTS` to a comma-separated allowlist of exact internal `host:port` pairs:
+Administrators may configure any syntactically valid DNS hostname and TCP port without deployment-managed endpoint configuration. IP literals, trailing-dot hostnames, and malformed DNS names are rejected whenever a connection is saved, tested, or used.
 
-```text
+This flexibility means an authorized or compromised administrator can make RCON connection attempts to any DNS hostname and port reachable from the web runtime. Use cluster egress policy and administrator access controls to constrain that trust boundary where required.
-RCON_ALLOWED_ENDPOINTS=season4.somc.svc.cluster.local:25575
-```
-
-IP literals, trailing-dot hostnames, malformed DNS names, and endpoints absent from the allowlist are rejected whenever a connection is saved, tested, or used.
 
 Saved passwords are encrypted with AES-256-GCM and connection-bound authenticated data. By default, domain-separated credential and audit keys are derived from `AUTH_SECRET`. Deployments may instead provide independent 32-byte base64 values through `RCON_CREDENTIAL_KEY` and `RCON_AUDIT_KEY`. Rotating the credential key requires replacing saved RCON passwords.
 
 ## Minecraft server configuration
 
-Enable RCON with a high-entropy password supplied through the deployment secret. Expose its port only on an internal `ClusterIP` service. Do not add RCON to an Ingress, NodePort, or public LoadBalancer.
+Enable RCON with a high-entropy password supplied through the deployment secret. Server addresses may resolve internally or externally. Prefer private networking, a VPN, or an encrypted tunnel; do not expose plaintext RCON directly to the public internet.
 
 The password entered in the administrator connection form must match the server password. Existing passwords are write-only; leave the replacement field blank when editing unrelated connection settings.
 
@@ -30,7 +26,7 @@ The password entered in the administrator connection form must match the server
 - Full commands and responses are not persisted or logged. Audit events contain the command verb and a domain-separated HMAC digest.
 - Connection passwords are never selected by page queries or returned to the browser.
 
-RCON is plaintext TCP. Keep it on the cluster network and use network policy or an encrypted tunnel when the network trust model requires stronger isolation.
+RCON is plaintext TCP. Internal deployments should use network policy; external connections should use private routing, a VPN, or an encrypted tunnel rather than direct public exposure.
 
 ## Migration