import { useMemo, useState } from "react"; import { useNavigate } from "react-router-dom"; import { revealInFileManager } from "../../lib/api"; import { useEditor } from "./EditorContext"; const EditorHeader = () => { const navigate = useNavigate(); const [exportOpen, setExportOpen] = useState(false); const [includeChapterCards, setIncludeChapterCards] = useState(false); const { metadata, editorMode, setEditorMode, hasTerminal, activeTab, setActiveTab, exporting, exportFeedback, autoStepsFeedback, handleExportMarkdown, handleExportMp4, clearExportFeedback, clearAutoStepsFeedback, setSharing, isProcessing, } = useEditor(); const exportKindLabel = exportFeedback?.kind === "mp4" ? "MP4" : "Markdown"; const title = useMemo(() => { const explicit = metadata?.title?.trim(); return explicit || "Untitled session"; }, [metadata?.title]); const copyExportPath = async () => { if (!exportFeedback?.path) return; try { await navigator.clipboard.writeText(exportFeedback.path); } catch (err) { console.error("Failed to copy export path:", err); } }; const revealExportPath = async () => { if (!exportFeedback?.path) return; try { await revealInFileManager(exportFeedback.path); } catch (err) { console.error("Failed to reveal export path:", err); } }; return (
{title}
{isProcessing && (
Converting video...
)}
{(["edit", "preview"] as const).map((mode) => { const active = editorMode === mode; return ( ); })}
{hasTerminal && (
)}
{exportOpen && !isProcessing && (
)}
⌘? {exportFeedback && (
{exportKindLabel} export{" "} {exportFeedback.status === "success" ? "completed" : "failed"}
{exportFeedback.path ?? exportFeedback.message}
)} {autoStepsFeedback && (
Auto Steps{" "} {autoStepsFeedback.status === "success" ? "completed" : "failed"}
{autoStepsFeedback.message}
)}
); }; export default EditorHeader;