Merge pull request #3010 from Dokploy/Improve-project-view-by-showing-last-deploy-rather-than-created

feat: add last deployment date to services and update sorting logic

Author: Siumauricio

apps/dokploy/pages/dashboard/project/[projectId]/environment/[environmentId].tsx

@@ -115,6 +115,7 @@ export type Services = {
 	id: string;
 	createdAt: string;
 	status?: "idle" | "running" | "done" | "error";
+	lastDeployDate?: Date | null;
 };
 
 type Project = Awaited<ReturnType<typeof findProjectById>>;
@@ -128,16 +129,34 @@ export const extractServicesFromEnvironment = (
 	const allServices: Services[] = [];
 
 	const applications: Services[] =
-		environment.applications?.map((item) => ({
-			appName: item.appName,
-			name: item.name,
-			type: "application",
-			id: item.applicationId,
-			createdAt: item.createdAt,
-			status: item.applicationStatus,
-			description: item.description,
-			serverId: item.serverId,
-		})) || [];
+		environment.applications?.map((item) => {
+			// Get the most recent deployment date
+			let lastDeployDate: Date | null = null;
+			const deployments = (item as any).deployments;
+			if (deployments && deployments.length > 0) {
+				for (const deployment of deployments) {
+					const deployDate = new Date(
+						deployment.finishedAt ||
+							deployment.startedAt ||
+							deployment.createdAt,
+					);
+					if (!lastDeployDate || deployDate > lastDeployDate) {
+						lastDeployDate = deployDate;
+					}
+				}
+			}
+			return {
+				appName: item.appName,
+				name: item.name,
+				type: "application",
+				id: item.applicationId,
+				createdAt: item.createdAt,
+				status: item.applicationStatus,
+				description: item.description,
+				serverId: item.serverId,
+				lastDeployDate,
+			};
+		}) || [];
 
 	const mariadb: Services[] =
 		environment.mariadb?.map((item) => ({
@@ -200,16 +219,34 @@ export const extractServicesFromEnvironment = (
 		})) || [];
 
 	const compose: Services[] =
-		environment.compose?.map((item) => ({
-			appName: item.appName,
-			name: item.name,
-			type: "compose",
-			id: item.composeId,
-			createdAt: item.createdAt,
-			status: item.composeStatus,
-			description: item.description,
-			serverId: item.serverId,
-		})) || [];
+		environment.compose?.map((item) => {
+			// Get the most recent deployment date
+			let lastDeployDate: Date | null = null;
+			const deployments = (item as any).deployments;
+			if (deployments && deployments.length > 0) {
+				for (const deployment of deployments) {
+					const deployDate = new Date(
+						deployment.finishedAt ||
+							deployment.startedAt ||
+							deployment.createdAt,
+					);
+					if (!lastDeployDate || deployDate > lastDeployDate) {
+						lastDeployDate = deployDate;
+					}
+				}
+			}
+			return {
+				appName: item.appName,
+				name: item.name,
+				type: "compose",
+				id: item.composeId,
+				createdAt: item.createdAt,
+				status: item.composeStatus,
+				description: item.description,
+				serverId: item.serverId,
+				lastDeployDate,
+			};
+		}) || [];
 
 	allServices.push(
 		...applications,
@@ -237,9 +274,9 @@ const EnvironmentPage = (
 	const { data: auth } = api.user.get.useQuery();
 	const [sortBy, setSortBy] = useState<string>(() => {
 		if (typeof window !== "undefined") {
-			return localStorage.getItem("servicesSort") || "createdAt-desc";
+			return localStorage.getItem("servicesSort") || "lastDeploy-desc";
 		}
-		return "createdAt-desc";
+		return "lastDeploy-desc";
 	});
 
 	useEffect(() => {
@@ -261,10 +298,45 @@ const EnvironmentPage = (
 					comparison =
 						new Date(a.createdAt).getTime() - new Date(b.createdAt).getTime();
 					break;
+				case "lastDeploy": {
+					const aLastDeploy = a.lastDeployDate;
+					const bLastDeploy = b.lastDeployDate;
+
+					if (direction === "desc") {
+						// For "desc" (newest first): services with deployments first, then those without
+						if (!aLastDeploy && !bLastDeploy) {
+							comparison = 0;
+						} else if (!aLastDeploy) {
+							comparison = 1; // a (no deploy) goes after b (has deploy)
+						} else if (!bLastDeploy) {
+							comparison = -1; // a (has deploy) goes before b (no deploy)
+						} else {
+							// Both have deployments: newest first (negative if a is newer)
+							comparison = bLastDeploy.getTime() - aLastDeploy.getTime();
+						}
+					} else {
+						// For "asc" (oldest first): services with deployments first, then those without
+						if (!aLastDeploy && !bLastDeploy) {
+							comparison = 0;
+						} else if (!aLastDeploy) {
+							comparison = 1; // a (no deploy) goes after b (has deploy)
+						} else if (!bLastDeploy) {
+							comparison = -1; // a (has deploy) goes before b (no deploy)
+						} else {
+							// Both have deployments: oldest first
+							comparison = aLastDeploy.getTime() - bLastDeploy.getTime();
+						}
+					}
+					break;
+				}
 				default:
 					comparison = 0;
 			}
-			return direction === "asc" ? comparison : -comparison;
+			// For other fields, apply direction normally
+			if (field !== "lastDeploy") {
+				return direction === "asc" ? comparison : -comparison;
+			}
+			return comparison;
 		});
 	};
 
@@ -1217,6 +1289,9 @@ const EnvironmentPage = (
 												<SelectValue placeholder="Sort by..." />
 											</SelectTrigger>
 											<SelectContent>
+												<SelectItem value="lastDeploy-desc">
+													Recently deployed
+												</SelectItem>
 												<SelectItem value="createdAt-desc">
 													Newest first
 												</SelectItem>

packages/server/src/services/environment.ts

@@ -34,13 +34,21 @@ export const findEnvironmentById = async (environmentId: string) => {
 	const environment = await db.query.environments.findFirst({
 		where: eq(environments.environmentId, environmentId),
 		with: {
-			applications: true,
+			applications: {
+				with: {
+					deployments: true,
+				},
+			},
 			mariadb: true,
 			mongo: true,
 			mysql: true,
 			postgres: true,
 			redis: true,
-			compose: true,
+			compose: {
+				with: {
+					deployments: true,
+				},
+			},
 			project: true,
 		},
 	});