From 726c3ba208fb8e24a0d295d7fdd53fcba96ba7fe Mon Sep 17 00:00:00 2001
From: Zein Sleiman <zsleiman@redhat.com>
Date: Mon, 19 Sep 2022 14:31:50 -0500
Subject: [PATCH 1/3] wip: adding reset

---
 src/lib/builderForm/BuilderForm.svelte | 48 +++++++++++++++++++++-----
 1 file changed, 39 insertions(+), 9 deletions(-)

diff --git a/src/lib/builderForm/BuilderForm.svelte b/src/lib/builderForm/BuilderForm.svelte
index 707b2f9..61104ae 100644
--- a/src/lib/builderForm/BuilderForm.svelte
+++ b/src/lib/builderForm/BuilderForm.svelte
@@ -7,17 +7,18 @@
   import ListItem from "$lib/List/ListItem.svelte";
   import UnorderedList from "$lib/List/UnorderedList.svelte";
   import { currentBuilderStatus } from "$lib/stores.js";
+	import { onMount } from "svelte";
 
-  let name:string = $currentBuilderStatus.name;
-  let author:AuthorInterface = $currentBuilderStatus.author;
-  let description:string = $currentBuilderStatus.description;
-  let keywordList:string[] = $currentBuilderStatus.keywords;
-  let ingredientList:string[] = $currentBuilderStatus.ingredients;
-  let instructionList:InstructionsInterface[] = $currentBuilderStatus.instructions;
+  let name: string = $currentBuilderStatus.name;
+  let author: AuthorInterface = $currentBuilderStatus.author;
+  let description: string = $currentBuilderStatus.description;
+  let keywordList: string[] = $currentBuilderStatus.keywords;
+  let ingredientList: string[] = $currentBuilderStatus.ingredients;
+  let instructionList: InstructionsInterface[] = $currentBuilderStatus.instructions;
   let recipeYield: string = $currentBuilderStatus.yield;
 
   // Keywords
-  let keyword:string;
+  let keyword: string;
   const handleAddKeyword = () => {
     keywordList = keyword ? [...keywordList, keyword] : [...keywordList];
     keyword = "";
@@ -29,7 +30,7 @@
   }
 
   // Ingredients
-  let ingredient:string;
+  let ingredient: string;
   const handleAddIngredient = () => {
     ingredientList = ingredient ? [...ingredientList, ingredient] : [...ingredientList];
     ingredient = "";
@@ -63,6 +64,31 @@
       updateCurrentBuilderRecipe(input);
   }
 
+  const onReset = () => {
+    currentBuilderStatus.set({
+      "name": '',
+      "author": {name: '', reference: ''},
+      "description": '',
+      "totalTime": 0,
+      "keywords": [],
+      "yield": '',
+      "category": '',
+      "cuisine": '',
+      "nutrition": {
+        "calories": ''
+      },
+      "ingredients": [],
+      "instructions": []
+    });
+    name = ''
+    author = {name: '', reference: ''}
+    description = '';
+    keywordList = [];
+    ingredientList = [];
+    instructionList = [];
+    recipeYield = '';
+  }
+
   // uses "as any" due to some weird ts issue, fix later i guess
   const updateCurrentBuilderRecipe = (input: any) => {
     currentBuilderStatus.set({
@@ -83,6 +109,10 @@
     goto("/builder/your-recipe");
   }
 
+  onMount(async () => {
+    onReset();
+  });
+
 </script>
 
 <form class="builderForm" on:submit|preventDefault={onSubmit}>
@@ -211,7 +241,7 @@
   <!-- Submit -->
   <section class="formActions">
     <Button formType="submit" variant="accent" class="submitButton">Generate Recipe</Button>
-    <Button formType="reset" class="resetButton">Clear</Button>
+    <Button formType="reset" class="resetButton" on:reset={onReset}>Clear</Button>
   </section>
 </form>
 

From 2bcdd71d8ebd74078d56d4f2c4d178b19c17d28a Mon Sep 17 00:00:00 2001
From: Zein Sleiman <zsleiman@redhat.com>
Date: Fri, 23 Sep 2022 10:08:42 -0500
Subject: [PATCH 2/3] use localstorage to store/write  data

---
 src/lib/builderForm/BuilderForm.svelte | 45 +++++++++++++++-----------
 src/routes/builder/your-recipe.svelte  | 10 +++++-
 2 files changed, 36 insertions(+), 19 deletions(-)

diff --git a/src/lib/builderForm/BuilderForm.svelte b/src/lib/builderForm/BuilderForm.svelte
index 42a8dbe..b939a14 100644
--- a/src/lib/builderForm/BuilderForm.svelte
+++ b/src/lib/builderForm/BuilderForm.svelte
@@ -10,8 +10,9 @@
   import DescriptionTerm from '$lib/List/DescriptionTerm.svelte';
   import ListItem from '$lib/List/ListItem.svelte';
   import UnorderedList from '$lib/List/UnorderedList.svelte';
+  import Recipe from '$lib/recipes/Recipe.svelte';
   import { currentBuilderStatus } from '$lib/stores.js';
-  import { onMount } from "svelte";
+  import { onMount } from 'svelte';
 
   let name: string = $currentBuilderStatus.name;
   let author: AuthorInterface = $currentBuilderStatus.author;
@@ -81,33 +82,35 @@
     input.ingredients = ingredientList;
     input.instructions = instructionList;
     console.log(input);
+    localStorage.setItem('recipe', JSON.stringify(input));
+    console.log(`hey did this write to local storage: ${localStorage.getItem('recipe')}`);
     updateCurrentBuilderRecipe(input);
   };
 
   const onReset = () => {
     currentBuilderStatus.set({
-      "name": '',
-      "author": {name: '', reference: ''},
-      "description": '',
-      "totalTime": 0,
-      "keywords": [],
-      "yield": '',
-      "category": '',
-      "cuisine": '',
-      "nutrition": {
-        "calories": ''
+      name: '',
+      author: { name: '', reference: '' },
+      description: '',
+      totalTime: 0,
+      keywords: [],
+      yield: '',
+      category: '',
+      cuisine: '',
+      nutrition: {
+        calories: ''
       },
-      "ingredients": [],
-      "instructions": []
+      ingredients: [],
+      instructions: []
     });
-    name = ''
-    author = {name: '', reference: ''}
+    name = '';
+    author = { name: '', reference: '' };
     description = '';
     keywordList = [];
     ingredientList = [];
     instructionList = [];
     recipeYield = '';
-  }
+  };
 
   // uses "as any" due to some weird ts issue, fix later i guess
   const updateCurrentBuilderRecipe = (input: any) => {
@@ -129,9 +132,15 @@
     console.log(currentBuilderStatus);
     goto('/builder/your-recipe');
   };
-  
+
   onMount(async () => {
-    onReset();
+    if (localStorage.getItem('recipe')) {
+      console.log(localStorage.getItem('recipe'));
+      // $currentBuilderStatus = JSON.parse(localStorage.getItem('recipe'))
+      // console.log($currentBuilderStatus)
+    } else {
+      onReset();
+    }
   });
 </script>
 
diff --git a/src/routes/builder/your-recipe.svelte b/src/routes/builder/your-recipe.svelte
index e9ed3c5..d8b5e80 100644
--- a/src/routes/builder/your-recipe.svelte
+++ b/src/routes/builder/your-recipe.svelte
@@ -6,6 +6,14 @@
 
   const submitRecipe = () => {
     console.log('yay');
+    localStorage.removeItem('recipe');
+    console.log(`cleared localstorage ${localStorage.getItem('key')}`);
+  };
+
+  const editRecipe = () => {
+    console.log('I go edit');
+    console.log(localStorage.getItem('recipe'));
+    goto('/builder');
   };
 </script>
 
@@ -19,7 +27,7 @@
   {#if $currentBuilderStatus.name}
     <Recipe data={$currentBuilderStatus} />
     <Button variant="accent" on:click={submitRecipe}>Submit</Button>
-    <Button on:click={() => goto('/builder')}>Edit</Button>
+    <Button on:click={editRecipe}>Edit</Button>
   {:else}
     <span> no data </span>
   {/if}

From 68775e5469b8d9d11fcf2a56df3e35c4632951e4 Mon Sep 17 00:00:00 2001
From: Zein Sleiman <zsleiman@redhat.com>
Date: Fri, 23 Sep 2022 10:58:05 -0500
Subject: [PATCH 3/3] remove console log

---
 src/lib/builderForm/BuilderForm.svelte | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/lib/builderForm/BuilderForm.svelte b/src/lib/builderForm/BuilderForm.svelte
index b939a14..d351eab 100644
--- a/src/lib/builderForm/BuilderForm.svelte
+++ b/src/lib/builderForm/BuilderForm.svelte
@@ -136,8 +136,6 @@
   onMount(async () => {
     if (localStorage.getItem('recipe')) {
       console.log(localStorage.getItem('recipe'));
-      // $currentBuilderStatus = JSON.parse(localStorage.getItem('recipe'))
-      // console.log($currentBuilderStatus)
     } else {
       onReset();
     }