appointment info card added duration and fixed date picker month bug

src/lib/modules/AppointmentConfirmDialog.svelte

@@ -55,6 +55,7 @@
 			bind:title={appointment.title}
 			bind:location={appointment.place}
 			bind:description={appointment.description}
+			bind:duration={appointment.duration}
 			bind:time
 			bind:date
 			isConfirmation={true}

src/lib/modules/AppointmentInfo.svelte

@@ -6,6 +6,7 @@
     export let description: string = "";
     export let isConfirmation: boolean = false;
     export let date: Date = new Date();
+    export let duration: number = 0;
     export let time: string = "";
 </script>
 
@@ -14,6 +15,7 @@
     <h5>{title}</h5>
     <p><i>pin_drop</i> {location}</p>
     <p><i>description</i> {description}</p>
+    <p><i>timer</i> {duration} Min.</p>
     {#if isConfirmation}
         <p><i>event</i> {extractDate(new Date(date))}</p>
         <p><i>schedule</i> {time}</p>

src/lib/modules/DatePicker.svelte

@@ -30,7 +30,9 @@
 	const renderCalendar = (): void => {
 		const mDate: Moment = moment(currentDate);
 		const year: number = currentDate.getFullYear();
-		const month: number = mDate.month() + 1;
+		const month: number = mDate.month();
+
+		// make sure to properly translate this
 		currentMonth = currentDate.toLocaleDateString('en-US', { month: 'long', year: 'numeric' });
 
 		const firstDayOfMonth: Date = new Date(year, month, 1);

src/routes/+page.svelte

@@ -1,25 +1,10 @@
 <script lang="ts">
+	import { goto } from "$app/navigation";
 	import { onMount } from "svelte";
 
-    interface Message {
-        message: string
-    }
 
-    let data: Message;
-
-    async function getMessage() {
-        let response = await fetch("/api/test");
-        data = await response.json();
-    }
-
-    onMount(async () => {
-        await getMessage();
-         
+    onMount(() => {
+        goto("/user/events");
     });
 </script>
 
-<h1>Welcome to SvelteKit</h1>
-<p>Visit <a href="https://svelte.dev/docs/kit">svelte.dev/docs/kit</a> to read the documentation</p>
-{#if data}
-    <p>{data.message}</p>
-{/if}

src/routes/appointment/+page.svelte

@@ -26,7 +26,8 @@
 			method: 'GET',
 			headers: {
 				'Content-Type': 'application/json'
-			}
+			},
+			cache: "no-store"
 		});
 
 		if (response.status === 404) {
@@ -62,6 +63,7 @@
 			bind:title={appointment.title}
 			bind:description={appointment.description}
 			bind:location={appointment.place}
+			bind:duration={appointment.duration}
 		/>
 		{#key selectedDate}
 			<DateTimes bind:activateModal bind:selectedDate bind:availableTimes={appointmentDateTimes} />

src/routes/user/creator/+page.svelte

@@ -25,6 +25,7 @@
 	let endpoint: "create" | "modify" = "create";
 	let appointmentId: string = "";
 	let oldAppointmentTimes: AppointmentDateTimes[] = [];
+	let errorMessage: string = "";
 
 
 	let appointmentList: AppointmentList[] = [
@@ -129,6 +130,7 @@
 
 	async function saveAppointment() {
 		if (!topic || !description || !dueDate || !location || !duration || !creatorInputs || !appointmentList) {
+			errorMessage = "not all parameters provided";
 			return;
 		}
 		console.log(appointmentList);
@@ -157,6 +159,14 @@
 
 			appointmentSaved = response.status === 200;
 
+			if (response.status === 400) {
+				errorMessage = "not all parameters provided";
+			}
+
+			if (response.status === 500) {
+				errorMessage = "internal server error";
+			}
+
 			setTimeout(() => {
 				appointmentSaved = false;
 			}, 5000);
@@ -208,6 +218,9 @@
 		}
 	});
 
+	// add error messages: missing inputs/backend error/...
+	// remove debug logs
+
 	// get time slots before sending
 </script>
 
@@ -234,6 +247,10 @@
 	<div class="snackbar green active">Erfolgreich gespeichert</div>
 {/if}
 
+{#if errorMessage}
+	<div class="snackbar error active">{errorMessage}</div>
+{/if}
+
 <style>
 	fieldset {
 		max-width: 90%;

src/routes/user/participants/+page.svelte

@@ -65,7 +65,7 @@
 
 {#if appointmentData && ready}
 
-    <AppointmentInfo title={appointmentData.title} location={appointmentData.place} description={`${appointmentData.duration} Min`} />
+    <AppointmentInfo title={appointmentData.title} location={appointmentData.place} description={appointmentData.description} duration={appointmentData.duration} />
 
     <table class="border large-space large-text">
         <thead>