From b2661e453355982f1516568c2bef40a1d8a7a45e Mon Sep 17 00:00:00 2001
From: Mauricio Siu <47042324+Siumauricio@users.noreply.github.com>
Date: Sat, 21 Dec 2024 14:58:58 -0600
Subject: [PATCH] refactor: update

---
 .../web-server/manage-traefik-ports.tsx       | 24 +++++++++++++------
 1 file changed, 17 insertions(+), 7 deletions(-)

diff --git a/apps/dokploy/components/dashboard/settings/web-server/manage-traefik-ports.tsx b/apps/dokploy/components/dashboard/settings/web-server/manage-traefik-ports.tsx
index aa9741ce..9641165d 100644
--- a/apps/dokploy/components/dashboard/settings/web-server/manage-traefik-ports.tsx
+++ b/apps/dokploy/components/dashboard/settings/web-server/manage-traefik-ports.tsx
@@ -49,12 +49,12 @@ interface AdditionalPort {
 /**
  * ManageTraefikPorts is a component that provides a modal interface for managing
  * additional port mappings for Traefik in a Docker Swarm environment.
- * 
+ *
  * Features:
  * - Add, remove, and edit port mappings
  * - Configure target port, published port, and publish mode for each mapping
  * - Persist port configurations through API calls
- * 
+ *
  * @component
  * @example
  * ```tsx
@@ -121,7 +121,10 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 					</DialogHeader>
 					<div className="grid gap-4 py-4">
 						{additionalPorts.map((port, index) => (
-							<div key={index} className="grid grid-cols-[120px_120px_minmax(120px,1fr)_80px] gap-4 items-end">
+							<div
+								key={index}
+								className="grid grid-cols-[120px_120px_minmax(120px,1fr)_80px] gap-4 items-end"
+							>
 								<div className="space-y-2">
 									<Label htmlFor={`target-port-${index}`}>
 										{t("settings.server.webServer.traefik.targetPort")}
@@ -132,7 +135,9 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 										value={port.targetPort}
 										onChange={(e) => {
 											const newPorts = [...additionalPorts];
-											newPorts[index].targetPort = Number.parseInt(
+
+											// @ts-ignore
+											newPorts?.[index].targetPort = Number.parseInt(
 												e.target.value,
 											);
 											setAdditionalPorts(newPorts);
@@ -150,7 +155,8 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 										value={port.publishedPort}
 										onChange={(e) => {
 											const newPorts = [...additionalPorts];
-											newPorts[index].publishedPort = Number.parseInt(
+											// @ts-ignore
+											newPorts?.[index].publishedPort = Number.parseInt(
 												e.target.value,
 											);
 											setAdditionalPorts(newPorts);
@@ -166,11 +172,15 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
 										value={port.publishMode}
 										onValueChange={(value: "ingress" | "host") => {
 											const newPorts = [...additionalPorts];
-											newPorts[index].publishMode = value;
+											// @ts-ignore
+											newPorts?.[index].publishMode = value;
 											setAdditionalPorts(newPorts);
 										}}
 									>
-										<SelectTrigger id={`publish-mode-${index}`} className="w-full">
+										<SelectTrigger
+											id={`publish-mode-${index}`}
+											className="w-full"
+										>
 											<SelectValue />
 										</SelectTrigger>
 										<SelectContent>