lodging beta

backend/server/adventures/models.py

@@ -8,6 +8,7 @@ from django_resized import ResizedImageField
 ADVENTURE_TYPES = [
     ('visited', 'Visited'),
     ('planned', 'Planned'),
+    ('lodging', 'Lodging'),
 ]
 
 

backend/server/adventures/views.py

@@ -138,8 +138,9 @@ class AdventureViewSet(viewsets.ModelViewSet):
         #     queryset = Adventure.objects.filter(
         #         Q(is_public=True) | Q(user_id=request.user.id), collection=None
         #     )
+        allowed_types = ['visited', 'planned']
         queryset = Adventure.objects.filter(
-            Q(user_id=request.user.id)
+            Q(user_id=request.user.id) & Q(type__in=allowed_types)
         )
         
         queryset = self.apply_sorting(queryset)

frontend/src/lib/components/AdventureCard.svelte

@@ -149,9 +149,12 @@
 		<div>
 			{#if adventure.type == 'visited' && user?.pk == adventure.user_id}
 				<div class="badge badge-primary">Visited</div>
-			{:else if user?.pk == adventure.user_id}
+			{:else if user?.pk == adventure.user_id && adventure.type == 'planned'}
 				<div class="badge badge-secondary">Planned</div>
+			{:else if user?.pk == adventure.user_id && adventure.type == 'lodging'}
+				<div class="badge badge-success">Lodging</div>
 			{/if}
+
 			<div class="badge badge-neutral">{adventure.is_public ? 'Public' : 'Private'}</div>
 		</div>
 		{#if adventure.location && adventure.location !== ''}

frontend/src/lib/components/NewAdventure.svelte

@@ -11,6 +11,7 @@
 
 	export let longitude: number | null = null;
 	export let latitude: number | null = null;
+	export let collection_id: number | null = null;
 
 	import MapMarker from '~icons/mdi/map-marker';
 	import Calendar from '~icons/mdi/calendar';
@@ -39,7 +40,7 @@
 		latitude: null,
 		longitude: null,
 		is_public: false,
-		collection: null
+		collection: collection_id || NaN
 	};
 
 	if (longitude && latitude) {
@@ -371,6 +372,14 @@
 						bind:value={newAdventure.longitude}
 						class="input input-bordered w-full max-w-xs mt-1"
 					/>
+					<input
+						type="text"
+						id="collection"
+						name="collection"
+						hidden
+						bind:value={newAdventure.collection}
+						class="input input-bordered w-full max-w-xs mt-1"
+					/>
 
 					<button type="submit" class="btn btn-primary mr-4 mt-4">Create</button>
 					<button type="button" class="btn mt-4" on:click={close}>Close</button>

frontend/src/routes/adventures/+page.server.ts

@@ -64,6 +64,7 @@ export const actions: Actions = {
 		let link = formData.get('link') as string | null;
 		let latitude = formData.get('latitude') as string | null;
 		let longitude = formData.get('longitude') as string | null;
+		let collection = formData.get('collection') as string | null;
 
 		// check if latitude and longitude are valid
 		if (latitude && longitude) {
@@ -108,6 +109,7 @@ export const actions: Actions = {
 		formDataToSend.append('description', description || '');
 		formDataToSend.append('latitude', latitude || '');
 		formDataToSend.append('longitude', longitude || '');
+		formDataToSend.append('collection', collection || '');
 		if (activity_types) {
 			// Filter out empty and duplicate activity types, then trim each activity type
 			const cleanedActivityTypes = Array.from(

frontend/src/routes/collections/[id]/+page.svelte

@@ -10,6 +10,7 @@
 	import AdventureLink from '$lib/components/AdventureLink.svelte';
 	import EditAdventure from '$lib/components/EditAdventure.svelte';
 	import NotFound from '$lib/components/NotFound.svelte';
+	import NewAdventure from '$lib/components/NewAdventure.svelte';
 
 	export let data: PageData;
 
@@ -25,6 +26,7 @@
 	}
 
 	let notFound: boolean = false;
+	let isShowingLinkModal: boolean = false;
 	let isShowingCreateModal: boolean = false;
 
 	onMount(() => {
@@ -72,6 +74,11 @@
 		return groupedAdventures;
 	}
 
+	function createAdventure(event: CustomEvent<Adventure>) {
+		adventures = [event.detail, ...adventures];
+		isShowingCreateModal = false;
+	}
+
 	async function addAdventure(event: CustomEvent<Adventure>) {
 		console.log(event.detail);
 		if (adventures.find((a) => a.id === event.detail.id)) {
@@ -111,6 +118,8 @@
 	let adventureToEdit: Adventure;
 	let isEditModalOpen: boolean = false;
 
+	let newType: string;
+
 	function editAdventure(event: CustomEvent<Adventure>) {
 		adventureToEdit = event.detail;
 		isEditModalOpen = true;
@@ -127,11 +136,11 @@
 	}
 </script>
 
-{#if isShowingCreateModal}
+{#if isShowingLinkModal}
 	<AdventureLink
 		user={data?.user ?? null}
 		on:close={() => {
-			isShowingCreateModal = false;
+			isShowingLinkModal = false;
 		}}
 		on:add={addAdventure}
 	/>
@@ -145,6 +154,15 @@
 	/>
 {/if}
 
+{#if isShowingCreateModal}
+	<NewAdventure
+		type={newType}
+		collection_id={collection.id}
+		on:create={createAdventure}
+		on:close={() => (isShowingCreateModal = false)}
+	/>
+{/if}
+
 {#if notFound}
 	<div
 		class="flex min-h-[100dvh] flex-col items-center justify-center bg-background px-4 py-12 sm:px-6 lg:px-8 -mt-20"
@@ -188,11 +206,39 @@
 					<button
 						class="btn btn-primary"
 						on:click={() => {
-							isShowingCreateModal = true;
+							isShowingLinkModal = true;
 						}}
 					>
 						Adventure</button
 					>
+					<p class="text-center font-bold text-lg">Add new...</p>
+					<button
+						class="btn btn-primary"
+						on:click={() => {
+							isShowingCreateModal = true;
+							newType = 'visited';
+						}}
+					>
+						Visited Adventure</button
+					>
+					<button
+						class="btn btn-primary"
+						on:click={() => {
+							isShowingCreateModal = true;
+							newType = 'planned';
+						}}
+					>
+						Planned Adventure</button
+					>
+					<button
+						class="btn btn-primary"
+						on:click={() => {
+							isShowingCreateModal = true;
+							newType = 'lodging';
+						}}
+					>
+						Lodging</button
+					>
 
 					<!-- <button
 			class="btn btn-primary"
@@ -238,7 +284,7 @@
 	</div>
 
 	{#if collection.start_date && collection.end_date}
-		<h1 class="text-center font-bold text-4xl mt-4">Itinerary</h1>
+		<h1 class="text-center font-bold text-4xl mt-4">Itinerary by Date</h1>
 		{#if numberOfDays}
 			<p class="text-center text-lg pl-16 pr-16">Duration: {numberOfDays} days</p>
 		{/if}