-
+
+ // let newTransportation: Transportation = {
+ // id:NaN,
+ // user_id: NaN,
+ // type: '',
+ // name: '',
+ // description: null,
+ // rating: NaN,
+ // link: null,
+ // date: null,
+ // flight_number: null,
+ // from_location: null,
+ // to_location: null,
+ // is_public: false,
+ // collection: null,
+ // created_at: '',
+ // updated_at: ''
+ // };
+ import { createEventDispatcher } from 'svelte';
+ import type { Collection, Transportation } from '$lib/types';
+ const dispatch = createEventDispatcher();
+ import { onMount } from 'svelte';
+ import { addToast } from '$lib/toasts';
+ let modal: HTMLDialogElement;
+
+ export let collection: Collection;
+
+ import MapMarker from '~icons/mdi/map-marker';
+ import Calendar from '~icons/mdi/calendar';
+ import Notebook from '~icons/mdi/notebook';
+ import Star from '~icons/mdi/star';
+ import PlaneCar from '~icons/mdi/plane-car';
+ import LinkVariant from '~icons/mdi/link-variant';
+ import Airplane from '~icons/mdi/airplane';
+
+ let type: string = '';
+
+ onMount(async () => {
+ modal = document.getElementById('my_modal_1') as HTMLDialogElement;
+ if (modal) {
+ modal.showModal();
+ }
+ });
+
+ // if (newTransportation.date) {
+ // newTransportation.date = newTransportation.date.slice(0, 19);
+ // }
+
+ function close() {
+ dispatch('close');
+ }
+
+ function handleKeydown(event: KeyboardEvent) {
+ if (event.key === 'Escape') {
+ close();
+ }
+ }
+
+ async function handleSubmit(event: Event) {
+ event.preventDefault();
+ const form = event.target as HTMLFormElement;
+ const formData = new FormData(form);
+
+ const response = await fetch(`/api/transportations/`, {
+ method: 'POST',
+ body: formData
+ });
+
+ if (response.ok) {
+ const result = await response.json();
+
+ addToast('success', 'Transportation added successfully!');
+ dispatch('add', result);
+ close();
+ } else {
+ addToast('error', 'Error editing transportation');
+ }
+ }
+
+
+
diff --git a/frontend/src/lib/types.ts b/frontend/src/lib/types.ts
index a53fc15..ce66789 100644
--- a/frontend/src/lib/types.ts
+++ b/frontend/src/lib/types.ts
@@ -88,7 +88,7 @@ export type OpenStreetMapPlace = {
export type Transportation = {
id: number;
- user_id: User;
+ user_id: number;
type: string;
name: string;
description: string | null;
diff --git a/frontend/src/routes/collections/[id]/+page.svelte b/frontend/src/routes/collections/[id]/+page.svelte
index 64555c9..a83bfd6 100644
--- a/frontend/src/routes/collections/[id]/+page.svelte
+++ b/frontend/src/routes/collections/[id]/+page.svelte
@@ -14,6 +14,7 @@
import { DefaultMarker, MapLibre, Popup } from 'svelte-maplibre';
import TransportationCard from '$lib/components/TransportationCard.svelte';
import EditTransportation from '$lib/components/EditTransportation.svelte';
+ import NewTransportation from '$lib/components/NewTransportation.svelte';
export let data: PageData;
@@ -32,6 +33,7 @@
let notFound: boolean = false;
let isShowingLinkModal: boolean = false;
let isShowingCreateModal: boolean = false;
+ let isShowingTransportationModal: boolean = false;
onMount(() => {
if (data.props.adventure) {
@@ -190,6 +192,17 @@
/>
{/if}
+{#if isShowingTransportationModal}
+
(isShowingTransportationModal = false)}
+ on:add={(event) => {
+ transportations = [event.detail, ...transportations];
+ isShowingTransportationModal = false;
+ }}
+ {collection}
+ />
+{/if}
+
{#if notFound}
Dining
+