```text

feat: Add type prop to CreateNewAdventure component

The code changes include adding a new prop called "type" to the CreateNewAdventure component in order to specify the type of adventure being created. This prop is passed from the parent component and used to set the "type" property of the newAdventure object. This allows for more flexibility in creating adventures with different types.

src/lib/components/CreateNewAdventure.svelte

@@ -1,9 +1,10 @@
 <script lang="ts">
   let newAdventure: Adventure;
+  export let type: string;
 
   newAdventure = {
     id: -1,
-    type: "mylog",
+    type: type,
     name: "",
     location: "",
     date: "",

src/routes/log/+page.svelte

@@ -246,7 +246,11 @@
 {/if}
 
 {#if isShowingMoreFields}
-  <MoreFieldsInput on:create={createNewAdventure} on:close={handleClose} />
+  <MoreFieldsInput
+    on:create={createNewAdventure}
+    on:close={handleClose}
+    type="mylog"
+  />
 {/if}
 
 {#if adventureToEdit && adventureToEdit.id != undefined}

src/routes/planner/+page.svelte

@@ -9,6 +9,7 @@
     removeAdventure,
   } from "../../services/adventureService.js";
   import SucessToast from "$lib/components/SucessToast.svelte";
+  import mapDrawing from "$lib/assets/adventure_map.svg";
   export let data;
   let plans: Adventure[] = [];
   let isLoading = true;
@@ -62,11 +63,11 @@
   }
 
   async function remove(event: { detail: number }) {
-    let initialLenght: number = plans.length;
+    let initialLength: number = plans.length;
     let theAdventure = plans.find((adventure) => adventure.id === event.detail);
     if (theAdventure) {
       let newArray = await removeAdventure(theAdventure, plans);
-      if (newArray.length == initialLenght - 1) {
+      if (newArray.length === initialLength - 1) {
         plans = newArray;
         showToast("Adventure removed successfully!");
       } else {
@@ -116,6 +117,12 @@
   <SucessToast action={toastAction} />
 {/if}
 
+<div class="flex justify-center items-center w-full mt-4 mb-4">
+  <article class="prose">
+    <h2 class="text-center">Add new Plan</h2>
+  </article>
+</div>
+
 <div class="flex flex-row items-center justify-center gap-4">
   <button
     type="button"
@@ -125,6 +132,13 @@
     <iconify-icon icon="mdi:plus" class="text-2xl"></iconify-icon>
   </button>
 </div>
+{#if plans.length != 0}
+  <div class="flex justify-center items-center w-full mt-4 mb-4">
+    <article class="prose">
+      <h1 class="text-center">My Adventure Plans</h1>
+    </article>
+  </div>
+{/if}
 
 {#if isLoading}
   <div class="flex justify-center items-center w-full mt-16">
@@ -145,10 +159,21 @@
   {/each}
 </div>
 
+{#if plans.length == 0 && !isLoading}
+  <div class="flex flex-col items-center justify-center mt-16">
+    <article class="prose mb-4"><h2>Add some plans!</h2></article>
+    <img src={mapDrawing} width="25%" alt="Logo" />
+  </div>
+{/if}
+
 {#if adventureToEdit && adventureToEdit.id != undefined}
   <EditModal bind:adventureToEdit on:submit={savePlan} on:close={handleClose} />
 {/if}
 
 {#if isShowingMoreFields}
-  <MoreFieldsInput on:create={createNewAdventure} on:close={handleClose} />
+  <MoreFieldsInput
+    on:create={createNewAdventure}
+    on:close={handleClose}
+    type="planner"
+  />
 {/if}

src/services/adventureService.ts

@@ -67,7 +67,7 @@ export async function removeAdventure(
   if (response.ok) {
     // remove adventure from array where id matches
     adventureArray = adventureArray.filter(
-      (adventure) => adventure.id !== adventure.id
+      (existingAdventure) => existingAdventure.id !== adventure.id
     );
     // showToast("Adventure removed successfully!");
   } else {
@@ -75,6 +75,8 @@ export async function removeAdventure(
     adventureArray = [];
   }
 
+  console.log(adventureArray);
+
   return adventureArray;
 }