From 66d2dc7b15aa6bec50e035d85bed7edb94ce5978 Mon Sep 17 00:00:00 2001
From: Sean Morley <zipsm15@gmail.com>
Date: Sat, 4 May 2024 17:18:53 +0000
Subject: [PATCH] feat: Add addAdventure, removeAdventure, and saveAdventure
 functions

The code changes include adding the addAdventure, removeAdventure, and saveAdventure functions to the +page.svelte file and adventureService.js module. These functions handle the API requests for adding, removing, and saving adventures respectively. They update the local plans array based on the API response and display appropriate toast messages. These changes enhance the functionality of the planner page by allowing users to add, remove, and save adventures.
---
 src/routes/log/+page.svelte | 128 +++++++++++-------------------------
 1 file changed, 37 insertions(+), 91 deletions(-)

diff --git a/src/routes/log/+page.svelte b/src/routes/log/+page.svelte
index ac491b6..08cfe28 100644
--- a/src/routes/log/+page.svelte
+++ b/src/routes/log/+page.svelte
@@ -14,6 +14,11 @@
   import { generateRandomString } from "$lib";
   import { visitCount } from "$lib/utils/stores/visitCountStore";
   import MoreFieldsInput from "$lib/components/CreateNewAdventure.svelte";
+  import {
+    addAdventure,
+    removeAdventure,
+    saveAdventure,
+  } from "../../services/adventureService.js";
 
   let isShowingMoreFields = false;
 
@@ -56,72 +61,26 @@
     URL.revokeObjectURL(url);
   }
 
-  const createNewAdventure = (event: { detail: Adventure }) => {
+  const createNewAdventure = async (event: { detail: Adventure }) => {
     isShowingMoreFields = false;
-    let detailAdventure = event.detail;
-    console.log("Event" + event.detail.name);
-
-    fetch("/api/visits", {
-      method: "POST",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({
-        detailAdventure,
-      }),
-    })
-      .then((response) => {
-        if (!response.ok) {
-          return response.json().then((data) => {
-            throw new Error(
-              data.error || `Failed to add adventure - ${data?.message}`
-            );
-          });
-        }
-        return response.json();
-      })
-      .then((data) => {
-        // add to local array for instant view update
-        adventures = [...adventures, data.adventure];
-        showToast("Adventure added successfully!");
-        visitCount.update((n) => n + 1);
-      })
-      .catch((error) => {
-        console.error("Error:", error);
-        showToast(error.message);
-      });
+    let newArray = await addAdventure(event.detail, adventures);
+    if (newArray.length > 0) {
+      adventures = newArray;
+      showToast("Adventure added successfully!");
+    } else {
+      showToast("Failed to add adventure");
+    }
   };
 
-  function saveAdventure(event: { detail: Adventure }) {
-    console.log("Event", event.detail);
-    let detailAdventure = event.detail;
-
-    // put request to /api/visits with id and adventure data
-    fetch("/api/visits", {
-      method: "PUT",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({
-        detailAdventure,
-      }),
-    })
-      .then((response) => response.json())
-      .then((data) => {
-        console.log("Success:", data);
-        // update local array with new data
-        const index = adventures.findIndex(
-          (adventure) => adventure.id === detailAdventure.id
-        );
-        if (index !== -1) {
-          adventures[index] = detailAdventure;
-        }
-        adventureToEdit = undefined;
-        showToast("Adventure edited successfully!");
-      })
-      .catch((error) => {
-        console.error("Error:", error);
-      });
+  async function save(event: { detail: Adventure }) {
+    let newArray = await saveAdventure(event.detail, adventures);
+    if (newArray.length > 0) {
+      adventures = newArray;
+      showToast("Adventure updated successfully!");
+    } else {
+      showToast("Failed to update adventure");
+    }
+    adventureToEdit = undefined;
   }
 
   function editAdventure(event: { detail: number }) {
@@ -186,29 +145,20 @@
       });
   }
 
-  function removeAdventure(event: { detail: number }) {
-    console.log("Event ID " + event.detail);
-    // send delete request to server at /api/visits
-    fetch("/api/visits", {
-      method: "DELETE",
-      headers: {
-        "Content-Type": "application/json",
-      },
-      body: JSON.stringify({ id: event.detail }),
-    })
-      .then((response) => response.json())
-      .then((data) => {
-        console.log("Success:", data);
-        // remove adventure from array where id matches
-        adventures = adventures.filter(
-          (adventure) => adventure.id !== event.detail
-        );
+  async function remove(event: { detail: number }) {
+    let initialLength: number = adventures.length;
+    let theAdventure = adventures.find(
+      (adventure) => adventure.id === event.detail
+    );
+    if (theAdventure) {
+      let newArray = await removeAdventure(theAdventure, adventures);
+      if (newArray.length === initialLength - 1) {
+        adventures = newArray;
         showToast("Adventure removed successfully!");
-        visitCount.update((n) => n - 1);
-      })
-      .catch((error) => {
-        console.error("Error:", error);
-      });
+      } else {
+        showToast("Failed to remove adventure");
+      }
+    }
   }
 </script>
 
@@ -254,11 +204,7 @@
 {/if}
 
 {#if adventureToEdit && adventureToEdit.id != undefined}
-  <EditModal
-    bind:adventureToEdit
-    on:submit={saveAdventure}
-    on:close={handleClose}
-  />
+  <EditModal bind:adventureToEdit on:submit={save} on:close={handleClose} />
 {/if}
 
 <div
@@ -269,7 +215,7 @@
       {adventure}
       type="mylog"
       on:edit={editAdventure}
-      on:remove={removeAdventure}
+      on:remove={remove}
     />
   {/each}
 </div>