Minor fixes:

removed clock
added navigation arrow to main sighting screen
added zoom functionality to rear (camera B) settings
brought back navigation to rear cam page

src/pages/Dashboard.tsx

@@ -6,7 +6,7 @@ import { CAM_BASE } from "../utils/config";
 const Dashboard = () => {
   const base_url = `${CAM_BASE}/SightingListFront/sightingSummary?mostRecentRef=`;
   return (
-    <SightingFeedProvider url={base_url} side="Front">
+    <SightingFeedProvider url={base_url}>
       <div className="mx-auto flex flex-col lg:flex-row gap-2 px-1 sm:px-2 lg:px-0 w-full min-h-screen">
         <FrontCameraOverviewCard />
         <SightingHistoryWidget title="Sightings" />

src/pages/FrontCamera.tsx

@@ -18,7 +18,7 @@ const FrontCamera = () => {
     <div className="mx-auto flex flex-col lg:flex-row gap-2 px-1 sm:px-2 lg:px-0 w-full min-h-screen">
       <OverviewVideoContainer
         title={"Front Camera"}
-        side="CameraRear"
+        side="CameraFront"
         settingsPage={true}
         zoomLevel={zoomLevel}
         onZoomLevelChange={setZoomLevel}

src/pages/RearCamera.tsx

@@ -1,27 +1,34 @@
-import { useNavigate } from "react-router";
-import { useSwipeable } from "react-swipeable";
 import OverviewVideoContainer from "../components/FrontCameraSettings/OverviewVideoContainer";
 import CameraSettings from "../components/CameraSettings/CameraSettings";
 import { Toaster } from "sonner";
+import { useState } from "react";
+import type { ZoomLevel } from "../types/types";
 
 const RearCamera = () => {
-  const navigate = useNavigate();
-  const handlers = useSwipeable({
-    onSwipedRight: () => navigate("/"),
-    trackMouse: true,
+  const [zoomLevel, setZoomLevel] = useState<ZoomLevel>({
+    left: 0,
+    top: 0,
+    x: 0,
+    y: 0,
+    px: 0,
+    py: 0,
+    level: 1,
   });
-
   return (
-    <div className="mx-auto grid grid-cols-1 sm:grid-cols-1 lg:grid-cols-2 gap-4 px-2 sm:px-4 lg:px-0 w-full order-first">
-      <CameraSettings title="Rear Camera Settings" side={"CameraRear"} />
-
-      <div {...handlers}>
-        <OverviewVideoContainer
-          title={"Rear Camera"}
-          side={"CameraRear"}
-          settingsPage={true}
-        />
-      </div>
+    <div className="mx-auto flex flex-col lg:flex-row gap-2 px-1 sm:px-2 lg:px-0 w-full min-h-screen">
+      <CameraSettings
+        title="Rear Camera Settings"
+        side={"CameraRear"}
+        zoomLevel={zoomLevel}
+        onZoomLevelChange={setZoomLevel}
+      />
+      <OverviewVideoContainer
+        title={"Rear Camera"}
+        side={"CameraRear"}
+        settingsPage={true}
+        zoomLevel={zoomLevel}
+        onZoomLevelChange={setZoomLevel}
+      />
       <Toaster />
     </div>
   );