hide editor buttons when not logged in

frontend/src/App.vue

@@ -31,8 +31,10 @@
       <LanguageMenu />
     </v-app-bar>
     <v-main>
-      <AddRecipeFab />
-        <router-view></router-view>
+      <v-slide-x-reverse-transition>
+        <AddRecipeFab v-if="loggedIn" />
+      </v-slide-x-reverse-transition>
+      <router-view></router-view>
       <FlashMessage :position="'right bottom'"></FlashMessage>
     </v-main>
   </v-app>
@@ -44,6 +46,7 @@ import SearchBar from "@/components/UI/Search/SearchBar";
 import AddRecipeFab from "@/components/UI/AddRecipeFab";
 import LanguageMenu from "@/components/UI/LanguageMenu";
 import Vuetify from "./plugins/vuetify";
+import { user } from "@/mixins/user";
 
 export default {
   name: "App",
@@ -55,6 +58,8 @@ export default {
     LanguageMenu,
   },
 
+  mixins: [user],
+
   watch: {
     $route() {
       this.search = false;

frontend/src/mixins/user.js

@@ -0,0 +1,12 @@
+import { store } from "@/store";
+export const user = {
+  data() {},
+  computed: {
+    user() {
+      return store.getters.getUserData;
+    },
+    loggedIn() {
+      return store.getters.getIsLoggedIn;
+    },
+  },
+};

frontend/src/pages/RecipePage.vue

@@ -15,6 +15,7 @@
         />
       </v-img>
       <EditorButtonRow
+        v-if="loggedIn"
         :open="showIcons"
         @json="jsonEditor = true"
         @editor="
@@ -65,6 +66,7 @@ import RecipeViewer from "../components/Recipe/RecipeViewer";
 import RecipeEditor from "../components/Recipe/RecipeEditor";
 import RecipeTimeCard from "../components/Recipe/RecipeTimeCard.vue";
 import EditorButtonRow from "../components/Recipe/EditorButtonRow";
+import { user } from "@/mixins/user";
 
 export default {
   components: {
@@ -74,6 +76,7 @@ export default {
     EditorButtonRow,
     RecipeTimeCard,
   },
+  mixins: [user],
   data() {
     return {
       // currentRecipe: this.$route.params.recipe,