Fix entry screen not updating

src/routes/+page.svelte

@@ -1,29 +1,27 @@
 <script lang="ts">
-    const {
-      data
-    } = $props()
+    const { data } = $props();
 
-    import Calendar from '$lib/components/calendar.svelte'
-    import Editor from '$lib/components/editor/index.svelte';
-    import EntrySummaryView from '$lib/components/entrySummaryView.svelte'
-    import AddEntryCover from '$lib/components/addEntryCover.svelte'
-    import { today } from '$lib/date';
+    import Calendar from "$lib/components/calendar.svelte";
+    import Editor from "$lib/components/editor/index.svelte";
+    import EntrySummaryView from "$lib/components/entrySummaryView.svelte";
+    import AddEntryCover from "$lib/components/addEntryCover.svelte";
+    import { today } from "$lib/date";
 
-    let edit = $state(false)
-    let selectedEntry = $state('')
-    let selectedDate = $state(today())
+    let edit = $state(false);
+    let selectedEntry = $state("");
+    let selectedDate = $state(today());
 
     let selectEntry = async (hasEntry: boolean, data: string | null) => {
         // data should be the entryID if hasEntry == true, or the date if there is no entry
         if (hasEntry) {
-        const res = await fetch(`/api/entry?id=${data}`)
-        selectedEntry = await res.json()
-        selectedDate = selectedEntry.date
+            const res = await fetch(`/api/entry?id=${data}`);
+            selectedEntry = await res.json();
+            selectedDate = selectedEntry.date;
         } else {
-        selectedEntry = ''
-        selectedDate = data as string
-      }
+            selectedEntry = "";
+            selectedDate = data as string;
         }
+    };
 
     // $effect(() => {selectedEntry = ''})
 </script>
@@ -31,22 +29,26 @@
 <Calendar entries={data.all} dayClickCallback={selectEntry} />
 
 <div class="flex flex-col md:flex-row space-y-4 w-full mt-6">
-    
     <div class="md:w-1/2 md:order-2">
         {#if selectedEntry}
+            {#key selectedEntry.id}
                 <Editor bind:entry={selectedEntry} />
+            {/key}
         {:else}
+            {#key selectedDate}
                 <AddEntryCover bind:date={selectedDate} />
+            {/key}
         {/if}
     </div>
 
     <div class="md:w-1/2 md:mr-4">
         <ul>
             {#each data.all as entry}
-                <EntrySummaryView clickCB={async () => await selectEntry(true, entry.id)} {entry} />
+                <EntrySummaryView
+                    clickCB={async () => await selectEntry(true, entry.id)}
+                    {entry}
+                />
             {/each}
         </ul>
     </div>
-        
-        
-    </div>
+</div>