fix(ui): prevent error message overflow in S3 Destinations modal

apps/dokploy/components/dashboard/settings/destination/handle-destinations.tsx

@@ -217,7 +217,7 @@ export const HandleDestinations = ({ destinationId }: Props) => {
 					</DialogDescription>
 				</DialogHeader>
 				{(isError || isErrorConnection) && (
-					<AlertBlock type="error" className="break-words">
+					<AlertBlock type="error" className="w-full">
 						{connectionError?.message || error?.message}
 					</AlertBlock>
 				)}

apps/dokploy/components/shared/alert-block.tsx

@@ -39,13 +39,19 @@ export function AlertBlock({
 		<div
 			{...props}
 			className={cn(
-				"flex items-center flex-row gap-4 rounded-lg p-2",
+				"flex items-start flex-row gap-4 rounded-lg p-2",
 				iconClassName,
 				className,
 			)}
 		>
-			{icon || <Icon className="text-current" />}
-			<span className="text-sm text-current">{children}</span>
+			<div className="flex-shrink-0 mt-0.5">
+				{icon || <Icon className="text-current" />}
+			</div>
+			<div className="flex-1 min-w-0">
+				<span className="text-sm text-current break-words overflow-wrap-anywhere whitespace-pre-wrap">
+					{children}
+				</span>
+			</div>
 		</div>
 	);
 }