9 files changed, 44 insertions, 55 deletions

diff --git a/subprojects/frontend/src/editor/EditorArea.tsx b/subprojects/frontend/src/editor/EditorArea.tsx
index 1c9b031b..7c5ac5fb 100644
--- a/subprojects/frontend/src/editor/EditorArea.tsx
+++ b/subprojects/frontend/src/editor/EditorArea.tsx
@@ -5,7 +5,7 @@ import React, { useCallback, useEffect } from 'react';
 import type EditorStore from './EditorStore';
 import EditorTheme from './EditorTheme';
 
-function EditorArea({
+export default observer(function EditorArea({
   editorStore,
 }: {
   editorStore: EditorStore;
@@ -32,6 +32,4 @@ function EditorArea({
       ref={editorParentRef}
     />
   );
-}
-
-export default observer(EditorArea);
+});
diff --git a/subprojects/frontend/src/editor/EditorButtons.tsx b/subprojects/frontend/src/editor/EditorButtons.tsx
index cbe7c424..d2273c6c 100644
--- a/subprojects/frontend/src/editor/EditorButtons.tsx
+++ b/subprojects/frontend/src/editor/EditorButtons.tsx
@@ -32,7 +32,7 @@ function getLintIcon(severity: Diagnostic['severity'] | undefined) {
   }
 }
 
-function EditorButtons({
+export default observer(function EditorButtons({
   editorStore,
 }: {
   editorStore: EditorStore | undefined;
@@ -102,6 +102,4 @@ function EditorButtons({
       </IconButton>
     </Stack>
   );
-}
-
-export default observer(EditorButtons);
+});
diff --git a/subprojects/frontend/src/editor/EditorPane.tsx b/subprojects/frontend/src/editor/EditorPane.tsx
index df43d2c9..2651726c 100644
--- a/subprojects/frontend/src/editor/EditorPane.tsx
+++ b/subprojects/frontend/src/editor/EditorPane.tsx
@@ -29,7 +29,7 @@ function EditorLoading(): JSX.Element {
   );
 }
 
-function EditorPane(): JSX.Element {
+export default observer(function EditorPane(): JSX.Element {
   const { editorStore } = useRootStore();
 
   return (
@@ -50,6 +50,4 @@ function EditorPane(): JSX.Element {
       </Box>
     </Stack>
   );
-}
-
-export default observer(EditorPane);
+});
diff --git a/subprojects/frontend/src/editor/EditorStore.ts b/subprojects/frontend/src/editor/EditorStore.ts
index b634a427..4407376b 100644
--- a/subprojects/frontend/src/editor/EditorStore.ts
+++ b/subprojects/frontend/src/editor/EditorStore.ts
@@ -13,7 +13,7 @@ import {
   type EditorState,
 } from '@codemirror/state';
 import { type Command, EditorView } from '@codemirror/view';
-import { action, computed, makeObservable, observable } from 'mobx';
+import { makeAutoObservable, observable } from 'mobx';
 import { nanoid } from 'nanoid';
 
 import getLogger from '../utils/getLogger';
@@ -57,29 +57,15 @@ export default class EditorStore {
     this.client = new XtextClient(this);
     this.searchPanel = new SearchPanelStore(this);
     this.lintPanel = new LintPanelStore(this);
-    makeObservable(this, {
+    makeAutoObservable<EditorStore, 'client'>(this, {
+      id: false,
       state: observable.ref,
+      client: false,
       view: observable.ref,
-      showLineNumbers: observable,
-      errorCount: observable,
-      warningCount: observable,
-      infoCount: observable,
-      highestDiagnosticLevel: computed,
-      canUndo: computed,
-      canRedo: computed,
-      setDarkMode: action,
-      setEditorParent: action,
-      dispatch: action,
-      dispatchTransaction: action,
-      doCommand: action,
-      doStateCommand: action,
-      updateDiagnostics: action,
-      nextDiagnostic: action,
-      updateOccurrences: action,
-      updateSemanticHighlighting: action,
-      undo: action,
-      redo: action,
-      toggleLineNumbers: action,
+      searchPanel: false,
+      lintPanel: false,
+      contentAssist: false,
+      formatText: false,
     });
   }
 
@@ -141,13 +127,11 @@ export default class EditorStore {
     }
   }
 
-  private readonly dispatchTransactionWithoutView = action(
-    (tr: Transaction) => {
-      log.trace('Editor transaction', tr);
-      this.state = tr.state;
-      this.client.onTransaction(tr);
-    },
-  );
+  private dispatchTransactionWithoutView(tr: Transaction): void {
+    log.trace('Editor transaction', tr);
+    this.state = tr.state;
+    this.client.onTransaction(tr);
+  }
 
   doCommand(command: Command): boolean {
     if (this.view === undefined) {
diff --git a/subprojects/frontend/src/editor/GenerateButton.tsx b/subprojects/frontend/src/editor/GenerateButton.tsx
index a28f6b4b..5254f6cb 100644
--- a/subprojects/frontend/src/editor/GenerateButton.tsx
+++ b/subprojects/frontend/src/editor/GenerateButton.tsx
@@ -7,7 +7,7 @@ import type EditorStore from './EditorStore';
 
 const GENERATE_LABEL = 'Generate';
 
-function GenerateButton({
+export default observer(function GenerateButton({
   editorStore,
 }: {
   editorStore: EditorStore | undefined;
@@ -53,6 +53,4 @@ function GenerateButton({
       {summary === '' ? GENERATE_LABEL : `${GENERATE_LABEL} (${summary})`}
     </Button>
   );
-}
-
-export default observer(GenerateButton);
+});
diff --git a/subprojects/frontend/src/editor/PanelStore.ts b/subprojects/frontend/src/editor/PanelStore.ts
index e0e2b2f4..4f827280 100644
--- a/subprojects/frontend/src/editor/PanelStore.ts
+++ b/subprojects/frontend/src/editor/PanelStore.ts
@@ -18,13 +18,29 @@ export default class PanelStore {
     private readonly closeCommand: Command,
     protected readonly store: EditorStore,
   ) {
-    makeObservable(this, {
+    makeObservable<
+      PanelStore,
+      | 'openCommand'
+      | 'closeCommand'
+      | 'store'
+      | 'setState'
+      | 'doOpen'
+      | 'doClose'
+    >(this, {
+      panelClass: false,
+      openCommand: false,
+      closeCommand: false,
+      store: false,
       state: observable,
       element: observable,
+      id: false,
       open: action,
       close: action,
       toggle: action,
+      setState: false,
       synchronizeStateToView: action,
+      doOpen: false,
+      doClose: false,
     });
   }
 
diff --git a/subprojects/frontend/src/editor/SearchPanelPortal.tsx b/subprojects/frontend/src/editor/SearchPanelPortal.tsx
index e8301489..b6b375e3 100644
--- a/subprojects/frontend/src/editor/SearchPanelPortal.tsx
+++ b/subprojects/frontend/src/editor/SearchPanelPortal.tsx
@@ -5,7 +5,7 @@ import React from 'react';
 import type EditorStore from './EditorStore';
 import SearchToolbar from './SearchToolbar';
 
-function SearchPanelPortal({
+export default observer(function SearchPanelPortal({
   editorStore: { searchPanel: searchPanelStore },
 }: {
   editorStore: EditorStore;
@@ -20,6 +20,4 @@ function SearchPanelPortal({
       <SearchToolbar searchPanelStore={searchPanelStore} />
     </Portal>
   );
-}
-
-export default observer(SearchPanelPortal);
+});
diff --git a/subprojects/frontend/src/editor/SearchPanelStore.ts b/subprojects/frontend/src/editor/SearchPanelStore.ts
index 8dd02ae6..65d595a8 100644
--- a/subprojects/frontend/src/editor/SearchPanelStore.ts
+++ b/subprojects/frontend/src/editor/SearchPanelStore.ts
@@ -21,7 +21,7 @@ export default class SearchPanelStore extends PanelStore {
     // Use a custom class name to avoid specificity issues with
     // CodeMirror `.cm-search.cm-panel` CSS styles.
     super('refinery-cm-search', openSearchPanel, closeSearchPanel, store);
-    makeObservable(this, {
+    makeObservable<SearchPanelStore, 'selectSearchField'>(this, {
       searchField: observable.ref,
       query: computed,
       invalidRegexp: computed,
@@ -32,6 +32,7 @@ export default class SearchPanelStore extends PanelStore {
       findPrevious: action,
       replaceNext: action,
       replaceAll: action,
+      selectSearchField: false,
     });
   }
 
diff --git a/subprojects/frontend/src/editor/SearchToolbar.tsx b/subprojects/frontend/src/editor/SearchToolbar.tsx
index 895f1ca1..a9b9811d 100644
--- a/subprojects/frontend/src/editor/SearchToolbar.tsx
+++ b/subprojects/frontend/src/editor/SearchToolbar.tsx
@@ -27,7 +27,7 @@ const DimLabel = styled(FormControlLabel)(({ theme }) => ({
   },
 }));
 
-function SearchToolbar({
+export default observer(function SearchToolbar({
   searchPanelStore,
 }: {
   searchPanelStore: SearchPanelStore;
@@ -271,6 +271,4 @@ function SearchToolbar({
       </Stack>
     </Toolbar>
   );
-}
-
-export default observer(SearchToolbar);
+});