Fix build

src-web/components/App.tsx

@@ -5,6 +5,7 @@ import { invoke } from '@tauri-apps/api';
 import { listen } from '@tauri-apps/api/event';
 import { appWindow } from '@tauri-apps/api/window';
 import { MotionConfig } from 'framer-motion';
+import { Suspense } from 'react';
 import { DndProvider } from 'react-dnd';
 import { HTML5Backend } from 'react-dnd-html5-backend';
 import { HelmetProvider } from 'react-helmet-async';
@@ -128,10 +129,6 @@ await listen('send_request', async () => {
   await invoke('send_request', { requestId });
 });
 
-await listen('refresh', () => {
-  location.reload();
-});
-
 await listen('zoom', ({ payload: zoomDelta }: { payload: number }) => {
   const fontSize = parseFloat(window.getComputedStyle(document.documentElement).fontSize);
 
@@ -148,14 +145,17 @@ await listen('zoom', ({ payload: zoomDelta }: { payload: number }) => {
 });
 
 export function App() {
+  console.log('STARTING APP');
   return (
     <QueryClientProvider client={queryClient}>
       <MotionConfig transition={{ duration: 0.1 }}>
         <HelmetProvider>
           <DndProvider backend={HTML5Backend}>
             <DialogProvider>
-              <AppRouter />
-              {/*<ReactQueryDevtools initialIsOpen={false} />*/}
+              <Suspense>
+                <AppRouter />
+                {/*<ReactQueryDevtools initialIsOpen={false} />*/}
+              </Suspense>
             </DialogProvider>
           </DndProvider>
         </HelmetProvider>

src-web/components/AppRouter.tsx

@@ -1,4 +1,3 @@
-import { Suspense } from 'react';
 import { createBrowserRouter, Navigate, RouterProvider } from 'react-router-dom';
 import { routePaths } from '../hooks/useRoutes';
 import { useTauriListeners } from '../hooks/useTauriListeners';
@@ -35,10 +34,8 @@ const router = createBrowserRouter([
 ]);
 
 export function AppRouter() {
+  console.log('AppRouter');
   useTauriListeners();
-  return (
-    <Suspense>
-      <RouterProvider router={router} />
-    </Suspense>
-  );
+  console.log('AppRouter 2');
+  return <RouterProvider router={router} />;
 }

src-web/components/core/Editor/Editor.tsx

@@ -92,11 +92,8 @@ export function Editor({
 
   useEffect(() => {
     if (cm.current === null) return;
-    const { view, languageCompartment } = cm.current;
-    const newDoc = defaultValue;
-    view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: newDoc ?? '' } });
-    const ext = getLanguageExtension({ contentType, useTemplating, autocomplete });
-    view.dispatch({ effects: languageCompartment.reconfigure(ext) });
+    const { view } = cm.current;
+    view.dispatch({ changes: { from: 0, to: view.state.doc.length, insert: defaultValue ?? '' } });
   }, [forceUpdateKey]);
 
   // Initialize the editor when ref mounts

src-web/components/core/Editor/index.tsx

@@ -1,7 +1,10 @@
 import { memo } from 'react';
+import * as editor from './Editor';
 
 export type { EditorProps } from './Editor';
-const editor = await import('./Editor');
+// TODO: Figure out why code-splitting breaks production build from
+//   showing any content
+// const editor = await import('./Editor');
 
 export const Editor = memo(editor.Editor);
 export const graphql = editor.graphql;

src-web/hooks/useTauriListeners.ts

@@ -1,4 +1,5 @@
 import { useQueryClient } from '@tanstack/react-query';
+import { listen } from '@tauri-apps/api/event';
 import { appWindow } from '@tauri-apps/api/window';
 import { useEffect } from 'react';
 import { debounce } from '../lib/debounce';
@@ -27,6 +28,13 @@ export function useTauriListeners() {
         else unsubFns.push(unsub);
       });
 
+    listen('refresh', () => {
+      location.reload();
+    }).then((unsub) => {
+      if (unmounted) unsub();
+      else unsubFns.push(unsub);
+    });
+
     appWindow
       .listen(
         'updated_request',

src-web/main.tsx

@@ -1,3 +1,4 @@
+console.log('FIRST 0');
 import { StrictMode } from 'react';
 import ReactDOM from 'react-dom/client';
 import { App } from './components/App';
@@ -5,7 +6,9 @@ import { getKeyValue } from './lib/keyValueStore';
 import { getPreferredAppearance, setAppearance } from './lib/theme/window';
 import './main.css';
 
+console.log('FIRST');
 setAppearance(await getKeyValue({ key: 'appearance', fallback: getPreferredAppearance() }));
+console.log('SECOND');
 
 // root holds our app's root DOM Element:
 ReactDOM.createRoot(document.getElementById('root') as HTMLElement).render(