Simplify checks

web/src/components/overlay/MobileCameraDrawer.tsx

@@ -2,6 +2,7 @@ import { useState } from "react";
 import { Drawer, DrawerContent, DrawerTrigger } from "../ui/drawer";
 import { Button } from "../ui/button";
 import { FaVideo } from "react-icons/fa";
+import { isMobile } from "react-device-detect";
 
 type MobileCameraDrawerProps = {
   allCameras: string[];
@@ -15,6 +16,10 @@ export default function MobileCameraDrawer({
 }: MobileCameraDrawerProps) {
   const [cameraDrawer, setCameraDrawer] = useState(false);
 
+  if (!isMobile) {
+    return;
+  }
+
   return (
     <Drawer open={cameraDrawer} onOpenChange={setCameraDrawer}>
       <DrawerTrigger asChild>

web/src/components/overlay/MobileReviewSettingsDrawer.tsx

@@ -15,6 +15,7 @@ import { FrigateConfig } from "@/types/frigateConfig";
 import { toast } from "sonner";
 import axios from "axios";
 import SaveExportOverlay from "./SaveExportOverlay";
+import { isMobile } from "react-device-detect";
 
 const ATTRIBUTES = ["amazon", "face", "fedex", "license_plate", "ups"];
 type DrawerMode = "none" | "select" | "export" | "calendar" | "filter";
@@ -114,6 +115,10 @@ export default function MobileReviewSettingsDrawer({
     filter?.labels,
   );
 
+  if (!isMobile) {
+    return;
+  }
+
   let content;
   if (drawerMode == "select") {
     content = (

web/src/components/overlay/MobileTimelineDrawer.tsx

@@ -3,6 +3,7 @@ import { Drawer, DrawerContent, DrawerTrigger } from "../ui/drawer";
 import { Button } from "../ui/button";
 import { FaFlag } from "react-icons/fa";
 import { TimelineType } from "@/types/timeline";
+import { isMobile } from "react-device-detect";
 
 type MobileTimelineDrawerProps = {
   selected: TimelineType;
@@ -14,6 +15,10 @@ export default function MobileTimelineDrawer({
 }: MobileTimelineDrawerProps) {
   const [drawer, setDrawer] = useState(false);
 
+  if (!isMobile) {
+    return;
+  }
+
   return (
     <Drawer open={drawer} onOpenChange={setDrawer}>
       <DrawerTrigger asChild>

web/src/views/events/RecordingView.tsx

@@ -238,16 +238,14 @@ export function RecordingView({
           {isDesktop && "Back"}
         </Button>
         <div className="flex items-center justify-end gap-2">
-          {isMobile && (
-            <MobileCameraDrawer
-              allCameras={allCameras}
-              selected={mainCamera}
-              onSelectCamera={(cam) => {
-                setPlaybackStart(currentTime);
-                setMainCamera(cam);
-              }}
-            />
-          )}
+          <MobileCameraDrawer
+            allCameras={allCameras}
+            selected={mainCamera}
+            onSelectCamera={(cam) => {
+              setPlaybackStart(currentTime);
+              setMainCamera(cam);
+            }}
+          />
           {isDesktop && (
             <ExportDialog
               camera={mainCamera}
@@ -300,19 +298,17 @@ export function RecordingView({
               onSelect={setTimelineType}
             />
           )}
-          {isMobile && (
-            <MobileReviewSettingsDrawer
-              camera={mainCamera}
-              filter={filter}
-              currentTime={currentTime}
-              latestTime={timeRange.end}
-              mode={exportMode}
-              range={exportRange}
-              onUpdateFilter={updateFilter}
-              setRange={setExportRange}
-              setMode={setExportMode}
-            />
-          )}
+          <MobileReviewSettingsDrawer
+            camera={mainCamera}
+            filter={filter}
+            currentTime={currentTime}
+            latestTime={timeRange.end}
+            mode={exportMode}
+            range={exportRange}
+            onUpdateFilter={updateFilter}
+            setRange={setExportRange}
+            setMode={setExportMode}
+          />
         </div>
       </div>