remove console.log + refactor categories

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

@@ -101,7 +101,6 @@ export default {
         templates: this.selectedTemplates,
       };
 
-      console.log(data);
 
       await api.backups.create(data);
       this.loading = false;

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

@@ -75,7 +75,6 @@ export default {
       let response = await api.backups.requestAvailable();
       this.availableBackups = response.imports;
       this.availableTemplates = response.templates;
-      console.log(this.availableBackups);
     },
     deleteBackup() {
       if (this.$refs.form.validate()) {

frontend/src/components/Settings/General/HomePageSettings.vue

@@ -41,14 +41,14 @@
                 >
                   <v-list-item
                     v-for="(item, index) in homeCategories"
-                    :key="item"
+                    :key="`${item.name}-${index}`"
                   >
                     <v-list-item-icon>
                       <v-icon>mdi-menu</v-icon>
                     </v-list-item-icon>
 
                     <v-list-item-content>
-                      <v-list-item-title v-text="item"></v-list-item-title>
+                      <v-list-item-title v-text="item.name"></v-list-item-title>
                     </v-list-item-content>
                     <v-list-item-icon @click="deleteActiveCategory(index)">
                       <v-icon>mdi-delete</v-icon>
@@ -81,13 +81,16 @@
                     minHeight: `200px`,
                   }"
                 >
-                  <v-list-item v-for="item in categories" :key="item">
+                  <v-list-item
+                    v-for="(item, index) in categories"
+                    :key="`${item.name}-${index}`"
+                  >
                     <v-list-item-icon>
                       <v-icon>mdi-menu</v-icon>
                     </v-list-item-icon>
 
                     <v-list-item-content>
-                      <v-list-item-title v-text="item"></v-list-item-title>
+                      <v-list-item-title v-text="item.name"></v-list-item-title>
                     </v-list-item-content>
                     <v-list-item-icon @click="deleteActiveCategory(index)">
                       <v-icon>mdi-delete</v-icon>
@@ -142,8 +145,10 @@ export default {
       this.homeCategories.splice(index, 1);
     },
     saveSettings() {
-      console.log("Saving Settings");
-      console.log(this.homeCategories);
+
+      this.homeCategories.forEach((element, index) => {
+        element.position = index + 1;
+      });
       this.$store.commit("setShowRecent", this.showRecent);
       this.$store.commit("setShowLimit", this.showLimit);
       this.$store.commit("setHomeCategories", this.homeCategories);

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

@@ -58,7 +58,6 @@ export default {
   methods: {
     getOptions() {
       this.langOptions = this.$store.getters.getAllLangs;
-      console.log(this.langOptions);
       this.selectedLang = this.$store.getters.getActiveLang;
     },
   },

frontend/src/components/Settings/Migration/MigrationCard.vue

@@ -81,7 +81,6 @@ export default {
     async importMigration(file_name) {
       this.loading == true;
       let response = await api.migrations.import(this.folder, file_name);
-      console.log(response);
       this.$emit("imported", response.successful, response.failed);
       this.loading == false;
     },

frontend/src/components/UI/CategorySidebar.vue

@@ -5,7 +5,7 @@
         <v-list-item-icon>
           <v-icon>{{ nav.icon }}</v-icon>
         </v-list-item-icon>
-        <v-list-item-title>{{ nav.title }}</v-list-item-title>
+        <v-list-item-title>{{ nav.title | titleCase }}</v-list-item-title>
       </v-list-item>
     </v-list>
   </v-navigation-drawer>
@@ -15,7 +15,8 @@
 export default {
   data() {
     return {
-      links: [
+      links: [],
+      baseLinks: [
         {
           icon: "mdi-home",
           to: "/",
@@ -34,14 +35,27 @@ export default {
       return this.$store.getters.getCategories;
     },
   },
+  watch: {
+    allCategories() {
+      this.buildSidebar();
+    },
+  },
   mounted() {
-    this.allCategories.forEach(async (element) => {
-      this.links.push({
-        title: element,
-        to: `/recipes/${element}`,
-        icon: "mdi-tag",
+    this.buildSidebar();
+  },
+
+  methods: {
+    async buildSidebar() {
+      this.links = [];
+      this.links.push(...this.baseLinks);
+      this.allCategories.forEach(async (element) => {
+        this.links.push({
+          title: element.name,
+          to: `/recipes/${element.slug}`,
+          icon: "mdi-tag",
+        });
       });
-    });
+    },
   },
 };
 </script>

frontend/src/components/UI/SearchBar.vue

@@ -82,7 +82,6 @@ export default {
     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) {

frontend/src/components/UI/SearchDialog.vue

@@ -61,7 +61,6 @@ export default {
       this.searchResults = results;
     },
     emitSelect(name, slug) {
-      console.log(name, slug);
       this.$emit("select", name, slug);
       this.dialog = false;
     },