diff --git a/messages/en-US.json b/messages/en-US.json index 5dbbc09f7..abb6bf405 100644 --- a/messages/en-US.json +++ b/messages/en-US.json @@ -1658,7 +1658,7 @@ "virtualApiKeysName": "Name", "virtualApiKeysDescriptionOptional": "Description (optional)", "virtualApiKeysAssociateUserOptional": "Associate User (optional)", - "virtualApiKeysAssociateUserDescription": "Attribution only. Does not grant access by itself.", + "virtualApiKeysAssociateUserDescription": "Associate this key with a user to track usage.", "virtualApiKeysAllResources": "All public inference resources", "virtualApiKeysAllResourcesDescription": "Allow this key to access every public inference resource in the organization", "virtualApiKeysSelectResources": "Public Inference Resources", @@ -1666,7 +1666,7 @@ "virtualApiKeysSelectResourcesDescription": "Choose which public inference resources this key can access", "virtualApiKeysNoResources": "No resources", "virtualApiKeysSecret": "Key", - "virtualApiKeysSeeOnce": "Copy this key now. You can also view it again later from the table.", + "virtualApiKeysCopyKey": "Copy this key. You can view it again later from the table or when editing.", "virtualApiKeysSecretHint": "Use this value as a Bearer token: vk-[id].[secret]", "virtualApiKeysViewSecret": "View Secret", "virtualApiKeysViewSecretTitle": "Virtual API Key Secret", diff --git a/src/components/CreateVirtualApiKeyForm.tsx b/src/components/CreateVirtualApiKeyForm.tsx index 32a3877aa..5a3e88ce8 100644 --- a/src/components/CreateVirtualApiKeyForm.tsx +++ b/src/components/CreateVirtualApiKeyForm.tsx @@ -391,7 +391,7 @@ export default function CreateVirtualApiKeyForm({ )} {credential && (
-

{t("virtualApiKeysSeeOnce")}

+

{t("virtualApiKeysCopyKey")}

([]); + const [credential, setCredential] = useState(null); + const [credentialLoading, setCredentialLoading] = useState(false); const formSchema = z .object({ @@ -132,6 +136,55 @@ export default function EditVirtualApiKeyForm({ form.reset({ allResources: virtualApiKey.allResources }); + + let cancelled = false; + setCredentialLoading(true); + setCredential(null); + + api.get>( + `/virtual-api-key/${virtualApiKey.virtualApiKeyId}` + ) + .then((res) => { + if (cancelled) { + return; + } + const secret = res.data.data.virtualApiKey.secret; + if (secret) { + setCredential( + `vk-${virtualApiKey.virtualApiKeyId}.${secret}` + ); + } else { + toast({ + variant: "destructive", + title: t("virtualApiKeysErrorFetchSecret"), + description: t( + "virtualApiKeysErrorFetchSecretDescription" + ) + }); + } + }) + .catch((e) => { + if (cancelled) { + return; + } + toast({ + variant: "destructive", + title: t("virtualApiKeysErrorFetchSecret"), + description: formatAxiosError( + e, + t("virtualApiKeysErrorFetchSecretDescription") + ) + }); + }) + .finally(() => { + if (!cancelled) { + setCredentialLoading(false); + } + }); + + return () => { + cancelled = true; + }; }, [open, virtualApiKey, form]); async function onSubmit(values: z.infer) { @@ -228,11 +281,11 @@ export default function EditVirtualApiKeyForm({ id="edit-virtual-api-key-form" >
- + + - - - {addActions.map((action, i) => ( - action.onSelect()}> - {action.label} - - ))} - - - ) : onAdd && addButtonText ? ( - - ) : null; + const addAction = + addActions && addActions.length > 0 && addButtonText ? ( + + + + + + {addActions.map((action, i) => ( + action.onSelect()} + > + {action.label} + + ))} + + + ) : onAdd && addButtonText ? ( + + ) : null; return (
@@ -674,7 +685,9 @@ export function DataTable({
- ) - : undefined + showAddActionInEmptyState ? ( +
+ {addAction} +
+ ) : undefined } /> )}