From 0b924be209a837ae615e07b29945db94c3eb9c22 Mon Sep 17 00:00:00 2001
From: karishmas6 <carishmashukla28@gmail.com>
Date: Mon, 24 Jun 2024 22:43:51 +0530
Subject: [PATCH] feat: page wrapper

---
 src/pages/PageWrappper.tsx | 75 ++++++++++++++++++++++++++++++++++++++
 1 file changed, 75 insertions(+)
 create mode 100644 src/pages/PageWrappper.tsx

diff --git a/src/pages/PageWrappper.tsx b/src/pages/PageWrappper.tsx
new file mode 100644
index 00000000..00e83a39
--- /dev/null
+++ b/src/pages/PageWrappper.tsx
@@ -0,0 +1,75 @@
+import React, { useEffect, useState } from 'react';
+import { NavBar } from "../components/molecules/NavBar";
+import { SocketProvider } from "../context/socket";
+import { BrowserDimensionsProvider } from "../context/browserDimensions";
+import { RecordingPage } from "./RecordingPage";
+import { MainPage } from "./MainPage";
+import { useGlobalInfoStore } from "../context/globalInfo";
+import { getActiveBrowserId } from "../api/recording";
+import { AlertSnackbar } from "../components/atoms/AlertSnackbar";
+import { InterpretationLog } from "../components/molecules/InterpretationLog";
+
+
+export const PageWrapper = () => {
+
+  const [recordingName, setRecordingName] = useState('');
+  const [open, setOpen] = useState(false);
+
+  const { browserId, setBrowserId, notification } =  useGlobalInfoStore();
+
+  const handleNewRecording = () => {
+    setBrowserId('new-recording');
+    setRecordingName('');
+  }
+
+  const handleEditRecording = (fileName: string) => {
+    setRecordingName(fileName);
+    setBrowserId('new-recording');
+  }
+
+  const isNotification = (): boolean=> {
+    if (notification.isOpen && !open){
+      setOpen(true);
+    }
+    return notification.isOpen;
+  }
+
+  useEffect(() => {
+    const isRecordingInProgress = async() => {
+      const id = await getActiveBrowserId();
+      if (id) {
+        setBrowserId(id);
+      }
+    }
+    isRecordingInProgress();
+  }, []);
+
+  return (
+    <div>
+      <SocketProvider>
+        <React.Fragment>
+          <NavBar newRecording={handleNewRecording} recordingName={recordingName} isRecording={!!browserId}/>
+            {browserId
+              ? (
+                  <BrowserDimensionsProvider>
+                    <React.Fragment>
+                      <RecordingPage recordingName={recordingName}/>
+                      <InterpretationLog/>
+                    </React.Fragment>
+                  </BrowserDimensionsProvider>
+              )
+              : <MainPage
+                handleEditRecording={handleEditRecording}
+              />
+            }
+        </React.Fragment>
+      </SocketProvider>
+      { isNotification() ?
+        <AlertSnackbar severity={notification.severity}
+                       message={notification.message}
+                       isOpen={notification.isOpen}/>
+        : null
+      }
+    </div>
+  );
+}