Move secrets between users and computers without the model seeing them
A new personal env scope (paradigm user: one user's secret for one bot) beats every other scope, reaches only that user's runs of that bot, and is redacted like any secret. Bots take secrets in with request_secret, which puts a [secret-request:ID] card in the chat: the user types the value into a masked input there, never into a message, and the bot is told only the key. Bots show secrets with capture_secret (a task's computer tool that saves a file or a command's output straight to a personal env, then redacts it from the rest of the run) and show_secret (an env by key): both give a [secret:ID] chip whose Reveal and Copy fetch the value on click, for its own user (personal) or a super admin (anything else), logged by key. Values never go into messages, page props, history, Copy chat or logs. Users manage their own secrets on Settings > Secrets; the Environment page lists everyone's, remove only. Deleting a bot or user removes its personal secrets, and SecretsNote tells bots never to ask for or print secrets in chat. Co-Authored-By: Claude Opus 5.5 <[email protected]>
This commit is contained in:
Claude Opus 5.5
@@ -41,6 +41,7 @@ const Descriptions: Record<EnvScope["paradigm"], string> = {
|
||||
computer:
|
||||
"For this computer only. Beats a workspace, loses to the bot's own.",
|
||||
bot: "For this bot only, everywhere it works. Beats the workspace, the computer and general.",
|
||||
user: "For one user's runs of one bot, set from the chat. Beats everything else.",
|
||||
};
|
||||
|
||||
/**
|
||||
|
||||
@@ -0,0 +1,110 @@
|
||||
import { useState } from "react";
|
||||
import Input from "@moduletrace/twui/form/Input";
|
||||
import Button from "@moduletrace/twui/layout/Button";
|
||||
import Row from "@moduletrace/twui/layout/Row";
|
||||
import Span from "@moduletrace/twui/layout/Span";
|
||||
import Stack from "@moduletrace/twui/layout/Stack";
|
||||
import { Pencil, Trash2 } from "lucide-react";
|
||||
import { twMerge } from "tailwind-merge";
|
||||
import RowIconButton from "@/src/components/general/row-icon-button";
|
||||
import type { PersonalSecret } from "@/src/types";
|
||||
|
||||
type Props = {
|
||||
secret: PersonalSecret;
|
||||
/**
|
||||
* Whose it is, for the super admin's list of everyone's.
|
||||
*/
|
||||
show_user?: boolean;
|
||||
busy?: boolean;
|
||||
/**
|
||||
* Saves a new value; without it the row can only be removed.
|
||||
*/
|
||||
onReplace?: (params: { secret: PersonalSecret; value: string }) => Promise<boolean>;
|
||||
onRemove: (params: { secret: PersonalSecret }) => void;
|
||||
};
|
||||
|
||||
/**
|
||||
* One personal secret: its key, what it's for, which bot (and whose), and
|
||||
* never its value. Replace opens a masked input in place.
|
||||
*/
|
||||
export default function PersonalSecretRow({ secret, show_user, busy, onReplace, onRemove }: Props) {
|
||||
const [editing, setEditing] = useState(false);
|
||||
const [value, setValue] = useState("");
|
||||
|
||||
const save = async () => {
|
||||
if (!value || !onReplace) return;
|
||||
|
||||
if (await onReplace({ secret, value })) {
|
||||
setValue("");
|
||||
setEditing(false);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
<Stack
|
||||
className={twMerge(
|
||||
"w-full gap-3! items-stretch py-3 px-4",
|
||||
"border-0 border-b border-solid border-hairline last:border-b-0",
|
||||
)}
|
||||
>
|
||||
<Row className="w-full gap-3! flex-nowrap items-start justify-between">
|
||||
<Stack className="gap-0.5! min-w-0">
|
||||
<Span className="text-sm font-bold leading-5 text-ink truncate">{secret.key}</Span>
|
||||
{secret.description ? (
|
||||
<Span className="text-[13px] leading-[18px] text-ink-secondary break-words">{secret.description}</Span>
|
||||
) : null}
|
||||
<Span className="text-[13px] leading-[18px] text-ink-secondary">
|
||||
{`${show_user ? `${secret.user_name}, for ` : "For "}${secret.bot_name}`}
|
||||
</Span>
|
||||
</Stack>
|
||||
<Row className="gap-1! flex-nowrap shrink-0">
|
||||
{onReplace ? (
|
||||
<RowIconButton
|
||||
icon={Pencil}
|
||||
title={`Replace ${secret.key}`}
|
||||
disabled={busy}
|
||||
onClick={() => setEditing(!editing)}
|
||||
/>
|
||||
) : null}
|
||||
<RowIconButton
|
||||
icon={Trash2}
|
||||
title={`Remove ${secret.key}`}
|
||||
loading={busy}
|
||||
disabled={busy}
|
||||
onClick={() => onRemove({ secret })}
|
||||
/>
|
||||
</Row>
|
||||
</Row>
|
||||
{editing ? (
|
||||
<Row className="w-full gap-2! flex-nowrap items-end">
|
||||
<Input
|
||||
id={`personal-secret-${secret.id}`}
|
||||
title={`New value for ${secret.key}`}
|
||||
label="New value"
|
||||
showLabel
|
||||
type="password"
|
||||
autoComplete="off"
|
||||
value={value}
|
||||
onChange={(e) => setValue(e.target.value)}
|
||||
/>
|
||||
<Button
|
||||
type="button"
|
||||
variant="outlined"
|
||||
color="gray"
|
||||
size="small"
|
||||
title="Cancel"
|
||||
onClick={() => {
|
||||
setValue("");
|
||||
setEditing(false);
|
||||
}}
|
||||
>
|
||||
Cancel
|
||||
</Button>
|
||||
<Button type="button" size="small" title={`Save ${secret.key}`} loading={busy} disabled={busy || !value} onClick={save}>
|
||||
Save
|
||||
</Button>
|
||||
</Row>
|
||||
) : null}
|
||||
</Stack>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,49 @@
|
||||
import type { PersonalSecret } from "@/src/types";
|
||||
import SettingsGroup from "../settings-group";
|
||||
import SettingsList from "../settings-list";
|
||||
import SettingsStatus from "../settings-status";
|
||||
import PersonalSecretRow from "./personal-secret-row";
|
||||
|
||||
type Props = {
|
||||
title: string;
|
||||
description: string;
|
||||
secrets: PersonalSecret[];
|
||||
show_user?: boolean;
|
||||
busy_id?: number;
|
||||
status?: { error?: boolean; success?: boolean; msg?: string };
|
||||
onReplace?: (params: { secret: PersonalSecret; value: string }) => Promise<boolean>;
|
||||
onRemove: (params: { secret: PersonalSecret }) => void;
|
||||
};
|
||||
|
||||
/**
|
||||
* A list of personal secrets (set from the chat), values never shown: the
|
||||
* user's own on the Secrets page, everyone's on the Environment page.
|
||||
*/
|
||||
export default function PersonalSecretsGroup({
|
||||
title,
|
||||
description,
|
||||
secrets,
|
||||
show_user,
|
||||
busy_id,
|
||||
status,
|
||||
onReplace,
|
||||
onRemove,
|
||||
}: Props) {
|
||||
return (
|
||||
<SettingsGroup title={title} description={description}>
|
||||
<SettingsList is_empty={!secrets.length} empty="No secrets saved yet.">
|
||||
{secrets.map((secret) => (
|
||||
<PersonalSecretRow
|
||||
key={secret.id}
|
||||
secret={secret}
|
||||
show_user={show_user}
|
||||
busy={busy_id == secret.id}
|
||||
onReplace={onReplace}
|
||||
onRemove={onRemove}
|
||||
/>
|
||||
))}
|
||||
</SettingsList>
|
||||
<SettingsStatus status={status} />
|
||||
</SettingsGroup>
|
||||
);
|
||||
}
|
||||
@@ -2,14 +2,17 @@ import { useContext, useState } from "react";
|
||||
import { AppContext } from "@/src/pages/__root";
|
||||
import type { EnvsMutationResult, EnvsOverviewPayload } from "@/src/types";
|
||||
import EnvsGroup from "../../(partials)/envs/envs-group";
|
||||
import postEnvApi from "../../(functions)/post-env-api";
|
||||
import PersonalSecretsGroup from "../../(partials)/secrets/personal-secrets-group";
|
||||
import EnvScopeSelect from "../(partials)/env-scope-select";
|
||||
import KnownEnvsGroup from "../(partials)/known-envs-group";
|
||||
import scopeValue, { envInScope } from "../(utils)/scope-value";
|
||||
|
||||
/**
|
||||
* Pick where (general, a workspace, a bot or a computer), then that scope's
|
||||
* envs. General also lists the app settings. Every change saves at once and
|
||||
* refreshes the page data.
|
||||
* envs. General also lists the app settings. Below, every user's personal
|
||||
* secrets (set from the chat), which can only be removed here. Every change
|
||||
* saves at once and refreshes the page data.
|
||||
*/
|
||||
export default function EnvironmentSettingsSection() {
|
||||
const { pageProps } = useContext(AppContext);
|
||||
@@ -20,6 +23,7 @@ export default function EnvironmentSettingsSection() {
|
||||
* Remounts the lists when the data changes under them.
|
||||
*/
|
||||
const [version, setVersion] = useState(0);
|
||||
const [removing, setRemoving] = useState<number>();
|
||||
|
||||
if (!overview) return null;
|
||||
|
||||
@@ -60,6 +64,23 @@ export default function EnvironmentSettingsSection() {
|
||||
onChanged={changed}
|
||||
onError={failed}
|
||||
/>
|
||||
<PersonalSecretsGroup
|
||||
title="Personal secrets"
|
||||
description="What users gave their bots from the chat, each for one user's runs of one bot. Only its user can see or replace one; you can remove it."
|
||||
secrets={overview.personal || []}
|
||||
show_user
|
||||
busy_id={removing}
|
||||
onRemove={async ({ secret }) => {
|
||||
if (!window.confirm(`Remove ${secret.user_name}'s ${secret.key} for ${secret.bot_name}?`)) return;
|
||||
|
||||
setRemoving(secret.id);
|
||||
const res = await postEnvApi({ path: "delete-env", body: { env_id: secret.id } }).catch(() => null);
|
||||
setRemoving(undefined);
|
||||
|
||||
if (res?.success && res.singleRes) changed(res.singleRes, res.msg || "Removed.");
|
||||
else failed(res?.msg || "Couldn't remove it.");
|
||||
}}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
@@ -0,0 +1,59 @@
|
||||
import { useContext, useState } from "react";
|
||||
import fetchApi from "@moduletrace/twui/utils/fetch/fetchApi";
|
||||
import type { APIResponseObject } from "@moduletrace/bunext/types";
|
||||
import { AppContext } from "@/src/pages/__root";
|
||||
import type { PersonalSecret } from "@/src/types";
|
||||
import PersonalSecretsGroup from "../../(partials)/secrets/personal-secrets-group";
|
||||
|
||||
/**
|
||||
* The user's own personal secrets, with Replace and Remove. Every change
|
||||
* saves at once and refreshes the list.
|
||||
*/
|
||||
export default function SecretsSettingsSection() {
|
||||
const { pageProps } = useContext(AppContext);
|
||||
const [secrets, setSecrets] = useState<PersonalSecret[]>(pageProps?.personal_secrets || []);
|
||||
const [busy_id, setBusyId] = useState<number>();
|
||||
const [status, setStatus] = useState<{ error?: boolean; success?: boolean; msg?: string }>();
|
||||
|
||||
const post = async ({ path, body }: { path: "save-secret" | "delete-secret"; body: Record<string, unknown> }) => {
|
||||
const res = await fetchApi<Record<string, unknown>, APIResponseObject<PersonalSecret[]>>(
|
||||
`/api/admin/secrets/${path}`,
|
||||
{ method: "POST", body },
|
||||
).catch(() => null);
|
||||
|
||||
if (res?.success && res.singleRes) {
|
||||
setSecrets(res.singleRes);
|
||||
setStatus({ success: true, msg: res.msg || "Saved." });
|
||||
return true;
|
||||
}
|
||||
|
||||
setStatus({ error: true, msg: res?.msg || "Couldn't save it." });
|
||||
return false;
|
||||
};
|
||||
|
||||
return (
|
||||
<PersonalSecretsGroup
|
||||
title="Your secrets"
|
||||
description="Each one is for one bot and only your runs of it. Bots ask for them with a card in the chat, never in a message."
|
||||
secrets={secrets}
|
||||
busy_id={busy_id}
|
||||
status={status}
|
||||
onReplace={async ({ secret, value }) => {
|
||||
if (!window.confirm(`Replace ${secret.key} for ${secret.bot_name}?`)) return false;
|
||||
|
||||
setBusyId(secret.id);
|
||||
const ok = await post({ path: "save-secret", body: { env_id: secret.id, value } });
|
||||
setBusyId(undefined);
|
||||
|
||||
return ok;
|
||||
}}
|
||||
onRemove={async ({ secret }) => {
|
||||
if (!window.confirm(`Remove ${secret.key} for ${secret.bot_name}? Its computers drop it on their next run.`)) return;
|
||||
|
||||
setBusyId(secret.id);
|
||||
await post({ path: "delete-secret", body: { env_id: secret.id } });
|
||||
setBusyId(undefined);
|
||||
}}
|
||||
/>
|
||||
);
|
||||
}
|
||||
@@ -0,0 +1,23 @@
|
||||
import type { PagePropsType } from "@/src/types";
|
||||
import type { BunextPageServerFn } from "@moduletrace/bunext/types";
|
||||
import userAuth from "@/src/functions/backend/auth/user-auth";
|
||||
import grabPersonalSecrets from "@/src/functions/backend/db/envs/grab-personal-secrets";
|
||||
import grabSettingsServerProps from "../(functions)/grab-settings-server-props";
|
||||
|
||||
/**
|
||||
* Every user's own personal secrets: keys only, never values.
|
||||
*/
|
||||
export const server: BunextPageServerFn<PagePropsType> = async (params) => {
|
||||
const settings = await grabSettingsServerProps(params);
|
||||
|
||||
if (!settings.props) return settings;
|
||||
|
||||
const { user } = await userAuth({ req: params.req });
|
||||
|
||||
return {
|
||||
props: {
|
||||
...settings.props,
|
||||
personal_secrets: user?.id ? await grabPersonalSecrets({ user_id: user.id }) : [],
|
||||
},
|
||||
};
|
||||
};
|
||||
@@ -0,0 +1,16 @@
|
||||
import SecretsSettingsSection from "./(sections)/secrets-settings-section";
|
||||
import SettingsShell from "../(partials)/settings-shell";
|
||||
import settingsPageMeta from "../(functions)/settings-page-meta";
|
||||
|
||||
export default function AdminSettingsSecretsPage() {
|
||||
return (
|
||||
<SettingsShell
|
||||
title="Secrets"
|
||||
description="Passwords, tokens and keys you gave your bots from the chat, or they saved for you. Bots use them by name and never see them."
|
||||
>
|
||||
<SecretsSettingsSection />
|
||||
</SettingsShell>
|
||||
);
|
||||
}
|
||||
|
||||
export const meta = settingsPageMeta({ label: "Secrets" });
|
||||
Reference in New Issue
Block a user