feat: add time formatting utility and update editor and preview components to use it

This commit is contained in:
Maze Winther
2025-07-01 01:30:02 +02:00
parent 1a01871cfc
commit c37c64c1b9
3 changed files with 29 additions and 12 deletions

View File

@ -6,6 +6,7 @@ import { ChevronLeft, Download } from "lucide-react";
import { useTimelineStore } from "@/stores/timeline-store";
import { HeaderBase } from "./header-base";
import { ProjectNameEditor } from "./editor/project-name-editor";
import { formatTimeCode } from "@/lib/time";
export function EditorHeader() {
const { getTotalDuration } = useTimelineStore();
@ -15,13 +16,6 @@ export function EditorHeader() {
console.log("Export project");
};
// Format duration from seconds to MM:SS format
const formatDuration = (seconds: number): string => {
const minutes = Math.floor(seconds / 60);
const remainingSeconds = Math.floor(seconds % 60);
return `${minutes}:${remainingSeconds.toString().padStart(2, "0")}`;
};
const leftContent = (
<div className="flex items-center gap-2">
<Link
@ -36,7 +30,7 @@ export function EditorHeader() {
const centerContent = (
<div className="flex items-center gap-2 text-xs text-muted-foreground">
<span>{formatDuration(getTotalDuration())}</span>
<span>{formatTimeCode(getTotalDuration(), "HH:MM:SS:CS")}</span>
</div>
);