2 files changed, 6 insertions, 48 deletions

diff --git a/subprojects/frontend/src/editor/ConnectionStatusNotification.tsx b/subprojects/frontend/src/editor/ConnectionStatusNotification.tsx
index 54c4e834..f7f089f0 100644
--- a/subprojects/frontend/src/editor/ConnectionStatusNotification.tsx
+++ b/subprojects/frontend/src/editor/ConnectionStatusNotification.tsx
@@ -1,44 +1,12 @@
 import Button from '@mui/material/Button';
 import { observer } from 'mobx-react-lite';
-import {
-  useSnackbar,
-  type SnackbarKey,
-  type SnackbarMessage,
-  type OptionsObject,
-} from 'notistack';
 import React, { useEffect } from 'react';
 
 import { ContrastThemeProvider } from '../theme/ThemeProvider';
+import useDelayedSnackbar from '../utils/useDelayedSnackbar';
 
 import type EditorStore from './EditorStore';
 
-const DEBOUNCE_TIMEOUT = 350;
-
-function enqueueLater(
-  enqueueSnackbar: (
-    message: SnackbarMessage,
-    options: OptionsObject | undefined,
-  ) => SnackbarKey,
-  closeSnackbar: (key: SnackbarKey) => void,
-  message: SnackbarMessage,
-  options?: OptionsObject | undefined,
-  debounceTimeout = DEBOUNCE_TIMEOUT,
-): () => void {
-  let key: SnackbarKey | undefined;
-  let timeout: number | undefined = setTimeout(() => {
-    timeout = undefined;
-    key = enqueueSnackbar(message, options);
-  }, debounceTimeout);
-  return () => {
-    if (timeout !== undefined) {
-      clearTimeout(timeout);
-    }
-    if (key !== undefined) {
-      closeSnackbar(key);
-    }
-  };
-}
-
 export default observer(function ConnectionStatusNotification({
   editorStore,
 }: {
@@ -51,13 +19,11 @@ export default observer(function ConnectionStatusNotification({
     disconnectedByUser,
     networkMissing,
   } = editorStore;
-  const { enqueueSnackbar, closeSnackbar } = useSnackbar();
+  const enqueueLater = useDelayedSnackbar(350);
 
   useEffect(() => {
     if (opening) {
       return enqueueLater(
-        enqueueSnackbar,
-        closeSnackbar,
         'Connecting to Refinery',
         {
           persist: true,
@@ -73,8 +39,6 @@ export default observer(function ConnectionStatusNotification({
 
     if (connectionErrors.length >= 1 && !opening) {
       return enqueueLater(
-        enqueueSnackbar,
-        closeSnackbar,
         <div>
           Connection error:{' '}
           <b>{connectionErrors[connectionErrors.length - 1]}</b>
@@ -110,8 +74,6 @@ export default observer(function ConnectionStatusNotification({
     if (networkMissing) {
       if (disconnectedByUser) {
         return enqueueLater(
-          enqueueSnackbar,
-          closeSnackbar,
           <div>
             <b>No network connection:</b> Some editing features might be
             degraded
@@ -130,8 +92,6 @@ export default observer(function ConnectionStatusNotification({
       }
 
       return enqueueLater(
-        enqueueSnackbar,
-        closeSnackbar,
         <div>
           <b>No network connection:</b> Refinery will try to reconnect when the
           connection is restored
@@ -154,8 +114,6 @@ export default observer(function ConnectionStatusNotification({
 
     if (disconnectedByUser) {
       return enqueueLater(
-        enqueueSnackbar,
-        closeSnackbar,
         <div>
           <b>Not connected to Refinery:</b> Some editing features might be
           degraded
@@ -181,8 +139,7 @@ export default observer(function ConnectionStatusNotification({
     connectionErrors,
     disconnectedByUser,
     networkMissing,
-    closeSnackbar,
-    enqueueSnackbar,
+    enqueueLater,
   ]);
 
   return null;
diff --git a/subprojects/frontend/src/editor/EditorStore.ts b/subprojects/frontend/src/editor/EditorStore.ts
index ecbe6ef8..c74e732f 100644
--- a/subprojects/frontend/src/editor/EditorStore.ts
+++ b/subprojects/frontend/src/editor/EditorStore.ts
@@ -16,6 +16,7 @@ import { type Command, EditorView } from '@codemirror/view';
 import { makeAutoObservable, observable } from 'mobx';
 import { nanoid } from 'nanoid';
 
+import type PWAStore from '../PWAStore';
 import getLogger from '../utils/getLogger';
 import XtextClient from '../xtext/XtextClient';
 
@@ -51,10 +52,10 @@ export default class EditorStore {
 
   infoCount = 0;
 
-  constructor(initialValue: string) {
+  constructor(initialValue: string, pwaStore: PWAStore) {
     this.id = nanoid();
     this.state = createEditorState(initialValue, this);
-    this.client = new XtextClient(this);
+    this.client = new XtextClient(this, pwaStore);
     this.searchPanel = new SearchPanelStore(this);
     this.lintPanel = new LintPanelStore(this);
     makeAutoObservable<EditorStore, 'client'>(this, {