fix: preserve selected log container on refetch

apps/dokploy/__test__/logs/container-selection.test.ts

@@ -0,0 +1,41 @@
+import { describe, expect, it } from "vitest";
+import { resolveContainerSelection } from "@/components/dashboard/application/logs/container-selection";
+
+const containers = [
+	{ containerId: "first-container" },
+	{ containerId: "selected-container" },
+];
+
+describe("resolveContainerSelection", () => {
+	it("selects the first container when no container is selected", () => {
+		expect(resolveContainerSelection(undefined, containers)).toBe(
+			"first-container",
+		);
+	});
+
+	it("preserves a manual selection when refreshed data contains it", () => {
+		const refreshedContainers = containers.map((container) => ({
+			...container,
+		}));
+
+		expect(
+			resolveContainerSelection("selected-container", refreshedContainers),
+		).toBe("selected-container");
+	});
+
+	it("falls back to the first container when the selection disappears", () => {
+		expect(resolveContainerSelection("removed-container", containers)).toBe(
+			"first-container",
+		);
+	});
+
+	it("keeps the current selection while container data is loading", () => {
+		expect(resolveContainerSelection("selected-container", undefined)).toBe(
+			"selected-container",
+		);
+	});
+
+	it("clears the selection when no containers are available", () => {
+		expect(resolveContainerSelection("selected-container", [])).toBeUndefined();
+	});
+});

apps/dokploy/components/dashboard/application/logs/container-selection.ts

@@ -0,0 +1,21 @@
+interface ContainerOption {
+	containerId: string;
+}
+
+export const resolveContainerSelection = (
+	currentContainerId: string | undefined,
+	containers: readonly ContainerOption[] | undefined,
+) => {
+	if (!containers) {
+		return currentContainerId;
+	}
+
+	if (
+		currentContainerId &&
+		containers.some(({ containerId }) => containerId === currentContainerId)
+	) {
+		return currentContainerId;
+	}
+
+	return containers[0]?.containerId;
+};

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

@@ -21,6 +21,7 @@ import {
 } from "@/components/ui/select";
 import { Switch } from "@/components/ui/switch";
 import { api } from "@/utils/api";
+import { resolveContainerSelection } from "./container-selection";
 export const DockerLogs = dynamic(
 	() =>
 		import("@/components/dashboard/docker/logs/docker-logs-id").then(
@@ -79,17 +80,13 @@ export const ShowDockerLogs = ({ appName, serverId, serviceId }: Props) => {
 			},
 		);
 
+	const availableContainers = option === "native" ? containers : services;
+
 	useEffect(() => {
-		if (option === "native") {
+		setContainerId((currentContainerId) =>
-			if (containers && containers?.length > 0) {
+			resolveContainerSelection(currentContainerId, availableContainers),
-				setContainerId(containers[0]?.containerId);
+		);
-			}
+	}, [availableContainers]);
-		} else {
-			if (services && services?.length > 0) {
-				setContainerId(services[0]?.containerId);
-			}
-		}
-	}, [option, services, containers]);
 
 	const isLoading = option === "native" ? containersLoading : servicesLoading;
 	const containersLength =
@@ -114,6 +111,7 @@ export const ShowDockerLogs = ({ appName, serverId, serviceId }: Props) => {
 						<Switch
 							checked={option === "native"}
 							onCheckedChange={(checked) => {
+								setContainerId(undefined);
 								setOption(checked ? "native" : "swarm");
 							}}
 						/>