From 5c856d55c4ed55032949a642fea26047a630d930 Mon Sep 17 00:00:00 2001
From: trafficlunar <trafficlunar@proton.me>
Date: Sat, 28 Dec 2024 16:34:22 +0000
Subject: [PATCH] fix: change aspect ratio calculations (again)

---
 src/components/dialogs/OpenImage.tsx | 20 ++++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/dialogs/OpenImage.tsx b/src/components/dialogs/OpenImage.tsx
index 9753eb1..9f3af12 100644
--- a/src/components/dialogs/OpenImage.tsx
+++ b/src/components/dialogs/OpenImage.tsx
@@ -37,11 +37,17 @@ function OpenImage({ close }: DialogProps) {
 		}
 	}, [acceptedFiles]);
 
-	const onDimensionChange = (e: React.ChangeEvent<HTMLInputElement>) => {
+	const onDimensionChange = (e: React.ChangeEvent<HTMLInputElement>, isWidth: boolean) => {
 		const newDimension = Number(e.target.value);
 		if (newDimension < 1 || newDimension > 10000) return;
 
-		setImageDimensions(() => ({ width: newDimension, height: Math.round(newDimension / aspectRatio) }));
+		setImageDimensions(() => {
+			if (isWidth) {
+				return { width: newDimension, height: Math.round(newDimension / aspectRatio) };
+			} else {
+				return { width: Math.round(newDimension * aspectRatio), height: newDimension };
+			}
+		});
 	};
 
 	const onSubmit = () => {
@@ -93,12 +99,18 @@ function OpenImage({ close }: DialogProps) {
 
 								<div>
 									<Label htmlFor="width">Width (blocks)</Label>
-									<Input type="number" id="width" placeholder="Width" value={imageDimensions.width} onChange={(e) => onDimensionChange(e)} />
+									<Input type="number" id="width" placeholder="Width" value={imageDimensions.width} onChange={(e) => onDimensionChange(e, true)} />
 								</div>
 
 								<div>
 									<Label htmlFor="height">Height (blocks)</Label>
-									<Input type="number" id="height" placeholder="Height" value={imageDimensions.height} onChange={(e) => onDimensionChange(e)} />
+									<Input
+										type="number"
+										id="height"
+										placeholder="Height"
+										value={imageDimensions.height}
+										onChange={(e) => onDimensionChange(e, false)}
+									/>
 								</div>
 							</div>
 						</>