chore(react/type_widget): bring back update interval

This commit is contained in:
Elian Doran 2025-09-20 13:03:46 +03:00
parent b19da81572
commit 6dd939df14
No known key found for this signature in database
4 changed files with 11 additions and 7 deletions

View File

@ -75,11 +75,12 @@ export function useSpacedUpdate(callback: () => void | Promise<void>, interval =
return spacedUpdateRef.current;
}
export function useEditorSpacedUpdate({ note, getData, onContentChange, dataSaved }: {
export function useEditorSpacedUpdate({ note, getData, onContentChange, dataSaved, updateInterval }: {
note: FNote,
getData: () => Promise<object | undefined> | object | undefined,
onContentChange: (newContent: string) => void,
dataSaved?: () => void
dataSaved?: () => void,
updateInterval?: number;
}) {
const parentComponent = useContext(ParentComponent);
const blob = useNoteBlob(note, parentComponent?.componentId);
@ -105,6 +106,9 @@ export function useEditorSpacedUpdate({ note, getData, onContentChange, dataSave
spacedUpdate.allowUpdateWithoutChange(() => onContentChange(blob.content));
}, [ blob ]);
// React to update interval changes.
useEffect(() => spacedUpdate.setUpdateInterval(updateInterval), [ updateInterval ]);
return spacedUpdate;
}

View File

@ -35,10 +35,11 @@ export function ReadOnlyCode({ note, viewScope, ntxId, parentComponent }: TypeWi
)
}
export function EditableCode({ note, ntxId, debounceUpdate, parentComponent, ...editorProps }: TypeWidgetProps & {
export function EditableCode({ note, ntxId, debounceUpdate, parentComponent, updateInterval, ...editorProps }: TypeWidgetProps & {
// if true, the update will be debounced to prevent excessive updates. Especially useful if the editor is linked to a live preview.
debounceUpdate?: boolean;
lineWrapping?: boolean;
updateInterval?: number;
}) {
const editorRef = useRef<VanillaCodeMirror>(null);
const containerRef = useRef<HTMLPreElement>(null);
@ -52,7 +53,8 @@ export function EditableCode({ note, ntxId, debounceUpdate, parentComponent, ...
codeEditor.setText(content ?? "");
codeEditor.setMimeType(note.mime);
codeEditor.clearHistory();
}
},
updateInterval
});
// Set up keyboard shortcuts.

View File

@ -33,6 +33,7 @@ export default function SplitEditor({ note, error, splitOptions, ...editorProps
<EditableCode
note={note}
lineWrapping={false}
updateInterval={750} debounceUpdate
{...editorProps}
/>
</div>

View File

@ -25,7 +25,6 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
constructor() {
super();
this.editorTypeWidget = new EditableCodeTypeWidget(true);
this.editorTypeWidget.updateBackgroundColor = () => {};
this.editorTypeWidget.isEnabled = () => true;
@ -39,8 +38,6 @@ export default abstract class AbstractSplitTypeWidget extends TypeWidget {
}
doRender(): void {
this.spacedUpdate.setUpdateInterval(750);
// Preview pane
this.$previewCol = this.$widget.find(".note-detail-split-preview-col");
this.$preview = this.$widget.find(".note-detail-split-preview");