mirror of
https://github.com/Dokploy/dokploy
synced 2025-06-26 18:27:59 +00:00
refactor: update
This commit is contained in:
@@ -49,12 +49,12 @@ interface AdditionalPort {
|
|||||||
/**
|
/**
|
||||||
* ManageTraefikPorts is a component that provides a modal interface for managing
|
* ManageTraefikPorts is a component that provides a modal interface for managing
|
||||||
* additional port mappings for Traefik in a Docker Swarm environment.
|
* additional port mappings for Traefik in a Docker Swarm environment.
|
||||||
*
|
*
|
||||||
* Features:
|
* Features:
|
||||||
* - Add, remove, and edit port mappings
|
* - Add, remove, and edit port mappings
|
||||||
* - Configure target port, published port, and publish mode for each mapping
|
* - Configure target port, published port, and publish mode for each mapping
|
||||||
* - Persist port configurations through API calls
|
* - Persist port configurations through API calls
|
||||||
*
|
*
|
||||||
* @component
|
* @component
|
||||||
* @example
|
* @example
|
||||||
* ```tsx
|
* ```tsx
|
||||||
@@ -121,7 +121,10 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
|
|||||||
</DialogHeader>
|
</DialogHeader>
|
||||||
<div className="grid gap-4 py-4">
|
<div className="grid gap-4 py-4">
|
||||||
{additionalPorts.map((port, index) => (
|
{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">
|
<div className="space-y-2">
|
||||||
<Label htmlFor={`target-port-${index}`}>
|
<Label htmlFor={`target-port-${index}`}>
|
||||||
{t("settings.server.webServer.traefik.targetPort")}
|
{t("settings.server.webServer.traefik.targetPort")}
|
||||||
@@ -132,7 +135,9 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
|
|||||||
value={port.targetPort}
|
value={port.targetPort}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const newPorts = [...additionalPorts];
|
const newPorts = [...additionalPorts];
|
||||||
newPorts[index].targetPort = Number.parseInt(
|
|
||||||
|
// @ts-ignore
|
||||||
|
newPorts?.[index].targetPort = Number.parseInt(
|
||||||
e.target.value,
|
e.target.value,
|
||||||
);
|
);
|
||||||
setAdditionalPorts(newPorts);
|
setAdditionalPorts(newPorts);
|
||||||
@@ -150,7 +155,8 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
|
|||||||
value={port.publishedPort}
|
value={port.publishedPort}
|
||||||
onChange={(e) => {
|
onChange={(e) => {
|
||||||
const newPorts = [...additionalPorts];
|
const newPorts = [...additionalPorts];
|
||||||
newPorts[index].publishedPort = Number.parseInt(
|
// @ts-ignore
|
||||||
|
newPorts?.[index].publishedPort = Number.parseInt(
|
||||||
e.target.value,
|
e.target.value,
|
||||||
);
|
);
|
||||||
setAdditionalPorts(newPorts);
|
setAdditionalPorts(newPorts);
|
||||||
@@ -166,11 +172,15 @@ export const ManageTraefikPorts = ({ children, serverId }: Props) => {
|
|||||||
value={port.publishMode}
|
value={port.publishMode}
|
||||||
onValueChange={(value: "ingress" | "host") => {
|
onValueChange={(value: "ingress" | "host") => {
|
||||||
const newPorts = [...additionalPorts];
|
const newPorts = [...additionalPorts];
|
||||||
newPorts[index].publishMode = value;
|
// @ts-ignore
|
||||||
|
newPorts?.[index].publishMode = value;
|
||||||
setAdditionalPorts(newPorts);
|
setAdditionalPorts(newPorts);
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<SelectTrigger id={`publish-mode-${index}`} className="w-full">
|
<SelectTrigger
|
||||||
|
id={`publish-mode-${index}`}
|
||||||
|
className="w-full"
|
||||||
|
>
|
||||||
<SelectValue />
|
<SelectValue />
|
||||||
</SelectTrigger>
|
</SelectTrigger>
|
||||||
<SelectContent>
|
<SelectContent>
|
||||||
|
|||||||
Reference in New Issue
Block a user