From e88a9ce96f0a37512fe70761e9cf6a0ab90be58c Mon Sep 17 00:00:00 2001
From: Mauricio Siu <siumauricio@hotmail.com>
Date: Fri, 21 Nov 2025 11:58:23 -0500
Subject: [PATCH] fix: update input handling in application components

- Modified the onChange event for input fields in AddApplication, AddCompose, and AddDatabase components to ensure proper trimming of whitespace from the input value before slugification.
---
 apps/dokploy/components/dashboard/project/add-application.tsx | 4 ++--
 apps/dokploy/components/dashboard/project/add-compose.tsx     | 4 ++--
 apps/dokploy/components/dashboard/project/add-database.tsx    | 4 ++--
 3 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/apps/dokploy/components/dashboard/project/add-application.tsx b/apps/dokploy/components/dashboard/project/add-application.tsx
index 079701eb8..b0db46681 100644
--- a/apps/dokploy/components/dashboard/project/add-application.tsx
+++ b/apps/dokploy/components/dashboard/project/add-application.tsx
@@ -150,8 +150,8 @@ export const AddApplication = ({ environmentId, projectName }: Props) => {
 											placeholder="Frontend"
 											{...field}
 											onChange={(e) => {
-												const val = e.target.value?.trim() || "";
-												const serviceName = slugify(val);
+												const val = e.target.value || "";
+												const serviceName = slugify(val.trim());
 												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 a187104ec..bb911373f 100644
--- a/apps/dokploy/components/dashboard/project/add-compose.tsx
+++ b/apps/dokploy/components/dashboard/project/add-compose.tsx
@@ -161,8 +161,8 @@ export const AddCompose = ({ environmentId, projectName }: Props) => {
 												placeholder="Frontend"
 												{...field}
 												onChange={(e) => {
-													const val = e.target.value?.trim() || "";
-													const serviceName = slugify(val);
+													const val = e.target.value || "";
+													const serviceName = slugify(val.trim());
 													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 c0600a2d9..3176b9589 100644
--- a/apps/dokploy/components/dashboard/project/add-database.tsx
+++ b/apps/dokploy/components/dashboard/project/add-database.tsx
@@ -395,8 +395,8 @@ export const AddDatabase = ({ environmentId, projectName }: Props) => {
 													placeholder="Name"
 													{...field}
 													onChange={(e) => {
-														const val = e.target.value?.trim() || "";
-														const serviceName = slugify(val);
+														const val = e.target.value || "";
+														const serviceName = slugify(val.trim());
 														form.setValue("appName", `${slug}-${serviceName}`);
 														field.onChange(val);
 													}}