Sqlite (#75)

* file structure

* auto-test

* take 2

* refactor ap scheduler and startup process

* fixed scraper error

* database abstraction

* database abstraction

* port recipes over to new schema

* meal migration

* start settings migration

* finale mongo port

* backup improvements

* migration imports to new DB structure

* unused import cleanup

* docs strings

* settings and theme import logic

* cleanup

* fixed tinydb error

* requirements

* fuzzy search

* remove scratch file

* sqlalchemy models

* improved search ui

* recipe models almost done

* sql modal population

* del scratch

* rewrite database model mixins

* mostly grabage

* recipe updates

* working sqllite

* remove old files and reorganize

* final cleanup

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

frontend/src/components/Settings/Backup/index.vue

@@ -121,10 +121,7 @@ export default {
     async createBackup() {
       this.backupLoading = true;
 
-      let response = await api.backups.create(
-        this.backupTag,
-        this.selectedTemplate
-      );
+      let response = await api.backups.create(this.backupTag, this.templates);
 
       if (response.status == 201) {
         this.selectedBackup = null;

frontend/src/components/UI/SearchBar.vue

@@ -0,0 +1,108 @@
+<template>
+  <div>
+    <v-autocomplete
+      :items="autoResults"
+      item-value="item.slug"
+      item-text="item.name"
+      dense
+      light
+      label="Search Mealie"
+      :search-input.sync="search"
+      hide-no-data
+      cache-items
+      solo
+    >
+      <template
+        v-if="showResults"
+        v-slot:item="{ item }"
+        style="max-width: 750px"
+      >
+        <v-list-item-avatar>
+          <v-img :src="getImage(item.item.image)"></v-img>
+        </v-list-item-avatar>
+        <v-list-item-content @click="selected(item.item.slug)">
+          <v-list-item-title>
+            {{ item.item.name }}
+            <v-rating
+              dense
+              v-if="item.item.rating"
+              :value="item.item.rating"
+              size="12"
+            >
+            </v-rating>
+          </v-list-item-title>
+          <v-list-item-subtitle>
+            {{ item.item.description }}
+          </v-list-item-subtitle>
+        </v-list-item-content>
+      </template>
+    </v-autocomplete>
+  </div>
+</template>
+
+<script>
+import Fuse from "fuse.js";
+import utils from "../../utils";
+
+export default {
+  props: {
+    showResults: {
+      default: false,
+    },
+  },
+  data() {
+    return {
+      search: "",
+      result: [],
+      autoResults: [],
+      isDark: false,
+      options: {
+        shouldSort: true,
+        threshold: 0.6,
+        location: 0,
+        distance: 100,
+        maxPatternLength: 32,
+        minMatchCharLength: 1,
+        keys: ["name", "slug"],
+      },
+    };
+  },
+  mounted() {
+    this.isDark = this.$store.getters.getIsDark;
+  },
+  computed: {
+    data() {
+      return this.$store.getters.getRecentRecipes;
+    },
+    fuse() {
+      return new Fuse(this.data, this.options);
+    },
+  },
+  watch: {
+    search() {
+      if (this.search.trim() === "") this.result = this.list;
+      else this.result = this.fuse.search(this.search.trim());
+      console.log("test");
+
+      this.$emit("results", this.result);
+      if (this.showResults === true) {
+        this.autoResults = this.result;
+      }
+    },
+  },
+  methods: {
+    getImage(image) {
+      return utils.getImageURL(image);
+    },
+    selected(slug) {
+      this.$emit("selected", slug);
+    },
+  },
+};
+</script>
+
+<style>
+.color-transition {
+  transition: background-color 0.3s ease;
+}
+</style>