fix: location missing field error

database/init.sql

@@ -14,7 +14,7 @@ CREATE TABLE IF NOT EXISTS events (
     date            DATE NOT NULL,
     time            TIME NOT NULL,
     location        VARCHAR(200) NOT NULL,
-    location_type   VARCHAR(20) NOT NULL DEFAULT 'text' CHECK (location_type IN ('text','maps')),
+    location_type   VARCHAR(20) NOT NULL DEFAULT 'none' CHECK (location_type IN ('none','text','maps')),
     location_url    VARCHAR(500),
     type            VARCHAR(20) NOT NULL CHECK (type IN ('limited','unlimited')),
     attendee_limit  INTEGER CHECK (attendee_limit > 0),

src/lib/database/schema.ts

@@ -17,7 +17,7 @@ import type { InferInsertModel, InferSelectModel } from 'drizzle-orm';
 // --- Enums (matching the SQL CHECK constraints)
 export const eventTypeEnum = pgEnum('event_type', ['limited', 'unlimited']);
 export const visibilityEnum = pgEnum('visibility', ['public', 'private']);
-export const locationTypeEnum = pgEnum('location_type', ['text', 'maps']);
+export const locationTypeEnum = pgEnum('location_type', ['none', 'text', 'maps']);
 
 // --- Events table
 export const events = pgTable(
@@ -28,7 +28,7 @@ export const events = pgTable(
 		date: date('date', { mode: 'string' }).notNull(), // ISO 'YYYY-MM-DD'
 		time: time('time', { withTimezone: false }).notNull(), // 'HH:MM:SS'
 		location: varchar('location', { length: 200 }).notNull(),
-		locationType: locationTypeEnum('location_type').notNull().default('text'),
+		locationType: locationTypeEnum('location_type').notNull().default('none'),
 		locationUrl: varchar('location_url', { length: 500 }),
 		type: eventTypeEnum('type').notNull(),
 		attendeeLimit: integer('attendee_limit'), // nullable in SQL

src/lib/i18n/messages.json

@@ -15,8 +15,10 @@
 		"time": "Time",
 		"location": "Location",
 		"locationType": "Location Type",
+		"locationNone": "None",
 		"locationText": "Text",
 		"locationMaps": "Google Maps",
+		"locationNoneDescription": "No location specified",
 		"locationTextDescription": "Enter location as plain text.",
 		"locationMapsDescription": "Enter Google Maps link.",
 		"googleMapsUrl": "Google Maps URL",
@@ -142,10 +144,12 @@
 		"locationLabel": "Location",
 		"locationPlaceholder": "Enter location",
 		"locationTypeLabel": "Location Type",
+		"locationNoneOption": "None",
 		"locationTextOption": "Plain Text",
 		"locationMapsOption": "Google Maps",
-		"locationTextDescription": "Enter location as plain text",
+		"locationNoneDescription": "No location specified.",
-		"locationMapsDescription": "Enter Google Maps link",
+		"locationTextDescription": "Enter location as plain text.",
+		"locationMapsDescription": "Enter Google Maps link.",
 		"googleMapsUrlLabel": "Google Maps URL",
 		"googleMapsUrlPlaceholder": "https://maps.google.com/...",
 		"typeLabel": "Type",
@@ -156,8 +160,8 @@
 		"visibilityLabel": "Visibility",
 		"publicOption": "🌍 Public",
 		"privateOption": "🔒 Private",
-		"publicDescription": "Public events are visible to everyone and can be discovered by others",
+		"publicDescription": "Public events are visible to everyone and can be discovered by others.",
-		"privateDescription": "Private events are only visible to you and people you share the link with",
+		"privateDescription": "Private events are only visible to you and people you share the link with.",
 		"creatingEvent": "Creating Event...",
 		"createEventButton": "Create Event"
 	},

src/lib/types.ts

@@ -1,7 +1,7 @@
 export type EventType = 'limited' | 'unlimited';
 export type EventVisibility = 'public' | 'private';
 export type ActionType = 'add' | 'remove';
-export type LocationType = 'text' | 'maps';
+export type LocationType = 'none' | 'text' | 'maps';
 
 export interface Event {
 	id: string;

src/routes/+page.svelte

@@ -25,7 +25,7 @@
 			<h2 class="mt-6 pt-8 text-xl md:text-2xl">
 				{t('home.whyCactoideTitle')}<span class="text-violet-400"
 					><a href="https://en.wikipedia.org/wiki/Cactoideae" target="_blank">*</a></span
-				>?🌵
+				>
 			</h2>
 			<p class="mt-4 text-lg md:text-xl">
 				{t('home.whyCactoideDescription')}

src/routes/create/+page.server.ts

@@ -21,7 +21,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 'text' | 'maps';
+		const locationType = formData.get('location_type') as 'none' | 'text' | 'maps';
 		const locationUrl = formData.get('location_url') as string;
 		const type = formData.get('type') as 'limited' | 'unlimited';
 		const attendeeLimit = formData.get('attendee_limit') as string;
@@ -34,8 +34,8 @@ export const actions: Actions = {
 		if (!name?.trim()) missingFields.push('name');
 		if (!date) missingFields.push('date');
 		if (!time) missingFields.push('time');
-		if (!location?.trim()) missingFields.push('location');
 		if (!locationType) missingFields.push('location_type');
+		if (locationType === 'text' && !location?.trim()) missingFields.push('location');
 		if (locationType === 'maps' && !locationUrl?.trim()) missingFields.push('location_url');
 		if (!userId) missingFields.push('userId');
 
@@ -99,7 +99,7 @@ export const actions: Actions = {
 				name: name.trim(),
 				date: date,
 				time: time,
-				location: location.trim(),
+				location: location?.trim() || '',
 				locationType: locationType,
 				locationUrl: locationType === 'maps' ? locationUrl?.trim() : null,
 				type: type,

src/routes/create/+page.svelte

@@ -11,7 +11,7 @@
 		date: '',
 		time: '',
 		location: '',
-		location_type: 'text',
+		location_type: 'none',
 		location_url: '',
 		type: 'unlimited',
 		attendee_limit: undefined,
@@ -50,7 +50,10 @@
 
 	const handleLocationTypeChange = (locationType: LocationType) => {
 		eventData.location_type = locationType;
-		if (locationType === 'text') {
+		if (locationType === 'none') {
+			eventData.location = '';
+			eventData.location_url = '';
+		} else if (locationType === 'text') {
 			eventData.location_url = '';
 			eventData.location = '';
 		} else {
@@ -70,7 +73,7 @@
 <div class="flex min-h-screen flex-col">
 	<!-- Main Content -->
 	<div class="container mx-auto flex-1 px-4 py-8">
-		<div class="mx-auto max-w-md">
+		<div class="mx-auto max-w-2xl">
 			<!-- Event Creation Form -->
 			<div class="rounded-sm border p-8">
 				<h2 class="mb-8 text-center text-3xl font-bold text-violet-400">{t('create.formTitle')}</h2>
@@ -168,7 +171,17 @@
 								{t('create.locationTypeLabel')}
 								<span class="text-red-400">{t('common.required')}</span>
 							</legend>
-							<div class="grid grid-cols-2 gap-3">
+							<div class="grid grid-cols-3 gap-3">
+								<button
+									type="button"
+									class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
+									'none'
+										? ' border-violet-500 bg-violet-400/20 font-semibold hover:bg-violet-400/70'
+										: 'border-dark-300 text-dark-700'}"
+									on:click={() => handleLocationTypeChange('none')}
+								>
+									{t('create.locationNoneOption')}
+								</button>
 								<button
 									type="button"
 									class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
@@ -190,52 +203,56 @@
 									{t('create.locationMapsOption')}
 								</button>
 							</div>
-							<p class="mt-2 text-xs text-slate-400">
+							<p class="mt-2 text-xs text-slate-400 italic">
-								{eventData.location_type === 'text'
+								{eventData.location_type === 'none'
-									? t('create.locationTextDescription')
+									? t('create.locationNoneDescription')
-									: t('create.locationMapsDescription')}
+									: eventData.location_type === 'text'
+										? t('create.locationTextDescription')
+										: t('create.locationMapsDescription')}
 							</p>
 						</fieldset>
 					</div>
 
-					<!-- Location Input -->
+					<!-- Location Input (only show when not 'none') -->
-					<div>
+					{#if eventData.location_type !== 'none'}
-						<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
+						<div>
-							{eventData.location_type === 'text'
+							<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
-								? t('create.locationLabel')
+								{eventData.location_type === 'text'
-								: t('create.googleMapsUrlLabel')}
+									? t('create.locationLabel')
-							<span class="text-red-400">{t('common.required')}</span>
+									: t('create.googleMapsUrlLabel')}
-						</label>
+								<span class="text-red-400">{t('common.required')}</span>
-						{#if eventData.location_type === 'text'}
+							</label>
-							<input
+							{#if eventData.location_type === 'text'}
-								id="location"
+								<input
-								name="location"
+									id="location"
-								type="text"
+									name="location"
-								bind:value={eventData.location}
+									type="text"
-								class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
+									bind:value={eventData.location}
-								placeholder={t('create.locationPlaceholder')}
+									class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
-								maxlength="200"
+									placeholder={t('create.locationPlaceholder')}
-								required
+									maxlength="200"
-							/>
+									required
-						{:else}
+								/>
-							<input
+							{:else}
-								id="location_url"
+								<input
-								name="location_url"
+									id="location_url"
-								type="url"
+									name="location_url"
-								bind:value={eventData.location_url}
+									type="url"
-								class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
+									bind:value={eventData.location_url}
-								placeholder={t('create.googleMapsUrlPlaceholder')}
+									class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
-								maxlength="500"
+									placeholder={t('create.googleMapsUrlPlaceholder')}
-								required
+									maxlength="500"
-							/>
+									required
-						{/if}
+								/>
-						{#if errors.location}
+							{/if}
-							<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
+							{#if errors.location}
-						{/if}
+								<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
-						{#if errors.location_url}
+							{/if}
-							<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
+							{#if errors.location_url}
-						{/if}
+								<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
-					</div>
+							{/if}
+						</div>
+					{/if}
 
 					<!-- Event Type -->
 					<div>
@@ -274,7 +291,7 @@
 						<div>
 							<label for="limit" class="text-dark-800 mb-3 block text-sm font-semibold">
 								{t('create.attendeeLimitLabel')}
-								{t('common.required')}
+								<span class="text-red-400">{t('common.required')}</span>
 							</label>
 							<input
 								id="attendee_limit"
@@ -322,7 +339,7 @@
 									{t('create.privateOption')}
 								</button>
 							</div>
-							<p class="mt-2 text-xs text-slate-400">
+							<p class="mt-2 text-xs text-slate-400 italic">
 								{eventData.visibility === 'public'
 									? t('create.publicDescription')
 									: t('create.privateDescription')}
@@ -342,7 +359,7 @@
 						<button
 							type="submit"
 							disabled={isSubmitting}
-							class="hover:bg-violet-400/70'l rounded-sm border-2 border-violet-500 bg-violet-400/20 px-4 py-3 py-4 font-bold font-medium font-semibold text-white shadow-lg transition-all duration-200 hover:scale-105"
+							class="hover:bg-violet-400/70'l flex-2 rounded-sm border-2 border-violet-500 bg-violet-400/20 px-4 py-3 py-4 font-bold font-medium font-semibold text-white shadow-lg transition-all duration-200 hover:scale-105"
 						>
 							{#if isSubmitting}
 								<div class="flex items-center justify-center">

src/routes/discover/+page.svelte

@@ -289,14 +289,16 @@
 												d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"
 											></path>
 										</svg>
-										{#if event.location_type === 'maps' && event.location_url}
+										{#if event.location_type === 'none'}
+											<span>N/A</span>
+										{:else if event.location_type === 'maps' && event.location_url}
 											<a
 												href={event.location_url}
 												target="_blank"
 												rel="noopener noreferrer"
 												class="text-slate-500 transition-colors duration-200 hover:text-slate-300"
 											>
-												{event.location}
+												{t('create.locationMapsOption')}
 											</a>
 										{:else}
 											<span>{event.location}</span>

src/routes/event/+page.svelte

@@ -126,14 +126,16 @@
 												d="M15 11a3 3 0 11-6 0 3 3 0 016 0z"
 											></path>
 										</svg>
-										{#if event.location_type === 'maps' && event.location_url}
+										{#if event.location_type === 'none'}
+											<span>N/A</span>
+										{:else if event.location_type === 'maps' && event.location_url}
 											<a
 												href={event.location_url}
 												target="_blank"
 												rel="noopener noreferrer"
 												class="text-slate-500 transition-colors duration-200 hover:text-slate-300"
 											>
-												{event.location}
+												Google Maps
 											</a>
 										{:else}
 											<span>{event.location}</span>

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

@@ -106,7 +106,7 @@
 				</div>
 			</div>
 		{:else if event}
-			<div class="mx-auto max-w-md space-y-6">
+			<div class="mx-auto max-w-2xl space-y-6">
 				<!-- Event Details Card -->
 
 				<div class="rounded-sm border p-6 shadow-2xl">
@@ -136,7 +136,7 @@
 							</div>
 						</div>
 
-						<!-- Location -->
+						<!-- Location (only show when not 'none') -->
 						<div class="flex items-center space-x-3 text-violet-400">
 							<div class="flex h-8 w-8 items-center justify-center rounded-sm">
 								<svg class=" h-4 w-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
@@ -155,14 +155,16 @@
 								</svg>
 							</div>
 							<div>
-								{#if event.location_type === 'maps' && event.location_url}
+								{#if event.location_type === 'none'}
+									<p class="font-semibold text-white">N/A</p>
+								{:else if event.location_type === 'maps' && event.location_url}
 									<a
 										href={event.location_url}
 										target="_blank"
 										rel="noopener noreferrer"
 										class="font-semibold text-white transition-colors duration-200 hover:text-violet-300"
 									>
-										{event.location}
+										{t('create.locationMapsOption')}
 									</a>
 								{:else}
 									<p class="font-semibold text-white">{event.location}</p>

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

@@ -53,7 +53,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 'text' | 'maps';
+		const locationType = formData.get('location_type') as 'none' | 'text' | 'maps';
 		const locationUrl = formData.get('location_url') as string;
 		const type = formData.get('type') as 'limited' | 'unlimited';
 		const attendeeLimit = formData.get('attendee_limit') as string;
@@ -65,8 +65,8 @@ export const actions: Actions = {
 		if (!name?.trim()) missingFields.push('name');
 		if (!date) missingFields.push('date');
 		if (!time) missingFields.push('time');
-		if (!location?.trim()) missingFields.push('location');
 		if (!locationType) missingFields.push('location_type');
+		if (locationType === 'text' && !location?.trim()) missingFields.push('location');
 		if (locationType === 'maps' && !locationUrl?.trim()) missingFields.push('location_url');
 
 		if (missingFields.length > 0) {
@@ -132,7 +132,7 @@ export const actions: Actions = {
 				name: name.trim(),
 				date: date,
 				time: time,
-				location: location.trim(),
+				location: location?.trim() || '',
 				locationType: locationType,
 				locationUrl: locationType === 'maps' ? locationUrl?.trim() : null,
 				type: type,

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

@@ -12,7 +12,7 @@
 		date: data.event.date,
 		time: data.event.time,
 		location: data.event.location,
-		location_type: data.event.locationType || 'text',
+		location_type: data.event.locationType || 'none',
 		location_url: data.event.locationUrl || '',
 		type: data.event.type,
 		attendee_limit: data.event.attendeeLimit,
@@ -53,7 +53,10 @@
 
 	const handleLocationTypeChange = (locationType: LocationType) => {
 		eventData.location_type = locationType;
-		if (locationType === 'text') {
+		if (locationType === 'none') {
+			eventData.location = '';
+			eventData.location_url = '';
+		} else if (locationType === 'text') {
 			eventData.location_url = '';
 			eventData.location = '';
 		} else {
@@ -73,7 +76,7 @@
 <div class="flex min-h-screen flex-col">
 	<!-- Main Content -->
 	<div class="container mx-auto flex-1 px-4 py-8">
-		<div class="mx-auto max-w-md">
+		<div class="mx-auto max-w-2xl">
 			<!-- Event Edit Form -->
 			<div class="rounded-sm border p-8">
 				<div class="mb-8 text-center">
@@ -169,7 +172,17 @@
 								{t('create.locationTypeLabel')}
 								<span class="text-red-400">{t('common.required')}</span>
 							</legend>
-							<div class="grid grid-cols-2 gap-3">
+							<div class="grid grid-cols-3 gap-3">
+								<button
+									type="button"
+									class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
+									'none'
+										? ' border-violet-500 bg-violet-400/20 font-semibold hover:bg-violet-400/70'
+										: 'border-dark-300 text-dark-700'}"
+									on:click={() => handleLocationTypeChange('none')}
+								>
+									{t('create.locationNoneOption')}
+								</button>
 								<button
 									type="button"
 									class="rounded-sm border-2 px-4 py-3 font-medium transition-all duration-200 {eventData.location_type ===
@@ -192,51 +205,55 @@
 								</button>
 							</div>
 							<p class="mt-2 text-xs text-slate-400">
-								{eventData.location_type === 'text'
+								{eventData.location_type === 'none'
-									? t('create.locationTextDescription')
+									? t('create.locationNoneDescription')
-									: t('create.locationMapsDescription')}
+									: eventData.location_type === 'text'
+										? t('create.locationTextDescription')
+										: t('create.locationMapsDescription')}
 							</p>
 						</fieldset>
 					</div>
 
-					<!-- Location Input -->
+					<!-- Location Input (only show when not 'none') -->
-					<div>
+					{#if eventData.location_type !== 'none'}
-						<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
+						<div>
-							{eventData.location_type === 'text'
+							<label for="location" class="text-dark-800 mb-3 block text-sm font-semibold">
-								? t('create.locationTypeLabel')
+								{eventData.location_type === 'text'
-								: t('create.googleMapsUrlLabel')}
+									? t('create.locationLabel')
-							<span class="text-red-400">{t('common.required')}</span>
+									: t('create.googleMapsUrlLabel')}
-						</label>
+								<span class="text-red-400">{t('common.required')}</span>
-						{#if eventData.location_type === 'text'}
+							</label>
-							<input
+							{#if eventData.location_type === 'text'}
-								id="location"
+								<input
-								name="location"
+									id="location"
-								type="text"
+									name="location"
-								bind:value={eventData.location}
+									type="text"
-								class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
+									bind:value={eventData.location}
-								placeholder={t('create.locationPlaceholder')}
+									class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
-								maxlength="200"
+									placeholder={t('create.locationPlaceholder')}
-								required
+									maxlength="200"
-							/>
+									required
-						{:else}
+								/>
-							<input
+							{:else}
-								id="location_url"
+								<input
-								name="location_url"
+									id="location_url"
-								type="url"
+									name="location_url"
-								bind:value={eventData.location_url}
+									type="url"
-								class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
+									bind:value={eventData.location_url}
-								placeholder={t('create.googleMapsUrlPlaceholder')}
+									class="border-dark-300 placeholder-dark-500 w-full rounded-sm border-2 px-4 py-3 text-slate-900 shadow-sm transition-all"
-								maxlength="500"
+									placeholder={t('create.googleMapsUrlPlaceholder')}
-								required
+									maxlength="500"
-							/>
+									required
-						{/if}
+								/>
-						{#if errors.location}
+							{/if}
-							<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
+							{#if errors.location}
-						{/if}
+								<p class="mt-2 text-sm font-medium text-red-600">{errors.location}</p>
-						{#if errors.location_url}
+							{/if}
-							<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
+							{#if errors.location_url}
-						{/if}
+								<p class="mt-2 text-sm font-medium text-red-600">{errors.location_url}</p>
-					</div>
+							{/if}
+						</div>
+					{/if}
 
 					<!-- Event Type -->
 					<div>