From 8af35da2795cffe3e3ee1c559b95bc72351ecb56 Mon Sep 17 00:00:00 2001
From: Elian Doran <contact@eliandoran.me>
Date: Tue, 10 Mar 2026 20:05:40 +0200
Subject: [PATCH] feat(video_player): add loop button

---
 .../src/widgets/type_widgets/file/Video.tsx   | 21 +++++++++++++++++++
 1 file changed, 21 insertions(+)

diff --git a/apps/client/src/widgets/type_widgets/file/Video.tsx b/apps/client/src/widgets/type_widgets/file/Video.tsx
index f160afb806..00df647138 100644
--- a/apps/client/src/widgets/type_widgets/file/Video.tsx
+++ b/apps/client/src/widgets/type_widgets/file/Video.tsx
@@ -51,6 +51,7 @@ export default function VideoPreview({ note }: { note: FNote }) {
                     <div className="left">
                         <PlaybackSpeed videoRef={videoRef} />
                         <RotateButton videoRef={videoRef} />
+                        <LoopButton videoRef={videoRef} />
                     </div>
                     <div className="center">
                         <SkipButton videoRef={videoRef} seconds={-10} icon="bx bx-rewind" text="Back 10s" />
@@ -254,6 +255,26 @@ function PlaybackSpeed({ videoRef }: { videoRef: RefObject<HTMLVideoElement> })
     );
 }
 
+function LoopButton({ videoRef }: { videoRef: RefObject<HTMLVideoElement> }) {
+    const [loop, setLoop] = useState(false);
+
+    const toggle = () => {
+        const video = videoRef.current;
+        if (!video) return;
+        video.loop = !video.loop;
+        setLoop(video.loop);
+    };
+
+    return (
+        <ActionButton
+            className={loop ? "active" : ""}
+            icon="bx bx-repeat"
+            text={loop ? "Disable loop" : "Loop"}
+            onClick={toggle}
+        />
+    );
+}
+
 function RotateButton({ videoRef }: { videoRef: RefObject<HTMLVideoElement> }) {
     const [rotation, setRotation] = useState(0);