From b6d2ac0cbcfe3b655ec1e27dfa3c3a17ba3e18c7 Mon Sep 17 00:00:00 2001 From: jableader Date: Wed, 17 Jan 2024 20:17:22 +1100 Subject: [PATCH] async/await --- src/components/EditRecipePage.vue | 53 ++++++++--------------- src/components/IngredientAddBox.vue | 13 +++--- src/components/MealPlanPage.vue | 6 +-- src/components/RecipeSearchBox.vue | 6 +-- src/data.js | 67 ++++++++++++++++++----------- 5 files changed, 69 insertions(+), 76 deletions(-) diff --git a/src/components/EditRecipePage.vue b/src/components/EditRecipePage.vue index 60d2d67..b56204f 100644 --- a/src/components/EditRecipePage.vue +++ b/src/components/EditRecipePage.vue @@ -121,55 +121,38 @@ export default { this.$router.push({ path: '/recipes/add', query: { url: this.link }}) this.refreshRecipe(); }, - refreshRecipe() { + async refreshRecipe() { if (this.id) { - data.getRecipe(this.id).then((response) => { - this.recipe = response; - this.link = response.link; - }); + this.recipe = await data.getRecipe(this.id); + this.link = this.recipe.link; return; } else if (this.link) { - data.parseRecipe(this.link).then((response) => { - if (!response) - { - this.parse_failed = true; - return; - } - - this.parse_failed = false; - this.recipe = response; - }); + this.recipe = await data.parseRecipe(this.link); + this.parse_failed = !this.recipe; } else { this.recipe = null; } }, - updateProduct(ingredient, product_link) { - data.parseProduct(ingredient, product_link).then(product => { - ingredient.product = product - }); + async updateProduct(ingredient, product_link) { + ingredient.product = await data.parseProduct(ingredient, product_link); }, - updateIngredient(ingredient, line) { - data.parseIngredients([line]).then(function(newIngredients) { - const newIngredient = newIngredients[0]; - ingredient.line = line; - ingredient.name = newIngredient.name; - ingredient.quantity = newIngredient.quantity; - ingredient.unit = newIngredient.unit; - ingredient.preparation = newIngredient.preparation; - if (newIngredient.product) { - ingredient.product = newIngredient.product; - } - }); + async updateIngredient(ingredient, line) { + const newIngredients = await data.parseIngredients([line]); + this.recipe.ingredients = this.recipe.ingredients.map(i => i == ingredient ? newIngredients[0] : i); }, deleteIngredient(ingredient) { this.recipe.ingredients = this.recipe.ingredients.filter(i => i != ingredient); }, - saveRecipe() { - data.saveRecipe(this.recipe).then((response) => { - this.$router.push(`/recipes/${response.id}`) - }); + async saveRecipe() { + const recipe = await data.saveRecipe(this.recipe); + if (recipe?.id) { + this.$router.push(`/recipes/${recipe.id}`); + return; + } + + alert('Failed to save recipe'); } }, } diff --git a/src/components/IngredientAddBox.vue b/src/components/IngredientAddBox.vue index 74a29f6..a4d5bdc 100644 --- a/src/components/IngredientAddBox.vue +++ b/src/components/IngredientAddBox.vue @@ -26,15 +26,12 @@ export default { this.$emit('add-ingredient', this.ingredient); this.ingredient = {}; }, - updateProduct(ingredient, product_link) { - data.parseProduct(ingredient, product_link).then(product => { - this.ingredient.product = product; - }); + async updateProduct(ingredient, product_link) { + this.ingredient.product = await data.parseProduct(ingredient, product_link); }, - updateIngredient(ingredient, line) { - data.parseIngredients([line]).then(newIngredients => { - this.ingredient = newIngredients[0]; - }); + async updateIngredient(ingredient, line) { + const newIngredients = await data.parseIngredients([line]); + this.ingredient = newIngredients[0]; }, } } diff --git a/src/components/MealPlanPage.vue b/src/components/MealPlanPage.vue index 546fe1a..6abd31e 100644 --- a/src/components/MealPlanPage.vue +++ b/src/components/MealPlanPage.vue @@ -74,9 +74,9 @@ export default { selectedMeal: null } }, - beforeMount() { - data.getMeals(this.from, this.to) - .then(meals => this.meals = meals); + async beforeMount() { + const meals = await data.getMeals(this.from, this.to) + this.meals = meals; }, methods: { editmeal(meal) { diff --git a/src/components/RecipeSearchBox.vue b/src/components/RecipeSearchBox.vue index 0a8cac0..b8bf779 100644 --- a/src/components/RecipeSearchBox.vue +++ b/src/components/RecipeSearchBox.vue @@ -37,10 +37,8 @@ export default { } }, methods: { - search() { - data.searchRecipes(this.searchTerm).then((recipes) => { - this.recipes = recipes - }); + async search() { + this.recipes = await data.searchRecipes(this.searchTerm) ?? this.recipes; }, selectRecipe(recipe) { this.$emit('select-recipe', recipe); diff --git a/src/data.js b/src/data.js index 6cbf9eb..470904b 100644 --- a/src/data.js +++ b/src/data.js @@ -1,51 +1,66 @@ const BASE_URL = "http://192.168.68.177:8000" export default { - getMeals(from, to) { - return fetch(BASE_URL + "/meals?from=" + from.toISOString() + "&to=" + to.toISOString()) - .then(response => response.json()) + async getMeals(from, to) { + const response = fetch(BASE_URL + "/meals?from=" + from.toISOString() + "&to=" + to.toISOString()); + return response.json(); }, - getMeal(id) { - return fetch(BASE_URL + `/meals/${encodeURIComponent(id)}`) - .then(response => response.json()) + async getMeal(id) { + var response = await fetch(BASE_URL + `/meals/${encodeURIComponent(id)}`); + return response.json(); }, - searchRecipes(query) { - return fetch(BASE_URL + "/recipes?q=" + encodeURIComponent(query)) - .then(response => response.json()) + async searchRecipes(query) { + const response = await fetch(BASE_URL + "/recipes?q=" + encodeURIComponent(query)); + return response.json(); }, - parseRecipe(url) { - return fetch(BASE_URL + `/recipes/parse?url=${encodeURIComponent(url)}`) - .then(response => response.json()) + async parseRecipe(url) { + const response = await fetch(BASE_URL + `/recipes/parse?url=${encodeURIComponent(url)}`); + return response.json(); }, - getRecipe(id) { - return fetch(BASE_URL + `/recipes/${encodeURIComponent(id)}`) - .then(response => response.json()) + async getRecipe(id) { + const response = await fetch(BASE_URL + `/recipes/${encodeURIComponent(id)}`); + return response.json(); }, - parseProduct(ingredient, url) { + async parseProduct(ingredient, url) { const body = { url, tags: [ingredient.name, ingredient.line], - } + }; - return fetch(BASE_URL + "/products", { + const response = await fetch(BASE_URL + "/products", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(body), - }).then(response => response.json()) + }); + + return response.json(); }, - parseIngredients(lines) { + async parseIngredients(lines) { const params = lines.map(line => "ingredients=" + encodeURIComponent(line)).join("&"); - return fetch(BASE_URL + "/recipes/ingredients/parse?" + params) - .then(response => response.json()) + const response = await fetch(BASE_URL + "/recipes/ingredients/parse?" + params); + return response.json(); }, - saveRecipe(recipe) { - return fetch(BASE_URL + "/recipes", { + async saveRecipe(recipe) { + const response = await fetch(BASE_URL + "/recipes", { method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify(recipe), - }).then(response => response.json()) - } + }); + + return response.json(); + }, + async saveMeal(meal) { + const response = await fetch(BASE_URL + "/meals", { + method: "POST", + headers: { + "Content-Type": "application/json" + }, + body: JSON.stringify(meal), + }); + + return response.json(); + }, } \ No newline at end of file