From f0894a964f9ad7ec56c7df09a3710009e7f8a73e Mon Sep 17 00:00:00 2001
From: Sean Morley <zipsm15@gmail.com>
Date: Tue, 2 Apr 2024 21:33:41 +0000
Subject: [PATCH] Refactor AdventureCard component and remove
 FeaturedAdventureCard

---
 src/lib/components/AdventureCard.svelte       | 28 +++++++++++++++++++
 .../components/FeaturedAdventureCard.svelte   | 24 ----------------
 src/routes/featured/+page.svelte              |  4 +--
 src/routes/log/+page.svelte                   |  2 +-
 4 files changed, 31 insertions(+), 27 deletions(-)
 delete mode 100644 src/lib/components/FeaturedAdventureCard.svelte

diff --git a/src/lib/components/AdventureCard.svelte b/src/lib/components/AdventureCard.svelte
index a94b0be..f185407 100644
--- a/src/lib/components/AdventureCard.svelte
+++ b/src/lib/components/AdventureCard.svelte
@@ -4,6 +4,8 @@
     import calendar from "$lib/assets/calendar.svg";
     const dispatch = createEventDispatcher();
 
+    export let type:String;
+
     export let name:String;
     export let location:String;
     export let created:string;
@@ -15,13 +17,22 @@
     function edit() {
         dispatch('edit', id)
     }
+    function add() {
+        dispatch('add', {name, location});
+    }
 </script>
 
+{#if type === 'mylog'}
+
 <div class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-neutral shadow-xl overflow-hidden">
     <div class="card-body">
       <h2 class="card-title overflow-ellipsis">{name}</h2>
+      {#if location !== ""}
       <p><img src={locationDot} class="inline-block -mt-1 mr-1" alt="Logo" />{location}</p>
+      {/if}
+      {#if created !== ""}
       <p><img src={calendar} class="inline-block -mt-1 mr-1" alt="Logo" />{created}</p>
+      {/if}
       <div class="card-actions justify-end">
         <button class="btn btn-primary" on:click={edit}>Edit</button>
         <button class="btn btn-secondary" on:click={remove}>Remove</button>
@@ -29,3 +40,20 @@
     </div>
 </div>
 
+{/if}
+
+{#if type === 'featured'}
+
+<div class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-neutral shadow-xl overflow-hidden">
+  <div class="card-body">
+    <h2 class="card-title overflow-ellipsis">{name}</h2>
+    {#if location!=""}
+    <p><img src={locationDot} class="inline-block -mt-1 mr-1" alt="Logo" />{location}</p>
+    {/if}
+    <div class="card-actions justify-end">
+      <button class="btn btn-primary" on:click={add}>Add</button>
+    </div>
+  </div>
+</div>
+
+{/if}
\ No newline at end of file
diff --git a/src/lib/components/FeaturedAdventureCard.svelte b/src/lib/components/FeaturedAdventureCard.svelte
deleted file mode 100644
index a442402..0000000
--- a/src/lib/components/FeaturedAdventureCard.svelte
+++ /dev/null
@@ -1,24 +0,0 @@
-<script lang="ts">
-    import { createEventDispatcher } from 'svelte';
-    import locationDot from "$lib/assets/locationDot.svg";
-    import calendar from "$lib/assets/calendar.svg";
-    const dispatch = createEventDispatcher();
-
-    export let name:String;
-    export let location:String;
-
-    function add() {
-        dispatch('add', {name, location});
-    }
-</script>
-
-<div class="card min-w-max lg:w-96 md:w-80 sm:w-60 xs:w-40 bg-neutral shadow-xl overflow-hidden">
-    <div class="card-body">
-      <h2 class="card-title overflow-ellipsis">{name}</h2>
-      <p><img src={locationDot} class="inline-block -mt-1 mr-1" alt="Logo" />{location}</p>
-      <div class="card-actions justify-end">
-        <button class="btn btn-primary" on:click={add}>Add</button>
-      </div>
-    </div>
-</div>
-
diff --git a/src/routes/featured/+page.svelte b/src/routes/featured/+page.svelte
index 4099954..df1be87 100644
--- a/src/routes/featured/+page.svelte
+++ b/src/routes/featured/+page.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
     export let data
     console.log(data.result);
-    import FeaturedAdventureCard from '$lib/components/FeaturedAdventureCard.svelte';
+    import AdventureCard from '$lib/components/AdventureCard.svelte';
     import type { Adventure } from '$lib/utils/types.js';
     import { addAdventure, getNextId } from '../../services/adventureService.js';
 
@@ -26,6 +26,6 @@
 
 <div class="grid xl:grid-cols-3 lg:grid-cols-3 md:grid-cols-2 sm:grid-cols-1 gap-4 mt-4 content-center auto-cols-auto ml-6 mr-6">
     {#each data.result as adventure (adventure.id)}
-        <FeaturedAdventureCard on:add={add} name={adventure.name} location={adventure.location} />
+        <AdventureCard type="featured" on:add={add} name={adventure.name} location={adventure.location} created="" id={NaN} />
     {/each}
 </div>
\ No newline at end of file
diff --git a/src/routes/log/+page.svelte b/src/routes/log/+page.svelte
index d44cb2f..7a925ba 100644
--- a/src/routes/log/+page.svelte
+++ b/src/routes/log/+page.svelte
@@ -148,7 +148,7 @@
 
 <div class="grid xl:grid-cols-3 lg:grid-cols-3 md:grid-cols-2 sm:grid-cols-1 gap-4 mt-4 content-center auto-cols-auto ml-6 mr-6">
     {#each adventures as adventure (adventure.id)}
-        <AdventureCard id={adventure.id} name={adventure.name} location={adventure.location} created={adventure.created} on:remove={triggerRemoveAdventure} on:edit={editAdventure} />
+        <AdventureCard type="mylog" id={adventure.id} name={adventure.name} location={adventure.location} created={adventure.created} on:remove={triggerRemoveAdventure} on:edit={editAdventure} />
     {/each}
 </div>