From c0373aece84954dc8eb635ee80692c71d6d65e91 Mon Sep 17 00:00:00 2001
From: Pavlo Legkyi <lehkyipavlo@gmail.com>
Date: Tue, 10 Dec 2024 15:39:29 +0100
Subject: [PATCH] fix: Fix restricted device size to enable phones landscape
 Refs #1210

---
 .../renderer/components/Previewer/Device/index.tsx    | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/desktop-app/src/renderer/components/Previewer/Device/index.tsx b/desktop-app/src/renderer/components/Previewer/Device/index.tsx
index b2215e8c..45241303 100644
--- a/desktop-app/src/renderer/components/Previewer/Device/index.tsx
+++ b/desktop-app/src/renderer/components/Previewer/Device/index.tsx
@@ -72,7 +72,7 @@ const Device = ({ isPrimary, device, setIndividualDevice }: Props) => {
   const [singleRotated, setSingleRotated] = useState<boolean>(false);
   const [loading, setLoading] = useState<boolean>(false);
   const [error, setError] = useState<ErrorState | null>(null);
-  const [screenshotInProgress, setScreenshotInProgess] =
+  const [screenshotInProgress, setScreenshotInProgress] =
     useState<boolean>(false);
   const address = useSelector(selectAddress);
   const zoomfactor = useSelector(selectZoomFactor);
@@ -497,10 +497,13 @@ const Device = ({ isPrimary, device, setIndividualDevice }: Props) => {
   const scaledHeight = height * zoomfactor;
   const scaledWidth = width * zoomfactor;
 
+  const isRestrictedMinimumDeviceSize =
+    device.width < 400 && zoomfactor < 0.6 && !rotateDevices && !singleRotated;
+
   return (
     <div
-      className={cx('h-fit flex-shrink-0', {
-        'w-52': device.width < 400 && zoomfactor < 0.6,
+      className={cx('h-fit', {
+        'w-52': isRestrictedMinimumDeviceSize,
       })}
     >
       <div className="flex justify-between">
@@ -515,7 +518,7 @@ const Device = ({ isPrimary, device, setIndividualDevice }: Props) => {
       <Toolbar
         webview={ref.current}
         device={device}
-        setScreenshotInProgress={setScreenshotInProgess}
+        setScreenshotInProgress={setScreenshotInProgress}
         openDevTools={openDevTools}
         toggleRuler={toggleRuler}
         onRotate={onRotateHandler}