From da9826dc7ccc7abf85732d75b75abc6a93f8e475 Mon Sep 17 00:00:00 2001
From: hay-kot <hay-kot@pm.me>
Date: Thu, 20 May 2021 21:18:58 -0700
Subject: [PATCH] image bug fix

---
 frontend/src/components/Recipe/MobileRecipeCard.vue | 9 +++++++--
 frontend/src/pages/Admin/Profile/UserCard.vue       | 2 +-
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/Recipe/MobileRecipeCard.vue b/frontend/src/components/Recipe/MobileRecipeCard.vue
index 6dc9b2c08823..a982d3d4e8ef 100644
--- a/frontend/src/components/Recipe/MobileRecipeCard.vue
+++ b/frontend/src/components/Recipe/MobileRecipeCard.vue
@@ -2,8 +2,13 @@
   <v-card :ripple="false" class="mx-auto" hover :to="`/recipe/${slug}`" @click="$emit('selected')">
     <v-list-item three-line>
       <v-list-item-avatar tile size="125" class="v-mobile-img rounded-sm my-0 ml-n4">
-        <v-img v-if="!fallBackImage" :src="getImage(slug)" @error="fallBackImage = true"></v-img>
-        <v-icon color="primary" class="icon-position" size="100">
+        <v-img
+          v-if="!fallBackImage"
+          :src="getImage(slug)"
+          @load="fallBackImage = false"
+          @error="fallBackImage = true"
+        ></v-img>
+        <v-icon v-else color="primary" class="icon-position" size="100">
           mdi-silverware-variant
         </v-icon>
       </v-list-item-avatar>
diff --git a/frontend/src/pages/Admin/Profile/UserCard.vue b/frontend/src/pages/Admin/Profile/UserCard.vue
index a134228364c0..960738615db7 100644
--- a/frontend/src/pages/Admin/Profile/UserCard.vue
+++ b/frontend/src/pages/Admin/Profile/UserCard.vue
@@ -2,7 +2,7 @@
   <StatCard icon="mdi-account">
     <template v-slot:avatar>
       <v-avatar color="accent" size="120" class="white--text headline mt-n16">
-        <img :src="userProfileImage" v-if="!hideImage" @error="hideImage = true" />
+        <img :src="userProfileImage" v-if="!hideImage" @error="hideImage = true" @load="hideImage = false" />
         <div v-else>
           {{ initials }}
         </div>