Merge branch 'canary' into fix/keyboard-shortcuts-non-english-layouts

apps/dokploy/components/dashboard/compose/advanced/add-command.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { useEffect } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -52,7 +52,7 @@ export const AddCommandCompose = ({ composeId }: Props) => {
 
 	const utils = api.useUtils();
 
-	const { mutateAsync, isLoading } = api.compose.update.useMutation();
+	const { mutateAsync, isPending } = api.compose.update.useMutation();
 
 	const form = useForm<AddCommand>({
 		defaultValues: {
@@ -128,7 +128,7 @@ export const AddCommandCompose = ({ composeId }: Props) => {
 							/>
 						</div>
 						<div className="flex justify-end">
-							<Button isLoading={isLoading} type="submit" className="w-fit">
+							<Button isLoading={isPending} type="submit" className="w-fit">
 								Save
 							</Button>
 						</div>

apps/dokploy/components/dashboard/compose/advanced/add-isolation.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { AlertTriangle, Loader2 } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";

apps/dokploy/components/dashboard/compose/delete-service.tsx

@@ -1,5 +1,5 @@
 import type { ServiceType } from "@dokploy/server/db/schema";
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import copy from "copy-to-clipboard";
 import { Copy, Trash2 } from "lucide-react";
 import { useRouter } from "next/router";
@@ -46,6 +46,8 @@ interface Props {
 }
 
 export const DeleteService = ({ id, type }: Props) => {
+	const { data: permissions } = api.user.getPermissions.useQuery();
+	const canDelete = permissions?.service.delete ?? false;
 	const [isOpen, setIsOpen] = useState(false);
 
 	const queryMap = {
@@ -55,6 +57,7 @@ export const DeleteService = ({ id, type }: Props) => {
 		mysql: () => api.mysql.one.useQuery({ mysqlId: id }, { enabled: !!id }),
 		mariadb: () =>
 			api.mariadb.one.useQuery({ mariadbId: id }, { enabled: !!id }),
+		libsql: () => api.libsql.one.useQuery({ libsqlId: id }, { enabled: !!id }),
 		application: () =>
 			api.application.one.useQuery({ applicationId: id }, { enabled: !!id }),
 		mongo: () => api.mongo.one.useQuery({ mongoId: id }, { enabled: !!id }),
@@ -70,11 +73,12 @@ export const DeleteService = ({ id, type }: Props) => {
 		redis: () => api.redis.remove.useMutation(),
 		mysql: () => api.mysql.remove.useMutation(),
 		mariadb: () => api.mariadb.remove.useMutation(),
+		libsql: () => api.libsql.remove.useMutation(),
 		application: () => api.application.delete.useMutation(),
 		mongo: () => api.mongo.remove.useMutation(),
 		compose: () => api.compose.delete.useMutation(),
 	};
-	const { mutateAsync, isLoading } = mutationMap[type]
+	const { mutateAsync, isPending } = mutationMap[type]
 		? mutationMap[type]()
 		: api.mongo.remove.useMutation();
 	const { push } = useRouter();
@@ -96,6 +100,7 @@ export const DeleteService = ({ id, type }: Props) => {
 				redisId: id || "",
 				mysqlId: id || "",
 				mariadbId: id || "",
+				libsqlId: id || "",
 				applicationId: id || "",
 				composeId: id || "",
 				deleteVolumes,
@@ -123,6 +128,8 @@ export const DeleteService = ({ id, type }: Props) => {
 			data?.applicationStatus === "running") ||
 		(data && "composeStatus" in data && data?.composeStatus === "running");
 
+	if (!canDelete) return null;
+
 	return (
 		<Dialog open={isOpen} onOpenChange={setIsOpen}>
 			<DialogTrigger asChild>
@@ -130,7 +137,7 @@ export const DeleteService = ({ id, type }: Props) => {
 					variant="ghost"
 					size="icon"
 					className="group hover:bg-red-500/10 "
-					isLoading={isLoading}
+					isLoading={isPending}
 				>
 					<Trash2 className="size-4 text-primary group-hover:text-red-500" />
 				</Button>
@@ -228,7 +235,7 @@ export const DeleteService = ({ id, type }: Props) => {
 					</Button>
 
 					<Button
-						isLoading={isLoading}
+						isLoading={isPending}
 						disabled={isDisabled}
 						form="hook-form-delete-compose"
 						type="submit"

apps/dokploy/components/dashboard/compose/general/actions.tsx

@@ -19,6 +19,9 @@ interface Props {
 }
 export const ComposeActions = ({ composeId }: Props) => {
 	const router = useRouter();
+	const { data: permissions } = api.user.getPermissions.useQuery();
+	const canDeploy = permissions?.deployment.create ?? false;
+	const canUpdateService = permissions?.service.create ?? false;
 	const { data, refetch } = api.compose.one.useQuery(
 		{
 			composeId,
@@ -28,169 +31,176 @@ export const ComposeActions = ({ composeId }: Props) => {
 	const { mutateAsync: update } = api.compose.update.useMutation();
 	const { mutateAsync: deploy } = api.compose.deploy.useMutation();
 	const { mutateAsync: redeploy } = api.compose.redeploy.useMutation();
-	const { mutateAsync: start, isLoading: isStarting } =
+	const { mutateAsync: start, isPending: isStarting } =
 		api.compose.start.useMutation();
-	const { mutateAsync: stop, isLoading: isStopping } =
+	const { mutateAsync: stop, isPending: isStopping } =
 		api.compose.stop.useMutation();
 	return (
 		<div className="flex flex-row gap-4 w-full flex-wrap ">
 			<TooltipProvider delayDuration={0} disableHoverableContent={false}>
-				<DialogAction
-					title="Deploy Compose"
-					description="Are you sure you want to deploy this compose?"
-					type="default"
-					onClick={async () => {
-						await deploy({
-							composeId: composeId,
-						})
-							.then(() => {
-								toast.success("Compose deployed successfully");
-								refetch();
-								router.push(
-									`/dashboard/project/${data?.environment.projectId}/environment/${data?.environmentId}/services/compose/${composeId}?tab=deployments`,
-								);
-							})
-							.catch(() => {
-								toast.error("Error deploying compose");
-							});
-					}}
-				>
-					<Button
-						variant="default"
-						isLoading={data?.composeStatus === "running"}
-						className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
-					>
-						<Tooltip>
-							<TooltipTrigger asChild>
-								<div className="flex items-center">
-									<Rocket className="size-4 mr-1" />
-									Deploy
-								</div>
-							</TooltipTrigger>
-							<TooltipPrimitive.Portal>
-								<TooltipContent sideOffset={5} className="z-[60]">
-									<p>Downloads the source code and performs a complete build</p>
-								</TooltipContent>
-							</TooltipPrimitive.Portal>
-						</Tooltip>
-					</Button>
-				</DialogAction>
-				<DialogAction
-					title="Reload Compose"
-					description="Are you sure you want to reload this compose?"
-					type="default"
-					onClick={async () => {
-						await redeploy({
-							composeId: composeId,
-						})
-							.then(() => {
-								toast.success("Compose reloaded successfully");
-								refetch();
-							})
-							.catch(() => {
-								toast.error("Error reloading compose");
-							});
-					}}
-				>
-					<Button
-						variant="secondary"
-						isLoading={data?.composeStatus === "running"}
-						className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
-					>
-						<Tooltip>
-							<TooltipTrigger asChild>
-								<div className="flex items-center">
-									<RefreshCcw className="size-4 mr-1" />
-									Reload
-								</div>
-							</TooltipTrigger>
-							<TooltipPrimitive.Portal>
-								<TooltipContent sideOffset={5} className="z-[60]">
-									<p>Reload the compose without rebuilding it</p>
-								</TooltipContent>
-							</TooltipPrimitive.Portal>
-						</Tooltip>
-					</Button>
-				</DialogAction>
-				{data?.composeType === "docker-compose" &&
-				data?.composeStatus === "idle" ? (
+				{canDeploy && (
 					<DialogAction
-						title="Start Compose"
-						description="Are you sure you want to start this compose?"
+						title="Deploy Compose"
+						description="Are you sure you want to deploy this compose?"
 						type="default"
 						onClick={async () => {
-							await start({
+							await deploy({
 								composeId: composeId,
 							})
 								.then(() => {
-									toast.success("Compose started successfully");
+									toast.success("Compose deployed successfully");
 									refetch();
+									router.push(
+										`/dashboard/project/${data?.environment.projectId}/environment/${data?.environmentId}/services/compose/${composeId}?tab=deployments`,
+									);
 								})
 								.catch(() => {
-									toast.error("Error starting compose");
+									toast.error("Error deploying compose");
 								});
 						}}
 					>
 						<Button
-							variant="secondary"
-							isLoading={isStarting}
+							variant="default"
+							isLoading={data?.composeStatus === "running"}
 							className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
 						>
 							<Tooltip>
 								<TooltipTrigger asChild>
 									<div className="flex items-center">
-										<CheckCircle2 className="size-4 mr-1" />
-										Start
+										<Rocket className="size-4 mr-1" />
+										Deploy
 									</div>
 								</TooltipTrigger>
 								<TooltipPrimitive.Portal>
 									<TooltipContent sideOffset={5} className="z-[60]">
 										<p>
-											Start the compose (requires a previous successful build)
+											Downloads the source code and performs a complete build
 										</p>
 									</TooltipContent>
 								</TooltipPrimitive.Portal>
 							</Tooltip>
 						</Button>
 					</DialogAction>
-				) : (
+				)}
+				{canDeploy && (
 					<DialogAction
-						title="Stop Compose"
-						description="Are you sure you want to stop this compose?"
+						title="Reload Compose"
+						description="Are you sure you want to reload this compose?"
+						type="default"
 						onClick={async () => {
-							await stop({
+							await redeploy({
 								composeId: composeId,
 							})
 								.then(() => {
-									toast.success("Compose stopped successfully");
+									toast.success("Compose reloaded successfully");
 									refetch();
 								})
 								.catch(() => {
-									toast.error("Error stopping compose");
+									toast.error("Error reloading compose");
 								});
 						}}
 					>
 						<Button
-							variant="destructive"
-							isLoading={isStopping}
+							variant="secondary"
+							isLoading={data?.composeStatus === "running"}
 							className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
 						>
 							<Tooltip>
 								<TooltipTrigger asChild>
 									<div className="flex items-center">
-										<Ban className="size-4 mr-1" />
-										Stop
+										<RefreshCcw className="size-4 mr-1" />
+										Reload
 									</div>
 								</TooltipTrigger>
 								<TooltipPrimitive.Portal>
 									<TooltipContent sideOffset={5} className="z-[60]">
-										<p>Stop the currently running compose</p>
+										<p>Reload the compose without rebuilding it</p>
 									</TooltipContent>
 								</TooltipPrimitive.Portal>
 							</Tooltip>
 						</Button>
 					</DialogAction>
 				)}
+				{canDeploy &&
+					(data?.composeType === "docker-compose" &&
+					data?.composeStatus === "idle" ? (
+						<DialogAction
+							title="Start Compose"
+							description="Are you sure you want to start this compose?"
+							type="default"
+							onClick={async () => {
+								await start({
+									composeId: composeId,
+								})
+									.then(() => {
+										toast.success("Compose started successfully");
+										refetch();
+									})
+									.catch(() => {
+										toast.error("Error starting compose");
+									});
+							}}
+						>
+							<Button
+								variant="secondary"
+								isLoading={isStarting}
+								className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+							>
+								<Tooltip>
+									<TooltipTrigger asChild>
+										<div className="flex items-center">
+											<CheckCircle2 className="size-4 mr-1" />
+											Start
+										</div>
+									</TooltipTrigger>
+									<TooltipPrimitive.Portal>
+										<TooltipContent sideOffset={5} className="z-[60]">
+											<p>
+												Start the compose (requires a previous successful build)
+											</p>
+										</TooltipContent>
+									</TooltipPrimitive.Portal>
+								</Tooltip>
+							</Button>
+						</DialogAction>
+					) : (
+						<DialogAction
+							title="Stop Compose"
+							description="Are you sure you want to stop this compose?"
+							onClick={async () => {
+								await stop({
+									composeId: composeId,
+								})
+									.then(() => {
+										toast.success("Compose stopped successfully");
+										refetch();
+									})
+									.catch(() => {
+										toast.error("Error stopping compose");
+									});
+							}}
+						>
+							<Button
+								variant="destructive"
+								isLoading={isStopping}
+								className="flex items-center gap-1.5 group focus-visible:ring-2 focus-visible:ring-offset-2"
+							>
+								<Tooltip>
+									<TooltipTrigger asChild>
+										<div className="flex items-center">
+											<Ban className="size-4 mr-1" />
+											Stop
+										</div>
+									</TooltipTrigger>
+									<TooltipPrimitive.Portal>
+										<TooltipContent sideOffset={5} className="z-[60]">
+											<p>Stop the currently running compose</p>
+										</TooltipContent>
+									</TooltipPrimitive.Portal>
+								</Tooltip>
+							</Button>
+						</DialogAction>
+					))}
 			</TooltipProvider>
 			<DockerTerminalModal
 				appName={data?.appName || ""}
@@ -205,27 +215,29 @@ export const ComposeActions = ({ composeId }: Props) => {
 					Open Terminal
 				</Button>
 			</DockerTerminalModal>
-			<div className="flex flex-row items-center gap-2 rounded-md px-4 py-2 border">
-				<span className="text-sm font-medium">Autodeploy</span>
-				<Switch
-					aria-label="Toggle autodeploy"
-					checked={data?.autoDeploy || false}
-					onCheckedChange={async (enabled) => {
-						await update({
-							composeId,
-							autoDeploy: enabled,
-						})
-							.then(async () => {
-								toast.success("Auto Deploy Updated");
-								await refetch();
+			{canUpdateService && (
+				<div className="flex flex-row items-center gap-2 rounded-md px-4 py-2 border">
+					<span className="text-sm font-medium">Autodeploy</span>
+					<Switch
+						aria-label="Toggle autodeploy"
+						checked={data?.autoDeploy || false}
+						onCheckedChange={async (enabled) => {
+							await update({
+								composeId,
+								autoDeploy: enabled,
 							})
-							.catch(() => {
-								toast.error("Error updating Auto Deploy");
-							});
-					}}
-					className="flex flex-row gap-2 items-center data-[state=checked]:bg-primary"
-				/>
-			</div>
+								.then(async () => {
+									toast.success("Auto Deploy Updated");
+									await refetch();
+								})
+								.catch(() => {
+									toast.error("Error updating Auto Deploy");
+								});
+						}}
+						className="flex flex-row gap-2 items-center data-[state=checked]:bg-primary"
+					/>
+				</div>
+			)}
 		</div>
 	);
 };

apps/dokploy/components/dashboard/compose/general/compose-file-editor.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
@@ -26,6 +26,8 @@ const AddComposeFile = z.object({
 type AddComposeFile = z.infer<typeof AddComposeFile>;
 
 export const ComposeFileEditor = ({ composeId }: Props) => {
+	const { data: permissions } = api.user.getPermissions.useQuery();
+	const canUpdate = permissions?.service.create ?? false;
 	const utils = api.useUtils();
 	const { data, refetch } = api.compose.one.useQuery(
 		{
@@ -34,7 +36,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 		{ enabled: !!composeId },
 	);
 
-	const { mutateAsync, isLoading } = api.compose.update.useMutation();
+	const { mutateAsync, isPending } = api.compose.update.useMutation();
 	const [hasUnsavedChanges, setHasUnsavedChanges] = useState(false);
 
 	const form = useForm<AddComposeFile>({
@@ -93,7 +95,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 	// Add keyboard shortcut for Ctrl+S/Cmd+S
 	useEffect(() => {
 		const handleKeyDown = (e: KeyboardEvent) => {
-			if ((e.ctrlKey || e.metaKey) && e.code === "KeyS" && !isLoading) {
+			if ((e.ctrlKey || e.metaKey) && e.code === "KeyS" && !isPending) {
 				e.preventDefault();
 				form.handleSubmit(onSubmit)();
 			}
@@ -103,7 +105,7 @@ export const ComposeFileEditor = ({ composeId }: Props) => {
 		return () => {
 			document.removeEventListener("keydown", handleKeyDown);
 		};
-	}, [form, onSubmit, isLoading]);
+	}, [form, onSubmit, isPending]);
 
 	return (
 		<>
@@ -164,14 +166,16 @@ services:
 				</Form>
 				<div className="flex justify-between flex-col lg:flex-row gap-2">
 					<div className="w-full flex flex-col lg:flex-row gap-4 items-end" />
-					<Button
-						type="submit"
-						form="hook-form-save-compose-file"
-						isLoading={isLoading}
-						className="lg:w-fit w-full"
-					>
-						Save
-					</Button>
+					{canUpdate && (
+						<Button
+							type="submit"
+							form="hook-form-save-compose-file"
+							isLoading={isPending}
+							className="lg:w-fit w-full"
+						>
+							Save
+						</Button>
+					)}
 				</div>
 			</div>
 		</>

apps/dokploy/components/dashboard/compose/general/generic/save-bitbucket-provider-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
 import Link from "next/link";
 import { useEffect } from "react";
@@ -74,10 +74,10 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 		api.bitbucket.bitbucketProviders.useQuery();
 	const { data, refetch } = api.compose.one.useQuery({ composeId });
 
-	const { mutateAsync, isLoading: isSavingBitbucketProvider } =
+	const { mutateAsync, isPending: isSavingBitbucketProvider } =
 		api.compose.update.useMutation();
 
-	const form = useForm<BitbucketProvider>({
+	const form = useForm({
 		defaultValues: {
 			composePath: "./docker-compose.yml",
 			repository: {
@@ -335,7 +335,7 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 														!field.value && "text-muted-foreground",
 													)}
 												>
-													{status === "loading" && fetchStatus === "fetching"
+													{status === "pending" && fetchStatus === "fetching"
 														? "Loading...."
 														: field.value
 															? branches?.find(
@@ -352,7 +352,7 @@ export const SaveBitbucketProviderCompose = ({ composeId }: Props) => {
 													placeholder="Search branch..."
 													className="h-9"
 												/>
-												{status === "loading" && fetchStatus === "fetching" && (
+												{status === "pending" && fetchStatus === "fetching" && (
 													<span className="py-6 text-center text-sm text-muted-foreground">
 														Loading Branches....
 													</span>

apps/dokploy/components/dashboard/compose/general/generic/save-git-provider-compose.tsx

@@ -1,5 +1,5 @@
-import { zodResolver } from "@hookform/resolvers/zod";
-import { KeyRoundIcon, LockIcon, X } from "lucide-react";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
+import { HelpCircle, KeyRoundIcon, LockIcon, X } from "lucide-react";
 import Link from "next/link";
 import { useRouter } from "next/router";
 import { useEffect } from "react";
@@ -58,9 +58,9 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 	const { data: sshKeys } = api.sshKey.all.useQuery();
 	const router = useRouter();
 
-	const { mutateAsync, isLoading } = api.compose.update.useMutation();
+	const { mutateAsync, isPending } = api.compose.update.useMutation();
 
-	const form = useForm<GitProvider>({
+	const form = useForm({
 		defaultValues: {
 			branch: "",
 			repositoryURL: "",
@@ -230,10 +230,8 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 									<FormLabel>Watch Paths</FormLabel>
 									<TooltipProvider>
 										<Tooltip>
-											<TooltipTrigger>
-												<div className="size-4 rounded-full bg-muted flex items-center justify-center text-[10px] font-bold">
-													?
-												</div>
+											<TooltipTrigger asChild>
+												<HelpCircle className="size-4 text-muted-foreground hover:text-foreground transition-colors cursor-pointer" />
 											</TooltipTrigger>
 											<TooltipContent className="max-w-[300px]">
 												<p>
@@ -318,7 +316,7 @@ export const SaveGitProviderCompose = ({ composeId }: Props) => {
 				</div>
 
 				<div className="flex flex-row justify-end">
-					<Button type="submit" className="w-fit" isLoading={isLoading}>
+					<Button type="submit" className="w-fit" isLoading={isPending}>
 						Save{" "}
 					</Button>
 				</div>

apps/dokploy/components/dashboard/compose/general/generic/save-gitea-provider-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { CheckIcon, ChevronsUpDown, Plus, X } from "lucide-react";
 import Link from "next/link";
 import { useEffect } from "react";
@@ -72,10 +72,10 @@ interface Props {
 export const SaveGiteaProviderCompose = ({ composeId }: Props) => {
 	const { data: giteaProviders } = api.gitea.giteaProviders.useQuery();
 	const { data, refetch } = api.compose.one.useQuery({ composeId });
-	const { mutateAsync, isLoading: isSavingGiteaProvider } =
+	const { mutateAsync, isPending: isSavingGiteaProvider } =
 		api.compose.update.useMutation();
 
-	const form = useForm<GiteaProvider>({
+	const form = useForm({
 		defaultValues: {
 			composePath: "./docker-compose.yml",
 			repository: {
@@ -331,7 +331,7 @@ export const SaveGiteaProviderCompose = ({ composeId }: Props) => {
 														!field.value && "text-muted-foreground",
 													)}
 												>
-													{status === "loading" && fetchStatus === "fetching"
+													{status === "pending" && fetchStatus === "fetching"
 														? "Loading...."
 														: field.value
 															? branches?.find(

apps/dokploy/components/dashboard/compose/general/generic/save-github-provider-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { CheckIcon, ChevronsUpDown, HelpCircle, X } from "lucide-react";
 import Link from "next/link";
 import { useEffect } from "react";
@@ -72,10 +72,10 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 	const { data: githubProviders } = api.github.githubProviders.useQuery();
 	const { data, refetch } = api.compose.one.useQuery({ composeId });
 
-	const { mutateAsync, isLoading: isSavingGithubProvider } =
+	const { mutateAsync, isPending: isSavingGithubProvider } =
 		api.compose.update.useMutation();
 
-	const form = useForm<GithubProvider>({
+	const form = useForm({
 		defaultValues: {
 			composePath: "./docker-compose.yml",
 			repository: {
@@ -94,7 +94,7 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 	const repository = form.watch("repository");
 	const githubId = form.watch("githubId");
 	const triggerType = form.watch("triggerType");
-	const { data: repositories, isLoading: isLoadingRepositories } =
+	const { data: repositories, isPending: isLoadingRepositories } =
 		api.github.getGithubRepositories.useQuery(
 			{
 				githubId,
@@ -321,7 +321,7 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 														!field.value && "text-muted-foreground",
 													)}
 												>
-													{status === "loading" && fetchStatus === "fetching"
+													{status === "pending" && fetchStatus === "fetching"
 														? "Loading...."
 														: field.value
 															? branches?.find(
@@ -338,7 +338,7 @@ export const SaveGithubProviderCompose = ({ composeId }: Props) => {
 													placeholder="Search branch..."
 													className="h-9"
 												/>
-												{status === "loading" && fetchStatus === "fetching" && (
+												{status === "pending" && fetchStatus === "fetching" && (
 													<span className="py-6 text-center text-sm text-muted-foreground">
 														Loading Branches....
 													</span>

apps/dokploy/components/dashboard/compose/general/generic/save-gitlab-provider-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { CheckIcon, ChevronsUpDown, X } from "lucide-react";
 import Link from "next/link";
 import { useEffect, useMemo } from "react";
@@ -74,10 +74,10 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 	const { data: gitlabProviders } = api.gitlab.gitlabProviders.useQuery();
 	const { data, refetch } = api.compose.one.useQuery({ composeId });
 
-	const { mutateAsync, isLoading: isSavingGitlabProvider } =
+	const { mutateAsync, isPending: isSavingGitlabProvider } =
 		api.compose.update.useMutation();
 
-	const form = useForm<GitlabProvider>({
+	const form = useForm({
 		defaultValues: {
 			composePath: "./docker-compose.yml",
 			repository: {
@@ -353,7 +353,7 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 														!field.value && "text-muted-foreground",
 													)}
 												>
-													{status === "loading" && fetchStatus === "fetching"
+													{status === "pending" && fetchStatus === "fetching"
 														? "Loading...."
 														: field.value
 															? branches?.find(
@@ -370,7 +370,7 @@ export const SaveGitlabProviderCompose = ({ composeId }: Props) => {
 													placeholder="Search branch..."
 													className="h-9"
 												/>
-												{status === "loading" && fetchStatus === "fetching" && (
+												{status === "pending" && fetchStatus === "fetching" && (
 													<span className="py-6 text-center text-sm text-muted-foreground">
 														Loading Branches....
 													</span>

apps/dokploy/components/dashboard/compose/general/generic/show.tsx

@@ -27,13 +27,13 @@ interface Props {
 }
 
 export const ShowProviderFormCompose = ({ composeId }: Props) => {
-	const { data: githubProviders, isLoading: isLoadingGithub } =
+	const { data: githubProviders, isPending: isLoadingGithub } =
 		api.github.githubProviders.useQuery();
-	const { data: gitlabProviders, isLoading: isLoadingGitlab } =
+	const { data: gitlabProviders, isPending: isLoadingGitlab } =
 		api.gitlab.gitlabProviders.useQuery();
-	const { data: bitbucketProviders, isLoading: isLoadingBitbucket } =
+	const { data: bitbucketProviders, isPending: isLoadingBitbucket } =
 		api.bitbucket.bitbucketProviders.useQuery();
-	const { data: giteaProviders, isLoading: isLoadingGitea } =
+	const { data: giteaProviders, isPending: isLoadingGitea } =
 		api.gitea.giteaProviders.useQuery();
 
 	const { mutateAsync: disconnectGitProvider } =

apps/dokploy/components/dashboard/compose/general/randomize-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { AlertTriangle } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";

apps/dokploy/components/dashboard/compose/general/show-converted-compose.tsx

@@ -32,7 +32,7 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
 		},
 	);
 
-	const { mutateAsync, isLoading } = api.compose.fetchSourceType.useMutation();
+	const { mutateAsync, isPending } = api.compose.fetchSourceType.useMutation();
 
 	useEffect(() => {
 		if (isOpen) {
@@ -66,7 +66,7 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
 					Preview your docker-compose file with added domains. Note: At least
 					one domain must be specified for this conversion to take effect.
 				</AlertBlock>
-				{isLoading ? (
+				{isPending ? (
 					<div className="flex flex-row items-center justify-center min-h-[25rem] border p-4 rounded-md">
 						<Loader2 className="h-8 w-8 text-muted-foreground mb-2 animate-spin" />
 					</div>
@@ -82,7 +82,7 @@ export const ShowConvertedCompose = ({ composeId }: Props) => {
 						<div className="flex flex-row gap-2 justify-end my-4">
 							<Button
 								variant="secondary"
-								isLoading={isLoading}
+								isLoading={isPending}
 								onClick={() => {
 									mutateAsync({ composeId })
 										.then(() => {

apps/dokploy/components/dashboard/compose/logs/show-stack.tsx

@@ -41,7 +41,7 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
 	const [option, setOption] = useState<"swarm" | "native">("native");
 	const [containerId, setContainerId] = useState<string | undefined>();
 
-	const { data: services, isLoading: servicesLoading } =
+	const { data: services, isPending: servicesLoading } =
 		api.docker.getStackContainersByAppName.useQuery(
 			{
 				appName,
@@ -52,7 +52,7 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
 			},
 		);
 
-	const { data: containers, isLoading: containersLoading } =
+	const { data: containers, isPending: containersLoading } =
 		api.docker.getContainersByAppNameMatch.useQuery(
 			{
 				appName,
@@ -77,7 +77,7 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
 	}, [option, services, containers]);
 
 	const isLoading = option === "native" ? containersLoading : servicesLoading;
-	const containersLenght =
+	const containersLength =
 		option === "native" ? containers?.length : services?.length;
 
 	return (
@@ -152,7 +152,7 @@ export const ShowDockerLogsStack = ({ appName, serverId }: Props) => {
 								</>
 							)}
 
-							<SelectLabel>Containers ({containersLenght})</SelectLabel>
+							<SelectLabel>Containers ({containersLength})</SelectLabel>
 						</SelectGroup>
 					</SelectContent>
 				</Select>

apps/dokploy/components/dashboard/compose/logs/show.tsx

@@ -1,8 +1,8 @@
 import { Loader2 } from "lucide-react";
-import { badgeStateColor } from "@/components/dashboard/application/logs/show";
-import { Badge } from "@/components/ui/badge";
 import dynamic from "next/dynamic";
 import { useEffect, useState } from "react";
+import { badgeStateColor } from "@/components/dashboard/application/logs/show";
+import { Badge } from "@/components/ui/badge";
 import {
 	Card,
 	CardContent,
@@ -42,7 +42,7 @@ export const ShowDockerLogsCompose = ({
 	appType,
 	serverId,
 }: Props) => {
-	const { data, isLoading } = api.docker.getContainersByAppNameMatch.useQuery(
+	const { data, isPending } = api.docker.getContainersByAppNameMatch.useQuery(
 		{
 			appName,
 			appType,
@@ -73,7 +73,7 @@ export const ShowDockerLogsCompose = ({
 				<Label>Select a container to view logs</Label>
 				<Select onValueChange={setContainerId} value={containerId}>
 					<SelectTrigger>
-						{isLoading ? (
+						{isPending ? (
 							<div className="flex flex-row gap-2 items-center justify-center text-sm text-muted-foreground">
 								<span>Loading...</span>
 								<Loader2 className="animate-spin size-4" />

apps/dokploy/components/dashboard/compose/update-compose.tsx

@@ -1,4 +1,4 @@
-import { zodResolver } from "@hookform/resolvers/zod";
+import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
 import { PenBoxIcon } from "lucide-react";
 import { useEffect, useState } from "react";
 import { useForm } from "react-hook-form";
@@ -43,7 +43,7 @@ interface Props {
 export const UpdateCompose = ({ composeId }: Props) => {
 	const [isOpen, setIsOpen] = useState(false);
 	const utils = api.useUtils();
-	const { mutateAsync, error, isError, isLoading } =
+	const { mutateAsync, error, isError, isPending } =
 		api.compose.update.useMutation();
 	const { data } = api.compose.one.useQuery(
 		{
@@ -148,7 +148,7 @@ export const UpdateCompose = ({ composeId }: Props) => {
 								/>
 								<DialogFooter>
 									<Button
-										isLoading={isLoading}
+										isLoading={isPending}
 										form="hook-form-update-compose"
 										type="submit"
 									>