import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema"; import { DownloadIcon, PenBoxIcon, PlusIcon } from "lucide-react"; import { useEffect, useState } from "react"; import { useForm } from "react-hook-form"; import { toast } from "sonner"; import type { z } from "zod"; import { AlertBlock } from "@/components/shared/alert-block"; import { Button } from "@/components/ui/button"; import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, DialogTrigger, } from "@/components/ui/dialog"; import { Form, FormControl, FormField, FormItem, FormLabel, FormMessage, } from "@/components/ui/form"; import { Input } from "@/components/ui/input"; import { Textarea } from "@/components/ui/textarea"; import { sshKeyCreate, type sshKeyType } from "@/server/db/validations"; import { api } from "@/utils/api"; type SSHKey = z.infer; interface Props { sshKeyId?: string; } export const HandleSSHKeys = ({ sshKeyId }: Props) => { const utils = api.useUtils(); const [isOpen, setIsOpen] = useState(false); const { data } = api.sshKey.one.useQuery( { sshKeyId: sshKeyId || "", }, { enabled: !!sshKeyId, }, ); const { mutateAsync, isError, error, isLoading } = sshKeyId ? api.sshKey.update.useMutation() : api.sshKey.create.useMutation(); const generateMutation = api.sshKey.generate.useMutation(); const form = useForm({ resolver: zodResolver(sshKeyCreate), defaultValues: { name: "", description: "", publicKey: "", privateKey: "", }, }); useEffect(() => { if (data) { form.reset({ ...data, description: data.description || undefined, }); } else { form.reset(); } }, [data, form, form.reset]); const onSubmit = async (data: SSHKey) => { await mutateAsync({ ...data, organizationId: "", sshKeyId: sshKeyId || "", }) .then(async () => { toast.success( sshKeyId ? "SSH key updated successfully" : "SSH key created successfully", ); await utils.sshKey.all.invalidate(); form.reset(); setIsOpen(false); }) .catch(() => { toast.error( sshKeyId ? "Error updating the SSH key" : "Error creating the SSH key", ); }); }; const onGenerateSSHKey = (type: z.infer) => generateMutation .mutateAsync(type) .then(async (data) => { toast.success("SSH Key Generated"); form.setValue("privateKey", data.privateKey); form.setValue("publicKey", data.publicKey); }) .catch(() => { toast.error("Error generating the SSH Key"); }); const downloadKey = (content: string, keyType: "private" | "public") => { const keyName = form.watch("name"); const publicKey = form.watch("publicKey"); // Extract algorithm type from public key const isEd25519 = publicKey.startsWith("ssh-ed25519"); const defaultName = isEd25519 ? "id_ed25519" : "id_rsa"; const filename = keyName ? `${keyName}${sshKeyId ? `_${sshKeyId}` : ""}_${keyType}_${defaultName}${keyType === "public" ? ".pub" : ""}` : `${defaultName}${keyType === "public" ? ".pub" : ""}`; const blob = new Blob([content], { type: "text/plain" }); const url = window.URL.createObjectURL(blob); const a = document.createElement("a"); a.href = url; a.download = filename; document.body.appendChild(a); a.click(); document.body.removeChild(a); window.URL.revokeObjectURL(url); }; return ( {sshKeyId ? ( ) : ( )} SSH Key
In this section you can add one of your keys or generate a new one.
{!sshKeyId && (
)}
{isError && {error?.message}}
{ return ( Name ); }} /> { return ( Description ); }} /> (
Private Key