From d90172a2b35155c189332320cc282b3dcf501b22 Mon Sep 17 00:00:00 2001
From: karishmas6 <carishmashukla28@gmail.com>
Date: Sat, 19 Oct 2024 20:38:43 +0530
Subject: [PATCH] feat: set width to 900

---
 src/components/atoms/canvas.tsx             | 2 +-
 src/components/molecules/BrowserNavBar.tsx  | 2 +-
 src/components/organisms/BrowserContent.tsx | 2 +-
 src/components/organisms/BrowserWindow.tsx  | 8 ++++----
 src/components/organisms/LeftSidePanel.tsx  | 2 +-
 src/constants/const.ts                      | 2 +-
 src/context/browserDimensions.tsx           | 2 +-
 7 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/src/components/atoms/canvas.tsx b/src/components/atoms/canvas.tsx
index 95f821e8..7e437408 100644
--- a/src/components/atoms/canvas.tsx
+++ b/src/components/atoms/canvas.tsx
@@ -142,7 +142,7 @@ const Canvas = ({ width, height, onCreateRef }: CanvasProps) => {
             tabIndex={0}
             ref={canvasRef}
             height={400}
-            width={1150}
+            width={900}
         />
     );
 
diff --git a/src/components/molecules/BrowserNavBar.tsx b/src/components/molecules/BrowserNavBar.tsx
index 11f22e58..16730e0c 100644
--- a/src/components/molecules/BrowserNavBar.tsx
+++ b/src/components/molecules/BrowserNavBar.tsx
@@ -77,7 +77,7 @@ const BrowserNavBar: FC<NavBarProps> = ({
   };
 
   return (
-    <StyledNavBar browserWidth={1150}>
+    <StyledNavBar browserWidth={900}>
       <NavBarButton
         type="button"
         onClick={() => {
diff --git a/src/components/organisms/BrowserContent.tsx b/src/components/organisms/BrowserContent.tsx
index b95f034b..79fe6e63 100644
--- a/src/components/organisms/BrowserContent.tsx
+++ b/src/components/organisms/BrowserContent.tsx
@@ -128,7 +128,7 @@ export const BrowserContent = () => {
       />
       <BrowserNavBar
         // todo: use width from browser dimension once fixed
-        browserWidth={1150}
+        browserWidth={900}
         handleUrlChanged={handleUrlChanged}
       />
       <BrowserWindow />
diff --git a/src/components/organisms/BrowserWindow.tsx b/src/components/organisms/BrowserWindow.tsx
index 0a509408..c173c130 100644
--- a/src/components/organisms/BrowserWindow.tsx
+++ b/src/components/organisms/BrowserWindow.tsx
@@ -316,7 +316,7 @@ export const BrowserWindow = () => {
 
 
     return (
-        <div onClick={handleClick} style={{ width: '1150px'}} id="browser-window">
+        <div onClick={handleClick} style={{ width: '900px'}} id="browser-window">
             {
                 getText === true || getList === true ? (
                     <GenericModal
@@ -361,14 +361,14 @@ export const BrowserWindow = () => {
                 <Highlighter
                     unmodifiedRect={highlighterData?.rect}
                     displayedSelector={highlighterData?.selector}
-                    width={1150}
+                    width={900}
                     height={400}
                     canvasRect={canvasRef.current.getBoundingClientRect()}
                 />
                 : null}
             <Canvas
                 onCreateRef={setCanvasReference}
-                width={1150}
+                width={900}
                 height={400}
             />
             </div>
@@ -385,7 +385,7 @@ const drawImage = (image: string, canvas: HTMLCanvasElement): void => {
     img.src = image;
     img.onload = () => {
         URL.revokeObjectURL(img.src);
-        ctx?.drawImage(img, 0, 0, 1150, 400);
+        ctx?.drawImage(img, 0, 0, 900, 400);
     };
 
 };
\ No newline at end of file
diff --git a/src/components/organisms/LeftSidePanel.tsx b/src/components/organisms/LeftSidePanel.tsx
index 7504be2e..29196d20 100644
--- a/src/components/organisms/LeftSidePanel.tsx
+++ b/src/components/organisms/LeftSidePanel.tsx
@@ -105,7 +105,7 @@ export const LeftSidePanel = (
         flexDirection: 'column',
       }}
     >
-      <SidePanelHeader />
+      {/* <SidePanelHeader /> */}
       <TabContext value={tab}>
         <Tabs value={tab} onChange={(e, newTab) => setTab(newTab)}>
           <Tab label="Recording" value='recording' />
diff --git a/src/constants/const.ts b/src/constants/const.ts
index 6df84b91..a1d7393d 100644
--- a/src/constants/const.ts
+++ b/src/constants/const.ts
@@ -1,4 +1,4 @@
-export const VIEWPORT_W = 1150;
+export const VIEWPORT_W = 900;
 export const VIEWPORT_H = 400;
 
 export const ONE_PERCENT_OF_VIEWPORT_W = VIEWPORT_W / 100;
diff --git a/src/context/browserDimensions.tsx b/src/context/browserDimensions.tsx
index 765a29f2..bc0d97ae 100644
--- a/src/context/browserDimensions.tsx
+++ b/src/context/browserDimensions.tsx
@@ -7,7 +7,7 @@ interface BrowserDimensions {
 };
 
 class BrowserDimensionsStore implements Partial<BrowserDimensions> {
-  width: number = 1150;
+  width: number = 900;
   height: number = 400;
 };