diff --git a/apps/webservice/src/app/[workspaceSlug]/_components/EnvironmentDrawer.tsx b/apps/webservice/src/app/[workspaceSlug]/_components/EnvironmentDrawer.tsx new file mode 100644 index 000000000..835bb394c --- /dev/null +++ b/apps/webservice/src/app/[workspaceSlug]/_components/EnvironmentDrawer.tsx @@ -0,0 +1,403 @@ +"use client"; + +import type * as schema from "@ctrlplane/db/schema"; +import React, { useState } from "react"; +import Link from "next/link"; +import { useParams, useRouter, useSearchParams } from "next/navigation"; +import { SiKubernetes, SiTerraform } from "@icons-pack/react-simple-icons"; +import { + IconExternalLink, + IconFilter, + IconInfoCircle, + IconPlant, + IconServer, + IconTarget, +} from "@tabler/icons-react"; +import * as LZString from "lz-string"; +import { z } from "zod"; + +import { + AlertDialog, + AlertDialogAction, + AlertDialogCancel, + AlertDialogContent, + AlertDialogDescription, + AlertDialogFooter, + AlertDialogHeader, + AlertDialogTitle, + AlertDialogTrigger, +} from "@ctrlplane/ui/alert-dialog"; +import { Button, buttonVariants } from "@ctrlplane/ui/button"; +import { Drawer, DrawerContent, DrawerTitle } from "@ctrlplane/ui/drawer"; +import { + Form, + FormControl, + FormField, + FormItem, + FormLabel, + FormMessage, + useForm, +} from "@ctrlplane/ui/form"; +import { Input } from "@ctrlplane/ui/input"; +import { Label } from "@ctrlplane/ui/label"; +import { Textarea } from "@ctrlplane/ui/textarea"; +import { + defaultCondition, + targetCondition, +} from "@ctrlplane/validators/targets"; + +import { api } from "~/trpc/react"; +import { TabButton } from "./TabButton"; +import { TargetConditionRender } from "./target-condition/TargetConditionRender"; + +const DeleteEnvironmentDialog: React.FC<{ + environment: schema.Environment; + children: React.ReactNode; +}> = ({ environment, children }) => { + const deleteEnvironment = api.environment.delete.useMutation(); + const utils = api.useUtils(); + const { removeEnvironmentId } = useEnvironmentDrawer(); + + const onDelete = () => + deleteEnvironment + .mutateAsync(environment.id) + .then(() => utils.environment.bySystemId.invalidate(environment.systemId)) + .then(removeEnvironmentId); + + return ( + + {children} + + + Delete Environment + + + Are you sure you want to delete this environment? You will have to + recreate it from scratch. + + + Cancel + + Delete + + + + + ); +}; +const environmentForm = z.object({ + name: z.string(), + description: z.string().default(""), +}); + +const EnvironmentForm: React.FC<{ + environment: schema.Environment; +}> = ({ environment }) => { + const form = useForm({ + schema: environmentForm, + defaultValues: { + name: environment.name, + description: environment.description ?? "", + }, + }); + const update = api.environment.update.useMutation(); + const envOverride = api.job.trigger.create.byEnvId.useMutation(); + + const utils = api.useUtils(); + + const { id, systemId } = environment; + const onSubmit = form.handleSubmit((data) => + update + .mutateAsync({ id, data }) + .then(() => form.reset(data)) + .then(() => utils.environment.bySystemId.invalidate(systemId)) + .then(() => utils.environment.byId.invalidate(id)), + ); + + return ( +
+ + ( + + Name + + + + + )} + /> + ( + + Description + +