diff --git a/vue/src/apps/CookbookView/CookbookView.vue b/vue/src/apps/CookbookView/CookbookView.vue
index 90f0c92aa..dd7e4b067 100644
--- a/vue/src/apps/CookbookView/CookbookView.vue
+++ b/vue/src/apps/CookbookView/CookbookView.vue
@@ -130,10 +130,10 @@ export default {
                 .then((result) => {
                     let new_book = result.data
                     this.refreshData()
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                 })
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         appendRecipeFilter: function (page, book) {
diff --git a/vue/src/apps/ExportView/ExportView.vue b/vue/src/apps/ExportView/ExportView.vue
index 0224850ce..425fe596b 100644
--- a/vue/src/apps/ExportView/ExportView.vue
+++ b/vue/src/apps/ExportView/ExportView.vue
@@ -118,7 +118,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
             // .then((e) => this.searchRecipes(""))
         },
@@ -133,7 +133,7 @@ export default {
         //         })
         //         .catch((err) => {
         //             console.log(err)
-        //             StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+        //             StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
         //         })
         // },
 
diff --git a/vue/src/apps/ImportView/ImportView.vue b/vue/src/apps/ImportView/ImportView.vue
index ef4ba770f..934402234 100644
--- a/vue/src/apps/ImportView/ImportView.vue
+++ b/vue/src/apps/ImportView/ImportView.vue
@@ -17,8 +17,7 @@
                             <b-card no-body>
                                 <b-card-header header-tag="header" class="p-1" role="tab">
                                     <b-col cols="12" md="6" offset="0" offset-md="3">
-                                        <b-button block v-b-toggle.id_accordion_url variant="info">Website</b-button>
-                                        <!-- TODO localize -->
+                                        <b-button block v-b-toggle.id_accordion_url variant="info">{{ $t('Website') }}</b-button>
                                     </b-col>
                                 </b-card-header>
                                 <b-collapse id="id_accordion_url" visible accordion="url_import_accordion"
@@ -30,7 +29,7 @@
                                                     <b-checkbox v-model="import_multiple" switch><span
                                                         v-if="import_multiple">Multiple Recipes</span><span
                                                         v-if="!import_multiple">Single Recipe</span></b-checkbox>
-                                                    <!-- TODO localize -->
+                                                    <!-- TODO localize or maybe icons ? -->
                                                 </div>
                                             </div>
                                             <b-input-group class="mt-2" :class="{ bounce: empty_input }"
@@ -38,8 +37,7 @@
                                                 <b-input
                                                     class="form-control form-control-lg form-control-borderless form-control-search"
                                                     v-model="website_url"
-                                                    placeholder="Website URL" @paste="onURLPaste"></b-input>
-                                                <!-- TODO localize -->
+                                                    placeholder="https://..." @paste="onURLPaste"></b-input>
                                                 <b-input-group-append>
                                                     <b-button variant="primary"
                                                               @click="loadRecipe(website_url,false,undefined)"><i
@@ -47,15 +45,15 @@
                                                     </b-button>
                                                 </b-input-group-append>
                                             </b-input-group>
-                                            <b-textarea rows="10" placeholder="Enter one URL per line"
+                                            <b-textarea rows="10" :placeholder="$t('one_url_per_line')"
                                                         v-model="website_url_list"
-                                                        v-if="import_multiple"> <!-- TODO localize -->
+                                                        v-if="import_multiple">
                                             </b-textarea>
 
                                             <b-button class="float-right" v-if="import_multiple"
-                                                                  :disabled="website_url_list.length < 1"
-                                                                  @click="autoImport()">Import
-                                                        </b-button>
+                                                      :disabled="website_url_list.length < 1"
+                                                      @click="autoImport()">{{ $t('Import') }}
+                                            </b-button>
 
                                             <div class="row mt-2"> <!-- TODO remove -->
                                                 <div class="col col-md-12">
@@ -89,7 +87,7 @@
                                 <b-card-header header-tag="header" class="p-1" role="tab">
                                     <b-col cols="12" md="6" offset="0" offset-md="3">
                                         <b-button block v-b-toggle.id_accordion_add_options variant="info"
-                                                  :disabled="recipe_json === undefined">Options
+                                                  :disabled="recipe_json === undefined">{{ $t('Options') }}
                                         </b-button>
                                     </b-col>
                                 </b-card-header>
@@ -127,9 +125,8 @@
 
                                         <div class="row mt-1">
                                             <div class="col col-md-12 text-center">
-                                                <small class="text-muted">Click the image you want to import for this
-                                                    recipe</small> <!-- TODO localize -->
-                                                <span v-if="recipe_images.length === 0">No additional images found in source.</span>
+                                                <small class="text-muted">{{$t('click_image_import')}}</small><br/>
+                                                <span v-if="recipe_images.length === 0">{{$t('no_more_images_found')}}</span>
                                                 <div class="scrolling-wrapper-flexbox">
                                                     <div class="wrapper-card" v-for="i in recipe_images"
                                                          v-bind:key="i"
@@ -147,7 +144,7 @@
                                                 <b-card no-body>
                                                     <b-card-title>
                                                         <div class="clearfix">
-                                                            <span class="float-left h5">Keywords</span>
+                                                            <span class="float-left h5">{{$t('Keywords')}}</span>
                                                             <b-button-group class="float-right">
                                                                 <b-button class="float-right" variant="primary"
                                                                           @click="$set(recipe_json, 'keywords', recipe_json.keywords.map(x => {x.show = true; return x}))">
@@ -194,7 +191,7 @@
                                 <b-card-header header-tag="header" class="p-1" role="tab">
                                     <b-col cols="12" md="6" offset="0" offset-md="3">
                                         <b-button block v-b-toggle.id_accordion_import variant="info"
-                                                  :disabled="recipe_json === undefined">Import
+                                                  :disabled="recipe_json === undefined">{{ $t('Import') }}
                                         </b-button>
                                     </b-col>
                                 </b-card-header>
@@ -391,7 +388,8 @@ export default {
             empty_input: false,
             edit_name: false,
             // Bookmarklet
-            BOOKMARKLET_CODE: window.BOOKMARKLET_CODE
+            BOOKMARKLET_CODE: window.BOOKMARKLET_CODE,
+            error: undefined
         }
     },
     mounted() {
@@ -422,12 +420,12 @@ export default {
                     let recipe = response.data
                     apiFactory.imageRecipe(response.data.id, undefined, recipe_json.image).then(response => { // save recipe image
                         if (!silent) {
-                            StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                            StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                         }
                         this.afterImportAction(action, recipe)
                     }).catch(e => {
                         if (!silent) {
-                            StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                            StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         }
                         this.afterImportAction(action, recipe)
                     })
@@ -436,13 +434,13 @@ export default {
                         this.failed_imports.push(recipe_json.source_url)
                     }
                     if (!silent) {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                     }
                 })
             } else {
                 console.log('cant import recipe without data')
                 if (!silent) {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 }
             }
         },
@@ -543,10 +541,11 @@ export default {
                 }
                 return this.recipe_json
             }).catch((err) => {
+                this.loading = false
                 if (url !== '') {
                     this.failed_imports.push(url)
                 }
-                StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH, err.response.data.msg)
+                StandardToasts.makeStandardToast(this, StandardToasts.FAIL_FETCH, err)
                 throw "Load Recipe Error"
             })
         },
@@ -577,15 +576,14 @@ export default {
                 window.location.href = resolveDjangoUrl('view_import_response', response.data['import_id'])
             }).catch((err) => {
                 console.log(err)
-                StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
             })
         },
         /**
          * Handles pasting URLs
          */
         onURLPaste: function (evt) {
-            this.website_url = evt.clipboardData.getData('text')
-            this.loadRecipe(false, undefined)
+            this.loadRecipe(evt.clipboardData.getData('text'), false, undefined)
             return true;
         },
         /**loadRecipe(false,undefined)
diff --git a/vue/src/apps/IngredientEditorView/IngredientEditorView.vue b/vue/src/apps/IngredientEditorView/IngredientEditorView.vue
index b546e8be2..7a6ce92e4 100644
--- a/vue/src/apps/IngredientEditorView/IngredientEditorView.vue
+++ b/vue/src/apps/IngredientEditorView/IngredientEditorView.vue
@@ -187,7 +187,7 @@ export default {
                     this.ingredients = result.data
                     this.loading = false
                 }).catch((err) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                     this.loading = false
                 })
             }
@@ -209,7 +209,7 @@ export default {
                 apiClient.updateIngredient(i.id, i).then(r => {
                     this.$set(i, 'changed', false)
                 }).catch((r, e) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
             })
         },
@@ -217,10 +217,10 @@ export default {
             if (confirm(this.$t('delete_confirmation', this.$t('Ingredient')))){
                 let apiClient = new ApiApiFactory()
                 apiClient.destroyIngredient(i.id).then(r => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                     this.ingredients = this.ingredients.filter(li => li.id !== i.id)
                 }).catch(e => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                 })
             }
         }
diff --git a/vue/src/apps/MealPlanView/MealPlanView.vue b/vue/src/apps/MealPlanView/MealPlanView.vue
index da0ae46d4..025e6a506 100644
--- a/vue/src/apps/MealPlanView/MealPlanView.vue
+++ b/vue/src/apps/MealPlanView/MealPlanView.vue
@@ -451,7 +451,7 @@ export default {
                     this.periodChangedCallback(this.current_period)
                 })
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
 
             this.refreshMealTypes()
@@ -474,7 +474,7 @@ export default {
                         }
                     })
                     .catch((error) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                     })
             })
         },
@@ -488,10 +488,10 @@ export default {
                     .updateMealType(this.meal_types[index].id, this.meal_types[index])
                     .then((e) => {
                         this.periodChangedCallback(this.current_period)
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((error) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                     })
             } else {
                 this.$set(this.meal_types[index], "editing", true)
@@ -504,10 +504,10 @@ export default {
                 .destroyMealType(this.meal_types[index].id)
                 .then((e) => {
                     this.periodChangedCallback(this.current_period)
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                 })
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                 })
         },
         updateEmoji: function (field, value) {
@@ -583,7 +583,7 @@ export default {
                             list.splice(index, 1)
                         })
                         .catch((error) => {
-                            StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                            StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         })
                 }
             })
@@ -635,7 +635,7 @@ export default {
             let apiClient = new ApiApiFactory()
 
             apiClient.updateMealPlan(entry.id, entry).catch((error) => {
-                StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
             })
         },
         createEntry(entry) {
@@ -646,7 +646,7 @@ export default {
             apiClient
                 .createMealPlan(entry)
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
                 .then((entry_result) => {
                     this.plan_entries.push(entry_result.data)
diff --git a/vue/src/apps/ModelListView/ModelListView.vue b/vue/src/apps/ModelListView/ModelListView.vue
index 09d523443..80449779d 100644
--- a/vue/src/apps/ModelListView/ModelListView.vue
+++ b/vue/src/apps/ModelListView/ModelListView.vue
@@ -276,7 +276,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err, Object.keys(err))
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         getThis: function (id, callback) {
@@ -292,21 +292,21 @@ export default {
                         this.items_left = [result.data].concat(this.destroyCard(result?.data?.id, this.items_left))
                         // this creates a deep copy to make sure that columns stay independent
                         this.items_right = [{...result.data}].concat(this.destroyCard(result?.data?.id, this.items_right))
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     })
                     .catch((err) => {
                         console.log(err)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                     })
             } else {
                 this.genericAPI(this.this_model, this.Actions.UPDATE, item)
                     .then((result) => {
                         this.refreshThis(item.id)
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
                         console.log(err, err.response)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                     })
             }
         },
@@ -315,7 +315,7 @@ export default {
             let api = new ApiApiFactory()
             food.shopping = true
             api.createShoppingListEntry({food: food, amount: 1}).then(() => {
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                 this.refreshCard(food, this.items_left)
                 this.refreshCard({...food}, this.items_right)
             })
@@ -339,7 +339,7 @@ export default {
             this.genericAPI(this.this_model, this.Actions.MOVE, {source: source_id, target: target_id})
                 .then((result) => {
                     this.moveUpdateItem(source_id, target_id)
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_MOVE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_MOVE)
                 })
                 .catch((err) => {
                     console.log(err)
@@ -378,7 +378,7 @@ export default {
             })
                 .then((result) => {
                     this.mergeUpdateItem(source_id, target_id)
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_MERGE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_MERGE)
                 })
                 .catch((err) => {
                     //TODO error checking not working with OpenAPI methods
@@ -432,7 +432,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         getRecipes: function (col, item) {
diff --git a/vue/src/apps/RecipeEditView/RecipeEditView.vue b/vue/src/apps/RecipeEditView/RecipeEditView.vue
index 038507708..50c3dbb99 100644
--- a/vue/src/apps/RecipeEditView/RecipeEditView.vue
+++ b/vue/src/apps/RecipeEditView/RecipeEditView.vue
@@ -822,7 +822,7 @@ export default {
                 .catch((err) => {
                     this.loading = false
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         updateRecipe: function (view_after) {
@@ -850,7 +850,7 @@ export default {
             apiFactory
                 .updateRecipe(this.recipe_id, this.recipe, {})
                 .then((response) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     this.recipe_changed = false
                     if (this.create_food) {
                         apiFactory.createFood({
@@ -864,7 +864,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
         },
         uploadImage: function (file) {
@@ -875,10 +875,10 @@ export default {
                     .then((request) => {
                         this.recipe.image = request.data.image
                         this.recipe_changed = false
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         console.log(err.request, err.response)
                     })
             }
@@ -891,10 +891,10 @@ export default {
                     .then((request) => {
                         this.recipe.image = null
                         this.recipe_changed = false
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                     })
                     .catch((err) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                         console.log(err.request, err.response)
                     })
             }
@@ -991,7 +991,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         searchFiles: function (query) {
@@ -1006,7 +1006,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         searchRecipes: function (query) {
@@ -1018,7 +1018,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         searchUnits: function (query) {
@@ -1042,7 +1042,7 @@ export default {
                     this.units_loading = false
                 })
                 .catch((err) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         searchFoods: function (query) {
@@ -1067,7 +1067,7 @@ export default {
                     this.foods_loading = false
                 })
                 .catch((err) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                 })
         },
         fileCreated: function (data) {
diff --git a/vue/src/apps/RecipeSearchView/RecipeSearchView.vue b/vue/src/apps/RecipeSearchView/RecipeSearchView.vue
index c8f4eb01a..7f872f46a 100644
--- a/vue/src/apps/RecipeSearchView/RecipeSearchView.vue
+++ b/vue/src/apps/RecipeSearchView/RecipeSearchView.vue
@@ -1496,11 +1496,11 @@ export default {
             this.genericAPI(this.Models.CUSTOM_FILTER, this.Actions.CREATE, params)
                 .then((result) => {
                     this.search.search_filter = result.data
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                 })
                 .catch((err) => {
                     console.log(err, Object.keys(err))
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         addField: function (field, count) {
diff --git a/vue/src/apps/ShoppingListView/ShoppingListView.vue b/vue/src/apps/ShoppingListView/ShoppingListView.vue
index 2a305bf66..f04483f87 100644
--- a/vue/src/apps/ShoppingListView/ShoppingListView.vue
+++ b/vue/src/apps/ShoppingListView/ShoppingListView.vue
@@ -1113,7 +1113,7 @@ export default {
                 .then((results) => {
                     if (results?.data) {
                         this.items.push(results.data)
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     } else {
                         console.log("no data returned")
                     }
@@ -1122,7 +1122,7 @@ export default {
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         deleteSupermarket: function (s) {
@@ -1130,11 +1130,11 @@ export default {
             api.destroySupermarket(s.id)
                 .then(() => {
                     this.getSupermarkets()
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                 })
         },
         deleteCategory: function (c) {
@@ -1146,11 +1146,11 @@ export default {
                     this.getSupermarkets()
                     this.getShoppingCategories()
                     this.new_supermarket.value.category_to_supermarket = this.new_supermarket.value.category_to_supermarket.filter((x) => x.category.id != c_id)
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                 })
         },
         resetFilters: function () {
@@ -1179,7 +1179,7 @@ export default {
                 promises.push(this.saveThis({id: entry, delay_until: delay_date}, false))
             })
             Promise.all(promises).then(() => {
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                 this.items = this.items.filter((x) => !entries.includes(x.id))
                 this.delay = this.defaultDelay
             })
@@ -1189,11 +1189,11 @@ export default {
             api.destroyShoppingListRecipe(recipe)
                 .then((x) => {
                     this.items = this.items.filter((x) => x.list_recipe !== recipe)
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                 })
         },
         deleteThis: function (item) {
@@ -1210,14 +1210,14 @@ export default {
                 promises.push(
                     api.destroyShoppingListEntry(x).catch((err) => {
                         console.log(err)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                     })
                 )
             })
 
             Promise.all(promises).then((result) => {
                 this.items = this.items.filter((x) => !entries.includes(x.id))
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
             })
         },
         editSupermarket(s) {
@@ -1267,7 +1267,7 @@ export default {
                 .catch((err) => {
                     console.log(err)
                     if (!autosync) {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_FETCH)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_FETCH)
                     }
                 })
         },
@@ -1353,11 +1353,11 @@ export default {
             let api = ApiApiFactory()
             api.partialUpdateUserPreference(this.settings.user, this.settings)
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
         },
         saveThis: function (thisItem, toast = true) {
@@ -1368,24 +1368,24 @@ export default {
                     .createShoppingListEntry(thisItem)
                     .then((result) => {
                         if (toast) {
-                            StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                            StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                         }
                     })
                     .catch((err) => {
                         console.log(err)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                     })
             } else {
                 return api
                     .partialUpdateShoppingListEntry(thisItem.id, thisItem)
                     .then((result) => {
                         if (toast) {
-                            StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                            StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                         }
                     })
                     .catch((err) => {
                         console.log(err, err.response)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                     })
             }
         },
@@ -1416,7 +1416,7 @@ export default {
                 .catch((err) => {
                     this.auto_sync_blocked = false
                     console.log(err, err.response)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
         },
         updateFood: function (food, field) {
@@ -1429,14 +1429,14 @@ export default {
             return api
                 .partialUpdateFood(food.id, food)
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     if (food?.numchild > 0) {
                         this.getShoppingList() // if food has children, just get the whole list.  probably could be more efficient
                     }
                 })
                 .catch((err) => {
                     console.log(err, Object.keys(err))
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
         },
         updateServings(e, plan) {
@@ -1450,26 +1450,26 @@ export default {
             let api = new ApiApiFactory()
             api.createSupermarketCategory({name: this.new_category.value})
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     this.shopping_categories.push(result.data)
                     this.new_category.value = undefined
                 })
                 .catch((err) => {
                     console.log(err, Object.keys(err))
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         addSupermarket: function () {
             let api = new ApiApiFactory()
             api.createSupermarket({name: this.new_supermarket.value})
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     this.supermarkets.push(result.data)
                     this.new_supermarket.value = undefined
                 })
                 .catch((err) => {
                     console.log(err, Object.keys(err))
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         saveSupermarketCategoryOrder(e) {
@@ -1495,11 +1495,11 @@ export default {
                 apiClient
                     .destroySupermarketCategoryRelation(e.removed.element.id)
                     .then((result) => {
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
                         console.log(err, Object.keys(err))
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         this.supermarkets = temp_supermarkets
                     })
             }
@@ -1522,11 +1522,11 @@ export default {
                     .then((updated_supermarket) => {
                         let idx = this.supermarkets.indexOf((x) => x.id === updated_supermarket.id)
                         Vue.set(this.supermarkets, idx, updated_supermarket)
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
                         console.log(err, Object.keys(err))
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         this.supermarkets = temp_supermarkets
                     })
             }
@@ -1536,11 +1536,11 @@ export default {
                     .then((updated_supermarket) => {
                         let idx = this.supermarkets.indexOf((x) => x.id === updated_supermarket.id)
                         Vue.set(this.supermarkets, idx, updated_supermarket)
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
                         console.log(err, Object.keys(err))
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         this.supermarkets = temp_supermarkets
                     })
             }
diff --git a/vue/src/components/AddRecipeToBook.vue b/vue/src/components/AddRecipeToBook.vue
index 82cf2cb6f..d573afad0 100644
--- a/vue/src/components/AddRecipeToBook.vue
+++ b/vue/src/components/AddRecipeToBook.vue
@@ -87,21 +87,21 @@ export default {
             apiFactory.createRecipeBook({ name: name }).then((r) => {
                 this.books.push(r.data)
                 this.selected_book = r.data
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
             })
         },
         addToBook: function () {
             let apiFactory = new ApiApiFactory()
             apiFactory.createRecipeBookEntry({ book: this.selected_book.id, recipe: this.recipe.id }).then((r) => {
                 this.recipe_book_list.push(r.data)
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
             })
         },
         removeFromBook: function (book_entry) {
             let apiFactory = new ApiApiFactory()
             apiFactory.destroyRecipeBookEntry(book_entry.id).then((r) => {
                 this.recipe_book_list = this.recipe_book_list.filter((e) => e.id !== book_entry.id)
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
             })
         },
         loadBookEntries: function () {
diff --git a/vue/src/components/Badges/Shopping.vue b/vue/src/components/Badges/Shopping.vue
index a156a46a9..efec66bf6 100644
--- a/vue/src/components/Badges/Shopping.vue
+++ b/vue/src/components/Badges/Shopping.vue
@@ -66,7 +66,7 @@ export default {
             }
             this.genericAPI(this.Models.FOOD, this.Actions.SHOPPING, params).then((result) => {
                 this.shopping = true
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
             })
         },
         cancelDelete() {
@@ -80,7 +80,7 @@ export default {
             this.genericAPI(this.Models.FOOD, this.Actions.SHOPPING, params).then(() => {
                 this.shopping = false
                 this.$refs["shopping" + this.item.id].$emit("close")
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
             })
         },
     },
diff --git a/vue/src/components/CookbookEditCard.vue b/vue/src/components/CookbookEditCard.vue
index 860ca3644..8f30ba8c1 100644
--- a/vue/src/components/CookbookEditCard.vue
+++ b/vue/src/components/CookbookEditCard.vue
@@ -114,10 +114,10 @@ export default {
             apiClient
                 .updateRecipeBook(this.book_copy.id, this.book_copy)
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                 })
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                 })
         },
         refreshData: function () {
@@ -135,10 +135,10 @@ export default {
                     .destroyRecipeBook(this.book.id)
                     .then((result) => {
                         this.$emit("refresh")
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                     })
                     .catch((error) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                     })
             }
         },
diff --git a/vue/src/components/GenericMultiselect.vue b/vue/src/components/GenericMultiselect.vue
index a5c3a0e7d..f434978cc 100644
--- a/vue/src/components/GenericMultiselect.vue
+++ b/vue/src/components/GenericMultiselect.vue
@@ -187,7 +187,7 @@ export default {
             console.log('CREATEING NEW with -> ' , e)
             this.genericAPI(this.model, this.Actions.CREATE, {name: e}).then(result => {
                 let createdObj = result.data?.results ?? result.data
-                StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                 if (this.multiple) {
                     this.selected_objects.push(createdObj)
                 } else {
@@ -196,7 +196,7 @@ export default {
                 this.objects.push(createdObj)
                 this.selectionChanged()
             }).catch((r, err) => {
-                StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
             })
         },
     },
diff --git a/vue/src/components/IngredientsCard.vue b/vue/src/components/IngredientsCard.vue
index 229e554ff..057b86f72 100644
--- a/vue/src/components/IngredientsCard.vue
+++ b/vue/src/components/IngredientsCard.vue
@@ -175,20 +175,20 @@ export default {
             this.genericAPI(this.Models.RECIPE, this.Actions.SHOPPING, params)
                 .then((result) => {
                     if (del_shopping) {
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                     } else if (this.selected_shoppingrecipe) {
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     } else {
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     }
                 })
                 .catch((err) => {
                     if (del_shopping) {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                     } else if (this.selected_shoppingrecipe) {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                     } else {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                     }
                     this.$emit("shopping-failed")
                 })
diff --git a/vue/src/components/Modals/AddRecipeToBook.vue b/vue/src/components/Modals/AddRecipeToBook.vue
index bf258aace..298976e5b 100644
--- a/vue/src/components/Modals/AddRecipeToBook.vue
+++ b/vue/src/components/Modals/AddRecipeToBook.vue
@@ -90,23 +90,23 @@ export default {
       apiFactory.createRecipeBook({name: name}).then(r => {
         this.books.push(r.data)
         this.selected_book = r.data
-        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
       })
     },
     addToBook: function () {
       let apiFactory = new ApiApiFactory()
       apiFactory.createRecipeBookEntry({book: this.selected_book.id, recipe: this.recipe.id}).then(r => {
         this.recipe_book_list.push(r.data)
-        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
       }).catch(e => {
-          StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+          StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
       })
     },
     removeFromBook: function (book_entry) {
       let apiFactory = new ApiApiFactory()
       apiFactory.destroyRecipeBookEntry(book_entry.id).then(r => {
         this.recipe_book_list = this.recipe_book_list.filter(e => e.id !== book_entry.id)
-        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
       })
     },
     loadBookEntries: function () {
diff --git a/vue/src/components/Modals/GenericModalForm.vue b/vue/src/components/Modals/GenericModalForm.vue
index 852f36d49..a6089ceda 100644
--- a/vue/src/components/Modals/GenericModalForm.vue
+++ b/vue/src/components/Modals/GenericModalForm.vue
@@ -173,13 +173,13 @@ export default {
             this.genericAPI(this.model, this.Actions.DELETE, { id: this.item1.id })
                 .then((result) => {
                     this.$emit("finish-action")
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_DELETE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_DELETE)
                 })
                 .catch((err) => {
                     if (err.response.status === 403){
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE_PROTECTED)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE_PROTECTED)
                     }else {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_DELETE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_DELETE)
                     }
                     this.$emit("finish-action", "cancel")
                 })
@@ -190,22 +190,22 @@ export default {
                 this.genericAPI(this.model, this.Actions.CREATE, this.form_data)
                     .then((result) => {
                         this.$emit("finish-action", { item: result.data })
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     })
                     .catch((err) => {
                         console.log(err)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                         this.$emit("finish-action", "cancel")
                     })
             } else {
                 this.genericAPI(this.model, this.Actions.UPDATE, this.form_data)
                     .then((result) => {
                         this.$emit("finish-action")
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_UPDATE)
                     })
                     .catch((err) => {
                         console.log(err, err.response)
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_UPDATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_UPDATE)
                         this.$emit("finish-action", "cancel")
                     })
             }
@@ -224,11 +224,11 @@ export default {
             this.genericAPI(this.model, this.Actions.MOVE, { source: this.item1.id, target: this.form_data.target.id })
                 .then((result) => {
                     this.$emit("finish-action", { target: this.form_data.target.id })
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_MOVE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_MOVE)
                 })
                 .catch((err) => {
                     console.log(err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_MOVE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_MOVE)
                     this.$emit("finish-action", "cancel")
                 })
         },
@@ -249,12 +249,12 @@ export default {
             })
                 .then((result) => {
                     this.$emit("finish-action", { target: this.form_data.target.id })
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_MERGE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_MERGE)
                 })
                 .catch((err) => {
                     //TODO error checking not working with OpenAPI methods
                     console.log("Error", err)
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_MERGE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_MERGE)
                     this.$emit("finish-action", "cancel")
                 })
 
diff --git a/vue/src/components/Modals/ShoppingModal.vue b/vue/src/components/Modals/ShoppingModal.vue
index 56f49446e..9934e7d7b 100644
--- a/vue/src/components/Modals/ShoppingModal.vue
+++ b/vue/src/components/Modals/ShoppingModal.vue
@@ -184,11 +184,11 @@ export default {
             apiClient
                 .shoppingRecipe(this.recipe.id, shopping_recipe)
                 .then((result) => {
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                     this.$emit("finish")
                 })
                 .catch((err) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
 
             this.$bvModal.hide(`shopping_${this.modal_id}`)
diff --git a/vue/src/components/RecipeContextMenu.vue b/vue/src/components/RecipeContextMenu.vue
index 7fbdbcb69..2f1868a91 100644
--- a/vue/src/components/RecipeContextMenu.vue
+++ b/vue/src/components/RecipeContextMenu.vue
@@ -162,10 +162,10 @@ export default {
                         this.servings_value = result.data.servings
                         this.addToShopping()
                     }
-                    StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                 })
                 .catch((error) => {
-                    StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                    StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                 })
         },
         createMealPlan(data) {
@@ -228,11 +228,11 @@ export default {
                 apiClient
                     .createRecipe(recipe)
                     .then((new_recipe) => {
-                        StandardToasts.makeStandardToast(StandardToasts.SUCCESS_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.SUCCESS_CREATE)
                         window.open(this.resolveDjangoUrl("view_recipe", new_recipe.data.id))
                     })
                     .catch((error) => {
-                        StandardToasts.makeStandardToast(StandardToasts.FAIL_CREATE)
+                        StandardToasts.makeStandardToast(this,StandardToasts.FAIL_CREATE)
                     })
             })
         },
diff --git a/vue/src/locales/en.json b/vue/src/locales/en.json
index 8e5492ab0..e6e8fed6b 100644
--- a/vue/src/locales/en.json
+++ b/vue/src/locales/en.json
@@ -243,6 +243,7 @@
     "OfflineAlert": "You are offline, shopping list may not syncronize.",
     "shopping_share": "Share Shopping List",
     "shopping_auto_sync": "Autosync",
+    "one_url_per_line": "One URL per line",
     "mealplan_autoadd_shopping": "Auto Add Meal Plan",
     "mealplan_autoexclude_onhand": "Exclude Food On Hand",
     "mealplan_autoinclude_related": "Add Related Recipes",
@@ -339,8 +340,11 @@
     "Website": "Website",
     "App": "App",
     "Bookmarklet": "Bookmarklet",
+    "click_image_import": "Click the image you want to import for this recipe",
+    "no_more_images_found": "No additional images found on Website.",
     "import_duplicates": "To prevent duplicates recipes with the same name as existing ones are ignored. Check this box to import everything.",
     "paste_json": "Paste json or html source here to load recipe.",
+    "Click_To_Edit": "Click to edit",
     "search_no_recipes": "Could not find any recipes!",
     "search_import_help_text": "Import a recipe from an external website or application.",
     "search_create_help_text": "Create a new recipe directly in Tandoor.",
@@ -386,6 +390,7 @@
     "Advanced": "Advanced",
     "Page": "Page",
     "Reset": "Reset",
+    "Options": "Options",
     "Create Food": "Create Food",
     "create_food_desc": "Create a food and link it to this recipe.",
     "additional_options": "Additional Options"
diff --git a/vue/src/utils/utils.js b/vue/src/utils/utils.js
index f76469822..2ebdb6469 100644
--- a/vue/src/utils/utils.js
+++ b/vue/src/utils/utils.js
@@ -50,48 +50,100 @@ export class StandardToasts {
     static FAIL_MOVE = "FAIL_MOVE"
     static FAIL_MERGE = "FAIL_MERGE"
 
-    static makeStandardToast(toast, err_details = undefined) { //TODO err_details render very ugly, improve this maybe by using a custom toast component (in conjunction with error logging maybe)
+    static makeStandardToast(context, toast, err) {
+        let title = ''
+        let msg = ''
+        let variant = ''
+
         switch (toast) {
             case StandardToasts.SUCCESS_CREATE:
-                makeToast(i18n.tc("Success"), i18n.tc("success_creating_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_creating_resource")
                 break
             case StandardToasts.SUCCESS_FETCH:
-                makeToast(i18n.tc("Success"), i18n.tc("success_fetching_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_fetching_resource")
                 break
             case StandardToasts.SUCCESS_UPDATE:
-                makeToast(i18n.tc("Success"), i18n.tc("success_updating_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_updating_resource")
                 break
             case StandardToasts.SUCCESS_DELETE:
-                makeToast(i18n.tc("Success"), i18n.tc("success_deleting_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_deleting_resource")
                 break
             case StandardToasts.SUCCESS_MOVE:
-                makeToast(i18n.tc("Success"), i18n.tc("success_moving_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_moving_resource")
                 break
             case StandardToasts.SUCCESS_MERGE:
-                makeToast(i18n.tc("Success"), i18n.tc("success_merging_resource") + (err_details ? "\n" + err_details : ""), "success")
+                variant = 'success'
+                title = i18n.tc("Success")
+                msg = i18n.tc("success_merging_resource")
                 break
             case StandardToasts.FAIL_CREATE:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_creating_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_creating_resource")
                 break
             case StandardToasts.FAIL_FETCH:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_fetching_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_fetching_resource")
                 break
             case StandardToasts.FAIL_UPDATE:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_updating_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_updating_resource")
                 break
             case StandardToasts.FAIL_DELETE:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_deleting_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_deleting_resource")
                 break
             case StandardToasts.FAIL_DELETE_PROTECTED:
-                makeToast(i18n.tc("Protected"), i18n.tc("err_deleting_protected_resource"), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_deleting_protected_resource")
                 break
             case StandardToasts.FAIL_MOVE:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_moving_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_moving_resource")
                 break
             case StandardToasts.FAIL_MERGE:
-                makeToast(i18n.tc("Failure"), i18n.tc("err_merging_resource") + (err_details ? "\n" + err_details : ""), "danger")
+                variant = 'danger'
+                title = i18n.tc("Failure")
+                msg = i18n.tc("err_merging_resource")
                 break
         }
+
+
+        let DEBUG = localStorage.getItem("DEBUG") === "True" || false
+
+        if (err !== undefined) {
+            if (DEBUG && err.response.headers['content-type'] === 'application/json' && err.response.status < 500) {
+                console.log('ERROR ', JSON.stringify(err.response.data))
+                msg = context.$createElement('div', {}, [
+                    context.$createElement('span', {}, [msg]),
+                    context.$createElement('br', {}, []),
+                    context.$createElement('code', {'class': 'mt-2'}, [JSON.stringify(err.response.data)])
+                ])
+            }
+        }
+
+        let toaster = new BToast()
+        toaster.$bvToast.toast(msg, {
+            title: title,
+            variant: variant,
+            toaster: "b-toaster-bottom-right",
+            solid: true,
+        })
     }
 }
 
@@ -167,7 +219,7 @@ export const StaticMixin = {
 
 export function resolveDjangoStatic(param) {
     let url = localStorage.getItem('STATIC_URL') + param
-    return url.replace('//','/') //replace // with / in case param started with / which resulted in // after the static base url
+    return url.replace('//', '/') //replace // with / in case param started with / which resulted in // after the static base url
 }
 
 /*