diff --git a/src/workspaces/officerdev/src/apps/FileBrowser/FileBrowserApp/useFileBrowserApp.ts b/src/workspaces/officerdev/src/apps/FileBrowser/FileBrowserApp/useFileBrowserApp.ts index 83e05051..66ae301f 100644 --- a/src/workspaces/officerdev/src/apps/FileBrowser/FileBrowserApp/useFileBrowserApp.ts +++ b/src/workspaces/officerdev/src/apps/FileBrowser/FileBrowserApp/useFileBrowserApp.ts @@ -154,8 +154,10 @@ export const useFileBrowserApp = (basePath: string, rootOverride?: string, initi // Keyboard shortcuts useEffect(() => { const handler = (ev: KeyboardEvent) => { - const tag = (ev.target as HTMLElement).tagName; + const target = ev.target as HTMLElement; + const tag = target.tagName; if (tag === 'INPUT' || tag === 'TEXTAREA') return; + if (target.closest('.monaco-editor')) return; if (ev.key === 'Escape') { if (viewPath) return; diff --git a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerBody.tsx b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerBody.tsx index f0c523d5..eed6d0fb 100644 --- a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerBody.tsx +++ b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerBody.tsx @@ -10,9 +10,10 @@ import { CodeRenderer } from './renderers/CodeRenderer'; import { MarkdownRenderer } from './renderers/MarkdownRenderer'; import { TextRenderer } from './renderers/TextRenderer'; import { ScrollToTopButton } from './renderers/ScrollToTopButton'; +import { EditorRenderer } from './renderers/EditorRenderer'; export const FileViewerBody = () => { - const { filePath, fileName, root, fileType, content, loading, error, autoPlay } = useFileViewer(); + const { filePath, fileName, root, fileType, content, loading, error, autoPlay, editing, setContent } = useFileViewer(); const scrollRef = useRef(null); const videoSrc = @@ -42,6 +43,8 @@ export const FileViewerBody = () => { ) : fileType === 'audio' ? ( + ) : content !== null && editing ? ( + ) : content !== null ? ( fileType === 'code' ? (
diff --git a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerContext.tsx b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerContext.tsx index c7c3603e..f25aa376 100644 --- a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerContext.tsx +++ b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerContext.tsx @@ -16,6 +16,9 @@ export type FileViewerContextValue = { extractAudioLoading: boolean; extractLoading: boolean; autoPlay: boolean; + editing: boolean; + setEditing: (editing: boolean) => void; + setContent: (content: string) => void; handleReadAloud: () => void; handleOcr: () => void; handleTranscribe: () => void; diff --git a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerHeader.tsx b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerHeader.tsx index 1499ed89..e4ec43ba 100644 --- a/src/workspaces/officerdev/src/apps/FileViewer/FileViewerHeader.tsx +++ b/src/workspaces/officerdev/src/apps/FileViewer/FileViewerHeader.tsx @@ -1,4 +1,4 @@ -import { Download, Loader2, Music, Film, Image, FileType2, Volume2, ScanText, FileText, AudioLines, FolderArchive, Save } from 'lucide-react'; +import { Download, Loader2, Music, Film, Image, FileType2, Volume2, ScanText, FileText, AudioLines, FolderArchive, Save, Pencil, Eye } from 'lucide-react'; import { getIcon } from 'material-file-icons'; import { getLang } from './file-types'; import { useFileViewer } from './FileViewerContext'; @@ -22,6 +22,8 @@ export const FileViewerHeader = () => { handleDownload, handleSaveResult, saveResultLoading, + editing, + setEditing, } = useFileViewer(); const headerIcon = @@ -46,6 +48,15 @@ export const FileViewerHeader = () => { {fileType === 'code' ? getLang(fileName) : fileType} + {(fileType === 'markdown' || fileType === 'code' || fileType === 'text') && content && ( + + )} {(fileType === 'markdown' || fileType === 'code' || fileType === 'text') && content && (