From 24f3be3c00d78c2413e0d86c6ee8a2cee668569b Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Tue, 29 Apr 2025 21:47:55 -0600
Subject: [PATCH] Add HandleBackup component to manage backup creation and
 updates, replacing the deprecated UpdateBackup component. Integrate dynamic
 form handling for various database types and metadata requirements. Update
 ShowBackups to utilize HandleBackup for both creating and updating backups,
 enhancing the user interface for better backup management.

---
 .../{add-backup.tsx => handle-backup.tsx}     | 307 +++++---
 .../database/backups/show-backups.tsx         |  18 +-
 .../database/backups/update-backup.tsx        | 681 ------------------
 packages/server/src/utils/restore/compose.ts  |   3 -
 packages/server/src/utils/restore/postgres.ts |   2 -
 5 files changed, 210 insertions(+), 801 deletions(-)
 rename apps/dokploy/components/dashboard/database/backups/{add-backup.tsx => handle-backup.tsx} (71%)
 delete mode 100644 apps/dokploy/components/dashboard/database/backups/update-backup.tsx

diff --git a/apps/dokploy/components/dashboard/database/backups/add-backup.tsx b/apps/dokploy/components/dashboard/database/backups/handle-backup.tsx
similarity index 71%
rename from apps/dokploy/components/dashboard/database/backups/add-backup.tsx
rename to apps/dokploy/components/dashboard/database/backups/handle-backup.tsx
index 1b3828e6..2d8a6b6d 100644
--- a/apps/dokploy/components/dashboard/database/backups/add-backup.tsx
+++ b/apps/dokploy/components/dashboard/database/backups/handle-backup.tsx
@@ -49,7 +49,7 @@ import {
 import { cn } from "@/lib/utils";
 import { api } from "@/utils/api";
 import { zodResolver } from "@hookform/resolvers/zod";
-import { DatabaseZap, PlusIcon, RefreshCw } from "lucide-react";
+import { DatabaseZap, PenBoxIcon, PlusIcon, RefreshCw } from "lucide-react";
 import { CheckIcon, ChevronsUpDown } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
@@ -58,75 +58,140 @@ import { z } from "zod";
 
 type CacheType = "cache" | "fetch";
 
-const getMetadataSchema = (
-	backupType: "database" | "compose",
-	databaseType: DatabaseType,
-) => {
-	if (backupType !== "compose") return z.object({}).optional();
+type DatabaseType = "postgres" | "mariadb" | "mysql" | "mongo" | "web-server";
 
-	const schemas = {
-		postgres: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-		}),
-		mariadb: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-			databasePassword: z.string().min(1, "Database password is required"),
-		}),
-		mongo: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-			databasePassword: z.string().min(1, "Database password is required"),
-		}),
-		mysql: z.object({
-			databaseRootPassword: z.string().min(1, "Root password is required"),
-		}),
-		"web-server": z.object({}),
-	};
-
-	return z.object({
-		[databaseType]: schemas[databaseType],
+const Schema = z
+	.object({
+		destinationId: z.string().min(1, "Destination required"),
+		schedule: z.string().min(1, "Schedule (Cron) required"),
+		prefix: z.string().min(1, "Prefix required"),
+		enabled: z.boolean(),
+		database: z.string().min(1, "Database required"),
+		keepLatestCount: z.coerce.number().optional(),
+		serviceName: z.string().nullable(),
+		databaseType: z
+			.enum(["postgres", "mariadb", "mysql", "mongo", "web-server"])
+			.optional(),
+		backupType: z.enum(["database", "compose"]),
+		metadata: z
+			.object({
+				postgres: z
+					.object({
+						databaseUser: z.string(),
+					})
+					.optional(),
+				mariadb: z
+					.object({
+						databaseUser: z.string(),
+						databasePassword: z.string(),
+					})
+					.optional(),
+				mongo: z
+					.object({
+						databaseUser: z.string(),
+						databasePassword: z.string(),
+					})
+					.optional(),
+				mysql: z
+					.object({
+						databaseRootPassword: z.string(),
+					})
+					.optional(),
+			})
+			.optional(),
+	})
+	.superRefine((data, ctx) => {
+		if (data.backupType === "compose" && !data.databaseType) {
+			ctx.addIssue({
+				code: z.ZodIssueCode.custom,
+				message: "Database type is required for compose backups",
+				path: ["databaseType"],
+			});
+		}
+		if (data.backupType === "compose" && data.databaseType) {
+			if (data.databaseType === "postgres") {
+				if (!data.metadata?.postgres?.databaseUser) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Database user is required for PostgreSQL",
+						path: ["metadata", "postgres", "databaseUser"],
+					});
+				}
+			} else if (data.databaseType === "mariadb") {
+				if (!data.metadata?.mariadb?.databaseUser) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Database user is required for MariaDB",
+						path: ["metadata", "mariadb", "databaseUser"],
+					});
+				}
+				if (!data.metadata?.mariadb?.databasePassword) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Database password is required for MariaDB",
+						path: ["metadata", "mariadb", "databasePassword"],
+					});
+				}
+			} else if (data.databaseType === "mongo") {
+				if (!data.metadata?.mongo?.databaseUser) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Database user is required for MongoDB",
+						path: ["metadata", "mongo", "databaseUser"],
+					});
+				}
+				if (!data.metadata?.mongo?.databasePassword) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Database password is required for MongoDB",
+						path: ["metadata", "mongo", "databasePassword"],
+					});
+				}
+			} else if (data.databaseType === "mysql") {
+				if (!data.metadata?.mysql?.databaseRootPassword) {
+					ctx.addIssue({
+						code: z.ZodIssueCode.custom,
+						message: "Root password is required for MySQL",
+						path: ["metadata", "mysql", "databaseRootPassword"],
+					});
+				}
+			}
+		}
 	});
-};
-
-const Schema = z.object({
-	destinationId: z.string().min(1, "Destination required"),
-	schedule: z.string().min(1, "Schedule (Cron) required"),
-	prefix: z.string().min(1, "Prefix required"),
-	enabled: z.boolean(),
-	database: z.string().min(1, "Database required"),
-	keepLatestCount: z.coerce.number().optional(),
-	serviceName: z.string().nullable(),
-});
-
-type Schema = z.infer<typeof Schema>;
 
 interface Props {
-	id: string;
+	id?: string;
+	backupId?: string;
 	databaseType?: DatabaseType;
 	refetch: () => void;
 	backupType: "database" | "compose";
 }
 
-type DatabaseType = "postgres" | "mariadb" | "mysql" | "mongo" | "web-server";
-
-export const AddBackup = ({
+export const HandleBackup = ({
 	id,
+	backupId,
 	databaseType = "postgres",
 	refetch,
 	backupType = "database",
 }: Props) => {
+	const [isOpen, setIsOpen] = useState(false);
+
 	const { data, isLoading } = api.destination.all.useQuery();
+	const { data: backup } = api.backup.one.useQuery(
+		{
+			backupId: backupId ?? "",
+		},
+		{
+			enabled: !!backupId,
+		},
+	);
 	const [cacheType, setCacheType] = useState<CacheType>("cache");
-	const [selectedDatabaseType, setSelectedDatabaseType] =
-		useState<DatabaseType>(databaseType as DatabaseType);
-
 	const { mutateAsync: createBackup, isLoading: isCreatingPostgresBackup } =
-		api.backup.create.useMutation();
+		backupId
+			? api.backup.update.useMutation()
+			: api.backup.create.useMutation();
 
-	const schema = Schema.extend({
-		metadata: getMetadataSchema(backupType, selectedDatabaseType),
-	});
-
-	const form = useForm<z.infer<typeof schema>>({
+	const form = useForm<z.infer<typeof Schema>>({
 		defaultValues: {
 			database: databaseType === "web-server" ? "dokploy" : "",
 			destinationId: "",
@@ -135,11 +200,15 @@ export const AddBackup = ({
 			schedule: "",
 			keepLatestCount: undefined,
 			serviceName: null,
+			databaseType: backupType === "compose" ? undefined : databaseType,
+			backupType: backupType,
 			metadata: {},
 		},
-		resolver: zodResolver(schema),
+		resolver: zodResolver(Schema),
 	});
 
+	console.log(backup);
+
 	const {
 		data: services,
 		isFetching: isLoadingServices,
@@ -147,38 +216,33 @@ export const AddBackup = ({
 		refetch: refetchServices,
 	} = api.compose.loadServices.useQuery(
 		{
-			composeId: id,
+			composeId: backup?.composeId ?? id ?? "",
 			type: cacheType,
 		},
 		{
 			retry: false,
 			refetchOnWindowFocus: false,
-			enabled: backupType === "compose",
+			enabled: backupType === "compose" && !!backup?.composeId && !!id,
 		},
 	);
 
 	useEffect(() => {
 		form.reset({
-			database: databaseType === "web-server" ? "dokploy" : "",
-			destinationId: "",
-			enabled: true,
-			prefix: "/",
-			schedule: "",
-			keepLatestCount: undefined,
-			serviceName: null,
-			metadata: {},
+			database:
+				(backup?.database ?? databaseType === "web-server") ? "dokploy" : "",
+			destinationId: backup?.destinationId ?? "",
+			enabled: backup?.enabled ?? true,
+			prefix: backup?.prefix ?? "/",
+			schedule: backup?.schedule ?? "",
+			keepLatestCount: backup?.keepLatestCount ?? undefined,
+			serviceName: backup?.serviceName ?? null,
+			databaseType: backup?.databaseType ?? databaseType,
+			backupType: backup?.backupType ?? backupType,
+			metadata: backup?.metadata ?? {},
 		});
-	}, [form, form.reset, form.formState.isSubmitSuccessful, databaseType]);
-
-	const onSubmit = async (data: Schema) => {
-		if (backupType === "compose" && !data.serviceName) {
-			form.setError("serviceName", {
-				type: "manual",
-				message: "Service name is required for compose backups",
-			});
-			return;
-		}
+	}, [form, form.reset, backupId, backup]);
 
+	const onSubmit = async (data: z.infer<typeof Schema>) => {
 		const getDatabaseId =
 			backupType === "compose"
 				? {
@@ -212,33 +276,50 @@ export const AddBackup = ({
 			schedule: data.schedule,
 			enabled: data.enabled,
 			database: data.database,
-			keepLatestCount: data.keepLatestCount,
-			databaseType:
-				backupType === "compose" ? selectedDatabaseType : databaseType,
+			keepLatestCount: data.keepLatestCount ?? null,
+			databaseType: data.databaseType || databaseType,
 			serviceName: data.serviceName,
 			...getDatabaseId,
+			backupId: backupId ?? "",
 			backupType,
+			metadata: data.metadata,
 		})
 			.then(async () => {
-				toast.success("Backup Created");
+				toast.success(`Backup ${backupId ? "Updated" : "Created"}`);
 				refetch();
+				setIsOpen(false);
 			})
 			.catch(() => {
-				toast.error("Error creating a backup");
+				toast.error(`Error ${backupId ? "updating" : "creating"} a backup`);
 			});
 	};
+
 	return (
-		<Dialog>
+		<Dialog open={isOpen} onOpenChange={setIsOpen}>
 			<DialogTrigger asChild>
-				<Button>
-					<PlusIcon className="h-4 w-4" />
-					Create Backup
-				</Button>
+				{backupId ? (
+					<Button
+						variant="ghost"
+						size="icon"
+						className="group hover:bg-blue-500/10"
+					>
+						<PenBoxIcon className="size-3.5 text-primary group-hover:text-blue-500" />
+					</Button>
+				) : (
+					<Button>
+						<PlusIcon className="h-4 w-4" />
+						{backupId ? "Update Backup" : "Create Backup"}
+					</Button>
+				)}
 			</DialogTrigger>
 			<DialogContent className="sm:max-w-lg max-h-screen overflow-y-auto">
 				<DialogHeader>
-					<DialogTitle>Create a backup</DialogTitle>
-					<DialogDescription>Add a new backup</DialogDescription>
+					<DialogTitle>
+						{backupId ? "Update Backup" : "Create Backup"}
+					</DialogTitle>
+					<DialogDescription>
+						{backupId ? "Update a backup" : "Add a new backup"}
+					</DialogDescription>
 				</DialogHeader>
 
 				<Form {...form}>
@@ -254,25 +335,33 @@ export const AddBackup = ({
 								</AlertBlock>
 							)}
 							{backupType === "compose" && (
-								<FormItem>
-									<FormLabel>Database Type</FormLabel>
-									<Select
-										value={selectedDatabaseType}
-										onValueChange={(value) =>
-											setSelectedDatabaseType(value as DatabaseType)
-										}
-									>
-										<SelectTrigger className="w-full">
-											<SelectValue placeholder="Select a database type" />
-										</SelectTrigger>
-										<SelectContent>
-											<SelectItem value="postgres">PostgreSQL</SelectItem>
-											<SelectItem value="mariadb">MariaDB</SelectItem>
-											<SelectItem value="mysql">MySQL</SelectItem>
-											<SelectItem value="mongo">MongoDB</SelectItem>
-										</SelectContent>
-									</Select>
-								</FormItem>
+								<FormField
+									control={form.control}
+									name="databaseType"
+									render={({ field }) => (
+										<FormItem>
+											<FormLabel>Database Type</FormLabel>
+											<Select
+												value={field.value}
+												onValueChange={(value) => {
+													field.onChange(value as DatabaseType);
+													form.setValue("metadata", {});
+												}}
+											>
+												<SelectTrigger className="w-full">
+													<SelectValue placeholder="Select a database type" />
+												</SelectTrigger>
+												<SelectContent>
+													<SelectItem value="postgres">PostgreSQL</SelectItem>
+													<SelectItem value="mariadb">MariaDB</SelectItem>
+													<SelectItem value="mysql">MySQL</SelectItem>
+													<SelectItem value="mongo">MongoDB</SelectItem>
+												</SelectContent>
+											</Select>
+											<FormMessage />
+										</FormItem>
+									)}
+								/>
 							)}
 							<FormField
 								control={form.control}
@@ -552,7 +641,7 @@ export const AddBackup = ({
 							/>
 							{backupType === "compose" && (
 								<>
-									{selectedDatabaseType === "postgres" && (
+									{form.watch("databaseType") === "postgres" && (
 										<FormField
 											control={form.control}
 											name="metadata.postgres.databaseUser"
@@ -568,7 +657,7 @@ export const AddBackup = ({
 										/>
 									)}
 
-									{selectedDatabaseType === "mariadb" && (
+									{form.watch("databaseType") === "mariadb" && (
 										<>
 											<FormField
 												control={form.control}
@@ -603,7 +692,7 @@ export const AddBackup = ({
 										</>
 									)}
 
-									{selectedDatabaseType === "mongo" && (
+									{form.watch("databaseType") === "mongo" && (
 										<>
 											<FormField
 												control={form.control}
@@ -638,7 +727,7 @@ export const AddBackup = ({
 										</>
 									)}
 
-									{selectedDatabaseType === "mysql" && (
+									{form.watch("databaseType") === "mysql" && (
 										<FormField
 											control={form.control}
 											name="metadata.mysql.databaseRootPassword"
@@ -666,7 +755,7 @@ export const AddBackup = ({
 								form="hook-form-add-backup"
 								type="submit"
 							>
-								Create
+								{backupId ? "Update" : "Create"}
 							</Button>
 						</DialogFooter>
 					</form>
diff --git a/apps/dokploy/components/dashboard/database/backups/show-backups.tsx b/apps/dokploy/components/dashboard/database/backups/show-backups.tsx
index 062e7be7..0a6517f9 100644
--- a/apps/dokploy/components/dashboard/database/backups/show-backups.tsx
+++ b/apps/dokploy/components/dashboard/database/backups/show-backups.tsx
@@ -19,10 +19,10 @@ import Link from "next/link";
 import { useState } from "react";
 import { toast } from "sonner";
 import type { ServiceType } from "../../application/advanced/show-resources";
-import { AddBackup } from "./add-backup";
 import { RestoreBackup } from "./restore-backup";
-import { UpdateBackup } from "./update-backup";
 import { AlertBlock } from "@/components/shared/alert-block";
+import { HandleBackup } from "./handle-backup";
+import { cn } from "@/lib/utils";
 
 interface Props {
 	id: string;
@@ -100,7 +100,7 @@ export const ShowBackups = ({
 				{postgres && postgres?.backups?.length > 0 && (
 					<div className="flex flex-col lg:flex-row gap-4 w-full lg:w-auto">
 						{databaseType !== "web-server" && (
-							<AddBackup
+							<HandleBackup
 								id={id}
 								databaseType={databaseType}
 								backupType={backupType}
@@ -141,7 +141,7 @@ export const ShowBackups = ({
 									No backups configured
 								</span>
 								<div className="flex flex-col sm:flex-row gap-4 w-full sm:w-auto">
-									<AddBackup
+									<HandleBackup
 										id={id}
 										databaseType={databaseType}
 										backupType={backupType}
@@ -170,7 +170,12 @@ export const ShowBackups = ({
 									{postgres?.backups.map((backup) => (
 										<div key={backup.backupId}>
 											<div className="flex w-full flex-col md:flex-row md:items-center justify-between gap-4 md:gap-10 border rounded-lg p-4">
-												<div className="grid grid-cols-1 md:grid-cols-3 xl:grid-cols-8 flex-col gap-8">
+												<div
+													className={cn(
+														"grid grid-cols-1 md:grid-cols-3 xl:grid-cols-6 flex-col gap-8",
+														backup.backupType === "compose" && "xl:grid-cols-8",
+													)}
+												>
 													{backup.backupType === "compose" && (
 														<>
 															<div className="flex flex-col gap-1">
@@ -265,7 +270,8 @@ export const ShowBackups = ({
 														</Tooltip>
 													</TooltipProvider>
 
-													<UpdateBackup
+													<HandleBackup
+														backupType={backup.backupType}
 														backupId={backup.backupId}
 														refetch={refetch}
 													/>
diff --git a/apps/dokploy/components/dashboard/database/backups/update-backup.tsx b/apps/dokploy/components/dashboard/database/backups/update-backup.tsx
deleted file mode 100644
index 8a12c535..00000000
--- a/apps/dokploy/components/dashboard/database/backups/update-backup.tsx
+++ /dev/null
@@ -1,681 +0,0 @@
-import { AlertBlock } from "@/components/shared/alert-block";
-import { Button } from "@/components/ui/button";
-import {
-	Command,
-	CommandEmpty,
-	CommandGroup,
-	CommandInput,
-	CommandItem,
-} from "@/components/ui/command";
-import {
-	Dialog,
-	DialogContent,
-	DialogDescription,
-	DialogFooter,
-	DialogHeader,
-	DialogTitle,
-	DialogTrigger,
-} from "@/components/ui/dialog";
-import {
-	Form,
-	FormControl,
-	FormDescription,
-	FormField,
-	FormItem,
-	FormLabel,
-	FormMessage,
-} from "@/components/ui/form";
-import { Input } from "@/components/ui/input";
-import {
-	Popover,
-	PopoverContent,
-	PopoverTrigger,
-} from "@/components/ui/popover";
-import { ScrollArea } from "@/components/ui/scroll-area";
-import {
-	Select,
-	SelectContent,
-	SelectItem,
-	SelectTrigger,
-	SelectValue,
-} from "@/components/ui/select";
-import { Switch } from "@/components/ui/switch";
-import {
-	Tooltip,
-	TooltipContent,
-	TooltipProvider,
-	TooltipTrigger,
-} from "@/components/ui/tooltip";
-import { cn } from "@/lib/utils";
-import { api } from "@/utils/api";
-import { zodResolver } from "@hookform/resolvers/zod";
-import {
-	CheckIcon,
-	ChevronsUpDown,
-	DatabaseZap,
-	PenBoxIcon,
-	RefreshCw,
-} from "lucide-react";
-import { useEffect, useState } from "react";
-import { useForm } from "react-hook-form";
-import { toast } from "sonner";
-import { z } from "zod";
-
-type CacheType = "cache" | "fetch";
-
-const getMetadataSchema = (
-	backupType: "database" | "compose",
-	databaseType: DatabaseType,
-) => {
-	if (backupType !== "compose") return z.object({}).optional();
-
-	const schemas = {
-		postgres: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-		}),
-		mariadb: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-			databasePassword: z.string().min(1, "Database password is required"),
-		}),
-		mongo: z.object({
-			databaseUser: z.string().min(1, "Database user is required"),
-			databasePassword: z.string().min(1, "Database password is required"),
-		}),
-		mysql: z.object({
-			databaseRootPassword: z.string().min(1, "Root password is required"),
-		}),
-		"web-server": z.object({}),
-	};
-
-	return z.object({
-		[databaseType]: schemas[databaseType as keyof typeof schemas],
-	});
-};
-
-const Schema = z.object({
-	destinationId: z.string().min(1, "Destination required"),
-	schedule: z.string().min(1, "Schedule (Cron) required"),
-	prefix: z.string().min(1, "Prefix required"),
-	enabled: z.boolean(),
-	database: z.string().min(1, "Database required"),
-	keepLatestCount: z.coerce.number().optional(),
-	serviceName: z.string().nullable(),
-	metadata: z.object({}).optional(),
-});
-
-interface Props {
-	backupId: string;
-	refetch: () => void;
-}
-
-type DatabaseType = "postgres" | "mariadb" | "mysql" | "mongo" | "web-server";
-
-export const UpdateBackup = ({ backupId, refetch }: Props) => {
-	const [isOpen, setIsOpen] = useState(false);
-	const [cacheType, setCacheType] = useState<CacheType>("cache");
-
-	const { data, isLoading } = api.destination.all.useQuery();
-	const { data: backup } = api.backup.one.useQuery(
-		{
-			backupId,
-		},
-		{
-			enabled: !!backupId,
-		},
-	);
-	const [selectedDatabaseType, setSelectedDatabaseType] =
-		useState<DatabaseType>(
-			(backup?.databaseType as DatabaseType) || "postgres",
-		);
-	const {
-		data: services,
-		isFetching: isLoadingServices,
-		error: errorServices,
-		refetch: refetchServices,
-	} = api.compose.loadServices.useQuery(
-		{
-			composeId: backup?.composeId || "",
-			type: cacheType,
-		},
-		{
-			retry: false,
-			refetchOnWindowFocus: false,
-			enabled:
-				isOpen && backup?.backupType === "compose" && !!backup?.composeId,
-		},
-	);
-
-	const { mutateAsync, isLoading: isLoadingUpdate } =
-		api.backup.update.useMutation();
-
-	const schema = Schema.extend({
-		metadata: getMetadataSchema(
-			backup?.backupType || "database",
-			selectedDatabaseType,
-		),
-	});
-
-	const form = useForm<z.infer<typeof schema>>({
-		defaultValues: {
-			database: "",
-			destinationId: "",
-			enabled: true,
-			prefix: "/",
-			schedule: "",
-			keepLatestCount: undefined,
-			serviceName: null,
-			metadata: {},
-		},
-		resolver: zodResolver(schema),
-	});
-
-	useEffect(() => {
-		if (backup) {
-			form.reset({
-				database: backup.database,
-				destinationId: backup.destinationId,
-				enabled: backup.enabled || false,
-				prefix: backup.prefix,
-				schedule: backup.schedule,
-				serviceName: backup.serviceName || null,
-				keepLatestCount: backup.keepLatestCount
-					? Number(backup.keepLatestCount)
-					: undefined,
-				metadata: backup.metadata || {},
-			});
-		}
-	}, [form, form.reset, backup]);
-
-	useEffect(() => {
-		if (backup?.backupType === "compose") {
-			const currentValues = form.getValues();
-			form.reset(
-				{
-					...currentValues,
-				},
-				{ keepDefaultValues: true },
-			);
-		}
-	}, [selectedDatabaseType, backup?.backupType, form]);
-
-	const onSubmit = async (data: z.infer<typeof schema>) => {
-		if (backup?.backupType === "compose" && !data.serviceName) {
-			form.setError("serviceName", {
-				type: "manual",
-				message: "Service name is required for compose backups",
-			});
-			return;
-		}
-
-		await mutateAsync({
-			backupId,
-			destinationId: data.destinationId,
-			prefix: data.prefix,
-			schedule: data.schedule,
-			enabled: data.enabled,
-			database: data.database,
-			serviceName: data.serviceName,
-			keepLatestCount: data.keepLatestCount as number | null,
-			metadata: data.metadata || {},
-			databaseType:
-				backup?.backupType === "compose"
-					? selectedDatabaseType
-					: (backup?.databaseType as DatabaseType),
-		})
-			.then(async () => {
-				toast.success("Backup Updated");
-				refetch();
-				setIsOpen(false);
-			})
-			.catch(() => {
-				toast.error("Error updating the Backup");
-			});
-	};
-
-	return (
-		<Dialog open={isOpen} onOpenChange={setIsOpen}>
-			<DialogTrigger asChild>
-				<Button
-					variant="ghost"
-					size="icon"
-					className="group hover:bg-blue-500/10"
-				>
-					<PenBoxIcon className="size-3.5 text-primary group-hover:text-blue-500" />
-				</Button>
-			</DialogTrigger>
-			<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg">
-				<DialogHeader>
-					<DialogTitle>Update Backup</DialogTitle>
-					<DialogDescription>Update the backup</DialogDescription>
-				</DialogHeader>
-
-				<Form {...form}>
-					<form
-						id="hook-form-update-backup"
-						onSubmit={form.handleSubmit(onSubmit)}
-						className="grid w-full gap-4"
-					>
-						<div className="grid grid-cols-1 gap-4">
-							{errorServices && (
-								<AlertBlock type="warning" className="[overflow-wrap:anywhere]">
-									{errorServices?.message}
-								</AlertBlock>
-							)}
-							{backup?.backupType === "compose" && (
-								<FormItem>
-									<FormLabel>Database Type</FormLabel>
-									<Select
-										value={selectedDatabaseType}
-										onValueChange={(value) => {
-											setSelectedDatabaseType(value as DatabaseType);
-										}}
-									>
-										<SelectTrigger className="w-full">
-											<SelectValue placeholder="Select a database type" />
-										</SelectTrigger>
-										<SelectContent>
-											<SelectItem value="postgres">PostgreSQL</SelectItem>
-											<SelectItem value="mariadb">MariaDB</SelectItem>
-											<SelectItem value="mysql">MySQL</SelectItem>
-											<SelectItem value="mongo">MongoDB</SelectItem>
-										</SelectContent>
-									</Select>
-								</FormItem>
-							)}
-							<FormField
-								control={form.control}
-								name="destinationId"
-								render={({ field }) => (
-									<FormItem className="">
-										<FormLabel>Destination</FormLabel>
-										<Popover>
-											<PopoverTrigger asChild>
-												<FormControl>
-													<Button
-														variant="outline"
-														className={cn(
-															"w-full justify-between !bg-input",
-															!field.value && "text-muted-foreground",
-														)}
-													>
-														{isLoading
-															? "Loading...."
-															: field.value
-																? data?.find(
-																		(destination) =>
-																			destination.destinationId === field.value,
-																	)?.name
-																: "Select Destination"}
-
-														<ChevronsUpDown className="ml-2 h-4 w-4 shrink-0 opacity-50" />
-													</Button>
-												</FormControl>
-											</PopoverTrigger>
-											<PopoverContent className="p-0" align="start">
-												<Command>
-													<CommandInput
-														placeholder="Search Destination..."
-														className="h-9"
-													/>
-													{isLoading && (
-														<span className="py-6 text-center text-sm">
-															Loading Destinations....
-														</span>
-													)}
-													<CommandEmpty>No destinations found.</CommandEmpty>
-													<ScrollArea className="h-64">
-														<CommandGroup>
-															{data?.map((destination) => (
-																<CommandItem
-																	value={destination.destinationId}
-																	key={destination.destinationId}
-																	onSelect={() => {
-																		form.setValue(
-																			"destinationId",
-																			destination.destinationId,
-																		);
-																	}}
-																>
-																	{destination.name}
-																	<CheckIcon
-																		className={cn(
-																			"ml-auto h-4 w-4",
-																			destination.destinationId === field.value
-																				? "opacity-100"
-																				: "opacity-0",
-																		)}
-																	/>
-																</CommandItem>
-															))}
-														</CommandGroup>
-													</ScrollArea>
-												</Command>
-											</PopoverContent>
-										</Popover>
-
-										<FormMessage />
-									</FormItem>
-								)}
-							/>
-							{backup?.backupType === "compose" && (
-								<div className="flex flex-row items-end w-full gap-4">
-									<FormField
-										control={form.control}
-										name="serviceName"
-										render={({ field }) => (
-											<FormItem className="w-full">
-												<FormLabel>Service Name</FormLabel>
-												<div className="flex gap-2">
-													<Select
-														onValueChange={field.onChange}
-														value={field.value || undefined}
-													>
-														<FormControl>
-															<SelectTrigger>
-																<SelectValue placeholder="Select a service name" />
-															</SelectTrigger>
-														</FormControl>
-
-														<SelectContent>
-															{services?.map((service, index) => (
-																<SelectItem
-																	value={service}
-																	key={`${service}-${index}`}
-																>
-																	{service}
-																</SelectItem>
-															))}
-															{(!services || services.length === 0) && (
-																<SelectItem value="none" disabled>
-																	Empty
-																</SelectItem>
-															)}
-														</SelectContent>
-													</Select>
-													<TooltipProvider delayDuration={0}>
-														<Tooltip>
-															<TooltipTrigger asChild>
-																<Button
-																	variant="secondary"
-																	type="button"
-																	isLoading={isLoadingServices}
-																	onClick={() => {
-																		if (cacheType === "fetch") {
-																			refetchServices();
-																		} else {
-																			setCacheType("fetch");
-																		}
-																	}}
-																>
-																	<RefreshCw className="size-4 text-muted-foreground" />
-																</Button>
-															</TooltipTrigger>
-															<TooltipContent
-																side="left"
-																sideOffset={5}
-																className="max-w-[10rem]"
-															>
-																<p>
-																	Fetch: Will clone the repository and load the
-																	services
-																</p>
-															</TooltipContent>
-														</Tooltip>
-													</TooltipProvider>
-													<TooltipProvider delayDuration={0}>
-														<Tooltip>
-															<TooltipTrigger asChild>
-																<Button
-																	variant="secondary"
-																	type="button"
-																	isLoading={isLoadingServices}
-																	onClick={() => {
-																		if (cacheType === "cache") {
-																			refetchServices();
-																		} else {
-																			setCacheType("cache");
-																		}
-																	}}
-																>
-																	<DatabaseZap className="size-4 text-muted-foreground" />
-																</Button>
-															</TooltipTrigger>
-															<TooltipContent
-																side="left"
-																sideOffset={5}
-																className="max-w-[10rem]"
-															>
-																<p>
-																	Cache: If you previously deployed this
-																	compose, it will read the services from the
-																	last deployment/fetch from the repository
-																</p>
-															</TooltipContent>
-														</Tooltip>
-													</TooltipProvider>
-												</div>
-
-												<FormMessage />
-											</FormItem>
-										)}
-									/>
-								</div>
-							)}
-							<FormField
-								control={form.control}
-								name="database"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Database</FormLabel>
-											<FormControl>
-												<Input placeholder={"dokploy"} {...field} />
-											</FormControl>
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
-							<FormField
-								control={form.control}
-								name="schedule"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Schedule (Cron)</FormLabel>
-											<FormControl>
-												<Input placeholder={"0 0 * * *"} {...field} />
-											</FormControl>
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
-							<FormField
-								control={form.control}
-								name="prefix"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Prefix Destination</FormLabel>
-											<FormControl>
-												<Input placeholder={"dokploy/"} {...field} />
-											</FormControl>
-											<FormDescription>
-												Use if you want to back up in a specific path of your
-												destination/bucket
-											</FormDescription>
-
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
-							<FormField
-								control={form.control}
-								name="keepLatestCount"
-								render={({ field }) => {
-									return (
-										<FormItem>
-											<FormLabel>Keep the latest</FormLabel>
-											<FormControl>
-												<Input
-													type="number"
-													placeholder={"keeps all the backups if left empty"}
-													{...field}
-												/>
-											</FormControl>
-											<FormDescription>
-												Optional. If provided, only keeps the latest N backups
-												in the cloud.
-											</FormDescription>
-											<FormMessage />
-										</FormItem>
-									);
-								}}
-							/>
-							<FormField
-								control={form.control}
-								name="enabled"
-								render={({ field }) => (
-									<FormItem className="flex flex-row items-center justify-between rounded-lg border p-3 ">
-										<div className="space-y-0.5">
-											<FormLabel>Enabled</FormLabel>
-											<FormDescription>
-												Enable or disable the backup
-											</FormDescription>
-										</div>
-										<FormControl>
-											<Switch
-												checked={field.value}
-												onCheckedChange={field.onChange}
-											/>
-										</FormControl>
-									</FormItem>
-								)}
-							/>
-							{backup?.backupType === "compose" && (
-								<>
-									{selectedDatabaseType === "postgres" && (
-										<FormField
-											control={form.control}
-											name="metadata.postgres.databaseUser"
-											render={({ field }) => (
-												<FormItem>
-													<FormLabel>Database User</FormLabel>
-													<FormControl>
-														<Input placeholder="postgres" {...field} />
-													</FormControl>
-													<FormMessage />
-												</FormItem>
-											)}
-										/>
-									)}
-
-									{selectedDatabaseType === "mariadb" && (
-										<>
-											<FormField
-												control={form.control}
-												name="metadata.mariadb.databaseUser"
-												render={({ field }) => (
-													<FormItem>
-														<FormLabel>Database User</FormLabel>
-														<FormControl>
-															<Input placeholder="mariadb" {...field} />
-														</FormControl>
-														<FormMessage />
-													</FormItem>
-												)}
-											/>
-											<FormField
-												control={form.control}
-												name="metadata.mariadb.databasePassword"
-												render={({ field }) => (
-													<FormItem>
-														<FormLabel>Database Password</FormLabel>
-														<FormControl>
-															<Input
-																type="password"
-																placeholder="••••••••"
-																{...field}
-															/>
-														</FormControl>
-														<FormMessage />
-													</FormItem>
-												)}
-											/>
-										</>
-									)}
-
-									{selectedDatabaseType === "mongo" && (
-										<>
-											<FormField
-												control={form.control}
-												name="metadata.mongo.databaseUser"
-												render={({ field }) => (
-													<FormItem>
-														<FormLabel>Database User</FormLabel>
-														<FormControl>
-															<Input placeholder="mongo" {...field} />
-														</FormControl>
-														<FormMessage />
-													</FormItem>
-												)}
-											/>
-											<FormField
-												control={form.control}
-												name="metadata.mongo.databasePassword"
-												render={({ field }) => (
-													<FormItem>
-														<FormLabel>Database Password</FormLabel>
-														<FormControl>
-															<Input
-																type="password"
-																placeholder="••••••••"
-																{...field}
-															/>
-														</FormControl>
-														<FormMessage />
-													</FormItem>
-												)}
-											/>
-										</>
-									)}
-
-									{selectedDatabaseType === "mysql" && (
-										<FormField
-											control={form.control}
-											name="metadata.mysql.databaseRootPassword"
-											render={({ field }) => (
-												<FormItem>
-													<FormLabel>Root Password</FormLabel>
-													<FormControl>
-														<Input
-															type="password"
-															placeholder="••••••••"
-															{...field}
-														/>
-													</FormControl>
-													<FormMessage />
-												</FormItem>
-											)}
-										/>
-									)}
-								</>
-							)}
-						</div>
-						<DialogFooter>
-							<Button
-								isLoading={isLoadingUpdate}
-								form="hook-form-update-backup"
-								type="submit"
-							>
-								Update
-							</Button>
-						</DialogFooter>
-					</form>
-				</Form>
-			</DialogContent>
-		</Dialog>
-	);
-};
diff --git a/packages/server/src/utils/restore/compose.ts b/packages/server/src/utils/restore/compose.ts
index f9deb52b..1b7f9fd9 100644
--- a/packages/server/src/utils/restore/compose.ts
+++ b/packages/server/src/utils/restore/compose.ts
@@ -14,7 +14,6 @@ export const restoreComposeBackup = async (
 	emit: (log: string) => void,
 ) => {
 	try {
-		console.log({ metadata });
 		const { serverId } = compose;
 
 		const rcloneFlags = getS3Credentials(destination);
@@ -78,8 +77,6 @@ export const restoreComposeBackup = async (
 			emit(stderr);
 		} else {
 			const { stdout, stderr } = await execAsync(restoreCommand);
-			console.log("stdout", stdout);
-			console.log("stderr", stderr);
 			emit(stdout);
 			emit(stderr);
 		}
diff --git a/packages/server/src/utils/restore/postgres.ts b/packages/server/src/utils/restore/postgres.ts
index 5ab7c74e..d6eae283 100644
--- a/packages/server/src/utils/restore/postgres.ts
+++ b/packages/server/src/utils/restore/postgres.ts
@@ -40,8 +40,6 @@ rclone cat ${rcloneFlags.join(" ")} "${backupPath}" | gunzip | docker exec -i ${
 			emit(stderr);
 		} else {
 			const { stdout, stderr } = await execAsync(command);
-			console.log("stdout", stdout);
-			console.log("stderr", stderr);
 			emit(stdout);
 			emit(stderr);
 		}