fix(ui): remove max-h-screen and overflow-y-auto from advanced settings dialogs

Remove problematic CSS classes from advanced application dialogs:
- Cluster and swarm settings
- Port configuration
- Security settings
- Traefik configuration
- Volume management
- Redirect configuration

Prevents tab hangs with overflow content.
This commit is contained in:
Jhon
2025-07-13 12:15:36 -03:00
parent 81040c899f
commit d78974efc0
9 changed files with 9 additions and 9 deletions

View File

@@ -270,7 +270,7 @@ export const AddSwarmSettings = ({ applicationId }: Props) => {
Swarm Settings Swarm Settings
</Button> </Button>
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-[85vh] overflow-y-auto sm:max-w-5xl p-0"> <DialogContent className="max-h-[85vh] sm:max-w-5xl p-0">
<DialogHeader className="p-6"> <DialogHeader className="p-6">
<DialogTitle>Swarm Settings</DialogTitle> <DialogTitle>Swarm Settings</DialogTitle>
<DialogDescription> <DialogDescription>

View File

@@ -185,7 +185,7 @@ export const ShowImport = ({ composeId }: Props) => {
</Button> </Button>
</div> </div>
<Dialog open={showModal} onOpenChange={setShowModal}> <Dialog open={showModal} onOpenChange={setShowModal}>
<DialogContent className="max-h-[80vh] max-w-[50vw] overflow-y-auto"> <DialogContent className="max-h-[80vh] max-w-[50vw]">
<DialogHeader> <DialogHeader>
<DialogTitle className="text-2xl font-bold"> <DialogTitle className="text-2xl font-bold">
Template Information Template Information

View File

@@ -124,7 +124,7 @@ export const HandlePorts = ({
<Button>{children}</Button> <Button>{children}</Button>
)} )}
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg"> <DialogContent className=" sm:max-w-lg">
<DialogHeader> <DialogHeader>
<DialogTitle>Ports</DialogTitle> <DialogTitle>Ports</DialogTitle>
<DialogDescription> <DialogDescription>

View File

@@ -179,7 +179,7 @@ export const HandleRedirect = ({
<Button>{children}</Button> <Button>{children}</Button>
)} )}
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg"> <DialogContent className="sm:max-w-lg">
<DialogHeader> <DialogHeader>
<DialogTitle>Redirects</DialogTitle> <DialogTitle>Redirects</DialogTitle>
<DialogDescription> <DialogDescription>

View File

@@ -114,7 +114,7 @@ export const HandleSecurity = ({
<Button>{children}</Button> <Button>{children}</Button>
)} )}
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-lg"> <DialogContent className=" sm:max-w-lg">
<DialogHeader> <DialogHeader>
<DialogTitle>Security</DialogTitle> <DialogTitle>Security</DialogTitle>
<DialogDescription> <DialogDescription>

View File

@@ -48,7 +48,7 @@ export const ShowTraefikConfig = ({ applicationId }: Props) => {
</div> </div>
) : ( ) : (
<div className="flex flex-col pt-2 relative"> <div className="flex flex-col pt-2 relative">
<div className="flex flex-col gap-6 max-h-[35rem] min-h-[10rem] overflow-y-auto"> <div className="flex flex-col gap-6 max-h-[35rem] min-h-[10rem]">
<CodeEditor <CodeEditor
lineWrapping lineWrapping
value={data || "Empty"} value={data || "Empty"}

View File

@@ -122,7 +122,7 @@ export const UpdateTraefikConfig = ({ applicationId }: Props) => {
<DialogTrigger asChild> <DialogTrigger asChild>
<Button isLoading={isLoading}>Modify</Button> <Button isLoading={isLoading}>Modify</Button>
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-4xl"> <DialogContent className=" sm:max-w-4xl">
<DialogHeader> <DialogHeader>
<DialogTitle>Update traefik config</DialogTitle> <DialogTitle>Update traefik config</DialogTitle>
<DialogDescription>Update the traefik config</DialogDescription> <DialogDescription>Update the traefik config</DialogDescription>

View File

@@ -151,7 +151,7 @@ export const AddVolumes = ({
<DialogTrigger className="" asChild> <DialogTrigger className="" asChild>
<Button>{children}</Button> <Button>{children}</Button>
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-3xl"> <DialogContent className=" sm:max-w-3xl">
<DialogHeader> <DialogHeader>
<DialogTitle>Volumes / Mounts</DialogTitle> <DialogTitle>Volumes / Mounts</DialogTitle>
</DialogHeader> </DialogHeader>

View File

@@ -186,7 +186,7 @@ export const UpdateVolume = ({
<PenBoxIcon className="size-3.5 text-primary group-hover:text-blue-500" /> <PenBoxIcon className="size-3.5 text-primary group-hover:text-blue-500" />
</Button> </Button>
</DialogTrigger> </DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-3xl"> <DialogContent className=" sm:max-w-3xl">
<DialogHeader> <DialogHeader>
<DialogTitle>Update</DialogTitle> <DialogTitle>Update</DialogTitle>
<DialogDescription>Update the mount</DialogDescription> <DialogDescription>Update the mount</DialogDescription>