hotfix: prpevent to use arrows in datepicker

Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>

src/lib/i18n/messages.json

@@ -28,6 +28,7 @@
 		"public": "Public",
 		"private": "Private",
 		"inviteOnly": "Invite Only",
+		"invite-only": "Invite Only",
 		"limited": "Limited",
 		"unlimited": "Unlimited",
 		"capacity": "Capacity",
@@ -267,7 +268,7 @@
 	"layout": {
 		"defaultTitle": "Cactoide -",
 		"defaultDescription": "Create and manage event RSVPs",
-		"userIdCookieText": "Your UserID storated as a cookie:",
+		"userIdCookieText": "Your UserID stored as a cookie:",
 		"firstTimeVisiting": "First time visiting. Generating new UserID...",
 		"copyright": "© 2025 Cactoide"
 	}

src/routes/+error.svelte

@@ -14,7 +14,7 @@
 	<!-- Error Content -->
 	<div class="container mx-auto flex-1 px-4 py-8">
 		<div class="mx-auto max-w-md text-center">
-			<div class="rounded-sm border border-red-500/30 bg-red-900/20 p-8">
+			<div class="rounded-sm border border-red-500/30 bg-red-900 p-8">
 				<div class="mb-4 text-6xl text-red-400">🚨</div>
 				<h2 class="mb-4 text-2xl font-bold text-red-400">{t('errors.errorTitle')}</h2>
 

src/routes/create/+page.svelte

@@ -139,6 +139,11 @@
 								bind:value={eventData.date}
 								min={today}
 								class="border-dark-300 w-full rounded-sm border-2 bg-white px-4 py-3 text-slate-900 shadow-sm transition-all duration-200"
+								on:keydown={(e) => {
+									if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
+										e.preventDefault();
+									}
+								}}
 								required
 							/>
 							{#if errors.date}

src/routes/event/+page.svelte

@@ -156,7 +156,8 @@
 												? 'border-green-300 text-green-400'
 												: 'border-orange-300 text-orange-400'}"
 										>
-											{event.visibility === 'public' ? t('common.public') : t('common.private')}
+											<!-- TODO(polaroi8d): replace with something better solution; message.json using this, beacuse of common.invite-only works here -->
+											{t(`common.${event.visibility}`)}
 										</span>
 									</div>
 									<div class="flex items-center space-x-2"></div>

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

@@ -485,19 +485,19 @@
 {#if success}
 	{#if typeToShow === '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"
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-green-500/30 bg-green-900 p-4 text-green-400"
 		>
 			{success}
 		</div>
 	{:else if typeToShow === '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"
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-yellow-500/30 bg-yellow-900 p-4 text-yellow-400"
 		>
 			{t('event.removedRsvpSuccessfully')}
 		</div>
 	{:else if typeToShow === 'copy'}
 		<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"
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-yellow-500/30 bg-yellow-900 p-4 text-yellow-400"
 		>
 			{t('event.eventLinkCopied')}
 		</div>
@@ -508,7 +508,7 @@
 
 {#if error}
 	<div
-		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-red-500/30 bg-red-900/20 p-4 text-red-400"
+		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-red-500/30 bg-red-900 p-4 text-red-400"
 	>
 		{error}
 	</div>

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

@@ -76,7 +76,7 @@ export const actions: Actions = {
 		const date = formData.get('date') as string;
 		const time = formData.get('time') as string;
 		const location = formData.get('location') as string;
-		const locationType = formData.get('location_type') as 'none' | 'text' | 'maps';
+		const locationType = formData.get('locationType') as string;
 		const locationUrl = formData.get('location_url') as string;
 		const type = formData.get('type') as 'limited' | 'unlimited';
 		const attendeeLimit = formData.get('attendee_limit') as string;
@@ -109,7 +109,7 @@ export const actions: Actions = {
 			});
 		}
 
-		// Check if date is in the past using local timezone (but allow editing past events for corrections)
+		// Check if date is in the past using local timezone
 		const [year, month, day] = date.split('-').map(Number);
 		const eventDate = new Date(year, month - 1, day);
 		const today = new Date();
@@ -148,7 +148,6 @@ export const actions: Actions = {
 				}
 			});
 		}
-
 		// Update the event
 		await database
 			.update(events)
@@ -157,7 +156,7 @@ export const actions: Actions = {
 				date: date,
 				time: time,
 				location: location?.trim() || '',
-				locationType: locationType,
+				locationType: locationType as 'none' | 'text' | 'maps',
 				locationUrl: locationType === 'maps' ? locationUrl?.trim() : null,
 				type: type,
 				attendeeLimit: type === 'limited' ? parseInt(attendeeLimit) : null,

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

@@ -1,5 +1,5 @@
 <script lang="ts">
-	import type { EventType, LocationType } from '$lib/types';
+	import type { CreateEventData, EventType, LocationType } from '$lib/types';
 	import { enhance } from '$app/forms';
 	import { goto } from '$app/navigation';
 	import { t } from '$lib/i18n/i18n.js';
@@ -7,7 +7,7 @@
 	export let data;
 	export let form;
 
-	let eventData = {
+	let eventData: CreateEventData = {
 		name: data.event.name,
 		date: data.event.date,
 		time: data.event.time,
@@ -15,7 +15,7 @@
 		location_type: data.event.locationType || 'none',
 		location_url: data.event.locationUrl || '',
 		type: data.event.type,
-		attendee_limit: data.event.attendeeLimit,
+		attendee_limit: data.event.attendeeLimit || undefined,
 		visibility: data.event.visibility
 	};
 
@@ -44,14 +44,14 @@
 			attendee_limit: (values as any).attendee_limit
 				? // eslint-disable-next-line @typescript-eslint/no-explicit-any
 					parseInt(String((values as any).attendee_limit))
-				: null
+				: undefined
 		};
 	}
 
 	const handleTypeChange = (type: EventType) => {
 		eventData.type = type;
 		if (type === 'unlimited') {
-			eventData.attendee_limit = null;
+			eventData.attendee_limit = undefined;
 		}
 	};
 
@@ -162,6 +162,11 @@
 								bind:value={eventData.date}
 								min={today}
 								class="border-dark-300 w-full rounded-sm border-2 bg-white px-4 py-3 text-slate-900 shadow-sm transition-all duration-200"
+								on:keydown={(e) => {
+									if (['ArrowUp', 'ArrowDown', 'ArrowLeft', 'ArrowRight'].includes(e.key)) {
+										e.preventDefault();
+									}
+								}}
 								required
 							/>
 							{#if errors.date}
@@ -189,6 +194,9 @@
 
 					<!-- Location Type -->
 					<div>
+						<!-- Hidden input to submit locationType value -->
+						<input type="hidden" name="locationType" bind:value={eventData.location_type} />
+
 						<fieldset>
 							<legend class="text-dark-800 mb-3 block text-sm font-semibold">
 								{t('create.locationTypeLabel')}
@@ -279,6 +287,9 @@
 
 					<!-- Event Type -->
 					<div>
+						<!-- Hidden input to submit type value -->
+						<input type="hidden" name="type" bind:value={eventData.type} />
+
 						<fieldset>
 							<legend class="text-dark-800 mb-3 block text-sm font-semibold">
 								{t('common.type')} <span class="text-red-400">{t('common.required')}</span>
@@ -333,6 +344,9 @@
 
 					<!-- Event Visibility -->
 					<div>
+						<!-- Hidden input to submit visibility value -->
+						<input type="hidden" name="visibility" bind:value={eventData.visibility} />
+
 						<fieldset>
 							<legend class="text-dark-800 mb-3 block text-sm font-semibold">
 								{t('common.visibility')} <span class="text-red-400">{t('common.required')}</span>
@@ -444,7 +458,7 @@
 <!-- Invite Link Toast -->
 {#if showInviteLinkToast}
 	<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"
+		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-yellow-500/30 bg-yellow-900 p-4 text-yellow-400"
 	>
 		{t('event.inviteLinkCopied')}
 	</div>

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

@@ -450,13 +450,13 @@
 {#if success}
 	{#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"
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-green-500 bg-green-900 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"
+			class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-yellow-500 bg-yellow-900 p-4 text-yellow-400"
 		>
 			{t('event.removedRsvpSuccessfully')}
 		</div>
@@ -465,7 +465,7 @@
 
 {#if error}
 	<div
-		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-red-500/30 bg-red-900/20 p-4 text-red-400"
+		class="fixed right-4 bottom-4 z-40 w-128 rounded-sm border border-red-500 bg-red-900 p-4 text-red-400"
 	>
 		{error}
 	</div>