Fixed spelling of availible

Sorry about all the small changes across lots of files, I think it would be best to fix this though to avoid potential future confusion.

frontend/src/api/backup.js

@@ -6,7 +6,7 @@ const backupBase = baseURL + "backups/";
 
 const backupURLs = {
   // Backup
-  avaiable: `${backupBase}avaiable/`,
+  available: `${backupBase}available/`,
   createBackup: `${backupBase}export/database/`,
   importBackup: (fileName) => `${backupBase}${fileName}/import/`,
   deleteBackup: (fileName) => `${backupBase}${fileName}/delete/`,
@@ -14,7 +14,7 @@ const backupURLs = {
 
 export default {
   async requestAvailable() {
-    let response = await apiReq.get(backupURLs.avaiable);
+    let response = await apiReq.get(backupURLs.available);
     return response.data;
   },
 

frontend/src/components/Admin/Theme.vue

@@ -21,7 +21,7 @@
           <v-form ref="form" lazy-validation>
             <v-select
               label="Saved Color Schemes"
-              :items="avaiableThemes"
+              :items="availableThemes"
               item-text="name"
               item-value="colors"
               return-object
@@ -95,13 +95,13 @@ export default {
       themes: null,
       activeTheme: {},
       darkMode: false,
-      avaiableThemes: [],
+      availableThemes: [],
       selectedScheme: "",
       selectedLight: "",
     };
   },
   async mounted() {
-    this.avaiableThemes = await api.themes.requestAll();
+    this.availableThemes = await api.themes.requestAll();
     this.darkMode = this.$store.getters.getDarkMode;
     this.themes = this.$store.getters.getThemes;
     this.setThemeEditor();
@@ -115,12 +115,12 @@ export default {
         } else if (this.selectedScheme !== "") {
           api.themes.delete(this.selectedScheme.name);
         }
-        this.avaiableThemes = await api.themes.requestAll();
+        this.availableThemes = await api.themes.requestAll();
       }
     },
     async appendTheme(newTheme) {
       api.themes.create(newTheme);
-      this.avaiableThemes.push(newTheme);
+      this.availableThemes.push(newTheme);
     },
     themeSelected() {
       this.activeTheme = this.selectedScheme.colors;

frontend/src/components/MealPlan/MealSelect.vue

@@ -5,7 +5,7 @@
         <v-card-title class="headline"> Choose a Recipe </v-card-title>
         <v-card-text>
           <v-autocomplete
-            :items="avaiableRecipes"
+            :items="availableRecipes"
             v-model="selected"
             clearable
             return
@@ -85,7 +85,7 @@ export default {
   },
 
   computed: {
-    avaiableRecipes() {
+    availableRecipes() {
       return this.$store.getters.getRecentRecipes;
     },
   },