feature/finish-recipe-assets (#384)

* add features to readme

* Copy markdown reference

* prop as whole recipe

* parameter as url instead of query

* add card styling to editor

* move images to /recipes/{slug}/images

* add image to breaking changes

* fix delete and import errors

* fix debug/about response

* logger updates

* dashboard ui

* add server side events

* unorganized routes

* default slot

* add backup viewer to dashboard

* format

* add dialog to backup imports

* initial event support

* delete assets when removed

Co-authored-by: hay-kot <hay-kot@pm.me>

frontend/src/components/UI/Buttons/TheDownloadBtn.vue

@@ -1,7 +1,11 @@
 <template>
-  <v-btn color="accent" text :loading="downloading" @click="downloadFile">
-    {{ showButtonText }}
-  </v-btn>
+  <div>
+    <slot v-bind="{ downloading, downloadFile }">
+      <v-btn color="accent" text :loading="downloading" @click="downloadFile">
+        {{ showButtonText }}
+      </v-btn>
+    </slot>
+  </div>
 </template>
 
 <script>

frontend/src/components/UI/Buttons/TheUploadBtn.vue

@@ -1,10 +1,12 @@
 <template>
   <v-form ref="file">
     <input ref="uploader" class="d-none" type="file" @change="onFileChanged" />
-    <v-btn :loading="isSelecting" @click="onButtonClick" color="accent" :text="textBtn">
-      <v-icon left> {{ icon }}</v-icon>
-      {{ text ? text : defaultText }}
-    </v-btn>
+    <slot v-bind="{ isSelecting, onButtonClick }">
+      <v-btn :loading="isSelecting" @click="onButtonClick" color="accent" :text="textBtn">
+        <v-icon left> {{ icon }}</v-icon>
+        {{ text ? text : defaultText }}
+      </v-btn>
+    </slot>
   </v-form>
 </template>
 
@@ -25,7 +27,7 @@ export default {
       default: true,
     },
   },
-  data: () => ({
+  data: () => ({    
     file: null,
     isSelecting: false,
   }),

frontend/src/components/UI/LogCard.vue

@@ -0,0 +1,81 @@
+<template>
+  <div class="mt-2">
+    <v-card>
+      <v-card-title class="headline">
+        Log
+        <v-spacer></v-spacer>
+        <v-text-field
+          class="ml-auto shrink mb-n7"
+          solo
+          label="Log Lines"
+          type="number"
+          append-icon="mdi-refresh-circle"
+          v-model="lines"
+          @click:append="getLogText"
+          suffix="lines"
+          single-line
+        >
+        </v-text-field>
+        <TheDownloadBtn :button-text="$t('about.download-log')" download-url="/api/debug/log">
+          <template v-slot:default="{ downloadFile }">
+            <v-btn bottom right relative fab icon color="primary" @click="downloadFile">
+              <v-icon> mdi-download </v-icon>
+            </v-btn>
+          </template>
+        </TheDownloadBtn>
+      </v-card-title>
+      <v-divider></v-divider>
+      <v-card-text>
+        <div v-for="(item, index) in splitText" :key="index" :class="getClass(item)">
+          {{ item }}
+        </div>
+      </v-card-text>
+    </v-card>
+  </div>
+</template>
+
+<script>
+import TheDownloadBtn from "@/components/UI/Buttons/TheDownloadBtn";
+import { api } from "@/api";
+export default {
+  components: { TheDownloadBtn },
+  data() {
+    return {
+      lines: 200,
+      text: "",
+    };
+  },
+  mounted() {
+    this.getLogText();
+  },
+  computed: {
+    splitText() {
+      return this.text.split("/n");
+    },
+  },
+  methods: {
+    async getLogText() {
+      this.text = await api.meta.getLogText(this.lines);
+    },
+    getClass(text) {
+      const isError = text.includes("ERROR:");
+      if (isError) {
+        return "log--error";
+      }
+    },
+  },
+};
+</script>
+
+<style scoped>
+.log-text {
+  background-color: #e0e0e077;
+}
+.log--error {
+  color: #ef5350;
+}
+.line-number {
+  color: black;
+  font-weight: bold;
+}
+</style>

frontend/src/components/UI/TheSidebar.vue

@@ -147,6 +147,11 @@ export default {
     },
     adminLinks() {
       return [
+        {
+          icon: "mdi-view-dashboard",
+          to: "/admin/dashboard",
+          title: this.$t("general.dashboard"),
+        },
         {
           icon: "mdi-cog",
           to: "/admin/settings",