feat: add remote logs error when is not reachable

apps/dokploy/components/dashboard/compose/deployments/show-deployment-compose.tsx

@@ -17,12 +17,14 @@ interface Props {
 	serverId?: string;
 	open: boolean;
 	onClose: () => void;
+	errorMessage?: string;
 }
 export const ShowDeploymentCompose = ({
 	logPath,
 	open,
 	onClose,
 	serverId,
+	errorMessage,
 }: Props) => {
 	const [data, setData] = useState("");
 	const [filteredLogs, setFilteredLogs] = useState<LogLine[]>([]);
@@ -105,6 +107,8 @@ export const ShowDeploymentCompose = ({
 		}
 	}, [filteredLogs, autoScroll]);
 
+	const optionalErrors = parseLogs(errorMessage || "");
+
 	return (
 		<Dialog
 			open={open}
@@ -161,9 +165,17 @@ export const ShowDeploymentCompose = ({
 							<TerminalLine key={index} log={log} noTimestamp />
 						))
 					) : (
-						<div className="flex justify-center items-center h-full text-muted-foreground">
-							<Loader2 className="h-6 w-6 animate-spin" />
-						</div>
+						<>
+							{optionalErrors.length > 0 ? (
+								optionalErrors.map((log: LogLine, index: number) => (
+									<TerminalLine key={`extra-${index}`} log={log} noTimestamp />
+								))
+							) : (
+								<div className="flex justify-center items-center h-full text-muted-foreground">
+									<Loader2 className="h-6 w-6 animate-spin" />
+								</div>
+							)}
+						</>
 					)}
 				</div>
 			</DialogContent>

apps/dokploy/components/dashboard/compose/deployments/show-deployments-compose.tsx

@@ -8,7 +8,7 @@ import {
 	CardHeader,
 	CardTitle,
 } from "@/components/ui/card";
-import { api } from "@/utils/api";
+import { api, type RouterOutputs } from "@/utils/api";
 import { RocketIcon } from "lucide-react";
 import React, { useEffect, useState } from "react";
 import { CancelQueuesCompose } from "./cancel-queues-compose";
@@ -19,7 +19,9 @@ interface Props {
 	composeId: string;
 }
 export const ShowDeploymentsCompose = ({ composeId }: Props) => {
-	const [activeLog, setActiveLog] = useState<string | null>(null);
+	const [activeLog, setActiveLog] = useState<
+		RouterOutputs["deployment"]["all"][number] | null
+	>(null);
 	const { data } = api.compose.one.useQuery({ composeId });
 	const { data: deployments } = api.deployment.allByCompose.useQuery(
 		{ composeId },
@@ -100,7 +102,7 @@ export const ShowDeploymentsCompose = ({ composeId }: Props) => {
 
 									<Button
 										onClick={() => {
-											setActiveLog(deployment.logPath);
+											setActiveLog(deployment);
 										}}
 									>
 										View
@@ -112,9 +114,10 @@ export const ShowDeploymentsCompose = ({ composeId }: Props) => {
 				)}
 				<ShowDeploymentCompose
 					serverId={data?.serverId || ""}
-					open={activeLog !== null}
+					open={Boolean(activeLog && activeLog.logPath !== null)}
 					onClose={() => setActiveLog(null)}
-					logPath={activeLog}
+					logPath={activeLog?.logPath || ""}
+					errorMessage={activeLog?.errorMessage || ""}
 				/>
 			</CardContent>
 		</Card>