diff --git a/web/src/components/filter/ReviewActionGroup.tsx b/web/src/components/filter/ReviewActionGroup.tsx
index 15eddfb28..779ac757a 100644
--- a/web/src/components/filter/ReviewActionGroup.tsx
+++ b/web/src/components/filter/ReviewActionGroup.tsx
@@ -1,21 +1,18 @@
-import { LuCheckSquare, LuTrash, LuX } from "react-icons/lu";
-import {
-  Tooltip,
-  TooltipContent,
-  TooltipProvider,
-  TooltipTrigger,
-} from "../ui/tooltip";
+import { LuCheckSquare, LuFileUp, LuTrash } from "react-icons/lu";
 import { useCallback } from "react";
 import axios from "axios";
+import { Button } from "../ui/button";
 
 type ReviewActionGroupProps = {
   selectedReviews: string[];
   setSelectedReviews: (ids: string[]) => void;
+  onExport: (id: string) => void;
   pullLatestData: () => void;
 };
 export default function ReviewActionGroup({
   selectedReviews,
   setSelectedReviews,
+  onExport,
   pullLatestData,
 }: ReviewActionGroupProps) {
   const onClearSelected = useCallback(() => {
@@ -37,36 +34,43 @@ export default function ReviewActionGroup({
   }, [selectedReviews, setSelectedReviews, pullLatestData]);
 
   return (
-    <div className="absolute inset-x-2 md:inset-x-[40%] top-0 p-2 bg-primary-foreground md:border-2 md:rounded-lg flex justify-between items-center">
-      <TooltipProvider>
-        <Tooltip>
-          <TooltipTrigger asChild>
-            <div className="cursor-pointer" onClick={onClearSelected}>
-              <LuX />
-            </div>
-          </TooltipTrigger>
-          <TooltipContent>Unselect All</TooltipContent>
-        </Tooltip>
-        <div className="flex gap-2 items-center">
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <div className="cursor-pointer" onClick={onMarkAsReviewed}>
-                <LuCheckSquare />
-              </div>
-            </TooltipTrigger>
-            <TooltipContent>Mark Selected As Reviewed</TooltipContent>
-          </Tooltip>
-          <div className="text-sm font-thin">|</div>
-          <Tooltip>
-            <TooltipTrigger asChild>
-              <div className="cursor-pointer" onClick={onDelete}>
-                <LuTrash />
-              </div>
-            </TooltipTrigger>
-            <TooltipContent>Delete Selected</TooltipContent>
-          </Tooltip>
-        </div>
-      </TooltipProvider>
+    <div className="absolute inset-x-2 inset-y-0 md:left-auto md:right-2 p-2 flex gap-2 justify-between items-center">
+      <div className="text-sm text-gray-500">{`${selectedReviews.length} selected | `}</div>
+      <Button size="sm" variant="link" onClick={onClearSelected}>
+        Unselect
+      </Button>
+      {selectedReviews.length == 1 && (
+        <Button
+          className="flex items-center"
+          variant="secondary"
+          size="sm"
+          onClick={() => {
+            onExport(selectedReviews[0]);
+            onClearSelected();
+          }}
+        >
+          <LuFileUp className="mr-1" />
+          Export
+        </Button>
+      )}
+      <Button
+        className="flex items-center"
+        variant="secondary"
+        size="sm"
+        onClick={onMarkAsReviewed}
+      >
+        <LuCheckSquare className="mr-1" />
+        Mark as reviewed
+      </Button>
+      <Button
+        className="flex items-center"
+        variant="secondary"
+        size="sm"
+        onClick={onDelete}
+      >
+        <LuTrash className="mr-1" />
+        Delete
+      </Button>
     </div>
   );
 }
diff --git a/web/src/views/events/EventView.tsx b/web/src/views/events/EventView.tsx
index d194e156e..d5d230741 100644
--- a/web/src/views/events/EventView.tsx
+++ b/web/src/views/events/EventView.tsx
@@ -246,13 +246,29 @@ export default function EventView({
     pullLatestData();
   }, [currentItems, minimapBounds]);
 
+  const exportReview = useCallback(
+    (id: string) => {
+      const review = currentItems?.find((seg) => seg.id == id);
+
+      if (!review) {
+        return;
+      }
+
+      axios.post(
+        `export/${review.camera}/start/${review.start_time}/end/${review.end_time}`,
+        { playback: "realtime" },
+      );
+    },
+    [selectedReviews],
+  );
+
   if (!config) {
     return <ActivityIndicator />;
   }
 
   return (
     <div className="flex flex-col size-full">
-      <div className="relative flex justify-between mb-2">
+      <div className="h-8 relative flex justify-between items-center mb-2">
         {isMobile && (
           <Logo className="absolute inset-y-0 inset-x-1/2 -translate-x-1/2 h-8" />
         )}
@@ -290,11 +306,14 @@ export default function EventView({
             <div className="hidden md:block">Motion</div>
           </ToggleGroupItem>
         </ToggleGroup>
-        <ReviewFilterGroup filter={filter} onUpdateFilter={updateFilter} />
-        {selectedReviews.length > 0 && (
+
+        {selectedReviews.length <= 0 ? (
+          <ReviewFilterGroup filter={filter} onUpdateFilter={updateFilter} />
+        ) : (
           <ReviewActionGroup
             selectedReviews={selectedReviews}
             setSelectedReviews={setSelectedReviews}
+            onExport={exportReview}
             pullLatestData={pullLatestData}
           />
         )}