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

Remove problematic CSS classes from:
- Application deployment modals
- Docker logs modals
- Swarm application dialogs

Fixes infinite render loops with tall content.
This commit is contained in:
Jhon
2025-07-13 12:14:49 -03:00
parent 257c0eb106
commit c7344190b4
7 changed files with 8 additions and 8 deletions

View File

@@ -124,7 +124,7 @@ export const ShowDeployment = ({
}
}}
>
<DialogContent className={"sm:max-w-5xl overflow-y-auto max-h-screen"}>
<DialogContent className={"sm:max-w-5xl"}>
<DialogHeader>
<DialogTitle>Deployment</DialogTitle>
<DialogDescription className="flex items-center gap-2">
@@ -158,7 +158,7 @@ export const ShowDeployment = ({
<div
ref={scrollRef}
onScroll={handleScroll}
className="h-[720px] overflow-y-auto space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
className="h-[720px] space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
>
{" "}
{filteredLogs.length > 0 ? (

View File

@@ -50,7 +50,7 @@ export const ShowDeploymentsModal = ({
</Button>
)}
</DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-5xl p-0">
<DialogContent className="sm:max-w-5xl p-0">
<ShowDeployments
id={id}
type={type}

View File

@@ -274,7 +274,7 @@ export const DockerLogsId: React.FC<Props> = ({
<div
ref={scrollRef}
onScroll={handleScroll}
className="h-[720px] overflow-y-auto space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
className="h-[720px] space-y-0 border p-4 bg-[#fafafa] dark:bg-[#050506] rounded custom-logs-scrollbar"
>
{filteredLogs.length > 0 ? (
filteredLogs.map((filteredLog: LogLine, index: number) => (

View File

@@ -138,7 +138,7 @@ export function LineCountFilter({
}}
/>
</div>
<CommandPrimitive.List className="max-h-[300px] overflow-y-auto overflow-x-hidden">
<CommandPrimitive.List className="max-h-[300px] overflow-x-hidden">
<CommandPrimitive.Group className="px-2 py-1.5">
{lineCountOptions.map((option) => {
const isSelected = value === option.value;

View File

@@ -40,7 +40,7 @@ export const ShowDockerModalLogs = ({
{children}
</DropdownMenuItem>
</DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-7xl">
<DialogContent className=" sm:max-w-7xl">
<DialogHeader>
<DialogTitle>View Logs</DialogTitle>
<DialogDescription>View the logs for {containerId}</DialogDescription>

View File

@@ -40,7 +40,7 @@ export const ShowDockerModalStackLogs = ({
{children}
</DropdownMenuItem>
</DialogTrigger>
<DialogContent className="max-h-screen overflow-y-auto sm:max-w-7xl">
<DialogContent className=" sm:max-w-7xl">
<DialogHeader>
<DialogTitle>View Logs</DialogTitle>
<DialogDescription>View the logs for {containerId}</DialogDescription>

View File

@@ -87,7 +87,7 @@ export const ShowNodeApplications = ({ serverId }: Props) => {
Services
</Button>
</DialogTrigger>
<DialogContent className={"sm:max-w-10xl overflow-y-auto max-h-screen"}>
<DialogContent className={"sm:max-w-10xl"}>
<DialogHeader>
<DialogTitle>Node Applications</DialogTitle>
<DialogDescription>