add: translations for timeline editor

This commit is contained in:
Alan Trebugeais
2026-05-08 14:54:55 +02:00
parent 83e2024732
commit 81c677da0e
3 changed files with 25 additions and 6 deletions
@@ -142,6 +142,8 @@ const TimelineEditor = forwardRef<TimelineEditorHandle, TimelineEditorProps>(
ref,
) {
const t = useScopedT("settings");
const tTimeline = useScopedT("timeline");
const tEditor = useScopedT("editor");
const initialEditorPreferences = useMemo(() => loadEditorPreferences(), []);
const totalMs = useMemo(
() => Math.max(0, Math.round(videoDuration * 1000)),
@@ -337,6 +339,11 @@ const TimelineEditor = forwardRef<TimelineEditorHandle, TimelineEditorProps>(
onAddAudio={handleToolbarAddAudio}
onSplitClip={handleSplitClip}
cropLabel={t("sections.crop", "Crop")}
addZoomLabel={tTimeline("zoom.addZoom", "Add Zoom (Z)")}
suggestZoomsLabel={tTimeline("zoom.suggestZooms", "Suggest Zooms from Cursor")}
addAnnotationLabel={tTimeline("annotation.addAnnotation", "Add Annotation (A)")}
addAudioLabel={tTimeline("audio.label", "Audio")}
splitClipLabel={tEditor("toolbar.splitClip", "Split Clip (C)")}
/>
)}
<div
@@ -90,7 +90,9 @@ export default function TimelineAxis({ videoDurationMs, currentTimeMs }: Timelin
<span
className={cn(
"text-[10px] font-medium tabular-nums tracking-tight",
marker.time === currentTimeMs ? "text-[#2563EB]" : "text-foreground/40",
Math.abs(marker.time - currentTimeMs) < 1
? "text-[#2563EB]"
: "text-foreground/40",
)}
>
{marker.label}
@@ -41,6 +41,11 @@ interface TimelineToolbarProps {
onAddAudio: () => void;
onSplitClip: () => void;
cropLabel: string;
addZoomLabel: string;
suggestZoomsLabel: string;
addAnnotationLabel: string;
addAudioLabel: string;
splitClipLabel: string;
}
export default function TimelineToolbar({
@@ -61,23 +66,28 @@ export default function TimelineToolbar({
onAddAudio,
onSplitClip,
cropLabel,
addZoomLabel,
suggestZoomsLabel,
addAnnotationLabel,
addAudioLabel,
splitClipLabel,
}: TimelineToolbarProps) {
return (
<div className="flex items-center gap-2 px-4 py-2 border-b border-foreground/10 bg-editor-panel">
<div className="flex items-center gap-1">
<Button onClick={onAddZoom} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#2563EB] hover:bg-[#2563EB]/10 transition-all" title="Add Zoom (Z)">
<Button onClick={onAddZoom} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#2563EB] hover:bg-[#2563EB]/10 transition-all" title={addZoomLabel} aria-label={addZoomLabel}>
<ZoomIn className="w-4 h-4" />
</Button>
<Button onClick={onSuggestZooms} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#2563EB] hover:bg-[#2563EB]/10 transition-all" title="Suggest Zooms from Cursor">
<Button onClick={onSuggestZooms} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#2563EB] hover:bg-[#2563EB]/10 transition-all" title={suggestZoomsLabel} aria-label={suggestZoomsLabel}>
<WandSparkles className="w-4 h-4" />
</Button>
<Button onClick={onAddAnnotation} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#B4A046] hover:bg-[#B4A046]/10 transition-all" title="Add Annotation (A)">
<Button onClick={onAddAnnotation} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#B4A046] hover:bg-[#B4A046]/10 transition-all" title={addAnnotationLabel} aria-label={addAnnotationLabel}>
<MessageSquare className="w-4 h-4" />
</Button>
<Button onClick={onAddAudio} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#a855f7] hover:bg-[#a855f7]/10 transition-all" title="Add Audio">
<Button onClick={onAddAudio} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-[#a855f7] hover:bg-[#a855f7]/10 transition-all" title={addAudioLabel} aria-label={addAudioLabel}>
<Music className="w-4 h-4" />
</Button>
<Button onClick={onSplitClip} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-foreground/10 transition-all" title="Split Clip (C)">
<Button onClick={onSplitClip} variant="ghost" size="icon" className="h-7 w-7 text-muted-foreground hover:text-foreground hover:bg-foreground/10 transition-all" title={splitClipLabel} aria-label={splitClipLabel}>
<Scissors className="w-4 h-4" />
</Button>
</div>