summaryrefslogtreecommitdiff
path: root/apps/web/src/components/editor/timeline/timeline-element.tsx
diff options
context:
space:
mode:
authorMaze Winther <mazewinther@gmail.com>2025-08-18 10:54:28 +0200
committerMaze Winther <mazewinther@gmail.com>2025-08-18 10:54:28 +0200
commit756a7c7caaeada4fff9a51f2ec4fe2968ac3b01e (patch)
tree1194f58254f2450395df18fb8d03469cd3ac3cd9 /apps/web/src/components/editor/timeline/timeline-element.tsx
parent13dff382c452be96e1adb05d26bc30fa6de38298 (diff)
downloadopencut-756a7c7caaeada4fff9a51f2ec4fe2968ac3b01e.tar.gz
feat: implement reveal in media feature
Diffstat (limited to 'apps/web/src/components/editor/timeline/timeline-element.tsx')
-rw-r--r--apps/web/src/components/editor/timeline/timeline-element.tsx28
1 files changed, 24 insertions, 4 deletions
diff --git a/apps/web/src/components/editor/timeline/timeline-element.tsx b/apps/web/src/components/editor/timeline/timeline-element.tsx
index ca5d8c0a..a1a33837 100644
--- a/apps/web/src/components/editor/timeline/timeline-element.tsx
+++ b/apps/web/src/components/editor/timeline/timeline-element.tsx
@@ -4,6 +4,7 @@ import {
Scissors,
Trash2,
Copy,
+ Search,
RefreshCw,
EyeOff,
Eye,
@@ -29,6 +30,7 @@ import {
ContextMenuSeparator,
ContextMenuTrigger,
} from "../../ui/context-menu";
+import { useMediaPanelStore } from "../media-panel/store";
export function TimelineElement({
element,
@@ -69,6 +71,8 @@ export function TimelineElement({
onUpdateDuration: updateElementDuration,
});
+ const { requestRevealMedia } = useMediaPanelStore.getState();
+
const effectiveDuration =
element.duration - element.trimStart - element.trimEnd;
const elementWidth = Math.max(
@@ -166,6 +170,16 @@ export function TimelineElement({
input.click();
};
+ const handleRevealInMedia = (e: React.MouseEvent) => {
+ e.stopPropagation();
+ if (element.type !== "media") {
+ toast.error("Reveal is only available for media clips");
+ return;
+ }
+
+ requestRevealMedia(element.mediaId);
+ };
+
const renderElementContent = () => {
if (element.type === "text") {
return (
@@ -348,10 +362,16 @@ export function TimelineElement({
Duplicate {element.type === "text" ? "text" : "clip"}
</ContextMenuItem>
{element.type === "media" && (
- <ContextMenuItem onClick={handleReplaceClip}>
- <RefreshCw className="h-4 w-4 mr-2" />
- Replace clip
- </ContextMenuItem>
+ <>
+ <ContextMenuItem onClick={handleRevealInMedia}>
+ <Search className="h-4 w-4 mr-2" />
+ Reveal in media
+ </ContextMenuItem>
+ <ContextMenuItem onClick={handleReplaceClip}>
+ <RefreshCw className="h-4 w-4 mr-2" />
+ Replace clip
+ </ContextMenuItem>
+ </>
)}
<ContextMenuSeparator />
<ContextMenuItem