Cleanup event filters (#10724)

* Add specific button / switch for showing reviewed items and use intermediate drawer for mobile

* Match design for filters

web/src/components/overlay/MobileReviewSettingsDrawer.tsx

@@ -20,7 +20,16 @@ import { isMobile } from "react-device-detect";
 const ATTRIBUTES = ["amazon", "face", "fedex", "license_plate", "ups"];
 type DrawerMode = "none" | "select" | "export" | "calendar" | "filter";
 
+const DRAWER_FEATURES = ["export", "calendar", "filter"] as const;
+export type DrawerFeatures = (typeof DRAWER_FEATURES)[number];
+const DEFAULT_DRAWER_FEATURES: DrawerFeatures[] = [
+  "export",
+  "calendar",
+  "filter",
+];
+
 type MobileReviewSettingsDrawerProps = {
+  features?: DrawerFeatures[];
   camera: string;
   filter?: ReviewFilter;
   latestTime: number;
@@ -32,6 +41,7 @@ type MobileReviewSettingsDrawerProps = {
   setMode: (mode: ExportMode) => void;
 };
 export default function MobileReviewSettingsDrawer({
+  features = DEFAULT_DRAWER_FEATURES,
   camera,
   filter,
   latestTime,
@@ -123,27 +133,33 @@ export default function MobileReviewSettingsDrawer({
   if (drawerMode == "select") {
     content = (
       <div className="w-full p-4 flex flex-col gap-2">
-        <Button
-          className="w-full flex justify-center items-center gap-2"
-          onClick={() => setDrawerMode("export")}
-        >
-          <FaArrowDown className="p-1 fill-secondary bg-muted-foreground rounded-md" />
-          Export
-        </Button>
-        <Button
-          className="w-full flex justify-center items-center gap-2"
-          onClick={() => setDrawerMode("calendar")}
-        >
-          <FaCalendarAlt className="fill-muted-foreground" />
-          Calendar
-        </Button>
-        <Button
-          className="w-full flex justify-center items-center gap-2"
-          onClick={() => setDrawerMode("filter")}
-        >
-          <FaFilter className="fill-muted-foreground" />
-          Filter
-        </Button>
+        {features.includes("export") && (
+          <Button
+            className="w-full flex justify-center items-center gap-2"
+            onClick={() => setDrawerMode("export")}
+          >
+            <FaArrowDown className="p-1 fill-secondary bg-muted-foreground rounded-md" />
+            Export
+          </Button>
+        )}
+        {features.includes("calendar") && (
+          <Button
+            className="w-full flex justify-center items-center gap-2"
+            onClick={() => setDrawerMode("calendar")}
+          >
+            <FaCalendarAlt className="fill-muted-foreground" />
+            Calendar
+          </Button>
+        )}
+        {features.includes("filter") && (
+          <Button
+            className="w-full flex justify-center items-center gap-2"
+            onClick={() => setDrawerMode("filter")}
+          >
+            <FaFilter className="fill-muted-foreground" />
+            Filter
+          </Button>
+        )}
       </div>
     );
   } else if (drawerMode == "export") {
@@ -230,17 +246,13 @@ export default function MobileReviewSettingsDrawer({
           </div>
         </div>
         <GeneralFilterContent
-          allLabels={allLabels.concat(allLabels)}
+          allLabels={allLabels}
           selectedLabels={filter?.labels}
           currentLabels={currentLabels}
-          showReviewed={0}
-          reviewed={0}
           setCurrentLabels={setCurrentLabels}
           updateLabelFilter={(newLabels) =>
             onUpdateFilter({ ...filter, labels: newLabels })
           }
-          setShowReviewed={() => {}}
-          setReviewed={() => {}}
           onClose={() => setDrawerMode("select")}
         />
       </div>
@@ -280,10 +292,3 @@ export default function MobileReviewSettingsDrawer({
     </>
   );
 }
-
-/**
- * <MobileTimelineDrawer
-              selected={timelineType ?? "timeline"}
-              onSelect={setTimelineType}
-            />
- */