Merge pull request #414 from SashaGoncharov19/canary

feat: added restart button for containers

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

@@ -1,3 +1,4 @@
+import { Button } from "@/components/ui/button";
 import {
 	Card,
 	CardContent,
@@ -17,6 +18,7 @@ import {
 } from "@/components/ui/select";
 import { api } from "@/utils/api";
 import { useEffect, useState } from "react";
+import { toast } from "sonner";
 import { DockerMonitoring } from "../../monitoring/docker/show";
 
 interface Props {
@@ -42,9 +44,15 @@ export const ShowMonitoringCompose = ({
 		string | undefined
 	>();
 
+	const [containerId, setContainerId] = useState<string | undefined>();
+
+	const { mutateAsync: restart, isLoading } =
+		api.docker.restartContainer.useMutation();
+
 	useEffect(() => {
 		if (data && data?.length > 0) {
 			setContainerAppName(data[0]?.name);
+			setContainerId(data[0]?.containerId);
 		}
 	}, [data]);
 
@@ -57,7 +65,17 @@ export const ShowMonitoringCompose = ({
 				</CardHeader>
 				<CardContent className="flex flex-col gap-4">
 					<Label>Select a container to watch the monitoring</Label>
-					<Select onValueChange={setContainerAppName} value={containerAppName}>
+					<div className="flex flex-row gap-4">
+						<Select
+							onValueChange={(value) => {
+								setContainerAppName(value);
+								setContainerId(
+									data?.find((container) => container.name === value)
+										?.containerId,
+								);
+							}}
+							value={containerAppName}
+						>
 							<SelectTrigger>
 								<SelectValue placeholder="Select a container" />
 							</SelectTrigger>
@@ -68,13 +86,27 @@ export const ShowMonitoringCompose = ({
 											key={container.containerId}
 											value={container.name}
 										>
-										{container.name} ({container.containerId}) {container.state}
+											{container.name} ({container.containerId}){" "}
+											{container.state}
 										</SelectItem>
 									))}
 									<SelectLabel>Containers ({data?.length})</SelectLabel>
 								</SelectGroup>
 							</SelectContent>
 						</Select>
+						<Button
+							isLoading={isLoading}
+							onClick={async () => {
+								if (!containerId) return;
+								toast.success(`Restarting container ${containerAppName}`);
+								await restart({ containerId }).then(() => {
+									toast.success("Container restarted");
+								});
+							}}
+						>
+							Restart
+						</Button>
+					</div>
 					<DockerMonitoring
 						appName={containerAppName || ""}
 						appType={appType}

apps/dokploy/server/api/routers/docker.ts

@@ -1,5 +1,6 @@
 import { z } from "zod";
 import {
+	containerRestart,
 	getConfig,
 	getContainers,
 	getContainersByAppLabel,
@@ -12,6 +13,16 @@ export const dockerRouter = createTRPCRouter({
 		return await getContainers();
 	}),
 
+	restartContainer: protectedProcedure
+		.input(
+			z.object({
+				containerId: z.string().min(1),
+			}),
+		)
+		.mutation(async ({ input }) => {
+			return await containerRestart(input.containerId);
+		}),
+
 	getConfig: protectedProcedure
 		.input(
 			z.object({

apps/dokploy/server/api/services/docker.ts

@@ -150,3 +150,20 @@ export const getContainersByAppLabel = async (appName: string) => {
 
 	return [];
 };
+
+export const containerRestart = async (containerId: string) => {
+	try {
+		const { stdout, stderr } = await execAsync(
+			`docker container restart ${containerId}`,
+		);
+
+		if (stderr) {
+			console.error(`Error: ${stderr}`);
+			return;
+		}
+
+		const config = JSON.parse(stdout);
+
+		return config;
+	} catch (error) {}
+};