mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
feat(api): enhance API key display with code editor and clipboard copy
This commit is contained in:
@@ -31,6 +31,8 @@ import {
|
|||||||
FormDescription,
|
FormDescription,
|
||||||
} from "@/components/ui/form";
|
} from "@/components/ui/form";
|
||||||
import { Switch } from "@/components/ui/switch";
|
import { Switch } from "@/components/ui/switch";
|
||||||
|
import copy from "copy-to-clipboard";
|
||||||
|
import { CodeEditor } from "@/components/shared/code-editor";
|
||||||
|
|
||||||
const formSchema = z.object({
|
const formSchema = z.object({
|
||||||
name: z.string().min(1, "Name is required"),
|
name: z.string().min(1, "Name is required"),
|
||||||
@@ -441,13 +443,16 @@ export const AddApiKey = () => {
|
|||||||
</DialogDescription>
|
</DialogDescription>
|
||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="mt-4 space-y-4">
|
<div className="mt-4 space-y-4">
|
||||||
<div className="rounded-md bg-muted p-4 font-mono text-sm break-all">
|
<CodeEditor
|
||||||
{newApiKey}
|
className="font-mono text-sm break-all"
|
||||||
</div>
|
language="properties"
|
||||||
|
value={newApiKey}
|
||||||
|
readOnly
|
||||||
|
/>
|
||||||
<div className="flex justify-end gap-3">
|
<div className="flex justify-end gap-3">
|
||||||
<Button
|
<Button
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
navigator.clipboard.writeText(newApiKey);
|
copy(newApiKey);
|
||||||
toast.success("API key copied to clipboard");
|
toast.success("API key copied to clipboard");
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
|
|||||||
Reference in New Issue
Block a user