Upstream/waveterm
1
0
Fork 0
mirror of https://github.com/wavetermdev/waveterm.git synced 2024-12-22 16:48:23 +01:00
Code Issues Packages Projects Releases Wiki Activity

Revert "Keep changes in preview after save (#360)"

Browse Source 
This reverts commit 13ac6af4d0.
This commit is contained in:
Evan Simkowitz 2024-09-10 14:27:11 -07:00
parent 13ac6af4d0
commit 29db989623
No known key found for this signature in database
3 changed files with 21 additions and 46 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
frontend/app/element/markdown.tsx
View File

@ -178,7 +178,7 @@ type MarkdownProps = {
}; };
const Markdown = ({ text, textAtom, showTocAtom, style, className, resolveOpts, onClickExecute }: MarkdownProps) => { const Markdown = ({ text, textAtom, showTocAtom, style, className, resolveOpts, onClickExecute }: MarkdownProps) => {
const textAtomValue = useAtomValueSafe<string>(textAtom); const textAtomValue = useAtomValueSafe(textAtom);
const tocRef = useRef<TocItem[]>([]); const tocRef = useRef<TocItem[]>([]);
const showToc = useAtomValueSafe(showTocAtom) ?? false; const showToc = useAtomValueSafe(showTocAtom) ?? false;
const contentsOsRef = useRef<OverlayScrollbarsComponentRef>(null); const contentsOsRef = useRef<OverlayScrollbarsComponentRef>(null);

14
frontend/app/view/codeeditor/codeeditor.tsx
View File

@ -2,12 +2,11 @@
// SPDX-License-Identifier: Apache-2.0 // SPDX-License-Identifier: Apache-2.0
import { atoms } from "@/app/store/global"; import { atoms } from "@/app/store/global";
import { useAtomValueSafe } from "@/util/util";
import loader from "@monaco-editor/loader"; import loader from "@monaco-editor/loader";
import { Editor, Monaco } from "@monaco-editor/react"; import { Editor, Monaco } from "@monaco-editor/react";
import { Atom, atom, useAtomValue } from "jotai"; import { atom, useAtomValue } from "jotai";
import type * as MonacoTypes from "monaco-editor/esm/vs/editor/editor.api"; import type * as MonacoTypes from "monaco-editor/esm/vs/editor/editor.api";
import React, { useMemo, useRef, useState } from "react"; import React, { useMemo, useRef } from "react";
import "./codeeditor.less"; import "./codeeditor.less";
// there is a global monaco variable (TODO get the correct TS type) // there is a global monaco variable (TODO get the correct TS type)
@ -71,8 +70,7 @@ function defaultEditorOptions(): MonacoTypes.editor.IEditorOptions {
} }
interface CodeEditorProps { interface CodeEditorProps {
text?: string; text: string;
textAtom?: Atom<string> | Atom<Promise<string>>;
filename: string; filename: string;
language?: string; language?: string;
onChange?: (text: string) => void; onChange?: (text: string) => void;
@ -89,13 +87,11 @@ const stickyScrollEnabledAtom = atom((get) => {
return settings["editor:stickyscrollenabled"] ?? false; return settings["editor:stickyscrollenabled"] ?? false;
}); });
export function CodeEditor({ text, textAtom, language, filename, onChange, onMount }: CodeEditorProps) { export function CodeEditor({ text, language, filename, onChange, onMount }: CodeEditorProps) {
const divRef = useRef<HTMLDivElement>(null); const divRef = useRef<HTMLDivElement>(null);
const unmountRef = useRef<() => void>(null); const unmountRef = useRef<() => void>(null);
const minimapEnabled = useAtomValue(minimapEnabledAtom); const minimapEnabled = useAtomValue(minimapEnabledAtom);
const stickyScrollEnabled = useAtomValue(stickyScrollEnabledAtom); const stickyScrollEnabled = useAtomValue(stickyScrollEnabledAtom);
const textAtomValue = useAtomValueSafe<string>(textAtom);
const [textValue] = useState(() => textAtomValue ?? text);
const theme = "wave-theme-dark"; const theme = "wave-theme-dark";
React.useEffect(() => { React.useEffect(() => {
@ -131,7 +127,7 @@ export function CodeEditor({ text, textAtom, language, filename, onChange, onMou
<div className="code-editor" ref={divRef}> <div className="code-editor" ref={divRef}>
<Editor <Editor
theme={theme} theme={theme}
value={textValue} value={text}
options={editorOpts} options={editorOpts}
onChange={handleEditorChange} onChange={handleEditorChange}
onMount={handleEditorOnMount} onMount={handleEditorOnMount}

51
frontend/app/view/preview/preview.tsx
View File

@ -126,9 +126,7 @@ export class PreviewModel implements ViewModel {
fileMimeType: jotai.Atom<Promise<string>>; fileMimeType: jotai.Atom<Promise<string>>;
fileMimeTypeLoadable: jotai.Atom<Loadable<string>>; fileMimeTypeLoadable: jotai.Atom<Loadable<string>>;
fileContent: jotai.Atom<Promise<string>>; fileContent: jotai.Atom<Promise<string>>;
fileContentLastSaved: jotai.PrimitiveAtom<string>; newFileContent: jotai.PrimitiveAtom<string | null>;
fileContentModified: jotai.PrimitiveAtom<string>;
previewFileContent: jotai.WritableAtom<Promise<string>, [value: string], void>;
openFileModal: jotai.PrimitiveAtom<boolean>; openFileModal: jotai.PrimitiveAtom<boolean>;
openFileError: jotai.PrimitiveAtom<string>; openFileError: jotai.PrimitiveAtom<string>;
@ -210,7 +208,6 @@ export class PreviewModel implements ViewModel {
const blockData = get(this.blockAtom); const blockData = get(this.blockAtom);
return blockData?.meta?.edit ?? false; return blockData?.meta?.edit ?? false;
}); });
this.viewName = jotai.atom("Preview"); this.viewName = jotai.atom("Preview");
this.viewText = jotai.atom((get) => { this.viewText = jotai.atom((get) => {
let headerPath = get(this.metaFilePath); let headerPath = get(this.metaFilePath);
@ -244,7 +241,7 @@ export class PreviewModel implements ViewModel {
}, },
]; ];
let saveClassName = "secondary"; let saveClassName = "secondary";
if (get(this.fileContentModified) !== null) { if (get(this.newFileContent) !== null) {
saveClassName = "primary"; saveClassName = "primary";
} }
if (isCeView) { if (isCeView) {
@ -371,6 +368,7 @@ export class PreviewModel implements ViewModel {
return fileInfo?.mimetype; return fileInfo?.mimetype;
}); });
this.fileMimeTypeLoadable = loadable(this.fileMimeType); this.fileMimeTypeLoadable = loadable(this.fileMimeType);
this.newFileContent = jotai.atom(null) as jotai.PrimitiveAtom<string | null>;
this.goParentDirectory = this.goParentDirectory.bind(this); this.goParentDirectory = this.goParentDirectory.bind(this);
const fullFileAtom = jotai.atom<Promise<FullFile>>(async (get) => { const fullFileAtom = jotai.atom<Promise<FullFile>>(async (get) => {
@ -391,23 +389,6 @@ export class PreviewModel implements ViewModel {
this.fullFile = fullFileAtom; this.fullFile = fullFileAtom;
this.fileContent = fileContentAtom; this.fileContent = fileContentAtom;
this.fileContentModified = jotai.atom();
this.fileContentLastSaved = jotai.atom();
this.previewFileContent = jotai.atom(
async (get) => {
const fileContentModified = get(this.fileContentModified);
const fileContentLastSaved = get(this.fileContentLastSaved);
if (!fileContentModified) {
return fileContentLastSaved ?? (await get(this.fileContent));
} else {
return fileContentModified;
}
},
(_get, set, value) => {
set(this.fileContentModified, value);
}
);
this.specializedView = jotai.atom<Promise<{ specializedView?: string; errorStr?: string }>>(async (get) => { this.specializedView = jotai.atom<Promise<{ specializedView?: string; errorStr?: string }>>(async (get) => {
return this.getSpecializedView(get); return this.getSpecializedView(get);
}); });
@ -552,7 +533,7 @@ export class PreviewModel implements ViewModel {
if (filePath == null) { if (filePath == null) {
return; return;
} }
const newFileContent = globalStore.get(this.fileContentModified); const newFileContent = globalStore.get(this.newFileContent);
if (newFileContent == null) { if (newFileContent == null) {
console.log("not saving file, newFileContent is null"); console.log("not saving file, newFileContent is null");
return; return;
@ -560,8 +541,7 @@ export class PreviewModel implements ViewModel {
const conn = globalStore.get(this.connection) ?? ""; const conn = globalStore.get(this.connection) ?? "";
try { try {
services.FileService.SaveFile(conn, filePath, util.stringToBase64(newFileContent)); services.FileService.SaveFile(conn, filePath, util.stringToBase64(newFileContent));
globalStore.set(this.fileContentModified, null); globalStore.set(this.newFileContent, null);
globalStore.set(this.fileContentLastSaved, newFileContent);
console.log("saved file", filePath); console.log("saved file", filePath);
} catch (error) { } catch (error) {
console.error("Error saving file:", error); console.error("Error saving file:", error);
@ -569,7 +549,9 @@ export class PreviewModel implements ViewModel {
} }
async handleFileRevert() { async handleFileRevert() {
globalStore.set(this.fileContentModified, null); const fileContent = await globalStore.get(this.fileContent);
this.monacoRef.current?.setValue(fileContent);
globalStore.set(this.newFileContent, null);
} }
async handleOpenFile(filePath: string) { async handleOpenFile(filePath: string) {
@ -639,7 +621,7 @@ export class PreviewModel implements ViewModel {
const loadableSV = globalStore.get(this.loadableSpecializedView); const loadableSV = globalStore.get(this.loadableSpecializedView);
if (loadableSV.state == "hasData") { if (loadableSV.state == "hasData") {
if (loadableSV.data.specializedView == "codeedit") { if (loadableSV.data.specializedView == "codeedit") {
if (globalStore.get(this.fileContentModified) != null) { if (globalStore.get(this.newFileContent) != null) {
menuItems.push({ type: "separator" }); menuItems.push({ type: "separator" });
menuItems.push({ menuItems.push({
label: "Save File", label: "Save File",
@ -729,11 +711,7 @@ function MarkdownPreview({ model }: SpecializedViewProps) {
}, [connName, fileInfo.dir]); }, [connName, fileInfo.dir]);
return ( return (
<div className="view-preview view-preview-markdown"> <div className="view-preview view-preview-markdown">
<Markdown <Markdown textAtom={model.fileContent} showTocAtom={model.markdownShowToc} resolveOpts={resolveOpts} />
textAtom={model.previewFileContent}
showTocAtom={model.markdownShowToc}
resolveOpts={resolveOpts}
/>
</div> </div>
); );
} }
@ -784,7 +762,8 @@ function StreamingPreview({ model }: SpecializedViewProps) {
} }
function CodeEditPreview({ model }: SpecializedViewProps) { function CodeEditPreview({ model }: SpecializedViewProps) {
const setNewFileContent = jotai.useSetAtom(model.previewFileContent); const fileContent = jotai.useAtomValue(model.fileContent);
const setNewFileContent = jotai.useSetAtom(model.newFileContent);
const fileName = jotai.useAtomValue(model.statFilePath); const fileName = jotai.useAtomValue(model.statFilePath);
function codeEditKeyDownHandler(e: WaveKeyboardEvent): boolean { function codeEditKeyDownHandler(e: WaveKeyboardEvent): boolean {
@ -833,16 +812,16 @@ function CodeEditPreview({ model }: SpecializedViewProps) {
return ( return (
<CodeEditor <CodeEditor
textAtom={model.previewFileContent} text={fileContent}
filename={fileName} filename={fileName}
onChange={setNewFileContent} onChange={(text) => setNewFileContent(text)}
onMount={onMount} onMount={onMount}
/> />
); );
} }
function CSVViewPreview({ model, parentRef }: SpecializedViewProps) { function CSVViewPreview({ model, parentRef }: SpecializedViewProps) {
const fileContent = jotai.useAtomValue(model.previewFileContent); const fileContent = jotai.useAtomValue(model.fileContent);
const fileName = jotai.useAtomValue(model.statFilePath); const fileName = jotai.useAtomValue(model.statFilePath);
return <CSVView parentRef={parentRef} readonly={true} content={fileContent} filename={fileName} />; return <CSVView parentRef={parentRef} readonly={true} content={fileContent} filename={fileName} />;
} }