From f13028ee70d724ea44c14c795afbe16a51e77c75 Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Sun, 21 Sep 2025 01:07:25 -0600
Subject: [PATCH] fix: handle optional configFiles in template details and
 improve mapping safety

---
 .../dashboard/project/ai/step-three.tsx       |  2 +-
 .../dashboard/project/ai/step-two.tsx         | 33 ++-------
 .../project/ai/template-generator.tsx         |  2 +-
 packages/server/src/services/ai.ts            | 71 +++++++++++++------
 4 files changed, 60 insertions(+), 48 deletions(-)

diff --git a/apps/dokploy/components/dashboard/project/ai/step-three.tsx b/apps/dokploy/components/dashboard/project/ai/step-three.tsx
index 188cd5257..bf074f3bd 100644
--- a/apps/dokploy/components/dashboard/project/ai/step-three.tsx
+++ b/apps/dokploy/components/dashboard/project/ai/step-three.tsx
@@ -88,7 +88,7 @@ export const StepThree = ({ templateInfo }: StepProps) => {
 						<div>
 							<h3 className="text-sm font-semibold">Configuration Files</h3>
 							<ul className="list-disc pl-5">
-								{templateInfo?.details?.configFiles.map((file, index) => (
+								{templateInfo?.details?.configFiles?.map((file, index) => (
 									<li key={index}>
 										<strong className="text-sm font-semibold">
 											{file.filePath}
diff --git a/apps/dokploy/components/dashboard/project/ai/step-two.tsx b/apps/dokploy/components/dashboard/project/ai/step-two.tsx
index e76e8ff76..57a00a72d 100644
--- a/apps/dokploy/components/dashboard/project/ai/step-two.tsx
+++ b/apps/dokploy/components/dashboard/project/ai/step-two.tsx
@@ -1,5 +1,5 @@
-import { Bot, Eye, EyeOff, PlusCircle, Trash2 } from "lucide-react";
-import { useEffect, useState } from "react";
+import { Bot, PlusCircle, Trash2 } from "lucide-react";
+import { useEffect } from "react";
 import ReactMarkdown from "react-markdown";
 import { toast } from "sonner";
 import { AlertBlock } from "@/components/shared/alert-block";
@@ -27,7 +27,6 @@ export interface StepProps {
 export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 	const suggestions = templateInfo.suggestions || [];
 	const selectedVariant = templateInfo.details;
-	const [showValues, setShowValues] = useState<Record<string, boolean>>({});
 
 	const { mutateAsync, isLoading, error, isError } =
 		api.ai.suggest.useMutation();
@@ -44,7 +43,7 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 			.then((data) => {
 				setTemplateInfo({
 					...templateInfo,
-					suggestions: data,
+					suggestions: data || [],
 				});
 			})
 			.catch((error) => {
@@ -54,10 +53,6 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 			});
 	}, [templateInfo.userInput]);
 
-	const toggleShowValue = (name: string) => {
-		setShowValues((prev) => ({ ...prev, [name]: !prev[name] }));
-	};
-
 	const handleEnvVariableChange = (
 		index: number,
 		field: "name" | "value",
@@ -310,9 +305,7 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 															/>
 															<div className="flex-1 relative">
 																<Input
-																	type={
-																		showValues[env.name] ? "text" : "password"
-																	}
+																	type={"password"}
 																	value={env.value}
 																	onChange={(e) =>
 																		handleEnvVariableChange(
@@ -323,19 +316,6 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 																	}
 																	placeholder="Variable Value"
 																/>
-																<Button
-																	type="button"
-																	variant="ghost"
-																	size="icon"
-																	className="absolute right-2 top-1/2 transform -translate-y-1/2"
-																	onClick={() => toggleShowValue(env.name)}
-																>
-																	{showValues[env.name] ? (
-																		<EyeOff className="h-4 w-4" />
-																	) : (
-																		<Eye className="h-4 w-4" />
-																	)}
-																</Button>
 															</div>
 															<Button
 																type="button"
@@ -437,13 +417,14 @@ export const StepTwo = ({ templateInfo, setTemplateInfo }: StepProps) => {
 										<AccordionContent>
 											<ScrollArea className="w-full rounded-md border">
 												<div className="p-4 space-y-4">
-													{selectedVariant?.configFiles?.length > 0 ? (
+													{selectedVariant?.configFiles?.length &&
+													selectedVariant?.configFiles?.length > 0 ? (
 														<>
 															<div className="text-sm text-muted-foreground mb-4">
 																This template requires the following
 																configuration files to be mounted:
 															</div>
-															{selectedVariant.configFiles.map(
+															{selectedVariant?.configFiles?.map(
 																(config, index) => (
 																	<div
 																		key={index}
diff --git a/apps/dokploy/components/dashboard/project/ai/template-generator.tsx b/apps/dokploy/components/dashboard/project/ai/template-generator.tsx
index 1356b846b..76a491aa0 100644
--- a/apps/dokploy/components/dashboard/project/ai/template-generator.tsx
+++ b/apps/dokploy/components/dashboard/project/ai/template-generator.tsx
@@ -47,7 +47,7 @@ interface Details {
 	envVariables: EnvVariable[];
 	shortDescription: string;
 	domains: Domain[];
-	configFiles: Mount[];
+	configFiles?: Mount[];
 }
 
 interface Mount {
diff --git a/packages/server/src/services/ai.ts b/packages/server/src/services/ai.ts
index 61c448397..7056f1547 100644
--- a/packages/server/src/services/ai.ts
+++ b/packages/server/src/services/ai.ts
@@ -92,31 +92,48 @@ export const suggestVariants = async ({
 
 		const { object } = await generateObject({
 			model,
-			output: "array",
+			output: "object",
 			schema: z.object({
-				id: z.string(),
-				name: z.string(),
-				shortDescription: z.string(),
-				description: z.string(),
+				suggestions: z.array(
+					z.object({
+						id: z.string(),
+						name: z.string(),
+						shortDescription: z.string(),
+						description: z.string(),
+					}),
+				),
 			}),
 			prompt: `
-        Act as advanced DevOps engineer and generate a list of open source projects what can cover users needs(up to 3 items), the suggestion 
-        should include id, name, shortDescription, and description. Use slug of title for id. 
+        Act as advanced DevOps engineer and generate a list of open source projects what can cover users needs(up to 3 items).
+        
+        Return your response as a JSON object with the following structure:
+        {
+          "suggestions": [
+            {
+              "id": "project-slug",
+              "name": "Project Name",
+              "shortDescription": "Brief one-line description",
+              "description": "Detailed description"
+            }
+          ]
+        }
         
         Important rules for the response:
-        1. The description field should ONLY contain a plain text description of the project, its features, and use cases
-        2. Do NOT include any code snippets, configuration examples, or installation instructions in the description
-        3. The shortDescription should be a single-line summary focusing on the main technologies
+        1. Use slug format for the id field (lowercase, hyphenated)
+        2. The description field should ONLY contain a plain text description of the project, its features, and use cases
+        3. Do NOT include any code snippets, configuration examples, or installation instructions in the description
+        4. The shortDescription should be a single-line summary focusing on the main technologies
+        5. All projects should be installable in docker and have docker compose support
         
-        User wants to create a new project with the following details, it should be installable in docker and can be docker compose generated for it:
+        User wants to create a new project with the following details:
         
         ${input}
       `,
 		});
 
-		if (object?.length) {
+		if (object?.suggestions?.length) {
 			const result = [];
-			for (const suggestion of object) {
+			for (const suggestion of object.suggestions) {
 				try {
 					const { object: docker } = await generateObject({
 						model,
@@ -136,16 +153,29 @@ export const suggestVariants = async ({
 									serviceName: z.string(),
 								}),
 							),
-							configFiles: z.array(
-								z.object({
-									content: z.string(),
-									filePath: z.string(),
-								}),
-							),
+							configFiles: z
+								.array(
+									z.object({
+										content: z.string(),
+										filePath: z.string(),
+									}),
+								)
+								.optional(),
 						}),
 						prompt: `
               Act as advanced DevOps engineer and generate docker compose with environment variables and domain configurations needed to install the following project.
-              Return the docker compose as a YAML string and environment variables configuration. Follow these rules:
+              
+              Return your response as a JSON object with this structure:
+              {
+                "dockerCompose": "yaml string here",
+                "envVariables": [{"name": "VAR_NAME", "value": "example_value"}],
+                "domains": [{"host": "domain.com", "port": 3000, "serviceName": "service"}],
+                "configFiles": [{"content": "file content", "filePath": "path/to/file"}]
+              }
+              
+              Note: configFiles is optional - only include it if configuration files are absolutely required.
+              
+              Follow these rules:
 
               Docker Compose Rules:
               1. Use placeholder like \${VARIABLE_NAME-default} for generated variables in the docker-compose.yml
@@ -198,6 +228,7 @@ export const suggestVariants = async ({
 					console.error("Error in docker compose generation:", error);
 				}
 			}
+
 			return result;
 		}