From ce538db892ab340ee36de912361f3d975cb779e1 Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Fri, 8 Mar 2024 09:36:17 -0700
Subject: [PATCH] Load after current preview changes

---
 web/src/components/player/PreviewVideoPlayer.tsx | 13 ++++++++-----
 1 file changed, 8 insertions(+), 5 deletions(-)

diff --git a/web/src/components/player/PreviewVideoPlayer.tsx b/web/src/components/player/PreviewVideoPlayer.tsx
index dfa263853..e6acaf931 100644
--- a/web/src/components/player/PreviewVideoPlayer.tsx
+++ b/web/src/components/player/PreviewVideoPlayer.tsx
@@ -104,11 +104,6 @@ export default function PreviewVideoPlayer({
         Math.floor(preview.end) <= timeRange.end,
     );
     setCurrentPreview(preview);
-
-    if (preview && previewRef.current) {
-      previewRef.current.load();
-    }
-
     controller.newPlayback({
       preview,
       timeRange,
@@ -118,6 +113,14 @@ export default function PreviewVideoPlayer({
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [controller, timeRange]);
 
+  useEffect(() => {
+    if (!currentPreview || !previewRef.current) {
+      return;
+    }
+
+    previewRef.current.load();
+  }, [currentPreview, previewRef]);
+
   return (
     <div
       className={`relative ${className ?? ""} ${onClick ? "cursor-pointer" : ""}`}