From 25d3a0803d9fbfbc6785c244670d8cf42d7719f8 Mon Sep 17 00:00:00 2001
From: Rohit <rohit.rajan031101@gmail.com>
Date: Sat, 15 Mar 2025 14:12:47 +0530
Subject: [PATCH] feat: resize browser content on size change

---
 src/components/browser/BrowserContent.tsx | 15 ++++++++++++++-
 1 file changed, 14 insertions(+), 1 deletion(-)

diff --git a/src/components/browser/BrowserContent.tsx b/src/components/browser/BrowserContent.tsx
index 41d79be8..e78cb76c 100644
--- a/src/components/browser/BrowserContent.tsx
+++ b/src/components/browser/BrowserContent.tsx
@@ -17,6 +17,11 @@ export const BrowserContent = () => {
   const [tabs, setTabs] = useState<string[]>(["current"]);
   const [tabIndex, setTabIndex] = React.useState(0);
   const [showOutputData, setShowOutputData] = useState(false);
+  const [browserWidth, setBrowserWidth] = useState(window.innerWidth * 0.7);
+
+  const handleResize = useCallback(() => {
+    setBrowserWidth(window.innerWidth * 0.7);
+  }, []);
 
   const handleChangeIndex = useCallback(
     (index: number) => {
@@ -109,6 +114,14 @@ export const BrowserContent = () => {
     [handleCloseTab]
   );
 
+  useEffect(() => {
+    window.addEventListener('resize', handleResize);
+    
+    return () => {
+      window.removeEventListener('resize', handleResize);
+    };
+  }, [handleResize]);
+
   useEffect(() => {
     if (socket) {
       socket.on("newTab", handleNewTab);
@@ -146,7 +159,7 @@ export const BrowserContent = () => {
       />
       <BrowserNavBar
         // todo: use width from browser dimension once fixed
-        browserWidth={window.innerWidth * 0.7}
+        browserWidth={browserWidth}
         handleUrlChanged={handleUrlChanged}
 
       />