fix: refactor, docker, dateformatter

src/lib/dateFormatter.ts

@@ -0,0 +1,12 @@
+export const formatDate = (dateString: string): string => {
+	const date = new Date(dateString);
+	const year = date.getFullYear();
+	const month = String(date.getMonth() + 1).padStart(2, '0');
+	const day = String(date.getDate()).padStart(2, '0');
+	return `${year}/${month}/${day}`;
+};
+
+export const formatTime = (timeString: string): string => {
+	const [hours, minutes] = timeString.split(':');
+	return `${hours}:${minutes}`;
+};

src/lib/types.ts

@@ -1,5 +1,6 @@
 export type EventType = 'limited' | 'unlimited';
 export type EventVisibility = 'public' | 'private';
+export type ActionType = 'add' | 'remove';
 
 export interface Event {
 	id: string;

src/routes/discover/+page.svelte

@@ -2,6 +2,7 @@
 	import type { Event } from '$lib/types';
 	import { goto } from '$app/navigation';
 	import type { PageData } from '../$types';
+	import { formatTime, formatDate } from '$lib/dateFormatter';
 
 	let publicEvents: Event[] = [];
 	let error = '';
@@ -9,19 +10,6 @@
 	export let data: PageData;
 	// Use the server-side data
 	$: publicEvents = data.events;
-
-	function formatDate(dateString: string): string {
-		const date = new Date(dateString);
-		const year = date.getFullYear();
-		const month = String(date.getMonth() + 1).padStart(2, '0');
-		const day = String(date.getDate()).padStart(2, '0');
-		return `${year}/${month}/${day}`;
-	}
-
-	function formatTime(timeString: string): string {
-		const [hours, minutes] = timeString.split(':');
-		return `${hours}:${minutes}`;
-	}
 </script>
 
 <svelte:head>

src/routes/event/+page.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
 	import type { Event } from '$lib/types';
 	import { goto } from '$app/navigation';
+	import { formatTime, formatDate } from '$lib/dateFormatter';
 
 	export let data: { events: Event[] };
 
@@ -56,19 +57,6 @@
 		showDeleteModal = false;
 		eventToDelete = null;
 	}
-
-	function formatDate(dateString: string): string {
-		const date = new Date(dateString);
-		const year = date.getFullYear();
-		const month = String(date.getMonth() + 1).padStart(2, '0');
-		const day = String(date.getDate()).padStart(2, '0');
-		return `${year}/${month}/${day}`;
-	}
-
-	function formatTime(timeString: string): string {
-		const [hours, minutes] = timeString.split(':');
-		return `${hours}:${minutes}`;
-	}
 </script>
 
 <svelte:head>

src/routes/event/[id]/+page.server.ts

@@ -117,15 +117,14 @@ export const actions: Actions = {
 				createdAt: new Date()
 			});
 
-			return { success: true };
+			return { success: true, type: 'add' };
 		} catch (err) {
 			console.error('Error adding RSVP:', err);
 			return fail(500, { error: 'Failed to add RSVP' });
 		}
 	},
 
-	removeRSVP: async ({ request, params }) => {
-		const eventId = params.id;
+	removeRSVP: async ({ request }) => {
 		const formData = await request.formData();
 
 		const rsvpId = formData.get('rsvpId') as string;
@@ -136,7 +135,7 @@ export const actions: Actions = {
 
 		try {
 			await drizzleQuery.delete(rsvps).where(eq(rsvps.id, rsvpId));
-			return { success: true };
+			return { success: true, type: 'remove' };
 		} catch (err) {
 			console.error('Error removing RSVP:', err);
 			return fail(500, { error: 'Failed to remove RSVP' });

src/routes/event/[id]/+page.svelte

@@ -3,6 +3,7 @@
 	import type { Event, RSVP } from '$lib/types';
 	import { goto } from '$app/navigation';
 	import { enhance } from '$app/forms';
+	import { formatTime, formatDate } from '$lib/dateFormatter';
 
 	export let data: { event: Event; rsvps: RSVP[]; userId: string };
 	export let form;
@@ -34,19 +35,6 @@
 
 	const eventId = $page.params.id;
 
-	function formatDate(dateString: string, timeString: string): string {
-		const date = new Date(`${dateString}T${timeString}`);
-		const year = date.getFullYear();
-		const month = String(date.getMonth() + 1).padStart(2, '0');
-		const day = String(date.getDate()).padStart(2, '0');
-		return `${year}/${month}/${day}`;
-	}
-
-	function formatTime(timeString: string): string {
-		const [hours, minutes] = timeString.split(':');
-		return `${hours}:${minutes}`;
-	}
-
 	function copyEventLink() {
 		const url = `${window.location.origin}/event/${eventId}`;
 		navigator.clipboard.writeText(url).then(() => {
@@ -329,11 +317,19 @@
 
 <!-- Success/Error Messages -->
 {#if success}
-	<div
-		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-green-500/30 bg-green-900/20 p-4 text-green-400"
-	>
-		{success}
-	</div>
+	{#if form?.type === 'add'}
+		<div
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-green-500/30 bg-green-900/20 p-4 text-green-400"
+		>
+			{success}
+		</div>
+	{:else if form?.type === 'remove'}
+		<div
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-yellow-500/30 bg-yellow-900/20 p-4 text-yellow-400"
+		>
+			Removed RSVP successfully.
+		</div>
+	{/if}
 {/if}
 
 {#if error}