diff --git a/src-tauri/src/main.rs b/src-tauri/src/main.rs index 6d3114ae..7a904b81 100644 --- a/src-tauri/src/main.rs +++ b/src-tauri/src/main.rs @@ -8,7 +8,6 @@ extern crate objc; use std::collections::HashMap; -use std::env; use std::env::current_dir; use std::fs::create_dir_all; @@ -25,7 +24,6 @@ use tauri::regex::Regex; use tauri::{AppHandle, Menu, MenuItem, RunEvent, State, Submenu, TitleBarStyle, Window, Wry}; use tauri::{CustomMenuItem, Manager, SystemTray, SystemTrayEvent, SystemTrayMenu, WindowEvent}; use tokio::sync::Mutex; -use tokio::task::spawn_local; use window_ext::WindowExt; diff --git a/src-web/components/core/Editor/Editor.tsx b/src-web/components/core/Editor/Editor.tsx index 7e89d3e6..6094aaf4 100644 --- a/src-web/components/core/Editor/Editor.tsx +++ b/src-web/components/core/Editor/Editor.tsx @@ -6,7 +6,8 @@ import { keymap, placeholder as placeholderExt, tooltips } from '@codemirror/vie import classnames from 'classnames'; import { EditorView } from 'codemirror'; import type { MutableRefObject } from 'react'; -import { memo, useEffect, useMemo, useRef } from 'react'; +import { memo, useEffect, useRef } from 'react'; +import { useUnmount } from 'react-use'; import { IconButton } from '../IconButton'; import './Editor.css'; import { baseExtensions, getLanguageExtension, multiLineExtensions } from './extensions'; @@ -48,8 +49,8 @@ export function Editor({ defaultValue, forceUpdateKey, ...props }: EditorProps) // NOTE: This was originally done to fix a bug where the editor would unmount // and remount after the first change event, something to do with React // StrictMode. This fixes it, though, and actually makes more sense - const fixedDefaultValue = useMemo(() => defaultValue, [forceUpdateKey, props.type]); - return <_Editor defaultValue={fixedDefaultValue} {...props} />; + // const fixedDefaultValue = useMemo(() => defaultValue, [forceUpdateKey, props.type]); + return <_Editor defaultValue={defaultValue} forceUpdateKey={forceUpdateKey} {...props} />; } const _Editor = memo(function _Editor({ @@ -61,6 +62,7 @@ const _Editor = memo(function _Editor({ placeholder, useTemplating, defaultValue, + forceUpdateKey, languageExtension, onChange, onFocus, @@ -68,10 +70,16 @@ const _Editor = memo(function _Editor({ singleLine, format, autocomplete, -}: Omit) { +}: EditorProps) { const cm = useRef<{ view: EditorView; languageCompartment: Compartment } | null>(null); const wrapperRef = useRef(null); + // Unmount editor when we're done + useUnmount(() => { + cm.current?.view.destroy(); + cm.current = null; + }); + // Use ref so we can update the onChange handler without re-initializing the editor const handleChange = useRef(onChange); useEffect(() => { @@ -106,7 +114,7 @@ const _Editor = memo(function _Editor({ if (cm.current === null) return; const { view } = cm.current; view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: defaultValue ?? '' } }); - }, [defaultValue]); + }, [forceUpdateKey]); // Initialize the editor when ref mounts useEffect(() => { @@ -139,10 +147,6 @@ const _Editor = memo(function _Editor({ } catch (e) { console.log('Failed to initialize Codemirror', e); } - return () => { - view.destroy(); - cm.current = null; - }; }, [wrapperRef.current, languageExtension]); const cmContainer = (