From 64a449a09d0ed8f753111e0cdf8c6588b6404bb0 Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Wed, 25 Dec 2024 03:45:21 -0600
Subject: [PATCH] refactor: add swarm improvements

---
 .../logs/show-docker-modal-stack-logs.tsx     | 58 +++++++++++++++++++
 .../dashboard/swarm/applications/columns.tsx  | 41 ++++++++++++-
 .../swarm/applications/show-applications.tsx  |  1 +
 packages/server/src/services/docker.ts        |  2 -
 4 files changed, 99 insertions(+), 3 deletions(-)
 create mode 100644 apps/dokploy/components/dashboard/docker/logs/show-docker-modal-stack-logs.tsx

diff --git a/apps/dokploy/components/dashboard/docker/logs/show-docker-modal-stack-logs.tsx b/apps/dokploy/components/dashboard/docker/logs/show-docker-modal-stack-logs.tsx
new file mode 100644
index 00000000..36719bb0
--- /dev/null
+++ b/apps/dokploy/components/dashboard/docker/logs/show-docker-modal-stack-logs.tsx
@@ -0,0 +1,58 @@
+import {
+	Dialog,
+	DialogContent,
+	DialogDescription,
+	DialogHeader,
+	DialogTitle,
+	DialogTrigger,
+} from "@/components/ui/dialog";
+import { DropdownMenuItem } from "@/components/ui/dropdown-menu";
+import dynamic from "next/dynamic";
+import type React from "react";
+export const DockerLogsId = dynamic(
+	() =>
+		import("@/components/dashboard/docker/logs/docker-logs-id").then(
+			(e) => e.DockerLogsId,
+		),
+	{
+		ssr: false,
+	},
+);
+
+interface Props {
+	containerId: string;
+	children?: React.ReactNode;
+	serverId?: string | null;
+}
+
+export const ShowDockerModalStackLogs = ({
+	containerId,
+	children,
+	serverId,
+}: Props) => {
+	return (
+		<Dialog>
+			<DialogTrigger asChild>
+				<DropdownMenuItem
+					className="w-full cursor-pointer space-x-3"
+					onSelect={(e) => e.preventDefault()}
+				>
+					{children}
+				</DropdownMenuItem>
+			</DialogTrigger>
+			<DialogContent className="max-h-screen  overflow-y-auto sm:max-w-7xl">
+				<DialogHeader>
+					<DialogTitle>View Logs</DialogTitle>
+					<DialogDescription>View the logs for {containerId}</DialogDescription>
+				</DialogHeader>
+				<div className="flex flex-col gap-4 pt-2.5">
+					<DockerLogsId
+						containerId={containerId || ""}
+						serverId={serverId}
+						runType="swarm"
+					/>
+				</div>
+			</DialogContent>
+		</Dialog>
+	);
+};
diff --git a/apps/dokploy/components/dashboard/swarm/applications/columns.tsx b/apps/dokploy/components/dashboard/swarm/applications/columns.tsx
index 362cb29b..69ccc41d 100644
--- a/apps/dokploy/components/dashboard/swarm/applications/columns.tsx
+++ b/apps/dokploy/components/dashboard/swarm/applications/columns.tsx
@@ -1,9 +1,17 @@
 import type { ColumnDef } from "@tanstack/react-table";
-import { ArrowUpDown } from "lucide-react";
+import { ArrowUpDown, MoreHorizontal } from "lucide-react";
 import * as React from "react";
 
 import { Button } from "@/components/ui/button";
+import {
+	DropdownMenu,
+	DropdownMenuContent,
+	DropdownMenuLabel,
+	DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
+
 import { Badge } from "@/components/ui/badge";
+import { ShowDockerModalStackLogs } from "../../docker/logs/show-docker-modal-stack-logs";
 
 export interface ApplicationList {
 	ID: string;
@@ -16,6 +24,7 @@ export interface ApplicationList {
 	DesiredState: string;
 	Error: string;
 	Node: string;
+	serverId: string;
 }
 
 export const columns: ColumnDef<ApplicationList>[] = [
@@ -203,4 +212,34 @@ export const columns: ColumnDef<ApplicationList>[] = [
 			return <div className="w-[10rem]">{row.getValue("Errors")}</div>;
 		},
 	},
+	{
+		accessorKey: "Logs",
+		accessorFn: (row) => row.Error,
+		header: ({ column }) => {
+			return <span>Logs</span>;
+		},
+		cell: ({ row }) => {
+			return (
+				<span className="w-[10rem]">
+					<DropdownMenu>
+						<DropdownMenuTrigger asChild>
+							<Button variant="ghost" className="h-8 w-8 p-0">
+								<span className="sr-only">Open menu</span>
+								<MoreHorizontal className="h-4 w-4" />
+							</Button>
+						</DropdownMenuTrigger>
+						<DropdownMenuContent align="end">
+							<DropdownMenuLabel>Actions</DropdownMenuLabel>
+							<ShowDockerModalStackLogs
+								containerId={row.original.ID}
+								serverId={row.original.serverId}
+							>
+								View Logs
+							</ShowDockerModalStackLogs>
+						</DropdownMenuContent>
+					</DropdownMenu>
+				</span>
+			);
+		},
+	},
 ];
diff --git a/apps/dokploy/components/dashboard/swarm/applications/show-applications.tsx b/apps/dokploy/components/dashboard/swarm/applications/show-applications.tsx
index 132cb008..df764225 100644
--- a/apps/dokploy/components/dashboard/swarm/applications/show-applications.tsx
+++ b/apps/dokploy/components/dashboard/swarm/applications/show-applications.tsx
@@ -89,6 +89,7 @@ export const ShowNodeApplications = ({ serverId }: Props) => {
 			Error: detail.Error,
 			Node: detail.Node,
 			Ports: detail.Ports || app.Ports,
+			serverId: serverId || "",
 		}));
 	});
 
diff --git a/packages/server/src/services/docker.ts b/packages/server/src/services/docker.ts
index 8835835d..9a40893e 100644
--- a/packages/server/src/services/docker.ts
+++ b/packages/server/src/services/docker.ts
@@ -460,8 +460,6 @@ export const getApplicationInfo = async (
 			.split("\n")
 			.map((line) => JSON.parse(line));
 
-		console.log(appArray);
-
 		return appArray;
 	} catch (error) {}
 };