finalized event cancel logic

ui/src/pages/Calendar.vue

@@ -30,7 +30,7 @@ function buildFullDate(month: number, year: number): Date {
 }
 
 const { selectedMonth, selectedYear, years, goPrev, goNext, goToday, onDatesSet, goToSelectedDate } = useCalendarNavigation(api)
-const { events } = useCalendarEvents(selectedMonth, selectedYear);
+const { events, loadEvents} = useCalendarEvents(selectedMonth, selectedYear);
 
 const panelOpen = ref(false)
 const activeEvent = ref<CalendarEvent | null>(null)
@@ -48,7 +48,7 @@ const dialogRef = ref<any>(null)
 
 // NEW: handle day/time slot clicks to start creating an event
 function onDateClick(arg: { dateStr: string }) {
-    dialogRef.value?.openDialog();
+    dialogRef.value?.openDialog(arg.dateStr);
     // For now, just open the panel with a draft payload.
     // activeEvent.value = {
     //     id: '__draft__',
@@ -215,7 +215,7 @@ onMounted(() => {
             <aside v-if="panelOpen"
                 class="3xl:w-lg 2xl:w-md border-l bg-card text-foreground flex flex-col overflow-auto scrollbar-themed"
                 :style="{ height: 'calc(100vh - 61px)', position: 'sticky', top: '64px' }">
-                <ViewCalendarEvent @close="() => { router.push('/calendar'); }">
+                <ViewCalendarEvent @close="() => { router.push('/calendar'); }" @reload="loadEvents()">
                 </ViewCalendarEvent>
             </aside>
         </div>