Works on ingredients

web/html/index.html

@@ -20,7 +20,7 @@
     <h4 class="title">{{ items[active_view].title }}</h4>
     <h6 class="subtitle">{{ categories[items[active_view].category].name }}</h6>
     <p><strong>{{ items[active_view].ingredients }}</strong></p>
-    <button @click="deleteRecipe(active_view + 1)" class="button is-danger is-pulled-right">DELETE !</button>
+    <button @click="deleteRecipe(items[active_view].id)" class="button is-danger is-pulled-right">DELETE !</button>
   </div>
   </section>
   <!-- Category List View -->
@@ -75,9 +75,15 @@
       deleteRecipe: function(id) {
         fetch("/api/delete/" + id)
           .then((res) => res.json())
-          .then((data) => console.log("Deleted :" + data))
+          .then((data) => {
+            if (data === true) {
+              this.items.splice(this.active_view, 1);
+              this.closeActiveView();
+              console.log("Deleted :" + data);
+            } else {
+              console.log("Error deleting");
+            }})
           .catch((err) => console.error(err));
-        this.closeActiveView();
       },
       fetchRecipesList: function() {
         fetch("/api/list")

web/src/main.rs

@@ -40,7 +40,7 @@ mod api {
                 id: rec.id,
                 title: rec.title,
                 category: rec.category as i16,
-                ingredients: rec.ingredients,
+                ingredients: rec.ingredients.as_string(),
                 preparation: rec.preparation,
             }
         }