From d945e77443631cc829dc45b1a9bc857078a24aa6 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Tue, 26 Mar 2024 18:54:00 -0600
Subject: [PATCH] Quick UI fixes (#10695)

* Quick fixes

* remove log
---
 web/src/components/overlay/ExportDialog.tsx |  3 +--
 web/src/pages/Events.tsx                    | 15 ++++++++++++++-
 web/src/pages/SubmitPlus.tsx                |  1 +
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/web/src/components/overlay/ExportDialog.tsx b/web/src/components/overlay/ExportDialog.tsx
index ea55720e5..a2c074bd6 100644
--- a/web/src/components/overlay/ExportDialog.tsx
+++ b/web/src/components/overlay/ExportDialog.tsx
@@ -167,14 +167,13 @@ export default function ExportDialog({
         >
           {EXPORT_OPTIONS.map((opt) => {
             return (
-              <div className="flex items-center gap-2">
+              <div key={opt} className="flex items-center gap-2">
                 <RadioGroupItem
                   className={
                     opt == selectedOption
                       ? "from-selected/50 to-selected/90 text-selected bg-selected"
                       : "from-secondary/50 to-secondary/90 text-secondary bg-secondary"
                   }
-                  key={opt}
                   id={opt}
                   value={opt}
                 />
diff --git a/web/src/pages/Events.tsx b/web/src/pages/Events.tsx
index 53f74a5e3..f618f4aca 100644
--- a/web/src/pages/Events.tsx
+++ b/web/src/pages/Events.tsx
@@ -69,7 +69,20 @@ export default function Events() {
   }, [last24Hours, reviewSearchParams]);
 
   // we want to update the items whenever the severity changes
-  useEffect(() => setBeforeTs(Date.now() / 1000), [severity]);
+  useEffect(() => {
+    if (recording) {
+      return;
+    }
+
+    const now = Date.now() / 1000;
+
+    if (now - beforeTs > 60) {
+      setBeforeTs(now);
+    }
+
+    // only refresh when severity changes
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [severity]);
 
   const reviewSegmentFetcher = useCallback((key: Array<string> | string) => {
     const [path, params] = Array.isArray(key) ? key : [key, undefined];
diff --git a/web/src/pages/SubmitPlus.tsx b/web/src/pages/SubmitPlus.tsx
index e4bfbff55..bf9f344f8 100644
--- a/web/src/pages/SubmitPlus.tsx
+++ b/web/src/pages/SubmitPlus.tsx
@@ -151,6 +151,7 @@ export default function SubmitPlus() {
 
             return (
               <div
+                key={event.id}
                 className="w-full rounded-2xl aspect-video flex justify-center items-center bg-black cursor-pointer"
                 onClick={() => setUpload(event)}
               >