From 86b56e2597745d8bc8edbccee73f958c8fdfd426 Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Sun, 4 May 2025 20:14:49 -0600
Subject: [PATCH 1/2] Refactor appName generation in dashboard components

- Updated the appName generation logic in `AddApplication`, `AddCompose`, and `AddDatabase` components to use the `slugify` function for improved consistency and readability.
- Enhanced the `slugify` function to return a default value of "service" if the input is empty, ensuring robustness in name generation.
- Improved project name validation in `handle-project.tsx` to enforce stricter rules on naming conventions.
---
 .../dashboard/project/add-application.tsx     |  6 ++----
 .../dashboard/project/add-compose.tsx         |  6 ++----
 .../dashboard/project/add-database.tsx        |  7 +++----
 .../dashboard/projects/handle-project.tsx     | 21 ++++++++++++++-----
 apps/dokploy/lib/slug.ts                      |  2 +-
 5 files changed, 24 insertions(+), 18 deletions(-)

diff --git a/apps/dokploy/components/dashboard/project/add-application.tsx b/apps/dokploy/components/dashboard/project/add-application.tsx
index 16c56917..c93de251 100644
--- a/apps/dokploy/components/dashboard/project/add-application.tsx
+++ b/apps/dokploy/components/dashboard/project/add-application.tsx
@@ -145,10 +145,8 @@ export const AddApplication = ({ projectId, projectName }: Props) => {
 											{...field}
 											onChange={(e) => {
 												const val = e.target.value?.trim() || "";
-												form.setValue(
-													"appName",
-													`${slug}-${val.toLowerCase().replaceAll(" ", "-")}`,
-												);
+												const serviceName = slugify(val);
+												form.setValue("appName", `${slug}-${serviceName}`);
 												field.onChange(val);
 											}}
 										/>
diff --git a/apps/dokploy/components/dashboard/project/add-compose.tsx b/apps/dokploy/components/dashboard/project/add-compose.tsx
index ea8690a8..5f2bb137 100644
--- a/apps/dokploy/components/dashboard/project/add-compose.tsx
+++ b/apps/dokploy/components/dashboard/project/add-compose.tsx
@@ -152,10 +152,8 @@ export const AddCompose = ({ projectId, projectName }: Props) => {
 												{...field}
 												onChange={(e) => {
 													const val = e.target.value?.trim() || "";
-													form.setValue(
-														"appName",
-														`${slug}-${val.toLowerCase()}`,
-													);
+													const serviceName = slugify(val);
+													form.setValue("appName", `${slug}-${serviceName}`);
 													field.onChange(val);
 												}}
 											/>
diff --git a/apps/dokploy/components/dashboard/project/add-database.tsx b/apps/dokploy/components/dashboard/project/add-database.tsx
index a58aef2c..79f7bb75 100644
--- a/apps/dokploy/components/dashboard/project/add-database.tsx
+++ b/apps/dokploy/components/dashboard/project/add-database.tsx
@@ -363,10 +363,9 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
 													{...field}
 													onChange={(e) => {
 														const val = e.target.value?.trim() || "";
-														form.setValue(
-															"appName",
-															`${slug}-${val.toLowerCase()}`,
-														);
+														const serviceName = slugify(val);
+														console.log(serviceName);
+														form.setValue("appName", `${slug}-${serviceName}`);
 														field.onChange(val);
 													}}
 												/>
diff --git a/apps/dokploy/components/dashboard/projects/handle-project.tsx b/apps/dokploy/components/dashboard/projects/handle-project.tsx
index dcb81241..ddc1303e 100644
--- a/apps/dokploy/components/dashboard/projects/handle-project.tsx
+++ b/apps/dokploy/components/dashboard/projects/handle-project.tsx
@@ -33,12 +33,23 @@ import { z } from "zod";
 const AddProjectSchema = z.object({
 	name: z
 		.string()
-		.min(1, {
-			message: "Name is required",
-		})
-		.regex(/^[a-zA-Z]/, {
+		.min(1, "Project name is required")
+		.refine(
+			(name) => {
+				const trimmedName = name.trim();
+				const validNameRegex =
+					/^[\p{L}\p{N}_-][\p{L}\p{N}\s_-]*[\p{L}\p{N}_-]$/u;
+				return validNameRegex.test(trimmedName);
+			},
+			{
+				message:
+					"Project name must start and end with a letter, number, hyphen or underscore. Spaces are allowed in between.",
+			},
+		)
+		.refine((name) => !/^\d/.test(name.trim()), {
 			message: "Project name cannot start with a number",
-		}),
+		})
+		.transform((name) => name.trim()),
 	description: z.string().optional(),
 });
 
diff --git a/apps/dokploy/lib/slug.ts b/apps/dokploy/lib/slug.ts
index a4982a0e..858bd62c 100644
--- a/apps/dokploy/lib/slug.ts
+++ b/apps/dokploy/lib/slug.ts
@@ -5,7 +5,7 @@ export const slugify = (text: string | undefined) => {
 		return "";
 	}
 
-	const cleanedText = text.trim().replace(/[^a-zA-Z0-9\s]/g, "");
+	const cleanedText = text.trim().replace(/[^a-zA-Z0-9\s]/g, "") || "service";
 
 	return slug(cleanedText, {
 		lower: true,

From c110fae96585a8e462fe7e037659bfa684482c77 Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Sun, 4 May 2025 20:15:17 -0600
Subject: [PATCH 2/2] Remove console log from appName generation in AddDatabase
 component

---
 apps/dokploy/components/dashboard/project/add-database.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/apps/dokploy/components/dashboard/project/add-database.tsx b/apps/dokploy/components/dashboard/project/add-database.tsx
index 79f7bb75..2420e603 100644
--- a/apps/dokploy/components/dashboard/project/add-database.tsx
+++ b/apps/dokploy/components/dashboard/project/add-database.tsx
@@ -364,7 +364,6 @@ export const AddDatabase = ({ projectId, projectName }: Props) => {
 													onChange={(e) => {
 														const val = e.target.value?.trim() || "";
 														const serviceName = slugify(val);
-														console.log(serviceName);
 														form.setValue("appName", `${slug}-${serviceName}`);
 														field.onChange(val);
 													}}