Update

src/components/admin/pages/edit/Editor.svelte

@@ -28,15 +28,18 @@
     import MDEMarkdownEditor from "./MDEMarkdownEditor.svelte";
     import {pageRepo} from "@repo/page.ts";
 
-    export let pageId: number;
-    export let branch: string;
-    export let dirty: boolean = false;
+  interface Props {
+    pageId: number;
+    branch: string;
+    dirty?: boolean;
+  }
+
+  let { pageId, branch, dirty = $bindable(false) }: Props = $props();
 
     let dispatcher = createEventDispatcher();
 
-    $: pageFuture = $pageRepo.getPage(pageId, branch).then(getPage);
-    let pageContent = "";
-    let page: Page | null = null;
+    let pageContent = $state("");
+    let page: Page | null = $state(null);
 
     function getPage(value: Page): Page {
         page = value;
@@ -66,8 +69,9 @@
             dispatcher("reload");
         }
     }
+    let pageFuture = $derived($pageRepo.getPage(pageId, branch).then(getPage));
 </script>
-<svelte:window on:beforeunload={() => {
+<svelte:window onbeforeunload={() => {
     if (dirty) {
         return "You have unsaved changes. Are you sure you want to leave?";
     }
@@ -78,14 +82,16 @@
     <div>
         <div>
             <Toolbar class="!bg-gray-900">
-                <ToolbarGroup slot="end">
-                    <ToolbarButton on:click={deletePage}>
-                        Delete
-                    </ToolbarButton>
-                    <ToolbarButton color="primary" on:click={savePage}>
-                        Save
-                    </ToolbarButton>
-                </ToolbarGroup>
+                {#snippet end()}
+                <ToolbarGroup >
+                      <ToolbarButton on:click={deletePage}>
+                          Delete
+                      </ToolbarButton>
+                      <ToolbarButton color="primary" on:click={savePage}>
+                          Save
+                      </ToolbarButton>
+                  </ToolbarGroup>
+              {/snippet}
             </Toolbar>
         </div>
         {#if page?.name.endsWith("md") || page?.name.endsWith("mdx")}