From 9fe2f2d5bcfd8479493ceb5ba3b9ef20266a663f Mon Sep 17 00:00:00 2001
From: Josh Hawkins <32435876+hawkeye217@users.noreply.github.com>
Date: Mon, 30 Sep 2024 14:01:00 -0500
Subject: [PATCH] frontend button

---
 .../overlay/detail/SearchDetailDialog.tsx     | 89 ++++++++++++++-----
 1 file changed, 65 insertions(+), 24 deletions(-)

diff --git a/web/src/components/overlay/detail/SearchDetailDialog.tsx b/web/src/components/overlay/detail/SearchDetailDialog.tsx
index 6b9de06db..94ec56a09 100644
--- a/web/src/components/overlay/detail/SearchDetailDialog.tsx
+++ b/web/src/components/overlay/detail/SearchDetailDialog.tsx
@@ -27,7 +27,13 @@ import { baseUrl } from "@/api/baseUrl";
 import { cn } from "@/lib/utils";
 import ActivityIndicator from "@/components/indicators/activity-indicator";
 import { ASPECT_VERTICAL_LAYOUT, ASPECT_WIDE_LAYOUT } from "@/types/record";
-import { FaHistory, FaImage, FaRegListAlt, FaVideo } from "react-icons/fa";
+import {
+  FaChevronDown,
+  FaHistory,
+  FaImage,
+  FaRegListAlt,
+  FaVideo,
+} from "react-icons/fa";
 import { FaRotate } from "react-icons/fa6";
 import ObjectLifecycle from "./ObjectLifecycle";
 import {
@@ -47,6 +53,12 @@ import { useNavigate } from "react-router-dom";
 import Chip from "@/components/indicators/Chip";
 import { capitalizeFirstLetter } from "@/utils/stringUtil";
 import useGlobalMutation from "@/hooks/use-global-mutate";
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger,
+} from "@/components/ui/dropdown-menu";
 
 const SEARCH_TABS = [
   "details",
@@ -309,33 +321,36 @@ function ObjectDetailsTab({
       });
   }, [desc, search, mutate]);
 
-  const regenerateDescription = useCallback(() => {
-    if (!search) {
-      return;
-    }
+  const regenerateDescription = useCallback(
+    (source: "snapshot" | "thumbnails") => {
+      if (!search) {
+        return;
+      }
 
-    axios
-      .put(`events/${search.id}/description/regenerate`)
-      .then((resp) => {
-        if (resp.status == 200) {
-          toast.success(
-            `A new description has been requested from ${capitalizeFirstLetter(config?.genai.provider ?? "Generative AI")}. Depending on the speed of your provider, the new description may take some time to regenerate.`,
+      axios
+        .put(`events/${search.id}/description/regenerate?source=${source}`)
+        .then((resp) => {
+          if (resp.status == 200) {
+            toast.success(
+              `A new description has been requested from ${capitalizeFirstLetter(config?.genai.provider ?? "Generative AI")}. Depending on the speed of your provider, the new description may take some time to regenerate.`,
+              {
+                position: "top-center",
+                duration: 7000,
+              },
+            );
+          }
+        })
+        .catch(() => {
+          toast.error(
+            `Failed to call ${capitalizeFirstLetter(config?.genai.provider ?? "Generative AI")} for a new description`,
             {
               position: "top-center",
-              duration: 7000,
             },
           );
-        }
-      })
-      .catch(() => {
-        toast.error(
-          `Failed to call ${capitalizeFirstLetter(config?.genai.provider ?? "Generative AI")} for a new description`,
-          {
-            position: "top-center",
-          },
-        );
-      });
-  }, [search, config]);
+        });
+    },
+    [search, config],
+  );
 
   return (
     <div className="flex flex-col gap-5">
@@ -403,7 +418,33 @@ function ObjectDetailsTab({
         />
         <div className="flex w-full flex-row justify-end gap-2">
           {config?.genai.enabled && (
-            <Button onClick={regenerateDescription}>Regenerate</Button>
+            <div className="flex items-center">
+              <Button
+                className="rounded-r-none border-r-0"
+                onClick={() => regenerateDescription("thumbnails")}
+              >
+                Regenerate
+              </Button>
+              <DropdownMenu>
+                <DropdownMenuTrigger asChild>
+                  <Button className="rounded-l-none border-l-0 px-2">
+                    <FaChevronDown className="size-3" />
+                  </Button>
+                </DropdownMenuTrigger>
+                <DropdownMenuContent>
+                  <DropdownMenuItem
+                    onClick={() => regenerateDescription("snapshot")}
+                  >
+                    Regenerate With Snapshot
+                  </DropdownMenuItem>
+                  <DropdownMenuItem
+                    onClick={() => regenerateDescription("thumbnails")}
+                  >
+                    Regenerate With Thumbnails
+                  </DropdownMenuItem>
+                </DropdownMenuContent>
+              </DropdownMenu>
+            </div>
           )}
           <Button variant="select" onClick={updateDescription}>
             Save