test: restore setTimeout spy after use to prevent test leakage

fix: Fix server card title overflow for responsiveness

apps/dokploy/__test__/compose/env-file-literals.test.ts

@@ -54,7 +54,16 @@ const inputEncoding: Record<string, string> = {
 	DB_HOST: '"${UNDEFINED_HOST:-localhost}"',
 };
 
-describe("getCreateEnvFileCommand", () => {
+const hasDocker = () => {
+	try {
+		execFileSync("docker", ["info"], { stdio: "ignore" });
+		return true;
+	} catch {
+		return false;
+	}
+};
+
+describe.skipIf(!hasDocker())("getCreateEnvFileCommand", () => {
 	it("writes special environment values that Docker Compose reads back literally", () => {
 		mkdirSync(codePath, { recursive: true });
 

apps/dokploy/__test__/process/execAsync.test.ts

@@ -0,0 +1,142 @@
+import { EventEmitter } from "node:events";
+import { execAsyncRemote } from "@dokploy/server/utils/process/execAsync";
+import { beforeEach, describe, expect, it, vi } from "vitest";
+
+// Define the `findServerById` mock via `vi.hoisted` so it is available to the
+// `vi.mock` factory *and* carries the vitest `Mock` type in test code. Defining
+// it inline in a plain `vi.mock` factory would leave the imported binding typed
+// as the real function, hiding `.mockResolvedValue`/`.mockReset` from TS.
+const mocks = vi.hoisted(() => ({
+	findServerById: vi.fn(),
+}));
+
+// The most recently constructed FakeClient is published here so tests can drive
+// its EventEmitter-style API without importing the (native) `ssh2` module.
+// `vi.hoisted` makes this object available to the async `ssh2` mock factory.
+const clientBox = vi.hoisted(() => ({ current: undefined as unknown }));
+
+interface FakeClientLike extends EventEmitter {
+	exec: ReturnType<typeof vi.fn>;
+	end: ReturnType<typeof vi.fn>;
+	connect: ReturnType<typeof vi.fn>;
+}
+
+vi.mock("@dokploy/server/services/server", () => ({
+	findServerById: mocks.findServerById,
+}));
+
+vi.mock("ssh2", async () => {
+	const { EventEmitter } = await import("node:events");
+	class FakeClient extends EventEmitter {
+		public exec = vi.fn();
+		public end = vi.fn();
+		public connect = vi.fn(() => this);
+		constructor() {
+			super();
+			clientBox.current = this;
+		}
+	}
+	return { Client: FakeClient };
+});
+
+class FakeStream extends EventEmitter {
+	public stderr: EventEmitter;
+
+	constructor() {
+		super();
+		this.stderr = new EventEmitter();
+	}
+}
+
+// `execAsyncRemote` `await`s `findServerById` before constructing the `Client`
+// and calling `.connect()` synchronously inside the `new Promise(...)`
+// executor, so a single macrotask boundary is enough to reach `.connect()`.
+const flushMicrotasks = () =>
+	new Promise<void>((resolve) => setImmediate(resolve));
+
+const getLastClient = (): FakeClientLike => {
+	const client = clientBox.current as FakeClientLike | undefined;
+	if (!client) {
+		throw new Error("No FakeClient was constructed");
+	}
+	return client;
+};
+
+const makeServer = () => ({
+	serverId: "s1",
+	sshKeyId: "key-1",
+	ipAddress: "10.0.0.1",
+	port: 2222,
+	username: "root",
+	sshKey: {
+		privateKey:
+			"-----BEGIN OPENSSH PRIVATE KEY-----\nmock-key\n-----END OPENSSH PRIVATE KEY-----",
+	},
+});
+
+describe("execAsyncRemote", () => {
+	beforeEach(() => {
+		mocks.findServerById.mockReset();
+		clientBox.current = undefined;
+	});
+
+	it("connects with the server's SSH credentials and resolves on exit code 0", async () => {
+		mocks.findServerById.mockResolvedValue(makeServer());
+		const onData = vi.fn();
+
+		const promise = execAsyncRemote("s1", "echo hi", onData);
+		await flushMicrotasks();
+
+		const client = getLastClient();
+		expect(client.connect).toHaveBeenCalledTimes(1);
+		expect(client.connect).toHaveBeenCalledWith(
+			expect.objectContaining({
+				host: "10.0.0.1",
+				port: 2222,
+				username: "root",
+				privateKey: expect.stringContaining("OPENSSH PRIVATE KEY"),
+				timeout: 99999,
+			}),
+		);
+
+		client.emit("ready");
+		const stream = new FakeStream();
+		client.exec.mock.calls[0]?.[1]?.(null, stream);
+
+		stream.emit("data", "hello");
+		stream.stderr.emit("data", "boom");
+		stream.emit("close", 0, "");
+
+		await expect(promise).resolves.toEqual({ stdout: "hello", stderr: "boom" });
+		expect(client.end).toHaveBeenCalled();
+		expect(onData).toHaveBeenCalledWith("hello");
+		expect(onData).toHaveBeenCalledWith("boom");
+	});
+
+	// Regression guard for the dead `sleep(1000)` line that used to sit inside
+	// the synchronous `new Promise(...)` executor (where `await` is illegal, so
+	// the returned promise was discarded and no delay ever happened). Ensures
+	// neither that line nor any equivalent 1s pre-connect timer is reintroduced.
+	it("does not schedule a 1s pre-connect sleep timer before .connect()", async () => {
+		mocks.findServerById.mockResolvedValue(makeServer());
+		const setTimeoutSpy = vi.spyOn(globalThis, "setTimeout");
+
+		try {
+			const promise = execAsyncRemote("s1", "echo hi");
+			await flushMicrotasks();
+
+			const client = getLastClient();
+			expect(client.connect).toHaveBeenCalledTimes(1);
+
+			expect(
+				setTimeoutSpy.mock.calls.filter((call) => call[1] === 1000),
+			).toEqual([]);
+
+			// Settle the pending connection so the test does not hang.
+			client.emit("error", new Error("aborted"));
+			await expect(promise).rejects.toThrow("SSH connection error: aborted");
+		} finally {
+			setTimeoutSpy.mockRestore();
+		}
+	});
+});

apps/dokploy/__test__/setup/monitoring-setup.real.test.ts

@@ -154,7 +154,16 @@ const hasRealMonitoring = () => {
 	);
 };
 
-describe.skipIf(hasRealMonitoring())(
+const hasDocker = () => {
+	try {
+		execSync("docker info", { stdio: "ignore" });
+		return true;
+	} catch {
+		return false;
+	}
+};
+
+describe.skipIf(!hasDocker() || hasRealMonitoring() || !process.env.CI)(
 	"setupMonitoring - legacy container cleanup (real docker)",
 	() => {
 		beforeEach(async () => {

apps/dokploy/components/dashboard/application/icon/show-icon-settings.tsx

@@ -1,4 +1,3 @@
-import DOMPurify from "dompurify";
 import { CircuitBoard, GlobeIcon, Pencil, Search, X } from "lucide-react";
 import { useEffect, useMemo, useState } from "react";
 import { toast } from "sonner";
@@ -14,6 +13,7 @@ import { Dropzone } from "@/components/ui/dropzone";
 import { Input } from "@/components/ui/input";
 import { type BundledIcon, bundledIcons } from "@/lib/bundled-icons";
 import { api } from "@/utils/api";
+import { sanitizeSvg } from "@/utils/sanitize-svg";
 
 interface ShowIconSettingsProps {
 	serviceId: string;
@@ -89,15 +89,6 @@ export const ShowIconSettings = ({
 		}
 	};
 
-	const sanitizeSvg = (svgContent: string): string | null => {
-		const clean = DOMPurify.sanitize(svgContent, {
-			USE_PROFILES: { svg: true, svgFilters: true },
-			ADD_TAGS: ["use"],
-		});
-		if (!clean) return null;
-		return `data:image/svg+xml;base64,${btoa(clean)}`;
-	};
-
 	const handleFileUpload = async (files: FileList | null) => {
 		if (!files || files.length === 0) return;
 		const file = files[0];

apps/dokploy/components/dashboard/organization/handle-organization.tsx

@@ -1,6 +1,7 @@
 import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
-import { PenBoxIcon, Plus } from "lucide-react";
-import { useEffect, useState } from "react";
+
+import { GlobeIcon, PenBoxIcon, Plus, X } from "lucide-react";
+import { useEffect, useRef, useState } from "react";
 import { useForm } from "react-hook-form";
 import { toast } from "sonner";
 import { z } from "zod";
@@ -14,6 +15,7 @@ import {
 	DialogTitle,
 	DialogTrigger,
 } from "@/components/ui/dialog";
+import { Dropzone } from "@/components/ui/dropzone";
 import {
 	Form,
 	FormControl,
@@ -24,6 +26,8 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { api } from "@/utils/api";
+import { resizeImage } from "@/utils/image-processing";
+import { sanitizeSvg } from "@/utils/sanitize-svg";
 
 const organizationSchema = z.object({
 	name: z.string().min(1, {
@@ -37,10 +41,24 @@ type OrganizationFormValues = z.infer<typeof organizationSchema>;
 interface Props {
 	organizationId?: string;
 	children?: React.ReactNode;
+	open?: boolean;
+	onOpenChange?: (open: boolean) => void;
 }
 
-export function AddOrganization({ organizationId }: Props) {
-	const [open, setOpen] = useState(false);
+export function AddOrganization({
+	organizationId,
+	open: controlledOpen,
+	onOpenChange: controlledOnOpenChange,
+}: Props) {
+	const [internalOpen, setInternalOpen] = useState(false);
+	const [uploadedFileName, setUploadedFileName] = useState<string | null>(null);
+	const [isUploading, setIsUploading] = useState(false);
+	const uploadCounter = useRef(0);
+	const isControlled = controlledOpen !== undefined;
+	const open = isControlled ? controlledOpen : internalOpen;
+	const setOpen = isControlled
+		? controlledOnOpenChange || (() => {})
+		: setInternalOpen;
 	const utils = api.useUtils();
 	const { data: organization } = api.organization.one.useQuery(
 		{
@@ -65,14 +83,18 @@ export function AddOrganization({ organizationId }: Props) {
 
 	useEffect(() => {
 		if (organization) {
+			uploadCounter.current++;
+			setIsUploading(false);
 			form.reset({
 				name: organization.name,
 				logo: organization.logo || "",
 			});
+			setUploadedFileName(null);
 		}
 	}, [organization, form]);
 
 	const onSubmit = async (values: OrganizationFormValues) => {
+		if (isUploading) return;
 		await mutateAsync({
 			name: values.name,
 			logo: values.logo,
@@ -80,6 +102,7 @@ export function AddOrganization({ organizationId }: Props) {
 		})
 			.then(() => {
 				form.reset();
+				setUploadedFileName(null);
 				toast.success(
 					`Organization ${organizationId ? "updated" : "created"} successfully`,
 				);
@@ -99,8 +122,94 @@ export function AddOrganization({ organizationId }: Props) {
 			});
 	};
 
+	const handleFileUpload = async (files: FileList | null) => {
+		if (!files || files.length === 0) return;
+		const file = files[0];
+		if (!file) return;
+
+		const currentUploadId = ++uploadCounter.current;
+		setIsUploading(true);
+
+		const allowedTypes = [
+			"image/jpeg",
+			"image/jpg",
+			"image/png",
+			"image/svg+xml",
+			"image/webp",
+		];
+		const fileExtension = file.name.split(".").pop()?.toLowerCase();
+		const allowedExtensions = ["jpg", "jpeg", "png", "svg", "webp"];
+
+		if (
+			!allowedTypes.includes(file.type) &&
+			!allowedExtensions.includes(fileExtension || "")
+		) {
+			toast.error("Only JPG, JPEG, PNG, WEBP, and SVG files are allowed");
+			setIsUploading(false);
+			return;
+		}
+
+		if (file.size > 2 * 1024 * 1024) {
+			toast.error("Image size must be less than 2MB");
+			setIsUploading(false);
+			return;
+		}
+
+		const isSvg = file.type === "image/svg+xml" || fileExtension === "svg";
+
+		if (isSvg) {
+			try {
+				const text = await file.text();
+				const sanitizedDataUrl = sanitizeSvg(text);
+				if (currentUploadId !== uploadCounter.current) return;
+				if (!sanitizedDataUrl) {
+					toast.error("Invalid SVG file");
+					return;
+				}
+				form.setValue("logo", sanitizedDataUrl);
+				form.trigger("logo");
+				setUploadedFileName(file.name);
+			} catch (error) {
+				if (currentUploadId === uploadCounter.current) {
+					toast.error("Error processing SVG");
+				}
+			} finally {
+				if (currentUploadId === uploadCounter.current) {
+					setIsUploading(false);
+				}
+			}
+			return;
+		}
+
+		// Resize raster images to max 256x256 and convert to WebP to save space
+		try {
+			const resizedDataUrl = await resizeImage(file, 256);
+			if (currentUploadId !== uploadCounter.current) return;
+			form.setValue("logo", resizedDataUrl);
+			form.trigger("logo");
+			setUploadedFileName(file.name);
+		} catch (error) {
+			if (currentUploadId === uploadCounter.current) {
+				toast.error("Error processing image");
+			}
+		} finally {
+			if (currentUploadId === uploadCounter.current) {
+				setIsUploading(false);
+			}
+		}
+	};
+
 	return (
-		<Dialog open={open} onOpenChange={setOpen}>
+		<Dialog
+			open={open}
+			onOpenChange={(val) => {
+				if (!val) {
+					uploadCounter.current++;
+					setIsUploading(false);
+				}
+				setOpen(val);
+			}}
+		>
 			<DialogTrigger asChild>
 				{organizationId ? (
 					<Button
@@ -162,23 +271,78 @@ export function AddOrganization({ organizationId }: Props) {
 						<FormField
 							control={form.control}
 							name="logo"
-							render={({ field }) => (
-								<FormItem className="gap-4">
-									<FormLabel className="text-right">Logo URL</FormLabel>
-									<FormControl>
-										<Input
-											placeholder="https://example.com/logo.png"
-											{...field}
-											value={field.value || ""}
-											className="col-span-3"
-										/>
-									</FormControl>
-									<FormMessage className="col-span-3 col-start-2" />
-								</FormItem>
-							)}
+							render={({ field }) => {
+								const isDataUrl = field.value?.startsWith("data:");
+								const displayValue = isDataUrl
+									? uploadedFileName || "Uploaded image"
+									: field.value || "";
+
+								return (
+									<FormItem className="gap-4">
+										<FormLabel className="text-right">
+											Logo URL or Upload
+										</FormLabel>
+										<FormControl>
+											<div className="col-span-3 flex flex-col gap-3">
+												<div className="flex items-center gap-3">
+													<div className="flex size-10 shrink-0 items-center justify-center rounded-md border bg-muted/50 p-1">
+														{field.value ? (
+															// biome-ignore lint/performance/noImgElement: user uploaded logo preview
+															<img
+																src={field.value}
+																alt="Logo preview"
+																className="size-full object-contain"
+															/>
+														) : (
+															<GlobeIcon className="size-5 text-muted-foreground" />
+														)}
+													</div>
+													<div className="relative flex-1">
+														<Input
+															placeholder="https://example.com/logo.png"
+															{...field}
+															value={displayValue}
+															readOnly={isDataUrl}
+															onChange={(e) => {
+																uploadCounter.current++;
+																setIsUploading(false);
+																field.onChange(e);
+																if (isDataUrl) setUploadedFileName(null);
+															}}
+															className="w-full pr-8"
+														/>
+														{field.value && (
+															<button
+																type="button"
+																onClick={() => {
+																	uploadCounter.current++;
+																	setIsUploading(false);
+																	form.setValue("logo", "");
+																	setUploadedFileName(null);
+																}}
+																className="absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground"
+															>
+																<X className="size-4" />
+															</button>
+														)}
+													</div>
+												</div>
+												<Dropzone
+													dropMessage="Drag & drop a logo or click to upload"
+													accept=".jpg,.jpeg,.png,.svg,.webp,image/jpeg,image/png,image/svg+xml,image/webp"
+													onChange={handleFileUpload}
+													classNameWrapper="border-2 border-dashed border-border hover:border-primary bg-muted/30 hover:bg-muted/50 transition-all rounded-lg"
+													classNameContent="h-32"
+												/>
+											</div>
+										</FormControl>
+										<FormMessage className="col-span-3 col-start-2" />
+									</FormItem>
+								);
+							}}
 						/>
 						<DialogFooter>
-							<Button type="submit" isLoading={isPending}>
+							<Button type="submit" isLoading={isPending || isUploading}>
 								{organizationId ? "Update organization" : "Create organization"}
 							</Button>
 						</DialogFooter>

apps/dokploy/components/dashboard/settings/servers/show-servers.tsx

@@ -115,10 +115,13 @@ export const ShowServers = () => {
 																className="relative hover:shadow-lg transition-shadow flex flex-col bg-transparent"
 															>
 																<CardHeader className="pb-3">
-																	<div className="flex items-start justify-between gap-2">
+																	<div className="flex items-start justify-between gap-2 min-w-0">
 																		<div className="flex min-w-0 items-center gap-2">
 																			<ServerIcon className="size-5 shrink-0 text-muted-foreground" />
-																			<CardTitle className="text-lg wrap-break-word min-w-0">
+																			<CardTitle
+																				className="text-lg truncate min-w-0"
+																				title={server.name}
+																			>
 																				{server.name}
 																			</CardTitle>
 																		</div>

apps/dokploy/components/layouts/side.tsx

@@ -616,7 +616,7 @@ function SidebarLogo() {
 					)}
 				>
 					{/* Organization Logo and Selector */}
-					<SidebarMenuItem className={"w-full"}>
+					<SidebarMenuItem className={"w-full min-w-0"}>
 						<Popover
 							open={organizationSelectorOpen}
 							onOpenChange={setOrganizationSelectorOpen}
@@ -632,14 +632,13 @@ function SidebarLogo() {
 								>
 									<div
 										className={cn(
-											"flex items-center gap-2",
+											"flex min-w-0 flex-1 items-center gap-2",
 											isCollapsed && "justify-center",
 										)}
 									>
 										<div
 											className={cn(
-												"flex items-center justify-center rounded-sm border",
-												"size-6",
+												"flex size-6 shrink-0 items-center justify-center rounded-sm border",
 											)}
 										>
 											<Logo
@@ -652,22 +651,24 @@ function SidebarLogo() {
 										</div>
 										<div
 											className={cn(
-												"flex flex-col items-start",
+												"flex flex-col items-start min-w-0 flex-1",
 												isCollapsed && "hidden",
 											)}
 										>
-											<div className="flex items-center gap-1.5">
-												<p className="text-sm font-medium leading-none">
+											<div className="flex items-center gap-1.5 min-w-0 w-full">
+												<p className="text-sm font-medium truncate">
 													{activeOrganization?.name ?? "Select Organization"}
 												</p>
 												{haveValidLicense && (
-													<Badge variant="blue">Enterprise</Badge>
+													<Badge variant="blue" className="shrink-0">
+														Enterprise
+													</Badge>
 												)}
 											</div>
 										</div>
 									</div>
 									<ChevronsUpDown
-										className={cn("ml-auto", isCollapsed && "hidden")}
+										className={cn("ml-auto shrink-0", isCollapsed && "hidden")}
 									/>
 								</SidebarMenuButton>
 							</PopoverTrigger>

apps/dokploy/components/proprietary/whitelabeling/whitelabeling-provider.tsx

@@ -1,39 +0,0 @@
-"use client";
-
-import Head from "next/head";
-import { useTheme } from "next-themes";
-import { api } from "@/utils/api";
-
-export function WhitelabelingProvider() {
-	const { resolvedTheme } = useTheme();
-	const { data: config } = api.whitelabeling.getPublic.useQuery(undefined, {
-		staleTime: 5 * 60 * 1000,
-		refetchOnWindowFocus: false,
-	});
-
-	const faviconHref =
-		config?.faviconUrl ??
-		(resolvedTheme === "dark"
-			? "/icon-dark.svg"
-			: resolvedTheme === "light"
-				? "/icon-light.svg"
-				: "/icon.svg");
-
-	return (
-		<>
-			<Head>
-				{config?.metaTitle && <title>{config.metaTitle}</title>}
-				<link rel="icon" href={faviconHref} key="app-favicon" />
-			</Head>
-
-			{config?.customCss && (
-				<style
-					id="whitelabeling-styles"
-					dangerouslySetInnerHTML={{
-						__html: config.customCss,
-					}}
-				/>
-			)}
-		</>
-	);
-}

apps/dokploy/components/ui/dropzone.tsx

@@ -10,13 +10,24 @@ interface DropzoneProps
 		"value" | "onChange"
 	> {
 	classNameWrapper?: string;
+	classNameContent?: string;
 	className?: string;
 	dropMessage: string;
 	onChange: (acceptedFiles: FileList | null) => void;
 }
 
 export const Dropzone = React.forwardRef<HTMLDivElement, DropzoneProps>(
-	({ className, classNameWrapper, dropMessage, onChange, ...props }, ref) => {
+	(
+		{
+			className,
+			classNameWrapper,
+			classNameContent,
+			dropMessage,
+			onChange,
+			...props
+		},
+		ref,
+	) => {
 		const inputRef = useRef<HTMLInputElement | null>(null);
 		// Function to handle drag over event
 		const handleDragOver = (e: React.DragEvent<HTMLDivElement>) => {
@@ -51,7 +62,10 @@ export const Dropzone = React.forwardRef<HTMLDivElement, DropzoneProps>(
 				)}
 			>
 				<CardContent
-					className="flex flex-col items-center justify-center space-y-2 px-2 py-4 text-xs h-96"
+					className={cn(
+						"flex flex-col items-center justify-center space-y-2 px-2 py-4 text-xs h-96",
+						classNameContent,
+					)}
 					onDragOver={handleDragOver}
 					onDrop={handleDrop}
 					onClick={handleButtonClick}

apps/dokploy/pages/_app.tsx

@@ -3,12 +3,10 @@ import "@/styles/globals.css";
 import type { NextPage } from "next";
 import type { AppProps } from "next/app";
 import { Inter } from "next/font/google";
-import Head from "next/head";
 import { ThemeProvider } from "next-themes";
 import NextTopLoader from "nextjs-toploader";
 import type { ReactElement, ReactNode } from "react";
 import { SearchCommand } from "@/components/dashboard/search-command";
-import { WhitelabelingProvider } from "@/components/proprietary/whitelabeling/whitelabeling-provider";
 import { Analytics } from "@/components/shared/analytics";
 import { Toaster } from "@/components/ui/sonner";
 import { TooltipProvider } from "@/components/ui/tooltip";
@@ -40,9 +38,6 @@ const MyApp = ({
 					}
 				`}
 			</style>
-			<Head>
-				<title>Dokploy</title>
-			</Head>
 			<TooltipProvider>
 				<ThemeProvider
 					attribute="class"
@@ -52,7 +47,6 @@ const MyApp = ({
 					forcedTheme={Component.theme}
 				>
 					<NextTopLoader color="hsl(var(--sidebar-ring))" />
-					<WhitelabelingProvider />
 					<Analytics />
 					<Toaster richColors />
 					<SearchCommand />

apps/dokploy/pages/_document.tsx

@@ -1,10 +1,39 @@
-import { Head, Html, Main, NextScript } from "next/document";
+import { getPublicWhitelabelingConfig } from "@dokploy/server";
+import NextDocument, {
+	type DocumentContext,
+	type DocumentInitialProps,
+	Head,
+	Html,
+	Main,
+	NextScript,
+} from "next/document";
 
-export default function Document() {
+interface WhitelabelingDocumentProps {
+	metaTitle: string | null;
+	faviconHref: string | null;
+	customCss: string | null;
+}
+
+export default function Document({
+	metaTitle,
+	faviconHref,
+	customCss,
+}: WhitelabelingDocumentProps) {
+	const title = metaTitle || "Dokploy";
 	return (
 		<Html lang="en" className="font-sans">
 			<Head>
-				<link rel="icon" href="/icon.svg" />
+				{/* Rendered on the server so the correct branding is present on first
+				    paint (and for social scrapers), avoiding a flash of / fallback to
+				    the default Dokploy branding. */}
+				<title>{title}</title>
+				<link rel="icon" href={faviconHref || "/icon.svg"} />
+				{customCss && (
+					<style
+						id="whitelabeling-styles"
+						dangerouslySetInnerHTML={{ __html: customCss }}
+					/>
+				)}
 			</Head>
 			<body className="flex h-full w-full flex-col font-sans">
 				<Main />
@@ -13,3 +42,67 @@ export default function Document() {
 		</Html>
 	);
 }
+
+const SETTINGS_CACHE_TTL = 60 * 1000; // 1 minute
+
+declare global {
+	var __SETTINGS_CACHE: {
+		data: {
+			metaTitle: string | null;
+			faviconHref: string | null;
+			customCss: string | null;
+		};
+		expiresAt: number;
+	} | null;
+}
+
+Document.getInitialProps = async (
+	ctx: DocumentContext,
+): Promise<DocumentInitialProps & WhitelabelingDocumentProps> => {
+	const initialProps = await NextDocument.getInitialProps(ctx);
+
+	let metaTitle: string | null = null;
+	let faviconHref: string | null = null;
+	let customCss: string | null = null;
+
+	if (
+		globalThis.__SETTINGS_CACHE &&
+		globalThis.__SETTINGS_CACHE.expiresAt > Date.now() &&
+		globalThis.__SETTINGS_CACHE.data
+	) {
+		return {
+			...initialProps,
+			...globalThis.__SETTINGS_CACHE.data,
+		};
+	}
+
+	try {
+		const config = await getPublicWhitelabelingConfig();
+		if (config) {
+			metaTitle = config.metaTitle;
+			// Remove any </style> tags to prevent XSS breakout
+			customCss = config.customCss
+				? config.customCss.replace(/<\/\s*style[^>]*>/gi, "")
+				: null;
+			faviconHref = config.faviconUrl || null;
+		}
+	} catch {
+		// Fall back to defaults if settings can't be read (e.g. DB not ready)
+	}
+
+	globalThis.__SETTINGS_CACHE = {
+		data: {
+			metaTitle,
+			faviconHref,
+			customCss,
+		},
+		expiresAt: Date.now() + SETTINGS_CACHE_TTL,
+	};
+
+	return {
+		...initialProps,
+		metaTitle,
+		faviconHref,
+		customCss,
+	};
+};

apps/dokploy/pages/index.tsx

@@ -5,6 +5,7 @@ import {
 } from "@dokploy/server";
 import { validateRequest } from "@dokploy/server/lib/auth";
 import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
+import { generateServerSideHelper } from "@/utils/create-server-helpers";
 import { REGEXP_ONLY_DIGITS } from "input-otp";
 import { Fingerprint } from "lucide-react";
 import type { GetServerSidePropsContext } from "next";
@@ -46,6 +47,7 @@ import {
 } from "@/components/ui/input-otp";
 import { Label } from "@/components/ui/label";
 import { authClient } from "@/lib/auth-client";
+import { appRouter } from "@/server/api/root";
 import { api } from "@/utils/api";
 import { useWhitelabelingPublic } from "@/utils/hooks/use-whitelabeling";
 
@@ -132,8 +134,7 @@ export default function Home({ IS_CLOUD, enforceSSO }: Props) {
 				return;
 			}
 
-			// @ts-ignore
-			if (data?.twoFactorRedirect as boolean) {
+			if (data && "twoFactorRedirect" in data && data.twoFactorRedirect) {
 				setTwoFactorCode("");
 				setIsTwoFactor(true);
 				toast.info("Please enter your 2FA code");
@@ -493,6 +494,11 @@ Home.getLayout = (page: ReactElement) => {
 	return <OnboardingLayout>{page}</OnboardingLayout>;
 };
 export async function getServerSideProps(context: GetServerSidePropsContext) {
+	const helpers = generateServerSideHelper(appRouter, context);
+	// Prefetch the public branding so the login/onboarding logo and app name
+	// render correctly on the server (no flash of default branding).
+	await helpers.whitelabeling.getPublic.prefetch();
+
 	if (IS_CLOUD) {
 		try {
 			const { user } = await validateRequest(context.req);
@@ -508,6 +514,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 
 		return {
 			props: {
+				trpcState: helpers.dehydrate(),
 				IS_CLOUD: IS_CLOUD,
 				enforceSSO: false,
 			},
@@ -539,6 +546,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 
 	return {
 		props: {
+			trpcState: helpers.dehydrate(),
 			hasAdmin,
 			enforceSSO: webServerSettings?.enforceSSO ?? false,
 		},

apps/dokploy/pages/invitation.tsx

@@ -1,5 +1,6 @@
 import { getUserByToken, IS_CLOUD } from "@dokploy/server";
 import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
+import { generateServerSideHelper } from "@/utils/create-server-helpers";
 import type { GetServerSidePropsContext } from "next";
 import Link from "next/link";
 import { useRouter } from "next/router";
@@ -23,6 +24,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { pushToDataLayer } from "@/lib/analytics";
 import { authClient } from "@/lib/auth-client";
+import { appRouter } from "@/server/api/root";
 import { api } from "@/utils/api";
 import { useWhitelabelingPublic } from "@/utils/hooks/use-whitelabeling";
 
@@ -330,6 +332,11 @@ Invitation.getLayout = (page: ReactElement) => {
 	return <OnboardingLayout>{page}</OnboardingLayout>;
 };
 export async function getServerSideProps(ctx: GetServerSidePropsContext) {
+	const helpers = generateServerSideHelper(appRouter, ctx);
+	// Prefetch the public branding so the invitation logo and app name render
+	// correctly on the server (no flash of default branding).
+	await helpers.whitelabeling.getPublic.prefetch();
+
 	const { query } = ctx;
 
 	const token = query.token;
@@ -358,6 +365,7 @@ export async function getServerSideProps(ctx: GetServerSidePropsContext) {
 		if (invitation.userAlreadyExists) {
 			return {
 				props: {
+					trpcState: helpers.dehydrate(),
 					isCloud: IS_CLOUD,
 					token: token,
 					invitation: invitation,
@@ -377,6 +385,7 @@ export async function getServerSideProps(ctx: GetServerSidePropsContext) {
 
 		return {
 			props: {
+				trpcState: helpers.dehydrate(),
 				isCloud: IS_CLOUD,
 				token: token,
 				invitation: invitation,

apps/dokploy/pages/register.tsx

@@ -1,5 +1,6 @@
 import { IS_CLOUD, isAdminPresent, validateRequest } from "@dokploy/server";
 import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
+import { generateServerSideHelper } from "@/utils/create-server-helpers";
 import { AlertTriangle } from "lucide-react";
 import type { GetServerSidePropsContext } from "next";
 import Link from "next/link";
@@ -27,6 +28,7 @@ import {
 import { Input } from "@/components/ui/input";
 import { pushToDataLayer } from "@/lib/analytics";
 import { authClient } from "@/lib/auth-client";
+import { appRouter } from "@/server/api/root";
 import { useWhitelabelingPublic } from "@/utils/hooks/use-whitelabeling";
 
 const registerSchema = z
@@ -305,6 +307,11 @@ Register.getLayout = (page: ReactElement) => {
 	);
 };
 export async function getServerSideProps(context: GetServerSidePropsContext) {
+	const helpers = generateServerSideHelper(appRouter, context);
+	// Prefetch the public branding so the onboarding logo and app name render
+	// correctly on the server (no flash of default branding).
+	await helpers.whitelabeling.getPublic.prefetch();
+
 	if (IS_CLOUD) {
 		const { user } = await validateRequest(context.req);
 
@@ -318,6 +325,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 		}
 		return {
 			props: {
+				trpcState: helpers.dehydrate(),
 				isCloud: true,
 			},
 		};
@@ -334,6 +342,7 @@ export async function getServerSideProps(context: GetServerSidePropsContext) {
 	}
 	return {
 		props: {
+			trpcState: helpers.dehydrate(),
 			isCloud: false,
 		},
 	};

apps/dokploy/pages/send-reset-password.tsx

@@ -1,5 +1,6 @@
 import { IS_CLOUD } from "@dokploy/server";
 import { standardSchemaResolver as zodResolver } from "@hookform/resolvers/standard-schema";
+import { generateServerSideHelper } from "@/utils/create-server-helpers";
 import type { GetServerSidePropsContext } from "next";
 import Link from "next/link";
 import { useRouter } from "next/router";
@@ -22,6 +23,7 @@ import {
 } from "@/components/ui/form";
 import { Input } from "@/components/ui/input";
 import { authClient } from "@/lib/auth-client";
+import { appRouter } from "@/server/api/root";
 import { useWhitelabelingPublic } from "@/utils/hooks/use-whitelabeling";
 
 const loginSchema = z.object({
@@ -165,7 +167,7 @@ export default function Home() {
 Home.getLayout = (page: ReactElement) => {
 	return <OnboardingLayout>{page}</OnboardingLayout>;
 };
-export async function getServerSideProps(_context: GetServerSidePropsContext) {
+export async function getServerSideProps(context: GetServerSidePropsContext) {
 	if (!IS_CLOUD) {
 		return {
 			redirect: {
@@ -175,7 +177,14 @@ export async function getServerSideProps(_context: GetServerSidePropsContext) {
 		};
 	}
 
+	const helpers = generateServerSideHelper(appRouter, context);
+	// Prefetch the public branding so the logo and app name render
+	// correctly on the server (no flash of default branding).
+	await helpers.whitelabeling.getPublic.prefetch();
+
 	return {
-		props: {},
+		props: {
+			trpcState: helpers.dehydrate(),
+		},
 	};
 }

apps/dokploy/server/api/routers/proprietary/whitelabeling.ts

@@ -14,6 +14,11 @@ import {
 	publicProcedure,
 } from "../../trpc";
 
+/** Invalidate the SSR branding caches in _document.tsx so the next request picks up fresh settings. */
+function clearBrandingSSRCache() {
+	globalThis.__SETTINGS_CACHE = null;
+}
+
 export const whitelabelingRouter = createTRPCRouter({
 	get: protectedProcedure.query(async ({ ctx }) => {
 		if (IS_CLOUD) {
@@ -47,6 +52,9 @@ export const whitelabelingRouter = createTRPCRouter({
 				whitelabelingConfig: input.whitelabelingConfig,
 			});
 
+			// Clear the cache so Next.js SSR applies changes immediately
+			clearBrandingSSRCache();
+
 			return { success: true };
 		}),
 
@@ -82,6 +90,9 @@ export const whitelabelingRouter = createTRPCRouter({
 			},
 		});
 
+		// Clear the cache so Next.js SSR applies changes immediately
+		clearBrandingSSRCache();
+
 		return { success: true };
 	}),
 

apps/dokploy/utils/create-server-helpers.ts

@@ -0,0 +1,21 @@
+import { createServerSideHelpers } from "@trpc/react-query/server";
+import type { GetServerSidePropsContext } from "next";
+import superjson from "superjson";
+import type { AppRouter } from "@/server/api/root";
+
+export const generateServerSideHelper = (
+	router: AppRouter,
+	context: GetServerSidePropsContext<any>,
+) => {
+	return createServerSideHelpers({
+		router,
+		ctx: {
+			req: context.req as any,
+			res: context.res as any,
+			db: null as any,
+			session: null as any,
+			user: null as any,
+		},
+		transformer: superjson,
+	});
+};

apps/dokploy/utils/image-processing.ts

@@ -0,0 +1,37 @@
+export const resizeImage = (file: File, maxSize: number): Promise<string> => {
+	return new Promise((resolve, reject) => {
+		const reader = new FileReader();
+		reader.onload = (event) => {
+			const img = new Image();
+			img.onload = () => {
+				let { width, height } = img;
+
+				if (width > maxSize || height > maxSize) {
+					if (width > height) {
+						height = Math.round((height * maxSize) / width);
+						width = maxSize;
+					} else {
+						width = Math.round((width * maxSize) / height);
+						height = maxSize;
+					}
+				}
+
+				const canvas = document.createElement("canvas");
+				canvas.width = width;
+				canvas.height = height;
+				const ctx = canvas.getContext("2d");
+				if (!ctx) {
+					resolve(event.target?.result as string);
+					return;
+				}
+
+				ctx.drawImage(img, 0, 0, width, height);
+				resolve(canvas.toDataURL("image/webp", 0.8));
+			};
+			img.onerror = reject;
+			img.src = event.target?.result as string;
+		};
+		reader.onerror = reject;
+		reader.readAsDataURL(file);
+	});
+};

apps/dokploy/utils/sanitize-svg.ts

@@ -0,0 +1,18 @@
+import DOMPurify from "dompurify";
+
+export const sanitizeSvg = (svgContent: string): string | null => {
+	const clean = DOMPurify.sanitize(svgContent, {
+		USE_PROFILES: { svg: true, svgFilters: true },
+	});
+
+	if (!clean) return null;
+
+	// Fix unicode base64 bug (TextEncoder byte-loop handles non-Latin1 chars)
+	const bytes = new TextEncoder().encode(clean);
+	let binString = "";
+	for (let i = 0; i < bytes.length; i++) {
+		binString += String.fromCharCode(bytes[i]!);
+	}
+
+	return `data:image/svg+xml;base64,${btoa(binString)}`;
+};

packages/server/package.json

@@ -66,7 +66,7 @@
     "drizzle-zod": "0.5.1",
     "lodash": "4.17.21",
     "micromatch": "4.0.8",
-    "nanoid": "3.3.11",
+    "nanoid": "3.3.18",
     "node-os-utils": "2.0.1",
     "node-pty": "1.1.0",
     "node-schedule": "2.1.1",

packages/server/src/utils/builders/docker-file.ts

@@ -26,9 +26,20 @@ export const getDockerCommand = (application: ApplicationNested) => {
 	try {
 		const image = `${appName}`;
 
-		const dockerContextPath = getDockerContextPath(application);
+		const defaultContextPath =
+			dockerFilePath.substring(0, dockerFilePath.lastIndexOf("/") + 1) || ".";
 
-		const commandArgs = ["build", "-t", image, "-f", dockerFilePath, "."];
+		const dockerContextPath =
+			getDockerContextPath(application) || defaultContextPath;
+
+		const commandArgs = [
+			"build",
+			"-t",
+			image,
+			"-f",
+			dockerFilePath,
+			dockerContextPath,
+		];
 
 		if (dockerBuildStage) {
 			commandArgs.push("--target", dockerBuildStage);

packages/server/src/utils/filesystem/directory.ts

@@ -138,10 +138,9 @@ export const getDockerContextPath = (application: Application) => {
 	const { APPLICATIONS_PATH } = paths(!!application.serverId);
 	const { appName, dockerContextPath } = application;
 
-	return path.join(
-		APPLICATIONS_PATH,
-		appName,
-		"code",
-		dockerContextPath || ".",
-	);
+	if (!dockerContextPath) {
+		return null;
+	}
+
+	return path.join(APPLICATIONS_PATH, appName, "code", dockerContextPath);
 };

packages/server/src/utils/process/execAsync.ts

@@ -165,8 +165,6 @@ export const execAsyncRemote = async (
 	let stderr = "";
 	return new Promise((resolve, reject) => {
 		const conn = new Client();
-
-		sleep(1000);
 		conn
 			.once("ready", () => {
 				conn.exec(command, (err, stream) => {

pnpm-lock.yaml

@@ -679,8 +679,8 @@ importers:
         specifier: 4.0.8
         version: 4.0.8
       nanoid:
-        specifier: 3.3.11
-        version: 3.3.11
+        specifier: 3.3.18
+        version: 3.3.18
       node-os-utils:
         specifier: 2.0.1
         version: 2.0.1
@@ -7186,11 +7186,6 @@ packages:
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
     hasBin: true
 
-  nanoid@3.3.12:
-    resolution: {integrity: sha512-ZB9RH/39qpq5Vu6Y+NmUaFhQR6pp+M2Xt76XBnEwDaGcVAqhlvxrl3B2bKS5D3NH3QR76v3aSrKaF/Kiy7lEtQ==}
-    engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
-    hasBin: true
-
   nanoid@3.3.18:
     resolution: {integrity: sha512-DTg4MJbGMWkfi6VZFdNt2/caMbQy4Ou+Op/hJQvGEWcnVfoA1QA+xzRKAzw9jD6+GVOOeYr/mIcuDSdug6F6+w==}
     engines: {node: ^10 || ^12 || ^13.7 || ^14 || >=15.0.1}
@@ -16295,8 +16290,6 @@ snapshots:
 
   nanoid@3.3.11: {}
 
-  nanoid@3.3.12: {}
-
   nanoid@3.3.18: {}
 
   nanostores@1.1.1: {}
@@ -16777,7 +16770,7 @@ snapshots:
 
   postcss@8.5.15:
     dependencies:
-      nanoid: 3.3.12
+      nanoid: 3.3.18
       picocolors: 1.1.1
       source-map-js: 1.2.1