added redirect for unauthorized users and formatted date on booking card

src/lib/funcs.ts

@@ -1,5 +1,6 @@
 import moment from "moment";
 import type { AppointmentTimes } from "./dbdata";
+import { goto } from "$app/navigation";
 
 export function isSameDate(dateA: Date, dateB: Date) {
     const date1 = moment(dateA).format('YYYY-MM-DD');
@@ -35,4 +36,13 @@ export function getTimeSlots(startDate: string, startTime: string, endTime: stri
 
 export function isDueDatePassed(dueDate: Date) {
     return moment(dueDate).isBefore();
+}
+
+export async function authFetch(input: RequestInfo | URL, init?: RequestInit): Promise<Response> {
+    const response = await fetch(input, init);
+    if (response.status === 401) {
+        goto("/auth");
+        throw new Error("Unauthorized");
+    }
+    return response;
 }

src/lib/modules/AppointmentInfo.svelte

@@ -1,4 +1,6 @@
 <script lang="ts">
+	import { extractDate } from "$lib/funcs";
+
     export let title: string = "";
     export let location: string = "";
     export let description: string = "";
@@ -13,7 +15,7 @@
     <p><i>pin_drop</i> {location}</p>
     <p><i>description</i> {description}</p>
     {#if isConfirmation}
-        <p><i>event</i> {date}</p>
+        <p><i>event</i> {extractDate(date)}</p>
         <p><i>schedule</i> {time}</p>
     {/if}
 </article>  

src/lib/modules/AppointmentRegisterInputs.svelte

@@ -44,15 +44,22 @@
             })
 
             if (response.status === 200) {
+                errorMessage = "";
                 successMessage = "successfully booked";
             } else {
-                errorMessage = "invalid credentials";
+                successMessage = "";
+                errorMessage = "invalid booking";
             }
+
+            setTimeout(() => {
+                successMessage = "";
+                errorMessage = "";
+            }, 7500);
         } catch (error) {
             console.log(error);
         }
     }
-    
+
     async function submit() {
         let customInputs: DynamicJson[] = [];
         errorMessage = "";

src/lib/modules/EventTables.svelte

@@ -2,7 +2,7 @@
 	import { goto } from '$app/navigation';
 	import { api_host, authToken } from '$lib';
 	import type { Appointment } from '$lib/dbdata';
-	import { isDueDatePassed } from '$lib/funcs';
+	import { authFetch, isDueDatePassed } from '$lib/funcs';
 	import { onMount } from 'svelte';
 
 	let appointmentData: Appointment[] = [];
@@ -13,17 +13,13 @@
 
 	async function fetchAppointments() {
 		try {
-			const response = await fetch(`${api_host}/api/users/appointments`, {
+			const response = await authFetch(`${api_host}/api/users/appointments`, {
 				method: 'GET',
 				headers: {
 					Authorization: 'Bearer ' + $authToken
 				}
 			});
 
-			if (!response.ok) {
-				throw new Error(`HTTP error! Status: ${response.status}`);
-			}
-
 			const data: Appointment[] = await response.json();
 			appointmentData = data;
 			console.log(appointmentData);

src/routes/appointment/+page.svelte

@@ -28,10 +28,6 @@
 				'Content-Type': 'application/json'
 			}
 		});
-		const js: Appointment = await response.json();
-		appointment = js;
-		appointmentDateTimes = js.times.filter((element) => element.available === true);
-        dynamicInputs = js.inputs;
 
 		if (response.status === 404) {
 			goto('/errors/404');
@@ -39,6 +35,11 @@
 		if (response.status === 410) {
 			goto('/errors/410');
 		}
+
+		const js: Appointment = await response.json();
+		appointment = js;
+		appointmentDateTimes = js.times.filter((element) => element.available === true);
+        dynamicInputs = js.inputs;
 	}
 
 	onMount(async () => {

src/routes/errors/410/+page.svelte

@@ -1 +1 @@
-<h2>410: Gone</h2>
+<h2>This booking page is not available anymore</h2>

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

@@ -1,6 +1,7 @@
 <script lang="ts">
     import { api_host, authToken } from "$lib";
 	import type { Appointment } from "$lib/dbdata";
+	import { authFetch } from "$lib/funcs";
 	import { onMount } from "svelte";
 
     let appointmentData: Appointment[] = [];
@@ -8,7 +9,7 @@
 
     async function fetchAppointments() {
         try {
-            const response = await fetch(`${api_host}/api/users/appointments`, {
+            const response = await authFetch(`${api_host}/api/users/appointments`, {
                 method: "GET",
                 headers: {
                     "Authorization": "Bearer " + $authToken

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

@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { api_host, authToken } from '$lib';
 	import type { AppointmentInputs, AppointmentList, AppointmentTimes, WeekdayAppointment } from '$lib/dbdata';
-	import { getTimeSlots } from '$lib/funcs';
+	import { authFetch, getTimeSlots } from '$lib/funcs';
 	import CreatorBaseInputs from '$lib/modules/CreatorBaseInputs.svelte';
 	import CreatorInputs from '$lib/modules/CreatorInputs.svelte';
 	import CreatorTimeInputs from '$lib/modules/CreatorTimeInputs.svelte';
@@ -131,7 +131,7 @@
 		console.log(convertedTimes);
 
 		try {
-            const response = await fetch(`${api_host}/api/users/create`, {
+            const response = await authFetch(`${api_host}/api/users/create`, {
                 method: "POST",
                 headers: {
                     "Content-Type": "application/json",

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

@@ -3,7 +3,7 @@
 	import { page } from "$app/stores";
     import { api_host, authToken } from "$lib";
 	import type { Appointment, AppointmentBooking } from "$lib/dbdata";
-	import { extractDate, extractTime } from "$lib/funcs";
+	import { authFetch, extractDate, extractTime } from "$lib/funcs";
 	import AppointmentInfo from "$lib/modules/AppointmentInfo.svelte";
 	import { onMount } from "svelte";
 
@@ -13,7 +13,7 @@
 
     async function fetchParticipants(appointmentId: string) {
         try {
-            const response = await fetch(`${api_host}/api/users/bookings?appointmentId=${appointmentId}`, {
+            const response = await authFetch(`${api_host}/api/users/bookings?appointmentId=${appointmentId}`, {
                 method: "GET",
                 headers: {
                     "Authorization": "Bearer " + $authToken
@@ -33,7 +33,7 @@
 
     async function fetchAppointment(appointmentId: string) {
         try {
-            const response = await fetch(`${api_host}/api/schedule?appointmentId=${appointmentId}&isUser=true`, {
+            const response = await authFetch(`${api_host}/api/schedule?appointmentId=${appointmentId}&isUser=true`, {
                 method: "GET",
                 headers: {
                     "Authorization": "Bearer " + $authToken