From a7fe96faebe6a3f37dbc44a2b3de6b32a0745c39 Mon Sep 17 00:00:00 2001
From: hay-kot <hay-kot@pm.me>
Date: Sat, 1 May 2021 19:31:01 -0800
Subject: [PATCH] context menu

---
 frontend/src/components/Recipe/ContextMenu.vue      |  5 ++++-
 frontend/src/components/Recipe/MobileRecipeCard.vue |  6 +++++-
 frontend/src/pages/Recipe/ViewRecipe.vue            | 10 ++--------
 3 files changed, 11 insertions(+), 10 deletions(-)

diff --git a/frontend/src/components/Recipe/ContextMenu.vue b/frontend/src/components/Recipe/ContextMenu.vue
index 79116b8ff..c4c8b3b14 100644
--- a/frontend/src/components/Recipe/ContextMenu.vue
+++ b/frontend/src/components/Recipe/ContextMenu.vue
@@ -18,7 +18,7 @@
           v-on="on"
           @click.prevent
         >
-          <v-icon>mdi-dots-vertical</v-icon>
+          <v-icon>{{ menuIcon }}</v-icon>
         </v-btn>
       </template>
       <v-list dense>
@@ -48,6 +48,9 @@ export default {
     slug: {
       type: String,
     },
+    menuIcon: {
+      default: "mdi-dots-vertical",
+    },
   },
   computed: {
     loggedIn() {
diff --git a/frontend/src/components/Recipe/MobileRecipeCard.vue b/frontend/src/components/Recipe/MobileRecipeCard.vue
index 377f9a10d..08ea424a7 100644
--- a/frontend/src/components/Recipe/MobileRecipeCard.vue
+++ b/frontend/src/components/Recipe/MobileRecipeCard.vue
@@ -1,5 +1,6 @@
 <template>
   <v-card
+    :ripple="false"
     class="mx-auto"
     hover
     :to="`/recipe/${slug}`"
@@ -15,7 +16,7 @@
         <v-img :src="getImage(slug)" lazy-src=""></v-img
       ></v-list-item-avatar>
       <v-list-item-content>
-        <v-list-item-title class=" mb-1">{{ name }}</v-list-item-title>
+        <v-list-item-title class=" mb-1">{{ name }} </v-list-item-title>
         <v-list-item-subtitle> {{ description }} </v-list-item-subtitle>
         <div class="d-flex justify-center align-center">
           <RecipeChips
@@ -34,6 +35,7 @@
             size="15"
             :value="rating"
           ></v-rating>
+          <ContextMenu :slug="slug" menu-icon="mdi-dots-horizontal" />
         </div>
       </v-list-item-content>
     </v-list-item>
@@ -42,10 +44,12 @@
 
 <script>
 import RecipeChips from "@/components/Recipe/RecipeViewer/RecipeChips";
+import ContextMenu from "@/components/Recipe/ContextMenu";
 import { api } from "@/api";
 export default {
   components: {
     RecipeChips,
+    ContextMenu,
   },
   props: {
     name: String,
diff --git a/frontend/src/pages/Recipe/ViewRecipe.vue b/frontend/src/pages/Recipe/ViewRecipe.vue
index e341f495f..8d49e44fb 100644
--- a/frontend/src/pages/Recipe/ViewRecipe.vue
+++ b/frontend/src/pages/Recipe/ViewRecipe.vue
@@ -129,8 +129,7 @@ export default {
   mounted() {
     this.getRecipeDetails();
     this.jsonEditor = false;
-    this.form = Boolean(this.edit);
-    console.log(this.form);
+    this.form = this.$route.query.edit === "true" && this.loggedIn;
   },
 
   watch: {
@@ -144,7 +143,7 @@ export default {
       return this.$route.params.recipe;
     },
     edit() {
-      return this.$route.query.edit;
+      return true;
     },
     showIcons() {
       return this.form;
@@ -165,7 +164,6 @@ export default {
     async getRecipeDetails() {
       this.recipeDetails = await api.recipes.requestDetails(this.currentRecipe);
       this.skeleton = false;
-      this.form = false;
     },
     getImage(image) {
       if (image) {
@@ -212,10 +210,6 @@ export default {
         }
       }
     },
-    showForm() {
-      this.form = true;
-      this.jsonEditor = false;
-    },
   },
 };
 </script>