diff --git a/frontend.old/.env.development b/frontend.old/.env.development
deleted file mode 100644
index 4afc44f70ac8..000000000000
--- a/frontend.old/.env.development
+++ /dev/null
@@ -1,2 +0,0 @@
-VUE_APP_API_BASE_URL=http://localhost:9000
-PREVIEW_BUNDLE=true
\ No newline at end of file
diff --git a/frontend.old/README.md b/frontend.old/README.md
deleted file mode 100644
index 576b98091161..000000000000
--- a/frontend.old/README.md
+++ /dev/null
@@ -1,24 +0,0 @@
-# frontend
-
-## Project setup
-```
-npm install
-```
-
-### Compiles and hot-reloads for development
-```
-npm run serve
-```
-
-### Compiles and minifies for production
-```
-npm run build
-```
-
-### Lints and fixes files
-```
-npm run lint
-```
-
-### Customize configuration
-See [Configuration Reference](https://cli.vuejs.org/config/).
diff --git a/frontend.old/babel.config.js b/frontend.old/babel.config.js
deleted file mode 100644
index 162a3ea97c29..000000000000
--- a/frontend.old/babel.config.js
+++ /dev/null
@@ -1,3 +0,0 @@
-module.exports = {
-  presets: ["@vue/cli-plugin-babel/preset"],
-};
diff --git a/frontend.old/component-stagin/Domain/MealPlan/MealPlanCard.vue b/frontend.old/component-stagin/Domain/MealPlan/MealPlanCard.vue
deleted file mode 100644
index 140e9872cb39..000000000000
--- a/frontend.old/component-stagin/Domain/MealPlan/MealPlanCard.vue
+++ /dev/null
@@ -1,173 +0,0 @@
-<template>
-  <v-row>
-    <SearchDialog ref="mealselect" @selected="setSlug" />
-    <BaseDialog
-      ref="customMealDialog"
-      title="Custom Meal"
-      :title-icon="$globals.icons.primary"
-      :submit-text="$t('general.save')"
-      :top="true"
-      @submit="pushCustomMeal"
-    >
-      <v-card-text>
-        <v-text-field v-model="customMeal.name" autofocus :label="$t('general.name')"> </v-text-field>
-        <v-textarea v-model="customMeal.description" :label="$t('recipe.description')"> </v-textarea>
-      </v-card-text>
-    </BaseDialog>
-    <v-col v-for="(planDay, index) in value" :key="index" cols="12" sm="12" md="6" lg="4" xl="3">
-      <v-hover v-slot="{ hover }" :open-delay="50">
-        <v-card :class="{ 'on-hover': hover }" :elevation="hover ? 12 : 2">
-          <CardImage large :slug="planDay.meals[0].slug" icon-size="200" @click="openSearch(index, modes.primary)">
-            <div>
-              <v-fade-transition>
-                <v-btn v-if="hover" small color="info" class="ma-1" @click.stop="addCustomItem(index, modes.primary)">
-                  <v-icon left>
-                    {{ $globals.icons.edit }}
-                  </v-icon>
-                  {{ $t("reicpe.no-recipe") }}
-                </v-btn>
-              </v-fade-transition>
-            </div>
-          </CardImage>
-
-          <v-card-title class="my-n3 mb-n6">
-            {{ $d(new Date(planDay.date.replaceAll("-", "/")), "short") }}
-          </v-card-title>
-          <v-card-subtitle class="mb-0 pb-0"> {{ planDay.meals[0].name }}</v-card-subtitle>
-          <v-hover v-slot="{ hover }">
-            <v-card-actions>
-              <v-spacer></v-spacer>
-              <v-fade-transition>
-                <v-btn v-if="hover" small color="info" text @click.stop="addCustomItem(index, modes.sides)">
-                  <v-icon left>
-                    {{ $globals.icons.edit }}
-                  </v-icon>
-                  {{ $t("reicpe.no-recipe") }}
-                </v-btn>
-              </v-fade-transition>
-              <v-btn color="info" outlined small @click="openSearch(index, modes.sides)">
-                <v-icon small class="mr-1">
-                  {{ $globals.icons.create }}
-                </v-icon>
-                {{ $t("meal-plan.side") }}
-              </v-btn>
-            </v-card-actions>
-          </v-hover>
-          <v-divider class="mx-2"></v-divider>
-          <v-list dense>
-            <v-list-item v-for="(recipe, i) in planDay.meals.slice(1)" :key="i">
-              <v-list-item-avatar color="accent">
-                <v-img :alt="recipe.slug" :src="getImage(recipe.slug)"></v-img>
-              </v-list-item-avatar>
-
-              <v-list-item-content>
-                <v-list-item-title v-text="recipe.name"></v-list-item-title>
-              </v-list-item-content>
-
-              <v-list-item-icon>
-                <v-btn icon @click="removeSide(index, i + 1)">
-                  <v-icon color="error">
-                    {{ $globals.icons.delete }}
-                  </v-icon>
-                </v-btn>
-              </v-list-item-icon>
-            </v-list-item>
-          </v-list>
-        </v-card>
-      </v-hover>
-    </v-col>
-  </v-row>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import { api } from "@/api";
-import SearchDialog from "../UI/Dialogs/SearchDialog";
-import CardImage from "../Recipe/CardImage.vue";
-export default {
-  components: {
-    SearchDialog,
-    CardImage,
-    BaseDialog,
-  },
-  props: {
-    value: Array,
-  },
-  data() {
-    return {
-      activeIndex: 0,
-      mode: "PRIMARY",
-      modes: {
-        primary: "PRIMARY",
-        sides: "SIDES",
-      },
-      customMeal: {
-        slug: null,
-        name: "",
-        description: "",
-      },
-    };
-  },
-
-  methods: {
-    getImage(slug) {
-      if (slug) {
-        return api.recipes.recipeSmallImage(slug);
-      }
-    },
-    setSide(name, slug = null, description = "") {
-      const meal = { name, slug, description };
-      this.value[this.activeIndex].meals.push(meal);
-    },
-    setPrimary(name, slug, description = "") {
-      this.value[this.activeIndex].meals[0].slug = slug;
-      this.value[this.activeIndex].meals[0].name = name;
-      this.value[this.activeIndex].meals[0].description = description;
-    },
-    setSlug(recipe) {
-      switch (this.mode) {
-        case this.modes.primary:
-          this.setPrimary(recipe.name, recipe.slug);
-          break;
-        default:
-          this.setSide(recipe.name, recipe.slug);
-          break;
-      }
-    },
-    openSearch(index, mode) {
-      this.mode = mode;
-      this.activeIndex = index;
-      this.$refs.mealselect.open();
-    },
-    removeSide(dayIndex, sideIndex) {
-      this.value[dayIndex].meals.splice(sideIndex, 1);
-    },
-    addCustomItem(index, mode) {
-      this.mode = mode;
-      this.activeIndex = index;
-      this.$refs.customMealDialog.open();
-    },
-    pushCustomMeal() {
-      switch (this.mode) {
-        case this.modes.primary:
-          this.setPrimary(this.customMeal.name, this.customMeal.slug, this.customMeal.description);
-          break;
-        default:
-          this.setSide(this.customMeal.name, this.customMeal.slug, this.customMeal.description);
-          break;
-      }
-      this.customMeal = { name: "", slug: null, description: "" };
-    },
-  },
-};
-</script>
-
-<style>
-.relative-card {
-  position: relative;
-}
-
-.custom-button {
-  z-index: -1;
-}
-</style>
diff --git a/frontend.old/component-stagin/Domain/MealPlan/MealPlanEditor.vue b/frontend.old/component-stagin/Domain/MealPlan/MealPlanEditor.vue
deleted file mode 100644
index 7f790b483491..000000000000
--- a/frontend.old/component-stagin/Domain/MealPlan/MealPlanEditor.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<template>
-  <v-card>
-    <v-card-title class="headline">
-      {{ $t("meal-plan.edit-meal-plan") }}
-    </v-card-title>
-    <v-divider></v-divider>
-
-    <v-card-text>
-      <MealPlanCard v-model="mealPlan.planDays" />
-      <v-row align="center" justify="end">
-        <v-card-actions>
-          <TheButton update @click="update" />
-          <v-spacer></v-spacer>
-        </v-card-actions>
-      </v-row>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import { api } from "@/api";
-import { utils } from "@/utils";
-import MealPlanCard from "./MealPlanCard";
-export default {
-  components: {
-    MealPlanCard,
-  },
-  props: {
-    mealPlan: Object,
-  },
-
-  methods: {
-    formatDate(timestamp) {
-      const dateObject = new Date(timestamp);
-      return utils.getDateAsPythonDate(dateObject);
-    },
-    async update() {
-      if (await api.mealPlans.update(this.mealPlan.uid, this.mealPlan)) {
-        this.$emit("updated");
-      }
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/component-stagin/Domain/MealPlan/MealPlanNew.vue b/frontend.old/component-stagin/Domain/MealPlan/MealPlanNew.vue
deleted file mode 100644
index fd8fbe347ec2..000000000000
--- a/frontend.old/component-stagin/Domain/MealPlan/MealPlanNew.vue
+++ /dev/null
@@ -1,227 +0,0 @@
-<template>
-  <v-card>
-    <v-card-title class=" headline">
-      {{ $t("meal-plan.create-a-new-meal-plan") }}
-      <v-btn color="info" class="ml-auto" @click="setQuickWeek()">
-        <v-icon left> {{ $globals.icons.calendarMinus }} </v-icon>
-        {{ $t("meal-plan.quick-week") }}
-      </v-btn>
-    </v-card-title>
-
-    <v-divider></v-divider>
-    <v-card-text>
-      <v-row dense>
-        <v-col cols="12" lg="6" md="6" sm="12">
-          <v-menu
-            ref="menu1"
-            v-model="menu1"
-            :close-on-content-click="true"
-            transition="scale-transition"
-            offset-y
-            max-width="290px"
-            min-width="290px"
-          >
-            <template #activator="{ on, attrs }">
-              <v-text-field
-                v-model="startComputedDateFormatted"
-                :label="$t('meal-plan.start-date')"
-                persistent-hint
-                :prepend-icon="$globals.icons.calendarMinus"
-                readonly
-                v-bind="attrs"
-                v-on="on"
-              ></v-text-field>
-            </template>
-            <DatePicker v-model="startDate" no-title @input="menu2 = false" />
-          </v-menu>
-        </v-col>
-        <v-col cols="12" lg="6" md="6" sm="12">
-          <v-menu
-            ref="menu2"
-            v-model="menu2"
-            :close-on-content-click="true"
-            transition="scale-transition"
-            offset-y
-            max-width="290px"
-            min-width="290px"
-          >
-            <template #activator="{ on, attrs }">
-              <v-text-field
-                v-model="endComputedDateFormatted"
-                :label="$t('meal-plan.end-date')"
-                persistent-hint
-                :prepend-icon="$globals.icons.calendarMinus"
-                readonly
-                v-bind="attrs"
-                v-on="on"
-              ></v-text-field>
-            </template>
-            <DatePicker v-model="endDate" no-title @input="menu2 = false" />
-          </v-menu>
-        </v-col>
-      </v-row>
-    </v-card-text>
-
-    <v-card-text v-if="startDate">
-      <MealPlanCard v-model="planDays" />
-    </v-card-text>
-    <v-row align="center" justify="end">
-      <v-card-actions class="mr-5">
-        <TheButton v-if="planDays.length > 0" edit text @click="random">
-          <template #icon>
-            {{ $globals.icons.diceMultiple }}
-          </template>
-          {{ $t("general.random") }}
-        </TheButton>
-        <TheButton create :disabled="planDays.length == 0" @click="save" />
-      </v-card-actions>
-    </v-row>
-  </v-card>
-</template>
-
-<script>
-import DatePicker from "@/components/FormHelpers/DatePicker";
-import { api } from "@/api";
-import { utils } from "@/utils";
-import MealPlanCard from "./MealPlanCard";
-const CREATE_EVENT = "created";
-export default {
-  components: {
-    MealPlanCard,
-    DatePicker,
-  },
-  data() {
-    return {
-      isLoading: false,
-      planDays: [],
-      items: [],
-
-      // Dates
-      startDate: null,
-      endDate: null,
-      menu1: false,
-      menu2: false,
-      usedRecipes: [1],
-    };
-  },
-
-  computed: {
-    groupSettings() {
-      return this.$store.getters.getCurrentGroup;
-    },
-    actualStartDate() {
-      if (!this.startDate) return null;
-      return Date.parse(this.startDate.replaceAll("-", "/"));
-    },
-    actualEndDate() {
-      if (!this.endDate) return null;
-      return Date.parse(this.endDate.replaceAll("-", "/"));
-    },
-    dateDif() {
-      if (!this.actualEndDate || !this.actualStartDate) return null;
-      const dateDif = (this.actualEndDate - this.actualStartDate) / (1000 * 3600 * 24) + 1;
-      if (dateDif < 1) {
-        return null;
-      }
-      return dateDif;
-    },
-    startComputedDateFormatted() {
-      return this.formatDate(this.actualStartDate);
-    },
-    endComputedDateFormatted() {
-      return this.formatDate(this.actualEndDate);
-    },
-    filteredRecipes() {
-      const recipes = this.items.filter(x => !this.usedRecipes.includes(x));
-      return recipes.length > 0 ? recipes : this.items;
-    },
-    allRecipes() {
-      return this.$store.getters.getAllRecipes;
-    },
-  },
-
-  watch: {
-    dateDif() {
-      this.planDays = [];
-      for (let i = 0; i < this.dateDif; i++) {
-        this.planDays.push({
-          date: this.getDate(i),
-          meals: [
-            {
-              name: "",
-              slug: "empty",
-              description: "empty",
-            },
-          ],
-        });
-      }
-    },
-  },
-  async created() {
-    await this.$store.dispatch("requestCurrentGroup");
-    await this.$store.dispatch("requestAllRecipes");
-    await this.buildMealStore();
-  },
-
-  methods: {
-    async buildMealStore() {
-      const categories = Array.from(this.groupSettings.categories, x => x.name);
-      this.items = await api.recipes.getAllByCategory(categories);
-
-      if (this.items.length === 0) {
-        this.items = this.allRecipes;
-      }
-    },
-    getRandom(list) {
-      return list[Math.floor(Math.random() * list.length)];
-    },
-    random() {
-      this.usedRecipes = [1];
-      this.planDays.forEach((_, index) => {
-        const recipe = this.getRandom(this.filteredRecipes);
-        this.planDays[index].meals[0].slug = recipe.slug;
-        this.planDays[index].meals[0].name = recipe.name;
-        this.usedRecipes.push(recipe);
-      });
-    },
-    getDate(index) {
-      const dateObj = new Date(this.actualStartDate.valueOf() + 1000 * 3600 * 24 * index);
-      return utils.getDateAsPythonDate(dateObj);
-    },
-    async save() {
-      const mealBody = {
-        group: this.groupSettings.name,
-        startDate: this.startDate,
-        endDate: this.endDate,
-        planDays: this.planDays,
-      };
-      if (await api.mealPlans.create(mealBody)) {
-        this.$emit(CREATE_EVENT);
-        this.planDays = [];
-        this.startDate = null;
-        this.endDate = null;
-      }
-    },
-    formatDate(date) {
-      if (!date) return null;
-
-      return this.$d(date);
-    },
-    getNextDayOfTheWeek(dayName, excludeToday = true, refDate = new Date()) {
-      const dayOfWeek = ["sun", "mon", "tue", "wed", "thu", "fri", "sat"].indexOf(dayName.slice(0, 3).toLowerCase());
-      if (dayOfWeek < 0) return;
-      refDate.setUTCHours(0, 0, 0, 0);
-      refDate.setDate(refDate.getDate() + +!!excludeToday + ((dayOfWeek + 7 - refDate.getDay() - +!!excludeToday) % 7));
-      return refDate;
-    },
-    setQuickWeek() {
-      const nextMonday = this.getNextDayOfTheWeek("Monday", false);
-      const nextEndDate = new Date(nextMonday);
-      nextEndDate.setDate(nextEndDate.getDate() + 4);
-
-      this.startDate = utils.getDateAsPythonDate(nextMonday);
-      this.endDate = utils.getDateAsPythonDate(nextEndDate);
-    },
-  },
-};
-</script>
diff --git a/frontend.old/component-stagin/Domain/User/UserAvatar.vue b/frontend.old/component-stagin/Domain/User/UserAvatar.vue
deleted file mode 100644
index a2f119084b25..000000000000
--- a/frontend.old/component-stagin/Domain/User/UserAvatar.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<template>
-  <v-list-item two-line to="/admin/profile">
-    <v-list-item-avatar color="accent" class="white--text">
-      <v-img v-if="!noImage" :src="profileImage" />
-      <div v-else>
-        {{ initials }}
-      </div>
-    </v-list-item-avatar>
-
-    <v-list-item-content>
-      <v-list-item-title> {{ user.fullName }}</v-list-item-title>
-      <v-list-item-subtitle> {{ user.admin ? $t("user.admin") : $t("user.user") }}</v-list-item-subtitle>
-    </v-list-item-content>
-  </v-list-item>
-</template>
-
-<script>
-import { initials } from "@/mixins/initials";
-import axios from "axios";
-import { api } from "@/api";
-export default {
-  mixins: [initials],
-  props: {
-    user: {
-      type: Object,
-    },
-  },
-  data() {
-    return {
-      noImage: false,
-      profileImage: "",
-    };
-  },
-  watch: {
-    async user() {
-      this.setImage();
-    },
-  },
-  methods: {
-    async setImage() {
-      const userImageURL = api.users.userProfileImage(this.user.id);
-      if (await this.imageExists(userImageURL)) {
-        this.noImage = false;
-        this.profileImage = userImageURL;
-      } else {
-        this.noImage = true;
-      }
-    },
-    async imageExists(url) {
-      const response = await axios.get(url).catch(() => {
-        this.noImage = true;
-        return { status: 404 };
-      });
-      return response.status !== 404;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/component-stagin/Page/Recipe/RecipeEditor.vue b/frontend.old/component-stagin/Page/Recipe/RecipeEditor.vue
deleted file mode 100644
index 65ab9152a3ef..000000000000
--- a/frontend.old/component-stagin/Page/Recipe/RecipeEditor.vue
+++ /dev/null
@@ -1,153 +0,0 @@
-<template>
-  <v-form ref="form">
-    <v-card-text>
-      <v-row dense>
-        <ImageUploadBtn class="my-1" :slug="value.slug" @upload="uploadImage" @refresh="$emit('upload')" />
-        <SettingsMenu class="my-1 mx-1" :value="value.settings" @upload="uploadImage" />
-      </v-row>
-      <v-row dense>
-        <v-col>
-          <v-text-field v-model="value.totalTime" :label="$t('recipe.total-time')"></v-text-field>
-        </v-col>
-        <v-col><v-text-field v-model="value.prepTime" :label="$t('recipe.prep-time')"></v-text-field></v-col>
-        <v-col><v-text-field v-model="value.performTime" :label="$t('recipe.perform-time')"></v-text-field></v-col>
-      </v-row>
-      <v-text-field v-model="value.name" class="my-3" :label="$t('recipe.recipe-name')" :rules="[existsRule]">
-      </v-text-field>
-      <v-textarea v-model="value.description" auto-grow min-height="100" :label="$t('recipe.description')">
-      </v-textarea>
-      <div class="my-2"></div>
-      <v-row dense disabled>
-        <v-col sm="4">
-          <v-text-field v-model="value.recipeYield" :label="$t('recipe.servings')" class="rounded-sm"> </v-text-field>
-        </v-col>
-        <v-spacer></v-spacer>
-        <Rating v-model="value.rating" :emit-only="true" />
-      </v-row>
-      <v-row>
-        <v-col cols="12" sm="12" md="4" lg="4">
-          <Ingredients v-model="value.recipeIngredient" :edit="true" />
-          <v-card class="mt-6">
-            <v-card-title class="py-2">
-              {{ $t("recipe.categories") }}
-            </v-card-title>
-            <v-divider class="mx-2"></v-divider>
-            <v-card-text>
-              <CategoryTagSelector
-                v-model="value.recipeCategory"
-                :return-object="false"
-                :show-add="true"
-                :show-label="false"
-              />
-            </v-card-text>
-          </v-card>
-
-          <v-card class="mt-2">
-            <v-card-title class="py-2">
-              {{ $t("tag.tags") }}
-            </v-card-title>
-            <v-divider class="mx-2"></v-divider>
-            <v-card-text>
-              <CategoryTagSelector
-                v-model="value.tags"
-                :return-object="false"
-                :show-add="true"
-                :tag-selector="true"
-                :show-label="false"
-              />
-            </v-card-text>
-          </v-card>
-          <Nutrition v-model="value.nutrition" :edit="true" />
-          <Assets v-model="value.assets" :edit="true" :slug="value.slug" />
-          <ExtrasEditor :extras="value.extras" @save="saveExtras" />
-        </v-col>
-
-        <v-divider class="my-divider" :vertical="true"></v-divider>
-
-        <v-col cols="12" sm="12" md="8" lg="8">
-          <Instructions v-model="value.recipeInstructions" :edit="true" />
-          <div class="d-flex row justify-end mt-2">
-            <BulkAdd class="mr-2" @bulk-data="appendSteps" />
-            <v-btn color="secondary" dark class="mr-4" @click="addStep">
-              <v-icon>{{ $globals.icons.create }}</v-icon>
-            </v-btn>
-          </div>
-          <Notes v-model="value.notes" :edit="true" />
-
-          <v-text-field v-model="value.orgURL" class="mt-10" :label="$t('recipe.original-url')"></v-text-field>
-        </v-col>
-      </v-row>
-    </v-card-text>
-  </v-form>
-</template>
-
-<script>
-import BulkAdd from "@/components/Recipe/Parts/Helpers/BulkAdd";
-import ExtrasEditor from "@/components/Recipe/Parts/Helpers/ExtrasEditor";
-import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
-import ImageUploadBtn from "@/components/Recipe/Parts/Helpers/ImageUploadBtn";
-import { validators } from "@/mixins/validators";
-import Nutrition from "@/components/Recipe/Parts/Nutrition";
-import Instructions from "@/components/Recipe/Parts/Instructions";
-import Ingredients from "@/components/Recipe/Parts/Ingredients";
-import Assets from "@/components/Recipe/Parts/Assets.vue";
-import Notes from "@/components/Recipe/Parts/Notes.vue";
-import SettingsMenu from "@/components/Recipe/Parts/Helpers/SettingsMenu.vue";
-import Rating from "@/components/Recipe/Parts/Rating";
-const UPLOAD_EVENT = "upload";
-export default {
-  components: {
-    BulkAdd,
-    ExtrasEditor,
-    CategoryTagSelector,
-    Nutrition,
-    ImageUploadBtn,
-    Instructions,
-    Ingredients,
-    Assets,
-    Notes,
-    SettingsMenu,
-    Rating,
-  },
-  mixins: [validators],
-  props: {
-    value: Object,
-  },
-  data() {
-    return {
-      fileObject: null,
-    };
-  },
-  methods: {
-    uploadImage(fileObject) {
-      this.$emit(UPLOAD_EVENT, fileObject);
-    },
-    appendSteps(steps) {
-      this.value.recipeInstructions.push(
-        ...steps.map(x => ({
-          title: "",
-          text: x,
-        }))
-      );
-    },
-    addStep() {
-      this.value.recipeInstructions.push({ title: "", text: "" });
-    },
-    saveExtras(extras) {
-      this.value.extras = extras;
-    },
-    validateRecipe() {
-      return this.$refs.form.validate();
-    },
-  },
-};
-</script>
-
-<style>
-.disabled-card {
-  opacity: 0.5;
-}
-.my-divider {
-  margin: 0 -1px;
-}
-</style>
diff --git a/frontend.old/component-stagin/Page/Recipe/RecipeViewer.vue b/frontend.old/component-stagin/Page/Recipe/RecipeViewer.vue
deleted file mode 100644
index c06b9a0cca14..000000000000
--- a/frontend.old/component-stagin/Page/Recipe/RecipeViewer.vue
+++ /dev/null
@@ -1,142 +0,0 @@
-<template>
-  <div>
-    <v-card-title class="headline">
-      {{ recipe.name }}
-    </v-card-title>
-    <v-card-text>
-      <VueMarkdown :source="recipe.description"> </VueMarkdown>
-      <v-row dense disabled>
-        <v-col>
-          <v-btn
-            v-if="recipe.recipeYield"
-            dense
-            small
-            :hover="false"
-            type="label"
-            :ripple="false"
-            elevation="0"
-            color="secondary darken-1"
-            class="rounded-sm static"
-          >
-            {{ recipe.recipeYield }}
-          </v-btn>
-        </v-col>
-        <Rating :key="recipe.slug" :value="recipe.rating" :name="recipe.name" :slug="recipe.slug" />
-      </v-row>
-      <v-row>
-        <v-col cols="12" sm="12" md="4" lg="4">
-          <Ingredients :value="recipe.recipeIngredient" :edit="false" />
-          <div v-if="medium">
-            <v-card v-if="recipe.recipeCategory.length > 0" class="mt-2">
-              <v-card-title class="py-2">
-                {{ $t("recipe.categories") }}
-              </v-card-title>
-              <v-divider class="mx-2"></v-divider>
-              <v-card-text>
-                <RecipeChips :items="recipe.recipeCategory" />
-              </v-card-text>
-            </v-card>
-            <v-card v-if="recipe.tags.length > 0" class="mt-2">
-              <v-card-title class="py-2">
-                {{ $t("tag.tags") }}
-              </v-card-title>
-              <v-divider class="mx-2"></v-divider>
-              <v-card-text>
-                <RecipeChips :items="recipe.tags" :is-category="false" />
-              </v-card-text>
-            </v-card>
-
-            <Nutrition v-if="recipe.settings.showNutrition" :value="recipe.nutrition" :edit="false" />
-            <Assets v-if="recipe.settings.showAssets" :value="recipe.assets" :edit="false" :slug="recipe.slug" />
-          </div>
-        </v-col>
-        <v-divider v-if="medium" class="my-divider" :vertical="true"></v-divider>
-
-        <v-col cols="12" sm="12" md="8" lg="8">
-          <Instructions :value="recipe.recipeInstructions" :edit="false" />
-          <Notes :value="recipe.notes" :edit="false" />
-        </v-col>
-      </v-row>
-      <div v-if="!medium">
-        <RecipeChips :title="$t('recipe.categories')" :items="recipe.recipeCategory" />
-        <RecipeChips :title="$t('tag.tags')" :items="recipe.tags" />
-        <Nutrition v-if="recipe.settings.showNutrition" :value="recipe.nutrition" :edit="false" />
-        <Assets v-if="recipe.settings.showAssets" :value="recipe.assets" :edit="false" :slug="recipe.slug" />
-      </div>
-      <v-row class="mt-2 mb-1">
-        <v-col></v-col>
-        <v-btn
-          v-if="recipe.orgURL"
-          dense
-          small
-          :hover="false"
-          type="label"
-          :ripple="false"
-          elevation="0"
-          :href="recipe.orgURL"
-          color="secondary darken-1"
-          target="_blank"
-          class="rounded-sm mr-4"
-        >
-          {{ $t("recipe.original-url") }}
-        </v-btn>
-      </v-row>
-    </v-card-text>
-  </div>
-</template>
-
-<script>
-import Nutrition from "@/components/Recipe/Parts/Nutrition";
-import VueMarkdown from "@adapttive/vue-markdown";
-import { utils } from "@/utils";
-import Rating from "@/components/Recipe/Parts/Rating";
-import Notes from "@/components/Recipe/Parts/Notes";
-import Ingredients from "@/components/Recipe/Parts/Ingredients";
-import Instructions from "@/components/Recipe/Parts/Instructions.vue";
-import Assets from "../../../../frontend.old/src/components/Recipe/Parts/Assets.vue";
-import RecipeChips from "./RecipeChips";
-
-
-export default {
-  components: {
-    VueMarkdown,
-    RecipeChips,
-    Notes,
-    Ingredients,
-    Nutrition,
-    Instructions,
-    Assets,
-    Rating,
-  },
-  props: {
-    recipe: {
-      type: Object,
-      required: true,
-    },
-  },
-  data() {
-    return {
-      disabledSteps: [],
-    };
-  },
-  computed: {
-    medium() {
-      return this.$vuetify.breakpoint.mdAndUp;
-    },
-  },
-  methods: {
-    generateKey(item, index) {
-      return utils.generateUniqueKey(item, index);
-    },
-  },
-};
-</script>
-
-<style>
-.static {
-  pointer-events: none;
-}
-.my-divider {
-  margin: 0 -1px;
-}
-</style>
diff --git a/frontend.old/frontend.Dockerfile b/frontend.old/frontend.Dockerfile
deleted file mode 100644
index 2cdab5876dc9..000000000000
--- a/frontend.old/frontend.Dockerfile
+++ /dev/null
@@ -1,22 +0,0 @@
-FROM node:lts-alpine
-
-# # install simple http server for serving static content
-# RUN npm install -g http-server
-
-# make the 'app' folder the current working directory
-WORKDIR /app
-
-# copy both 'package.json' and 'package-lock.json' (if available)
-COPY package*.json ./
-
-# install project dependencies
-RUN npm install
-
-# copy project files and folders to the current working directory (i.e. 'app' folder)
-# COPY . .
-
-# build app for production with minification
-# RUN npm run build
-
-EXPOSE 8080
-CMD [ "npm", "run", "serve" ]
\ No newline at end of file
diff --git a/frontend.old/jsconfig.json b/frontend.old/jsconfig.json
deleted file mode 100644
index 0486e3bb36a6..000000000000
--- a/frontend.old/jsconfig.json
+++ /dev/null
@@ -1,9 +0,0 @@
-{
-  "compilerOptions": {
-    "baseUrl": ".",
-    "paths": {
-      "@/*": ["./src/*"]
-    }
-  },
-  "exclude": ["node_modules", "dist"]
-}
diff --git a/frontend.old/package.json b/frontend.old/package.json
deleted file mode 100644
index 1384c5140725..000000000000
--- a/frontend.old/package.json
+++ /dev/null
@@ -1,75 +0,0 @@
-{
-  "name": "frontend",
-  "version": "0.1.0",
-  "private": true,
-  "scripts": {
-    "serve": "vue-cli-service serve",
-    "build": "vue-cli-service build",
-    "lint": "vue-cli-service lint",
-    "i18n:report": "vue-cli-service i18n:report --src './src/**/*.?(js|vue)' --locales './src/locales/**/*.json'"
-  },
-  "dependencies": {
-    "@adapttive/vue-markdown": "^4.0.1",
-    "axios": "^0.21.1",
-    "core-js": "^3.14.0",
-    "fuse.js": "^6.4.6",
-    "register-service-worker": "^1.7.1",
-    "v-jsoneditor": "^1.4.4",
-    "vue": "^2.6.14",
-    "vue-i18n": "^8.24.1",
-    "vue-router": "^3.5.1",
-    "vuedraggable": "^2.24.3",
-    "vuetify": "^2.5.3",
-    "vuex": "^3.6.2",
-    "vuex-persistedstate": "^4.0.0-beta.3"
-  },
-  "devDependencies": {
-    "@intlify/vue-i18n-loader": "^1.1.0",
-    "@mdi/font": "^5.9.55",
-    "@mdi/js": "^5.9.55",
-    "@vue/cli-plugin-babel": "^4.5.13",
-    "@vue/cli-plugin-eslint": "^4.5.13",
-    "@vue/cli-plugin-pwa": "~4.5.0",
-    "@vue/cli-service": "^4.5.13",
-    "@vue/preload-webpack-plugin": "^2.0.0",
-    "babel-eslint": "^10.1.0",
-    "eslint": "^6.7.2",
-    "eslint-plugin-vue": "^6.2.2",
-    "html-webpack-plugin": "^5.3.1",
-    "preload-webpack-plugin": "^2.3.0",
-    "sass": "^1.34.1",
-    "sass-loader": "^8.0.2",
-    "typeface-roboto": "^1.1.13",
-    "vue-cli-plugin-i18n": "~1.0.1",
-    "vue-cli-plugin-vuetify": "^2.4.1",
-    "vue-cli-plugin-webpack-bundle-analyzer": "^4.0.0",
-    "vue-template-compiler": "^2.6.14",
-    "vuetify-loader": "^1.7.2"
-  },
-  "eslintConfig": {
-    "root": true,
-    "env": {
-      "node": true
-    },
-    "extends": [
-      "plugin:vue/essential",
-      "eslint:recommended"
-    ],
-    "parserOptions": {
-      "parser": "babel-eslint"
-    },
-    "rules": {}
-  },
-  "prettier": {
-    "trailingComma": "es5",
-    "tabWidth": 2,
-    "semi": true,
-    "singleQuote": false,
-    "printWidth": 120
-  },
-  "browserslist": [
-    "> 1%",
-    "last 2 versions",
-    "not dead"
-  ]
-}
\ No newline at end of file
diff --git a/frontend.old/public/img/icons/android-chrome-192x192.png b/frontend.old/public/img/icons/android-chrome-192x192.png
deleted file mode 100644
index 0569b776e427..000000000000
Binary files a/frontend.old/public/img/icons/android-chrome-192x192.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/android-chrome-maskable-192x192.png b/frontend.old/public/img/icons/android-chrome-maskable-192x192.png
deleted file mode 100644
index 0569b776e427..000000000000
Binary files a/frontend.old/public/img/icons/android-chrome-maskable-192x192.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/android-chrome-maskable-512x512.png b/frontend.old/public/img/icons/android-chrome-maskable-512x512.png
deleted file mode 100644
index cb0380533224..000000000000
Binary files a/frontend.old/public/img/icons/android-chrome-maskable-512x512.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon-120x120.png b/frontend.old/public/img/icons/apple-touch-icon-120x120.png
deleted file mode 100644
index 0bb475552c3c..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon-120x120.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon-152x152.png b/frontend.old/public/img/icons/apple-touch-icon-152x152.png
deleted file mode 100644
index 53d2b9201a40..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon-152x152.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon-180x180.png b/frontend.old/public/img/icons/apple-touch-icon-180x180.png
deleted file mode 100644
index 12ee3c053603..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon-180x180.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon-60x60.png b/frontend.old/public/img/icons/apple-touch-icon-60x60.png
deleted file mode 100644
index 772375179bb6..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon-60x60.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon-76x76.png b/frontend.old/public/img/icons/apple-touch-icon-76x76.png
deleted file mode 100644
index 919cbdeb6985..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon-76x76.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/apple-touch-icon.png b/frontend.old/public/img/icons/apple-touch-icon.png
deleted file mode 100644
index 12ee3c053603..000000000000
Binary files a/frontend.old/public/img/icons/apple-touch-icon.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/favicon-16x16.png b/frontend.old/public/img/icons/favicon-16x16.png
deleted file mode 100644
index 05e2e7625d46..000000000000
Binary files a/frontend.old/public/img/icons/favicon-16x16.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/favicon-32x32.png b/frontend.old/public/img/icons/favicon-32x32.png
deleted file mode 100644
index 9263cc67c9c4..000000000000
Binary files a/frontend.old/public/img/icons/favicon-32x32.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/msapplication-icon-144x144.png b/frontend.old/public/img/icons/msapplication-icon-144x144.png
deleted file mode 100644
index c4a5fcb71b59..000000000000
Binary files a/frontend.old/public/img/icons/msapplication-icon-144x144.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/mstile-150x150.png b/frontend.old/public/img/icons/mstile-150x150.png
deleted file mode 100644
index c6dfc5414f9b..000000000000
Binary files a/frontend.old/public/img/icons/mstile-150x150.png and /dev/null differ
diff --git a/frontend.old/public/img/icons/safari-pinned-tab.svg b/frontend.old/public/img/icons/safari-pinned-tab.svg
deleted file mode 100644
index 802178d07502..000000000000
--- a/frontend.old/public/img/icons/safari-pinned-tab.svg
+++ /dev/null
@@ -1,3 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="256" height="256" viewBox="0 0 256 256" version="1.1">
-	<path d="M 162.083 54.642 C 148.745 68.272, 137.170 80.703, 136.362 82.266 C 133.689 87.435, 133.522 94.130, 135.929 99.573 C 137.122 102.269, 139.070 105.510, 140.258 106.775 L 142.418 109.074 90.974 160.526 L 39.529 211.979 46.999 219.499 L 54.470 227.020 91.235 190.265 L 128 153.510 164.765 190.265 L 201.530 227.020 209 219.500 L 216.470 211.980 179.725 175.225 L 142.980 138.470 150.320 131.178 C 156.858 124.685, 157.808 124.063, 159.001 125.501 C 162.066 129.195, 168.873 132.163, 174.392 132.213 C 183.508 132.295, 186.374 130.174, 212.477 104.038 L 236.454 80.030 231.501 75.001 L 226.548 69.973 209.288 87.212 L 192.027 104.452 187 99.500 L 181.973 94.548 199.212 77.288 L 216.452 60.027 211.500 55 L 206.548 49.973 189.288 67.212 L 172.027 84.452 167 79.500 L 161.973 74.548 179.225 57.275 L 196.477 40.001 191.406 34.930 L 186.335 29.859 162.083 54.642 M 38.429 41.250 C 31.557 49.376, 28.011 62.815, 29.835 73.824 C 31.955 86.615, 34.508 90.093, 61.720 117.253 L 86.520 142.005 101.501 126.999 L 116.482 111.993 79.496 74.996 C 59.154 54.648, 42.210 38, 41.844 38 C 41.478 38, 39.941 39.462, 38.429 41.250" stroke="none" fill="black" fill-rule="evenodd"/>
-</svg>
\ No newline at end of file
diff --git a/frontend.old/public/index.html b/frontend.old/public/index.html
deleted file mode 100644
index fa926f2b96ea..000000000000
--- a/frontend.old/public/index.html
+++ /dev/null
@@ -1,22 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-
-<head>
-  <meta charset="utf-8">
-  <meta http-equiv="X-UA-Compatible" content="IE=edge">
-  <meta name="viewport" content="width=device-width,initial-scale=1.0">
-  <meta name="description" content="Mealie is a self hosted recipe manager and meal planner.">
-  <link rel="icon" href="<%= BASE_URL %>favicon.ico">
-  <title> Mealie </title>
-</head>
-
-<body>
-  <noscript>
-    <strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
-        Please enable it to continue.</strong>
-  </noscript>
-  <div id="app"></div>
-  <!-- built files will be auto injected -->
-</body>
-
-</html>
\ No newline at end of file
diff --git a/frontend.old/src/App.vue b/frontend.old/src/App.vue
deleted file mode 100644
index 63d1c45e1549..000000000000
--- a/frontend.old/src/App.vue
+++ /dev/null
@@ -1,138 +0,0 @@
-<template>
-  <v-app>
-    <!-- Dummpy Comment -->
-    <TheAppBar />
-    <v-main>
-      <v-banner v-if="demo" sticky>
-        <div class="text-center">
-          <b> This is a Demo of the v0.5.0 (BETA) </b> | Username: changeme@email.com | Password: demo
-        </div>
-      </v-banner>
-      <GlobalSnackbar />
-      <v-snackbar v-model="snackWithButtons" bottom left timeout="-1">
-        {{ snackWithBtnText }}
-        <template v-slot:action="{ attrs }">
-          <v-btn text color="primary" v-bind="attrs" @click.stop="refreshApp">
-            {{ snackBtnText }}
-          </v-btn>
-          <v-btn icon class="ml-4" @click="snackWithButtons = false">
-            <v-icon>{{ $globals.icons.close }}</v-icon>
-          </v-btn>
-        </template>
-      </v-snackbar>
-      <router-view></router-view>
-    </v-main>
-  </v-app>
-</template>
-
-<script>
-import TheAppBar from "@/components/UI/TheAppBar";
-import GlobalSnackbar from "@/components/UI/GlobalSnackbar";
-import Vuetify from "./plugins/vuetify";
-import { user } from "@/mixins/user";
-
-export default {
-  name: "App",
-
-  components: {
-    TheAppBar,
-    GlobalSnackbar,
-  },
-
-  mixins: [user],
-
-  computed: {
-    demo() {
-      const appInfo = this.$store.getters.getAppInfo;
-      return appInfo.demoStatus;
-    },
-  },
-
-  async created() {
-    // Initial API Requests
-    this.$store.dispatch("initTheme");
-    this.$store.dispatch("refreshToken");
-    this.$store.dispatch("requestUserData");
-    this.$store.dispatch("requestCurrentGroup");
-    this.$store.dispatch("requestTags");
-    this.$store.dispatch("requestAppInfo");
-    this.$store.dispatch("requestSiteSettings");
-
-    // Listen for swUpdated event and display refresh snackbar as required.
-    document.addEventListener("swUpdated", this.showRefreshUI, { once: true });
-    // Refresh all open app tabs when a new service worker is installed.
-    if (navigator.serviceWorker) {
-      navigator.serviceWorker.addEventListener("controllerchange", () => {
-        if (this.refreshing) return;
-        this.refreshing = true;
-        window.location.reload();
-      });
-    }
-  },
-
-  mounted() {
-    this.darkModeSystemCheck();
-    this.darkModeAddEventListener();
-  },
-
-  data() {
-    return {
-      refreshing: false,
-      registration: null,
-      snackBtnText: "",
-      snackWithBtnText: "",
-      snackWithButtons: false,
-    };
-  },
-
-  methods: {
-    // For Later!
-
-    /**
-     * Checks if 'system' is set for dark mode and then sets the corrisponding value for vuetify
-     */
-    darkModeSystemCheck() {
-      if (this.$store.getters.getDarkMode === "system")
-        Vuetify.framework.theme.dark = window.matchMedia("(prefers-color-scheme: dark)").matches;
-    },
-    /**
-     * This will monitor the OS level darkmode and call to update dark mode.
-     */
-    darkModeAddEventListener() {
-      const darkMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-      darkMediaQuery.addEventListener("change", () => {
-        this.darkModeSystemCheck();
-      });
-    },
-
-    showRefreshUI(e) {
-      // Display a snackbar inviting the user to refresh/reload the app due
-      // to an app update being available.
-      // The new service worker is installed, but not yet active.
-      // Store the ServiceWorkerRegistration instance for later use.
-      this.registration = e.detail;
-      this.snackBtnText = this.$t("events.refresh");
-      this.snackWithBtnText = this.$t("events.new-version");
-      this.snackWithButtons = true;
-    },
-    refreshApp() {
-      this.snackWithButtons = false;
-      // Protect against missing registration.waiting.
-      if (!this.registration || !this.registration.waiting) {
-        return;
-      }
-      this.registration.waiting.postMessage("skipWaiting");
-    },
-  },
-};
-</script>
-
-<style>
-.top-dialog {
-  align-self: flex-start;
-}
-:root {
-  scrollbar-color: transparent transparent;
-}
-</style>
-
diff --git a/frontend.old/src/api/about.js b/frontend.old/src/api/about.js
deleted file mode 100644
index 92434fad1311..000000000000
--- a/frontend.old/src/api/about.js
+++ /dev/null
@@ -1,80 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const aboutAPI = {
-  async getEvents() {
-    const resposne = await apiReq.get(API_ROUTES.aboutEvents);
-    return resposne.data;
-  },
-  async deleteEvent(id) {
-    const resposne = await apiReq.delete(API_ROUTES.aboutEventsId(id));
-    return resposne.data;
-  },
-  async deleteAllEvents() {
-    const resposne = await apiReq.delete(API_ROUTES.aboutEvents);
-    return resposne.data;
-  },
-
-  async allEventNotifications() {
-    const response = await apiReq.get(API_ROUTES.aboutEventsNotifications);
-    return response.data;
-  },
-
-  async createNotification(data) {
-    const response = await apiReq.post(API_ROUTES.aboutEventsNotifications, data);
-    return response.data;
-  },
-
-  async deleteNotification(id) {
-    const response = await apiReq.delete(API_ROUTES.aboutEventsNotificationsId(id));
-    return response.data;
-  },
-  async testNotificationByID(id) {
-    const response = await apiReq.post(
-      API_ROUTES.aboutEventsNotificationsTest,
-      { id: id },
-      () => i18n.t("events.something-went-wrong"),
-      () => i18n.t("events.test-message-sent")
-    );
-    return response.data;
-  },
-  async testNotificationByURL(url) {
-    const response = await apiReq.post(
-      API_ROUTES.aboutEventsNotificationsTest,
-      { test_url: url },
-      () => i18n.t("events.something-went-wrong"),
-      () => i18n.t("events.test-message-sent")
-    );
-    return response.data;
-  },
-  //   async getAppInfo() {
-  //     const response = await apiReq.get(aboutURLs.version);
-  //     return response.data;
-  //   },
-
-  //   async getDebugInfo() {
-  //     const response = await apiReq.get(aboutURLs.debug);
-  //     return response.data;
-  //   },
-
-  //   async getLogText(num) {
-  //     const response = await apiReq.get(aboutURLs.log(num));
-  //     return response.data;
-  //   },
-
-  //   async getLastJson() {
-  //     const response = await apiReq.get(aboutURLs.lastRecipe);
-  //     return response.data;
-  //   },
-
-  //   async getIsDemo() {
-  //     const response = await apiReq.get(aboutURLs.demo);
-  //     return response.data;
-  //   },
-
-  //   async getStatistics() {
-  //     const response = await apiReq.get(aboutURLs.statistics);
-  //     return response.data;
-  //   },
-};
diff --git a/frontend.old/src/api/api-utils.js b/frontend.old/src/api/api-utils.js
deleted file mode 100644
index 2a9b0acb4a85..000000000000
--- a/frontend.old/src/api/api-utils.js
+++ /dev/null
@@ -1,121 +0,0 @@
-import { prefix } from "./apiRoutes";
-import axios from "axios";
-import { store } from "../store";
-import { utils } from "@/utils";
-
-axios.defaults.headers.common["Authorization"] = `Bearer ${store.getters.getToken}`;
-
-function handleError(error, getText) {
-  if (getText) {
-    utils.notify.error(getText(error.response));
-  }
-  return false;
-}
-function handleResponse(response, getText) {
-  if (response && getText) {
-    const successText = getText(response);
-    utils.notify.success(successText);
-  }
-  return response;
-}
-
-function defaultErrorText(response) {
-  return response.statusText;
-}
-
-function defaultSuccessText(response) {
-  return response.statusText;
-}
-
-const requests = {
-  /**
-   *
-   * @param {*} funcCall Callable Axios Function
-   * @param {*} url Destination url
-   * @param {*} data Request Data
-   * @param {*} getErrorText Error Text Function
-   * @param {*} getSuccessText Success Text Function
-   * @returns Object response
-   */
-  unsafe: async function(funcCall, url, data, getErrorText = defaultErrorText, getSuccessText) {
-    const response = await funcCall(url, data).catch(function(error) {
-      handleError(error, getErrorText);
-    });
-    return handleResponse(response, getSuccessText);
-  },
-  /**
-   *
-   * @param {*} funcCall Callable Axios Function
-   * @param {*} url Destination url
-   * @param {*} data Request Data
-   * @param {*} getErrorText Error Text Function
-   * @param {*} getSuccessText Success Text Function
-   * @returns Array [response, error]
-   */
-  safe: async function(funcCall, url, data, getErrorText = defaultErrorText, getSuccessText) {
-    const response = await funcCall(url, data).catch(function(error) {
-      handleError(error, getErrorText);
-      return [null, error];
-    });
-    return [handleResponse(response, getSuccessText), null];
-  },
-};
-
-const apiReq = {
-  get: async function(url, getErrorText = defaultErrorText) {
-    return axios.get(url).catch(function(error) {
-      handleError(error, getErrorText);
-    });
-  },
-
-  getSafe: async function(url) {
-    let error = null;
-    const response = await axios.get(url).catch(e => {
-      error = e;
-    });
-    return [response, error];
-  },
-
-  post: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.unsafe(axios.post, url, data, getErrorText, getSuccessText);
-  },
-
-  postSafe: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.safe(axios.post, url, data, getErrorText, getSuccessText);
-  },
-
-  put: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.unsafe(axios.put, url, data, getErrorText, getSuccessText);
-  },
-
-  putSafe: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.safe(axios.put, url, data, getErrorText, getSuccessText);
-  },
-
-  patch: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.unsafe(axios.patch, url, data, getErrorText, getSuccessText);
-  },
-
-  patchSafe: async function(url, data, getErrorText = defaultErrorText, getSuccessText) {
-    return await requests.safe(axios.patch, url, data, getErrorText, getSuccessText);
-  },
-
-  delete: async function(url, data, getErrorText = defaultErrorText, getSuccessText = defaultSuccessText) {
-    return await requests.unsafe(axios.delete, url, data, getErrorText, getSuccessText);
-  },
-
-  deleteSafe: async function(url, data, getErrorText = defaultErrorText, getSuccessText = defaultSuccessText) {
-    return await requests.unsafe(axios.delete, url, data, getErrorText, getSuccessText);
-  },
-
-  download: async function(url) {
-    const response = await this.get(url);
-    const token = response.data.fileToken;
-
-    const tokenURL = prefix + "/utils/download?token=" + token;
-    window.open(tokenURL, "_blank");
-    return response.data;
-  },
-};
-
-export { apiReq };
diff --git a/frontend.old/src/api/apiRoutes.js b/frontend.old/src/api/apiRoutes.js
deleted file mode 100644
index 5d726267743f..000000000000
--- a/frontend.old/src/api/apiRoutes.js
+++ /dev/null
@@ -1,90 +0,0 @@
-// This Content is Auto Generated
-export const prefix = "/api";
-export const API_ROUTES = {
-  aboutEvents: `${prefix}/about/events`,
-  aboutEventsNotifications: `${prefix}/about/events/notifications`,
-  aboutEventsNotificationsTest: `${prefix}/about/events/notifications/test`,
-  aboutRecipesDefaults: `${prefix}/about/recipes/defaults`,
-  authRefresh: `${prefix}/auth/refresh`,
-  authToken: `${prefix}/auth/token`,
-  authTokenLong: `${prefix}/auth/token/long`,
-  backupsAvailable: `${prefix}/backups/available`,
-  backupsExportDatabase: `${prefix}/backups/export/database`,
-  backupsUpload: `${prefix}/backups/upload`,
-  categories: `${prefix}/categories`,
-  categoriesEmpty: `${prefix}/categories/empty`,
-  debug: `${prefix}/debug`,
-  debugLastRecipeJson: `${prefix}/debug/last-recipe-json`,
-  debugLog: `${prefix}/debug/log`,
-  debugStatistics: `${prefix}/debug/statistics`,
-  debugVersion: `${prefix}/debug/version`,
-  groups: `${prefix}/groups`,
-  groupsSelf: `${prefix}/groups/self`,
-  mealPlansAll: `${prefix}/meal-plans/all`,
-  mealPlansCreate: `${prefix}/meal-plans/create`,
-  mealPlansThisWeek: `${prefix}/meal-plans/this-week`,
-  mealPlansToday: `${prefix}/meal-plans/today`,
-  mealPlansTodayImage: `${prefix}/meal-plans/today/image`,
-  migrations: `${prefix}/migrations`,
-  recipesCategory: `${prefix}/recipes/category`,
-  recipesCreate: `${prefix}/recipes/create`,
-  recipesCreateFromZip: `${prefix}/recipes/create-from-zip`,
-  recipesCreateUrl: `${prefix}/recipes/create-url`,
-  recipesSummary: `${prefix}/recipes/summary`,
-  recipesSummaryUncategorized: `${prefix}/recipes/summary/uncategorized`,
-  recipesSummaryUntagged: `${prefix}/recipes/summary/untagged`,
-  recipesTag: `${prefix}/recipes/tag`,
-  recipesTestScrapeUrl: `${prefix}/recipes/test-scrape-url`,
-  shoppingLists: `${prefix}/shopping-lists`,
-  siteSettings: `${prefix}/site-settings`,
-  siteSettingsCustomPages: `${prefix}/site-settings/custom-pages`,
-  siteSettingsWebhooksTest: `${prefix}/site-settings/webhooks/test`,
-  tags: `${prefix}/tags`,
-  tagsEmpty: `${prefix}/tags/empty`,
-  themes: `${prefix}/themes`,
-  themesCreate: `${prefix}/themes/create`,
-  users: `${prefix}/users`,
-  usersApiTokens: `${prefix}/users/api-tokens`,
-  usersSelf: `${prefix}/users/self`,
-  usersSignUps: `${prefix}/users/sign-ups`,
-  utilsDownload: `${prefix}/utils/download`,
-
-  aboutEventsId: id => `${prefix}/about/events/${id}`,
-  aboutEventsNotificationsId: id => `${prefix}/about/events/notifications/${id}`,
-  backupsFileNameDelete: file_name => `${prefix}/backups/${file_name}/delete`,
-  backupsFileNameDownload: file_name => `${prefix}/backups/${file_name}/download`,
-  backupsFileNameImport: file_name => `${prefix}/backups/${file_name}/import`,
-  categoriesCategory: category => `${prefix}/categories/${category}`,
-  debugLogNum: num => `${prefix}/debug/log/${num}`,
-  groupsId: id => `${prefix}/groups/${id}`,
-  mealPlansId: id => `${prefix}/meal-plans/${id}`,
-  mealPlansIdShoppingList: id => `${prefix}/meal-plans/${id}/shopping-list`,
-  mealPlansPlanId: plan_id => `${prefix}/meal-plans/${plan_id}`,
-  mediaRecipesRecipeSlugAssetsFileName: (recipe_slug, file_name) =>
-    `${prefix}/media/recipes/${recipe_slug}/assets/${file_name}`,
-  mediaRecipesRecipeSlugImagesFileName: (recipe_slug, file_name) =>
-    `${prefix}/media/recipes/${recipe_slug}/images/${file_name}`,
-  migrationsImportTypeFileNameDelete: (import_type, file_name) =>
-    `${prefix}/migrations/${import_type}/${file_name}/delete`,
-  migrationsImportTypeFileNameImport: (import_type, file_name) =>
-    `${prefix}/migrations/${import_type}/${file_name}/import`,
-  migrationsImportTypeUpload: import_type => `${prefix}/migrations/${import_type}/upload`,
-  recipesRecipeSlug: recipe_slug => `${prefix}/recipes/${recipe_slug}`,
-  recipesRecipeSlugAssets: recipe_slug => `${prefix}/recipes/${recipe_slug}/assets`,
-  recipesRecipeSlugImage: recipe_slug => `${prefix}/recipes/${recipe_slug}/image`,
-  recipesRecipeSlugZip: recipe_slug => `${prefix}/recipes/${recipe_slug}/zip`,
-  recipesSlugComments: slug => `${prefix}/recipes/${slug}/comments`,
-  recipesSlugCommentsId: (slug, id) => `${prefix}/recipes/${slug}/comments/${id}`,
-  shoppingListsId: id => `${prefix}/shopping-lists/${id}`,
-  siteSettingsCustomPagesId: id => `${prefix}/site-settings/custom-pages/${id}`,
-  tagsTag: tag => `${prefix}/tags/${tag}`,
-  themesId: id => `${prefix}/themes/${id}`,
-  usersApiTokensTokenId: token_id => `${prefix}/users/api-tokens/${token_id}`,
-  usersId: id => `${prefix}/users/${id}`,
-  usersIdFavorites: id => `${prefix}/users/${id}/favorites`,
-  usersIdFavoritesSlug: (id, slug) => `${prefix}/users/${id}/favorites/${slug}`,
-  usersIdImage: id => `${prefix}/users/${id}/image`,
-  usersIdPassword: id => `${prefix}/users/${id}/password`,
-  usersIdResetPassword: id => `${prefix}/users/${id}/reset-password`,
-  usersSignUpsToken: token => `${prefix}/users/sign-ups/${token}`,
-};
diff --git a/frontend.old/src/api/backup.js b/frontend.old/src/api/backup.js
deleted file mode 100644
index 31c354c07e9d..000000000000
--- a/frontend.old/src/api/backup.js
+++ /dev/null
@@ -1,62 +0,0 @@
-import { apiReq } from "./api-utils";
-import { store } from "@/store";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const backupAPI = {
-  /**
-   * Request all backups available on the server
-   * @returns {Array} List of Available Backups
-   */
-  async requestAvailable() {
-    let response = await apiReq.get(API_ROUTES.backupsAvailable);
-    return response.data;
-  },
-  /**
-   * Calls for importing a file on the server
-   * @param {string} fileName
-   * @param {object} data
-   * @returns A report containing status of imported items
-   */
-  async import(fileName, data) {
-    let response = await apiReq.post(API_ROUTES.backupsFileNameImport(fileName), data);
-    store.dispatch("requestRecentRecipes");
-    return response;
-  },
-  /**
-   * Removes a file from the server
-   * @param {string} fileName
-   */
-  async delete(fileName) {
-    return apiReq.delete(
-      API_ROUTES.backupsFileNameDelete(fileName),
-      null,
-      () => i18n.t("settings.backup.unable-to-delete-backup"),
-      () => i18n.t("settings.backup.backup-deleted")
-    );
-  },
-  /**
-   * Creates a backup on the serve given a set of options
-   * @param {object} data
-   * @returns
-   */
-  async create(options) {
-    return apiReq.post(
-      API_ROUTES.backupsExportDatabase,
-      options,
-      () => i18n.t("settings.backup.error-creating-backup-see-log-file"),
-      response => {
-        return i18n.t("settings.backup.backup-created-at-response-export_path", { path: response.data.export_path });
-      }
-    );
-  },
-  /**
-   * Downloads a file from the server. I don't actually think this is used?
-   * @param {string} fileName
-   * @returns Download URL
-   */
-  async download(fileName) {
-    const url = API_ROUTES.backupsFileNameDownload(fileName);
-    apiReq.download(url);
-  },
-};
diff --git a/frontend.old/src/api/category.js b/frontend.old/src/api/category.js
deleted file mode 100644
index d06d4b5b3932..000000000000
--- a/frontend.old/src/api/category.js
+++ /dev/null
@@ -1,111 +0,0 @@
-import { apiReq } from "./api-utils";
-import { store } from "@/store";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const categoryAPI = {
-  async getAll() {
-    let response = await apiReq.get(API_ROUTES.categories);
-    return response.data;
-  },
-  async getEmpty() {
-    let response = await apiReq.get(API_ROUTES.categoriesEmpty);
-    return response.data;
-  },
-  async create(name) {
-    const response = await apiReq.post(
-      API_ROUTES.categories,
-      { name: name },
-      () => i18n.t("category.category-creation-failed"),
-      () => i18n.t("category.category-created")
-    );
-    if (response) {
-      store.dispatch("requestCategories");
-      return response.data;
-    }
-  },
-  async getRecipesInCategory(category) {
-    let response = await apiReq.get(API_ROUTES.categoriesCategory(category));
-    return response.data;
-  },
-  async update(name, newName, overrideRequest = false) {
-    const response = await apiReq.put(
-      API_ROUTES.categoriesCategory(name),
-      { name: newName },
-      () => i18n.t("category.category-update-failed"),
-      () => i18n.t("category.category-updated")
-    );
-    if (response && !overrideRequest) {
-      store.dispatch("requestCategories");
-      return response.data;
-    }
-  },
-  async delete(category, overrideRequest = false) {
-    const response = await apiReq.delete(
-      API_ROUTES.categoriesCategory(category),
-      null,
-      () => i18n.t("category.category-deletion-failed"),
-      () => i18n.t("category.category-deleted")
-    );
-    if (response && !overrideRequest) {
-      store.dispatch("requestCategories");
-    }
-    return response;
-  },
-};
-
-export const tagAPI = {
-  async getAll() {
-    let response = await apiReq.get(API_ROUTES.tags);
-    return response.data;
-  },
-  async getEmpty() {
-    let response = await apiReq.get(API_ROUTES.tagsEmpty);
-    return response.data;
-  },
-  async create(name) {
-    const response = await apiReq.post(
-      API_ROUTES.tags,
-      { name: name },
-      () => i18n.t("tag.tag-creation-failed"),
-      () => i18n.t("tag.tag-created")
-    );
-    if (response) {
-      store.dispatch("requestTags");
-      return response.data;
-    }
-  },
-  async getRecipesInTag(tag) {
-    let response = await apiReq.get(API_ROUTES.tagsTag(tag));
-    return response.data;
-  },
-  async update(name, newName, overrideRequest = false) {
-    const response = await apiReq.put(
-      API_ROUTES.tagsTag(name),
-      { name: newName },
-      () => i18n.t("tag.tag-update-failed"),
-      () => i18n.t("tag.tag-updated")
-    );
-
-    if (response) {
-      if (!overrideRequest) {
-        store.dispatch("requestTags");
-      }
-      return response.data;
-    }
-  },
-  async delete(tag, overrideRequest = false) {
-    const response = await apiReq.delete(
-      API_ROUTES.tagsTag(tag),
-      null,
-      () => i18n.t("tag.tag-deletion-failed"),
-      () => i18n.t("tag.tag-deleted")
-    );
-    if (response) {
-      if (!overrideRequest) {
-        store.dispatch("requestTags");
-      }
-      return response.data;
-    }
-  },
-};
diff --git a/frontend.old/src/api/groups.js b/frontend.old/src/api/groups.js
deleted file mode 100644
index 62ad406b3b43..000000000000
--- a/frontend.old/src/api/groups.js
+++ /dev/null
@@ -1,53 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-function deleteErrorText(response) {
-  switch (response.data.detail) {
-    case "GROUP_WITH_USERS":
-      return i18n.t("group.cannot-delete-group-with-users");
-
-    case "GROUP_NOT_FOUND":
-      return i18n.t("group.group-not-found");
-
-    case "DEFAULT_GROUP":
-      return i18n.t("group.cannot-delete-default-group");
-
-    default:
-      return i18n.t("group.group-deletion-failed");
-  }
-}
-
-export const groupAPI = {
-  async allGroups() {
-    let response = await apiReq.get(API_ROUTES.groups);
-    return response.data;
-  },
-  create(name) {
-    return apiReq.post(
-      API_ROUTES.groups,
-      { name: name },
-      () => i18n.t("group.user-group-creation-failed"),
-      () => i18n.t("group.user-group-created")
-    );
-  },
-  delete(id) {
-    return apiReq.delete(API_ROUTES.groupsId(id), null, deleteErrorText, function() {
-      return i18n.t("group.group-deleted");
-    });
-  },
-  async current() {
-    const response = await apiReq.get(API_ROUTES.groupsSelf, null, null);
-    if (response) {
-      return response.data;
-    }
-  },
-  update(data) {
-    return apiReq.put(
-      API_ROUTES.groupsId(data.id),
-      data,
-      () => i18n.t("group.error-updating-group"),
-      () => i18n.t("settings.group-settings-updated")
-    );
-  },
-};
diff --git a/frontend.old/src/api/index.js b/frontend.old/src/api/index.js
deleted file mode 100644
index dbc633212f33..000000000000
--- a/frontend.old/src/api/index.js
+++ /dev/null
@@ -1,37 +0,0 @@
-import { backupAPI } from "./backup";
-import { recipeAPI } from "./recipe";
-import { mealplanAPI } from "./mealplan";
-import { settingsAPI } from "./settings";
-import { themeAPI } from "./themes";
-import { migrationAPI } from "./migration";
-import { utilsAPI } from "./upload";
-import { categoryAPI, tagAPI } from "./category";
-import { metaAPI } from "./meta";
-import { userAPI } from "./users";
-import { signupAPI } from "./signUps";
-import { groupAPI } from "./groups";
-import { siteSettingsAPI } from "./siteSettings";
-import { aboutAPI } from "./about";
-import { shoppingListsAPI } from "./shoppingLists";
-
-/**
- * The main object namespace for interacting with the backend database
- */
-export const api = {
-  recipes: recipeAPI,
-  siteSettings: siteSettingsAPI,
-  backups: backupAPI,
-  mealPlans: mealplanAPI,
-  settings: settingsAPI,
-  themes: themeAPI,
-  migrations: migrationAPI,
-  utils: utilsAPI,
-  categories: categoryAPI,
-  tags: tagAPI,
-  meta: metaAPI,
-  users: userAPI,
-  signUps: signupAPI,
-  groups: groupAPI,
-  about: aboutAPI,
-  shoppingLists: shoppingListsAPI,
-};
diff --git a/frontend.old/src/api/mealplan.js b/frontend.old/src/api/mealplan.js
deleted file mode 100644
index f1e3dc8d219e..000000000000
--- a/frontend.old/src/api/mealplan.js
+++ /dev/null
@@ -1,57 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const mealplanAPI = {
-  create(postBody) {
-    return apiReq.post(
-      API_ROUTES.mealPlansCreate,
-      postBody,
-      () => i18n.t("meal-plan.mealplan-creation-failed"),
-      () => i18n.t("meal-plan.mealplan-created")
-    );
-  },
-
-  async all() {
-    let response = await apiReq.get(API_ROUTES.mealPlansAll);
-    return response;
-  },
-
-  async thisWeek() {
-    let response = await apiReq.get(API_ROUTES.mealPlansThisWeek);
-    return response.data;
-  },
-
-  async today() {
-    let response = await apiReq.get(API_ROUTES.mealPlansToday);
-    return response;
-  },
-
-  async getById(id) {
-    let response = await apiReq.get(API_ROUTES.mealPlansId(id));
-    return response.data;
-  },
-
-  delete(id) {
-    return apiReq.delete(
-      API_ROUTES.mealPlansId(id),
-      null,
-      () => i18n.t("meal-plan.mealplan-deletion-failed"),
-      () => i18n.t("meal-plan.mealplan-deleted")
-    );
-  },
-
-  update(id, body) {
-    return apiReq.put(
-      API_ROUTES.mealPlansId(id),
-      body,
-      () => i18n.t("meal-plan.mealplan-update-failed"),
-      () => i18n.t("meal-plan.mealplan-updated")
-    );
-  },
-
-  async shoppingList(id) {
-    let response = await apiReq.get(API_ROUTES.mealPlansIdShoppingList(id));
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/meta.js b/frontend.old/src/api/meta.js
deleted file mode 100644
index b460c961c17a..000000000000
--- a/frontend.old/src/api/meta.js
+++ /dev/null
@@ -1,29 +0,0 @@
-import { apiReq } from "./api-utils";
-import { API_ROUTES } from "./apiRoutes";
-
-export const metaAPI = {
-  async getAppInfo() {
-    const response = await apiReq.get(API_ROUTES.debugVersion);
-    return response.data;
-  },
-
-  async getDebugInfo() {
-    const response = await apiReq.get(API_ROUTES.debug);
-    return response.data;
-  },
-
-  async getLogText(num) {
-    const response = await apiReq.get(API_ROUTES.debugLogNum(num));
-    return response.data;
-  },
-
-  async getLastJson() {
-    const response = await apiReq.get(API_ROUTES.debugLastRecipeJson);
-    return response.data;
-  },
-
-  async getStatistics() {
-    const response = await apiReq.get(API_ROUTES.debugStatistics);
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/migration.js b/frontend.old/src/api/migration.js
deleted file mode 100644
index 96d148a88e64..000000000000
--- a/frontend.old/src/api/migration.js
+++ /dev/null
@@ -1,25 +0,0 @@
-import { apiReq } from "./api-utils";
-import { store } from "../store";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const migrationAPI = {
-  async getMigrations() {
-    let response = await apiReq.get(API_ROUTES.migrations);
-    return response.data;
-  },
-  async delete(folder, file) {
-    const response = await apiReq.delete(
-      API_ROUTES.migrationsImportTypeFileNameDelete(folder, file),
-      null,
-      () => i18n.t("general.file-folder-not-found"),
-      () => i18n.t("migration.migration-data-removed")
-    );
-    return response;
-  },
-  async import(folder, file) {
-    let response = await apiReq.post(API_ROUTES.migrationsImportTypeFileNameImport(folder, file));
-    store.dispatch("requestRecentRecipes");
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/recipe.js b/frontend.old/src/api/recipe.js
deleted file mode 100644
index 6a4445c7fd31..000000000000
--- a/frontend.old/src/api/recipe.js
+++ /dev/null
@@ -1,181 +0,0 @@
-import { API_ROUTES } from "./apiRoutes";
-import { apiReq } from "./api-utils";
-import { store } from "../store";
-import i18n from "@/i18n.js";
-
-export const recipeAPI = {
-  /**
-   * Returns the Default Recipe Settings for the Site
-   * @returns {AxoisResponse} Axois Response Object
-   */
-  async getDefaultSettings() {
-    const response = await apiReq.get(API_ROUTES.aboutRecipesDefaults);
-    return response;
-  },
-
-  /**
-   * Create a Recipe by URL
-   * @param {string} recipeURL
-   * @returns {string} Recipe Slug
-   */
-  async createByURL(recipeURL) {
-    const response = await apiReq.post(API_ROUTES.recipesCreateUrl, { url: recipeURL }, false, () =>
-      i18n.t("recipe.recipe-created")
-    );
-
-    store.dispatch("requestRecentRecipes");
-    return response;
-  },
-
-  async getAllByCategory(categories) {
-    let response = await apiReq.post(API_ROUTES.recipesCategory, categories);
-    return response.data;
-  },
-
-  async create(recipeData) {
-    const response = await apiReq.post(
-      API_ROUTES.recipesCreate,
-      recipeData,
-      () => i18n.t("recipe.recipe-creation-failed"),
-      () => i18n.t("recipe.recipe-created")
-    );
-    store.dispatch("requestRecentRecipes");
-    return response.data;
-  },
-
-  async requestDetails(recipeSlug) {
-    const response = await apiReq.getSafe(API_ROUTES.recipesRecipeSlug(recipeSlug));
-    return response;
-  },
-
-  updateImage(recipeSlug, fileObject, overrideSuccessMsg = false) {
-    const formData = new FormData();
-    formData.append("image", fileObject);
-    formData.append("extension", fileObject.name.split(".").pop());
-
-    let successMessage = null;
-    if (!overrideSuccessMsg) {
-      successMessage = function() {
-        return overrideSuccessMsg ? null : i18n.t("recipe.recipe-image-updated");
-      };
-    }
-
-    return apiReq.put(
-      API_ROUTES.recipesRecipeSlugImage(recipeSlug),
-      formData,
-      () => i18n.t("general.image-upload-failed"),
-      successMessage
-    );
-  },
-
-  async createAsset(recipeSlug, fileObject, name, icon) {
-    const fd = new FormData();
-    fd.append("file", fileObject);
-    fd.append("extension", fileObject.name.split(".").pop());
-    fd.append("name", name);
-    fd.append("icon", icon);
-    const response = apiReq.post(API_ROUTES.recipesRecipeSlugAssets(recipeSlug), fd);
-    return response;
-  },
-
-  updateImagebyURL(slug, url) {
-    return apiReq.post(
-      API_ROUTES.recipesRecipeSlugImage(slug),
-      { url: url },
-      () => i18n.t("general.image-upload-failed"),
-      () => i18n.t("recipe.recipe-image-updated")
-    );
-  },
-
-  async update(data) {
-    let response = await apiReq.put(
-      API_ROUTES.recipesRecipeSlug(data.slug),
-      data,
-      () => i18n.t("recipe.recipe-update-failed"),
-      () => i18n.t("recipe.recipe-updated")
-    );
-    if (response) {
-      store.dispatch("patchRecipe", response.data);
-      return response.data.slug; // ! Temporary until I rewrite to refresh page without additional request
-    }
-  },
-
-  async patch(data) {
-    let response = await apiReq.patch(API_ROUTES.recipesRecipeSlug(data.slug), data);
-    store.dispatch("patchRecipe", response.data);
-    return response.data;
-  },
-
-  async delete(recipeSlug) {
-    const response = await apiReq.delete(
-      API_ROUTES.recipesRecipeSlug(recipeSlug),
-      null,
-      () => i18n.t("recipe.unable-to-delete-recipe"),
-      () => i18n.t("recipe.recipe-deleted")
-    );
-    store.dispatch("dropRecipe", response.data);
-    return response;
-  },
-
-  async allSummary(start = 0, limit = 9999) {
-    const response = await apiReq.get(API_ROUTES.recipesSummary, {
-      params: { start: start, limit: limit },
-    });
-    return response.data;
-  },
-
-  async allUntagged() {
-    const response = await apiReq.get(API_ROUTES.recipesSummaryUntagged);
-    return response.data;
-  },
-
-  async allUnategorized() {
-    const response = await apiReq.get(API_ROUTES.recipesSummaryUncategorized);
-    return response.data;
-  },
-
-  recipeImage(recipeSlug, version = null, key = null) {
-    return `/api/media/recipes/${recipeSlug}/images/original.webp?&rnd=${key}&version=${version}`;
-  },
-
-  recipeSmallImage(recipeSlug, version = null, key = null) {
-    return `/api/media/recipes/${recipeSlug}/images/min-original.webp?&rnd=${key}&version=${version}`;
-  },
-
-  recipeTinyImage(recipeSlug, version = null, key = null) {
-    return `/api/media/recipes/${recipeSlug}/images/tiny-original.webp?&rnd=${key}&version=${version}`;
-  },
-
-  recipeAssetPath(recipeSlug, assetName) {
-    return `/api/media/recipes/${recipeSlug}/assets/${assetName}`;
-  },
-
-  /** Create comment in the Database
-   * @param slug
-   */
-  async createComment(slug, data) {
-    const response = await apiReq.post(API_ROUTES.recipesSlugComments(slug), data);
-    return response.data;
-  },
-  /** Update comment in the Database
-   * @param slug
-   * @param id
-   */
-  async updateComment(slug, id, data) {
-    const response = await apiReq.put(API_ROUTES.recipesSlugCommentsId(slug, id), data);
-    return response.data;
-  },
-  /** Delete comment from the Database
-   * @param slug
-   * @param id
-   */
-  async deleteComment(slug, id) {
-    const response = await apiReq.delete(API_ROUTES.recipesSlugCommentsId(slug, id));
-    return response.data;
-  },
-
-  async testScrapeURL(url) {
-    const response = await apiReq.post(API_ROUTES.recipesTestScrapeUrl, { url: url });
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/settings.js b/frontend.old/src/api/settings.js
deleted file mode 100644
index ffb2af344bbc..000000000000
--- a/frontend.old/src/api/settings.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import { apiReq } from "./api-utils";
-import { API_ROUTES } from "./apiRoutes";
-
-export const settingsAPI = {
-  async requestAll() {
-    let response = await apiReq.get(API_ROUTES.siteSettings);
-    return response.data;
-  },
-
-  async testWebhooks() {
-    let response = await apiReq.post(API_ROUTES.siteSettingsWebhooksTest);
-    return response.data;
-  },
-
-  async update(body) {
-    let response = await apiReq.put(API_ROUTES.siteSettings, body);
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/shoppingLists.js b/frontend.old/src/api/shoppingLists.js
deleted file mode 100644
index 74a7c9e2cd1c..000000000000
--- a/frontend.old/src/api/shoppingLists.js
+++ /dev/null
@@ -1,33 +0,0 @@
-// This Content is Auto Generated
-import { API_ROUTES } from "./apiRoutes";
-import { apiReq } from "./api-utils";
-
-export const shoppingListsAPI = {
-  /** Create Shopping List in the Database
-   */
-  async createShoppingList(data) {
-    const response = await apiReq.post(API_ROUTES.shoppingLists, data);
-    return response.data;
-  },
-  /** Get Shopping List from the Database
-   * @param id
-   */
-  async getShoppingList(id) {
-    const response = await apiReq.get(API_ROUTES.shoppingListsId(id));
-    return response.data;
-  },
-  /** Update Shopping List in the Database
-   * @param id
-   */
-  async updateShoppingList(id, data) {
-    const response = await apiReq.put(API_ROUTES.shoppingListsId(id), data);
-    return response.data;
-  },
-  /** Delete Shopping List from the Database
-   * @param id
-   */
-  async deleteShoppingList(id) {
-    const response = await apiReq.delete(API_ROUTES.shoppingListsId(id));
-    return response.data;
-  },
-};
diff --git a/frontend.old/src/api/signUps.js b/frontend.old/src/api/signUps.js
deleted file mode 100644
index 946a8ea71063..000000000000
--- a/frontend.old/src/api/signUps.js
+++ /dev/null
@@ -1,35 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const signupAPI = {
-  async getAll() {
-    let response = await apiReq.get(API_ROUTES.usersSignUps);
-    return response.data;
-  },
-  async createToken(data) {
-    let response = await apiReq.post(
-      API_ROUTES.usersSignUps,
-      data,
-      () => i18n.t("signup.sign-up-link-creation-failed"),
-      () => i18n.t("signup.sign-up-link-created")
-    );
-    return response.data;
-  },
-  async deleteToken(token) {
-    return await apiReq.delete(
-      API_ROUTES.usersSignUpsToken(token),
-      null,
-      () => i18n.t("signup.sign-up-token-deletion-failed"),
-      () => i18n.t("signup.sign-up-token-deleted")
-    );
-  },
-  async createUser(token, data) {
-    return apiReq.post(
-      API_ROUTES.usersSignUpsToken(token),
-      data,
-      () => i18n.t("user.you-are-not-allowed-to-create-a-user"),
-      () => i18n.t("user.user-created")
-    );
-  },
-};
diff --git a/frontend.old/src/api/siteSettings.js b/frontend.old/src/api/siteSettings.js
deleted file mode 100644
index 0d25479df24c..000000000000
--- a/frontend.old/src/api/siteSettings.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import { apiReq } from "./api-utils";
-import { store } from "@/store";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const siteSettingsAPI = {
-  async get() {
-    let response = await apiReq.get(API_ROUTES.siteSettings);
-    return response.data;
-  },
-
-  async update(body) {
-    const response = await apiReq.put(
-      API_ROUTES.siteSettings,
-      body,
-      () => i18n.t("settings.settings-update-failed"),
-      () => i18n.t("settings.settings-updated")
-    );
-    if (response) {
-      store.dispatch("requestSiteSettings");
-    }
-    return response;
-  },
-
-  async getPages() {
-    let response = await apiReq.get(API_ROUTES.siteSettingsCustomPages);
-    return response.data;
-  },
-
-  async getPage(id) {
-    let response = await apiReq.get(API_ROUTES.siteSettingsCustomPagesId(id));
-    return response.data;
-  },
-
-  createPage(body) {
-    return apiReq.post(
-      API_ROUTES.siteSettingsCustomPages,
-      body,
-      () => i18n.t("page.page-creation-failed"),
-      () => i18n.t("page.new-page-created")
-    );
-  },
-
-  async deletePage(id) {
-    return await apiReq.delete(
-      API_ROUTES.siteSettingsCustomPagesId(id),
-      null,
-      () => i18n.t("page.page-deletion-failed"),
-      () => i18n.t("page.page-deleted")
-    );
-  },
-
-  updatePage(body) {
-    return apiReq.put(
-      API_ROUTES.siteSettingsCustomPagesId(body.id),
-      body,
-      () => i18n.t("page.page-update-failed"),
-      () => i18n.t("page.page-updated")
-    );
-  },
-
-  async updateAllPages(allPages) {
-    let response = await apiReq.put(
-      API_ROUTES.siteSettingsCustomPages,
-      allPages,
-      () => i18n.t("page.pages-update-failed"),
-      () => i18n.t("page.pages-updated")
-    );
-    return response;
-  },
-};
diff --git a/frontend.old/src/api/themes.js b/frontend.old/src/api/themes.js
deleted file mode 100644
index ba19e0083c64..000000000000
--- a/frontend.old/src/api/themes.js
+++ /dev/null
@@ -1,42 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-import { API_ROUTES } from "./apiRoutes";
-
-export const themeAPI = {
-  async requestAll() {
-    let response = await apiReq.get(API_ROUTES.themes);
-    return response.data;
-  },
-
-  async requestByName(name) {
-    let response = await apiReq.get(API_ROUTES.themesId(name));
-    return response.data;
-  },
-
-  async create(postBody) {
-    return await apiReq.post(
-      API_ROUTES.themesCreate,
-      postBody,
-      () => i18n.t("settings.theme.error-creating-theme-see-log-file"),
-      () => i18n.t("settings.theme.theme-saved")
-    );
-  },
-
-  update(data) {
-    return apiReq.put(
-      API_ROUTES.themesId(data.id),
-      data,
-      () => i18n.t("settings.theme.error-updating-theme"),
-      () => i18n.t("settings.theme.theme-updated")
-    );
-  },
-
-  delete(id) {
-    return apiReq.delete(
-      API_ROUTES.themesId(id),
-      null,
-      () => i18n.t("settings.theme.error-deleting-theme"),
-      () => i18n.t("settings.theme.theme-deleted")
-    );
-  },
-};
diff --git a/frontend.old/src/api/upload.js b/frontend.old/src/api/upload.js
deleted file mode 100644
index efd9ada3e1fc..000000000000
--- a/frontend.old/src/api/upload.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-
-export const utilsAPI = {
-  // import { api } from "@/api";
-  uploadFile(url, fileObject) {
-    return apiReq.post(
-      url,
-      fileObject,
-      () => i18n.t("general.failure-uploading-file"),
-      () => i18n.t("general.file-uploaded")
-    );
-  },
-};
diff --git a/frontend.old/src/api/users.js b/frontend.old/src/api/users.js
deleted file mode 100644
index d354a6e6614b..000000000000
--- a/frontend.old/src/api/users.js
+++ /dev/null
@@ -1,107 +0,0 @@
-import { API_ROUTES } from "./apiRoutes";
-import { apiReq } from "./api-utils";
-import i18n from "@/i18n.js";
-
-export const userAPI = {
-  async login(formData) {
-    let response = await apiReq.post(API_ROUTES.authToken, formData, null, () => {
-      return i18n.t("user.user-successfully-logged-in");
-    });
-    return response;
-  },
-  async refresh() {
-    return apiReq.getSafe(API_ROUTES.authRefresh);
-  },
-  async allUsers() {
-    let response = await apiReq.get(API_ROUTES.users);
-    return response.data;
-  },
-  create(user) {
-    return apiReq.post(
-      API_ROUTES.users,
-      user,
-      () => i18n.t("user.user-creation-failed"),
-      () => i18n.t("user.user-created")
-    );
-  },
-  async self() {
-    return apiReq.getSafe(API_ROUTES.usersSelf);
-  },
-  async byID(id) {
-    let response = await apiReq.get(API_ROUTES.usersId(id));
-    return response.data;
-  },
-  update(user) {
-    return apiReq.put(
-      API_ROUTES.usersId(user.id),
-      user,
-      () => i18n.t("user.user-update-failed"),
-      () => i18n.t("user.user-updated")
-    );
-  },
-  changePassword(id, password) {
-    return apiReq.put(
-      API_ROUTES.usersIdPassword(id),
-      password,
-      () => i18n.t("user.existing-password-does-not-match"),
-      () => i18n.t("user.password-updated")
-    );
-  },
-
-  delete(id) {
-    return apiReq.delete(API_ROUTES.usersId(id), null, deleteErrorText, () => {
-      return i18n.t("user.user-deleted");
-    });
-  },
-  resetPassword(id) {
-    return apiReq.put(
-      API_ROUTES.usersIdResetPassword(id),
-      null,
-      () => i18n.t("user.password-reset-failed"),
-      () => i18n.t("user.password-has-been-reset-to-the-default-password")
-    );
-  },
-  async createAPIToken(name) {
-    const response = await apiReq.post(API_ROUTES.usersApiTokens, { name });
-    return response.data;
-  },
-  async deleteAPIToken(id) {
-    const response = await apiReq.delete(API_ROUTES.usersApiTokensTokenId(id));
-    return response.data;
-  },
-  /** Adds a Recipe to the users favorites
-   * @param id
-   */
-  async getFavorites(id) {
-    const response = await apiReq.get(API_ROUTES.usersIdFavorites(id));
-    return response.data;
-  },
-  /** Adds a Recipe to the users favorites
-   * @param id
-   */
-  async addFavorite(id, slug) {
-    const response = await apiReq.post(API_ROUTES.usersIdFavoritesSlug(id, slug));
-    return response.data;
-  },
-  /** Adds a Recipe to the users favorites
-   * @param id
-   */
-  async removeFavorite(id, slug) {
-    const response = await apiReq.delete(API_ROUTES.usersIdFavoritesSlug(id, slug));
-    return response.data;
-  },
-
-  userProfileImage(id) {
-    if (!id || id === undefined) return;
-    return `/api/users/${id}/image`;
-  },
-};
-
-const deleteErrorText = response => {
-  switch (response.data.detail) {
-    case "SUPER_USER":
-      return i18n.t("user.error-cannot-delete-super-user");
-    default:
-      return i18n.t("user.you-are-not-allowed-to-delete-this-user");
-  }
-};
diff --git a/frontend.old/src/components/Fallbacks/NoRecipe.vue b/frontend.old/src/components/Fallbacks/NoRecipe.vue
deleted file mode 100644
index d196b487c05b..000000000000
--- a/frontend.old/src/components/Fallbacks/NoRecipe.vue
+++ /dev/null
@@ -1,17 +0,0 @@
-<template>
-  <div>
-    <The404>
-      <h1 class="mx-auto">{{ $t('general.no-recipe-found') }}</h1>
-    </The404>
-  </div>
-</template>
-
-<script>
-import The404 from "./The404.vue";
-export default {
-  components: { The404 },
-};
-</script>
-
-
-
diff --git a/frontend.old/src/components/Fallbacks/The404.vue b/frontend.old/src/components/Fallbacks/The404.vue
deleted file mode 100644
index 60f8d5ba19cd..000000000000
--- a/frontend.old/src/components/Fallbacks/The404.vue
+++ /dev/null
@@ -1,51 +0,0 @@
-<template>
-  <div>
-    <v-card-title>
-      <slot>
-        <h1 class="mx-auto">{{ $t('page.404-page-not-found') }}</h1>
-      </slot>
-    </v-card-title>
-    <div class="d-flex justify-space-around">
-      <div class="d-flex">
-        <p>4</p>
-        <v-icon color="primary" class="mx-auto" size="200">
-          {{ $globals.icons.primary }}
-        </v-icon>
-        <p>4</p>
-      </div>
-    </div>
-    <v-card-actions>
-      <v-spacer></v-spacer>
-      <slot name="actions">
-        <v-btn v-for="(button, index) in buttons" :key="index" :to="button.to" color="primary">
-          <v-icon left> {{ button.icon }} </v-icon>
-          {{ button.text }}
-        </v-btn>
-      </slot>
-      <v-spacer></v-spacer>
-    </v-card-actions>
-  </div>
-</template>
-
-<script>
-export default {
-  computed: {
-    buttons() {
-      return[ 
-        { icon: this.$globals.icons.home, to: "/", text: this.$t('general.home') },
-        { icon: this.$globals.icons.primary, to: "/recipes/all", text: this.$t('page.all-recipes') },
-        { icon: this.$globals.icons.search, to: "/search", text: this.$t('search.search') },
-      ]; 
-    },
-  }
-};
-</script>
-
-<style scoped>
-p {
-  padding-bottom: 0 !important;
-  margin-bottom: 0 !important;
-  color: var(--v-primary-base);
-  font-size: 200px;
-}
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/components/FormHelpers/CategoryTagSelector.vue b/frontend.old/src/components/FormHelpers/CategoryTagSelector.vue
deleted file mode 100644
index e02b988b48ef..000000000000
--- a/frontend.old/src/components/FormHelpers/CategoryTagSelector.vue
+++ /dev/null
@@ -1,134 +0,0 @@
-<template>
-  <v-autocomplete
-    :items="activeItems"
-    v-model="selected"
-    :value="value"
-    :label="inputLabel"
-    chips
-    deletable-chips
-    :dense="dense"
-    item-text="name"
-    persistent-hint
-    multiple
-    :hint="hint"
-    :solo="solo"
-    :return-object="returnObject"
-    :flat="flat"
-    @input="emitChange"
-  >
-    <template v-slot:selection="data">
-      <v-chip
-        class="ma-1"
-        :input-value="data.selected"
-        close
-        @click:close="removeByIndex(data.index)"
-        label
-        color="accent"
-        dark
-        :key="data.index"
-      >
-        {{ data.item.name || data.item }}
-      </v-chip>
-    </template>
-    <template v-slot:append-outer="">
-      <NewCategoryTagDialog v-if="showAdd" :tag-dialog="tagSelector" @created-item="pushToItem" />
-    </template>
-  </v-autocomplete>
-</template>
-
-<script>
-import NewCategoryTagDialog from "@/components/UI/Dialogs/NewCategoryTagDialog";
-const MOUNTED_EVENT = "mounted";
-export default {
-  components: {
-    NewCategoryTagDialog,
-  },
-  props: {
-    value: Array,
-    solo: {
-      default: false,
-    },
-    dense: {
-      default: true,
-    },
-    returnObject: {
-      default: true,
-    },
-    tagSelector: {
-      default: false,
-    },
-    hint: {
-      default: null,
-    },
-    showAdd: {
-      default: false,
-    },
-    showLabel: {
-      default: true,
-    },
-  },
-  data() {
-    return {
-      selected: [],
-    };
-  },
-  async created() {
-    if (this.tagSelector) {
-      this.$store.dispatch("requestTags");
-    } else {
-      this.$store.dispatch("requestCategories");
-    }
-  },
-  mounted() {
-    this.$emit(MOUNTED_EVENT);
-    this.setInit(this.value);
-  },
-
-  watch: {
-    value(val) {
-      this.selected = val;
-    },
-  },
-
-  computed: {
-    inputLabel() {
-      if (!this.showLabel) return null;
-      return this.tagSelector ? this.$t("tag.tags") : this.$t("recipe.categories");
-    },
-    activeItems() {
-      let ItemObjects = [];
-      if (this.tagSelector) ItemObjects = this.$store.getters.getAllTags;
-      else {
-        ItemObjects = this.$store.getters.getAllCategories;
-      }
-      if (this.returnObject) return ItemObjects;
-      else {
-        return ItemObjects.map(x => x.name);
-      }
-    },
-    flat() {
-      if (this.selected) {
-        return this.selected.length > 0 && this.solo;
-      }
-      return false;
-    },
-  },
-  methods: {
-    emitChange() {
-      this.$emit("input", this.selected);
-    },
-    setInit(val) {
-      this.selected = val;
-    },
-    removeByIndex(index) {
-      this.selected.splice(index, 1);
-    },
-    pushToItem(createdItem) {
-      createdItem = this.returnObject ? createdItem : createdItem.name;
-      this.selected.push(createdItem);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/components/FormHelpers/ColorPickerDialog.vue b/frontend.old/src/components/FormHelpers/ColorPickerDialog.vue
deleted file mode 100644
index 13ba003ec499..000000000000
--- a/frontend.old/src/components/FormHelpers/ColorPickerDialog.vue
+++ /dev/null
@@ -1,65 +0,0 @@
-<template>
-  <div>
-    <div class="text-center">
-      <h3>{{ buttonText }}</h3>
-    </div>
-    <v-text-field v-model="color" hide-details class="ma-0 pa-0" solo >
-      <template v-slot:append>
-        <v-menu v-model="menu" top nudge-bottom="105" nudge-left="16" :close-on-content-click="false">
-          <template v-slot:activator="{ on }">
-            <div :style="swatchStyle" v-on="on" swatches-max-height="300" />
-          </template>
-          <v-card>
-            <v-card-text class="pa-0">
-              <v-color-picker v-model="color" flat mode="hexa" show-swatches />
-            </v-card-text>
-          </v-card>
-        </v-menu>
-      </template>
-    </v-text-field>
-
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    buttonText: String,
-    value: String,
-  },
-  data() {
-    return {
-      dialog: false,
-      swatches: false,
-      color: this.value || "#1976D2",
-      mask: "!#XXXXXXXX",
-      menu: false,
-    };
-  },
-  computed: {
-    swatchStyle() {
-      const { value, menu } = this;
-      return {
-        backgroundColor: value,
-        cursor: "pointer",
-        height: "30px",
-        width: "30px",
-        borderRadius: menu ? "50%" : "4px",
-        transition: "border-radius 200ms ease-in-out",
-      };
-    },
-  },
-  watch: {
-    color() {
-      this.updateColor();
-    },
-  },
-  methods: {
-    updateColor() {
-      this.$emit("input", this.color);
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/FormHelpers/DatePicker.vue b/frontend.old/src/components/FormHelpers/DatePicker.vue
deleted file mode 100644
index 610ec00a8970..000000000000
--- a/frontend.old/src/components/FormHelpers/DatePicker.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<template>
-  <v-date-picker :first-day-of-week="firstDayOfWeek" v-on="$listeners"></v-date-picker>
-</template>
-
-<script>
-import { api } from "@/api";
-
-export default {
-  data() {
-    return {
-      firstDayOfWeek: 0,
-    };
-  },
-  mounted() {
-    this.getOptions();
-  },
-
-  methods: {
-    async getOptions() {
-      const settings = await api.siteSettings.get();
-      this.firstDayOfWeek = settings.firstDayOfWeek;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/FormHelpers/ImportOptions.vue b/frontend.old/src/components/FormHelpers/ImportOptions.vue
deleted file mode 100644
index 519037a46e53..000000000000
--- a/frontend.old/src/components/FormHelpers/ImportOptions.vue
+++ /dev/null
@@ -1,69 +0,0 @@
-<template>
-  <div>
-    <v-checkbox
-      v-for="(option, index) in options"
-      :key="index"
-      class="mb-n4 mt-n3"
-      dense
-      :label="option.text"
-      v-model="option.value"
-      @change="emitValue()"
-    ></v-checkbox>
-  </div>
-</template>
-
-<script>
-const UPDATE_EVENT = "update-options";
-export default {
-  data() {
-    return {
-      options: {
-        recipes: {
-          value: true,
-          text: this.$t("general.recipes"),
-        },
-        settings: {
-          value: true,
-          text: this.$t("general.settings"),
-        },
-        pages: {
-          value: true,
-          text: this.$t("settings.pages"),
-        },
-        themes: {
-          value: true,
-          text: this.$t("general.themes"),
-        },
-        users: {
-          value: true,
-          text: this.$t("user.users"),
-        },
-        groups: {
-          value: true,
-          text: this.$t("group.groups"),
-        },
-        notifications: {
-          value: true,
-          text: this.$t("events.notification"),
-        },
-      },
-    };
-  },
-  mounted() {
-    this.emitValue();
-  },
-  methods: {
-    emitValue() {
-      this.$emit(UPDATE_EVENT, {
-        recipes: this.options.recipes.value,
-        settings: this.options.settings.value,
-        themes: this.options.themes.value,
-        pages: this.options.pages.value,
-        users: this.options.users.value,
-        groups: this.options.groups.value,
-        notifications: this.options.notifications.value,
-      });
-    },
-  },
-};
-</script>
\ No newline at end of file
diff --git a/frontend.old/src/components/FormHelpers/LanguageSelector.vue b/frontend.old/src/components/FormHelpers/LanguageSelector.vue
deleted file mode 100644
index c480fad998d5..000000000000
--- a/frontend.old/src/components/FormHelpers/LanguageSelector.vue
+++ /dev/null
@@ -1,48 +0,0 @@
-<template>
-  <v-select
-    dense
-    :items="allLanguages"
-    item-text="name"
-    :label="$t('settings.language')"
-    :prepend-icon="$globals.icons.translate"
-    :value="selectedItem"
-    @input="setLanguage"
-  >
-  </v-select>
-</template>
-
-<script>
-const SELECT_EVENT = "select-lang";
-export default {
-  props: {
-    siteSettings: {
-      default: false,
-    },
-  },
-  data: function() {
-    return {
-      selectedItem: 0,
-      items: [
-        {
-          name: "English",
-          value: "en-US",
-        },
-      ],
-    };
-  },
-  created() {
-    this.selectedItem = this.$store.getters.getActiveLang;
-  },
-  computed: {
-    allLanguages() {
-      return this.$store.getters.getAllLangs;
-    },
-  },
-
-  methods: {
-    setLanguage(selectedLanguage) {
-      this.$emit(SELECT_EVENT, selectedLanguage);
-    },
-  },
-};
-</script>
diff --git a/frontend.old/src/components/FormHelpers/TimePickerDialog.vue b/frontend.old/src/components/FormHelpers/TimePickerDialog.vue
deleted file mode 100644
index 8a7c9e851a22..000000000000
--- a/frontend.old/src/components/FormHelpers/TimePickerDialog.vue
+++ /dev/null
@@ -1,42 +0,0 @@
-<template>
-  <v-dialog ref="dialog" v-model="modal2" :return-value.sync="time" persistent width="290px">
-    <template v-slot:activator="{ on, attrs }">
-      <v-text-field
-        v-model="time"
-        :label="$t('settings.set-new-time')"
-        :prepend-icon="$globals.icons.clockOutline"
-        readonly
-        v-bind="attrs"
-        v-on="on"
-      ></v-text-field>
-    </template>
-    <v-time-picker v-if="modal2" v-model="time" full-width>
-      <v-spacer></v-spacer>
-      <v-btn text color="primary" @click="modal2 = false"> {{ $t("general.cancel") }} </v-btn>
-      <v-btn text color="primary" @click="saveTime"> {{ $t("general.ok") }} </v-btn>
-    </v-time-picker>
-  </v-dialog>
-</template>
-
-<script>
-export default {
-  data() {
-    return {
-      time: null,
-      modal2: false,
-    };
-  },
-  methods: {
-    saveTime() {
-      this.$refs.dialog.save(this.time);
-      this.$emit("save-time", this.time);
-    },
-  },
-};
-</script>
-
-<style scoped>
-.v-text-field {
-  max-width: 300px;
-}
-</style>
diff --git a/frontend.old/src/components/ImportSummaryDialog/DataTable.vue b/frontend.old/src/components/ImportSummaryDialog/DataTable.vue
deleted file mode 100644
index 8391bc95eedf..000000000000
--- a/frontend.old/src/components/ImportSummaryDialog/DataTable.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<template>
-  <div>
-    <v-data-table
-      dense
-      :headers="dataHeaders"
-      :items="dataSet"
-      item-key="name"
-      class="elevation-1 mt-2"
-      show-expand
-      :expanded.sync="expanded"
-      :footer-props="{
-        'items-per-page-options': [100, 200, 300, 400, -1],
-      }"
-      :items-per-page="100"
-    >
-      <template v-slot:item.status="{ item }">
-        <div :class="item.status ? 'success--text' : 'error--text'">
-          {{ item.status ? "Imported" : "Failed" }}
-        </div>
-      </template>
-
-      <template v-slot:expanded-item="{ headers, item }">
-        <td :colspan="headers.length">
-          <div class="ma-2">
-            {{ item.exception }}
-          </div>
-        </td>
-      </template>
-    </v-data-table>
-  </div>
-</template>
-
-<script>
-export default {
-  props: {
-    dataSet: Array,
-    dataHeaders: Array,
-  },
-  data: () => ({
-    singleExpand: false,
-    expanded: [],
-  }),
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/ImportSummaryDialog/index.vue b/frontend.old/src/components/ImportSummaryDialog/index.vue
deleted file mode 100644
index d754451fd0f7..000000000000
--- a/frontend.old/src/components/ImportSummaryDialog/index.vue
+++ /dev/null
@@ -1,142 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-dialog v-model="dialog" width="70%">
-      <v-card>
-        <v-app-bar dark color="primary mb-2">
-          <v-icon large left>
-            {{ $globals.icons.import }}
-          </v-icon>
-          <v-toolbar-title class="headline">
-            {{ $t("settings.backup.import-summary") }}
-          </v-toolbar-title>
-          <v-spacer></v-spacer>
-        </v-app-bar>
-        <v-card-text class="mb-n4">
-          <v-row>
-            <div v-for="values in allNumbers" :key="values.title">
-              <v-card-text>
-                <div>
-                  <h3>{{ values.title }}</h3>
-                </div>
-                <div class="success--text">{{ $t("general.success-count", { count: values.success }) }}</div>
-                <div class="error--text">{{ $t("general.failed-count", { count: values.failure }) }}</div>
-              </v-card-text>
-            </div>
-          </v-row>
-        </v-card-text>
-        <v-tabs v-model="tab" show-arrows="">
-          <v-tab>{{ $t("general.recipes") }}</v-tab>
-          <v-tab>{{ $t("general.themes") }}</v-tab>
-          <v-tab>{{ $t("general.settings") }}</v-tab>
-          <v-tab> {{ $t("settings.pages") }} </v-tab>
-          <v-tab>{{ $t("user.users") }}</v-tab>
-          <v-tab>{{ $t("group.groups") }}</v-tab>
-        </v-tabs>
-        <v-tabs-items v-model="tab">
-          <v-tab-item v-for="(table, index) in allTables" :key="index">
-            <v-card flat>
-              <DataTable :data-headers="importHeaders" :data-set="table" />
-            </v-card>
-          </v-tab-item>
-        </v-tabs-items>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import DataTable from "@/components/ImportSummaryDialog/DataTable";
-export default {
-  components: {
-    DataTable,
-  },
-  data: () => ({
-    tab: null,
-    dialog: false,
-    recipeData: [],
-    themeData: [],
-    settingsData: [],
-    userData: [],
-    groupData: [],
-    pageData: [],
-    allDataTables: [],
-  }),
-
-  computed: {
-    importHeaders() {
-      return [
-        {
-          text: this.$t("general.status"),
-          value: "status",
-        },
-        {
-          text: this.$t("general.name"),
-          align: "start",
-          sortable: true,
-          value: "name",
-        },
-        {
-          text: this.$t("general.exception"),
-          value: "data-table-expand",
-          align: "center",
-        },
-      ];
-    },
-    recipeNumbers() {
-      return this.calculateNumbers(this.$t("general.recipes"), this.recipeData);
-    },
-    settingsNumbers() {
-      return this.calculateNumbers(this.$t("general.settings"), this.settingsData);
-    },
-    themeNumbers() {
-      return this.calculateNumbers(this.$t("general.themes"), this.themeData);
-    },
-    userNumbers() {
-      return this.calculateNumbers(this.$t("user.users"), this.userData);
-    },
-    groupNumbers() {
-      return this.calculateNumbers(this.$t("group.groups"), this.groupData);
-    },
-    pageNumbers() {
-      return this.calculateNumbers(this.$t("settings.pages"), this.pageData);
-    },
-    allNumbers() {
-      return [
-        this.recipeNumbers,
-        this.themeNumbers,
-        this.settingsNumbers,
-        this.pageNumbers,
-        this.userNumbers,
-        this.groupNumbers,
-      ];
-    },
-    allTables() {
-      return [this.recipeData, this.themeData, this.settingsData, this.pageData, this.userData, this.groupData];
-    },
-  },
-
-  methods: {
-    calculateNumbers(title, list_array) {
-      if (!list_array) return;
-      let numbers = { title: title, success: 0, failure: 0 };
-      list_array.forEach(element => {
-        if (element.status) {
-          numbers.success++;
-        } else numbers.failure++;
-      });
-      return numbers;
-    },
-    open(importData) {
-      this.recipeData = importData.recipeImports;
-      this.themeData = importData.themeImports;
-      this.settingsData = importData.settingsImports;
-      this.userData = importData.userImports;
-      this.groupData = importData.groupImports;
-      this.pageData = importData.pageImports;
-      this.dialog = true;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/Login/LoginDialog.vue b/frontend.old/src/components/Login/LoginDialog.vue
deleted file mode 100644
index fae060b1d075..000000000000
--- a/frontend.old/src/components/Login/LoginDialog.vue
+++ /dev/null
@@ -1,28 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-dialog v-model="dialog" width="500px">
-      <LoginForm @logged-in="dialog = false" />
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import LoginForm from "./LoginForm";
-export default {
-  components: {
-    LoginForm,
-  },
-  data() {
-    return {
-      dialog: false,
-    };
-  },
-  methods: {
-    open() {
-      this.dialog = true;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/Login/LoginForm.vue b/frontend.old/src/components/Login/LoginForm.vue
deleted file mode 100644
index d3bda238cce9..000000000000
--- a/frontend.old/src/components/Login/LoginForm.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-<template>
-  <v-card width="500px">
-    <v-divider></v-divider>
-    <v-app-bar dark color="primary" class="mt-n1 mb-2">
-      <v-icon large left v-if="!loading">
-        {{ $globals.icons.user }}
-      </v-icon>
-      <v-progress-circular v-else indeterminate color="white" large class="mr-2"> </v-progress-circular>
-      <v-toolbar-title class="headline">{{ $t("user.login") }}</v-toolbar-title>
-      <v-spacer></v-spacer>
-    </v-app-bar>
-
-    <v-form @submit.prevent="login">
-      <v-card-text>
-        <v-text-field
-          v-model="user.email"
-          :prepend-icon="$globals.icons.email"
-          validate-on-blur
-          autocomplete
-          autofocus
-          :label="`${$t('user.email')} or ${$t('user.username')} `"
-          type="email"
-        ></v-text-field>
-        <v-text-field
-          v-model="user.password"
-          class="mb-2s"
-          autocomplete
-          :prepend-icon="$globals.icons.lock"
-          :label="$t('user.password')"
-          :type="showPassword ? 'text' : 'password'"
-          :append-icon="showPassword ? $globals.icons.eye : $globals.icons.eyeOff"
-          @click:append="showPassword = !showPassword"
-        ></v-text-field>
-        <v-card-actions>
-          <v-btn v-if="options.isLoggingIn" color="primary" block large type="submit">{{ $t("user.sign-in") }} </v-btn>
-        </v-card-actions>
-
-        <v-alert v-if="error" class="mt-3 mb-0" type="error">
-          {{ $t("user.could-not-validate-credentials") }}
-        </v-alert>
-      </v-card-text>
-    </v-form>
-  </v-card>
-</template>
-
-<script>
-import { api } from "@/api";
-export default {
-  props: {},
-  data() {
-    return {
-      loading: false,
-      error: false,
-      showLogin: false,
-      showPassword: false,
-      user: {
-        email: "",
-        password: "",
-      },
-      options: {
-        isLoggingIn: true,
-      },
-    };
-  },
-  mounted() {
-    this.clear();
-  },
-  methods: {
-    clear() {
-      this.user = { email: "", password: "" };
-    },
-    async login() {
-      this.loading = true;
-      this.error = false;
-      let formData = new FormData();
-      formData.append("username", this.user.email);
-      formData.append("password", this.user.password);
-      const response = await api.users.login(formData);
-      if (!response) {
-        this.error = true;
-      } else {
-        this.clear();
-        this.$store.commit("setToken", response.data.access_token);
-        this.$emit("logged-in");
-        this.$store.dispatch("requestUserData");
-      }
-
-      this.loading = false;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/Login/SignUpForm.vue b/frontend.old/src/components/Login/SignUpForm.vue
deleted file mode 100644
index 4aa118f8f30a..000000000000
--- a/frontend.old/src/components/Login/SignUpForm.vue
+++ /dev/null
@@ -1,141 +0,0 @@
-<template>
-  <v-card width="500px">
-    <v-divider></v-divider>
-    <v-app-bar dark color="primary" class="mt-n1">
-      <v-icon large left v-if="!loading">
-        {{ $globals.icons.user }}
-      </v-icon>
-      <v-progress-circular v-else indeterminate color="white" large class="mr-2"> </v-progress-circular>
-      <v-toolbar-title class="headline">
-        {{ $t("signup.sign-up") }}
-      </v-toolbar-title>
-      <v-spacer></v-spacer>
-    </v-app-bar>
-    <v-card-text>
-      {{ $t("signup.welcome-to-mealie") }}
-      <v-divider class="mt-3"></v-divider>
-      <v-form ref="signUpForm" @submit.prevent="signUp">
-        <v-text-field
-          v-model="user.name"
-          light="light"
-          :prepend-icon="$globals.icons.user"
-          validate-on-blur
-          :rules="[existsRule]"
-          :label="$t('user.full-name')"
-        ></v-text-field>
-        <v-text-field
-          v-model="user.username"
-          light="light"
-          :prepend-icon="$globals.icons.user"
-          validate-on-blur
-          :rules="[existsRule]"
-          :label="$t('user.username')"
-        ></v-text-field>
-        <v-text-field
-          v-model="user.email"
-          light="light"
-          :prepend-icon="$globals.icons.email"
-          validate-on-blur
-          :rules="[existsRule, emailRule]"
-          :label="$t('user.email')"
-          type="email"
-        ></v-text-field>
-        <v-text-field
-          v-model="user.password"
-          light="light"
-          class="mb-2s"
-          :prepend-icon="$globals.icons.lock"
-          validate-on-blur
-          :label="$t('user.password')"
-          :type="showPassword ? 'text' : 'password'"
-          :rules="[minRule]"
-        ></v-text-field>
-        <v-text-field
-          v-model="user.passwordConfirm"
-          light="light"
-          class="mb-2s"
-          :prepend-icon="$globals.icons.lock"
-          :label="$t('user.password')"
-          :type="showPassword ? 'text' : 'password'"
-          :append-icon="showPassword ? $globals.icons.eye : $globals.icons.eyeOff"
-          :rules="[user.password === user.passwordConfirm || $t('user.password-must-match')]"
-          @click:append="showPassword = !showPassword"
-        ></v-text-field>
-        <v-card-actions>
-          <v-btn v-if="options.isLoggingIn" dark color="primary" block="block" type="submit">
-            {{ $t("signup.sign-up") }}
-          </v-btn>
-        </v-card-actions>
-        <v-alert dense v-if="error" outlined class="mt-3 mb-0" type="error">
-          {{ $t("signup.error-signing-up") }}
-        </v-alert>
-      </v-form>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-export default {
-  mixins: [validators],
-  data() {
-    return {
-      loading: false,
-      error: false,
-      showPassword: false,
-      user: {
-        name: "",
-        email: "",
-        password: "",
-        passwordConfirm: "",
-      },
-      options: {
-        isLoggingIn: true,
-      },
-    };
-  },
-  mounted() {
-    this.clear();
-  },
-  computed: {
-    token() {
-      return this.$route.params.token;
-    },
-  },
-  methods: {
-    clear() {
-      this.user = {
-        name: "",
-        email: "",
-        password: "",
-        passwordConfirm: "",
-      };
-    },
-    async signUp() {
-      this.loading = true;
-      this.error = false;
-
-      const userData = {
-        fullName: this.user.name,
-        username: this.user.username,
-        email: this.user.email,
-        group: "default",
-        password: this.user.password,
-        admin: false,
-      };
-
-      if (this.$refs.signUpForm.validate()) {
-        if (await api.signUps.createUser(this.token, userData)) {
-          this.$emit("user-created");
-          this.$router.push("/");
-        }
-      }
-
-      this.loading = false;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/MealPlan/ShoppingListDialog.vue b/frontend.old/src/components/MealPlan/ShoppingListDialog.vue
deleted file mode 100644
index d66d27219a89..000000000000
--- a/frontend.old/src/components/MealPlan/ShoppingListDialog.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-dialog v-model="dialog" width="650">
-      <v-card>
-        <v-card-title class="headline">
-          {{ $t("shopping-list.shopping-list") }}
-          <v-spacer></v-spacer>
-          <v-btn text color="accent" @click="group = !group">
-            {{ $t("meal-plan.group") }}
-          </v-btn>
-        </v-card-title>
-        <v-divider></v-divider>
-
-        <v-card-text v-if="group == false">
-          <v-list dense v-for="(recipe, index) in ingredients" :key="`${index}-recipe`">
-            <v-subheader>{{ recipe.name }} </v-subheader>
-            <v-divider></v-divider>
-
-            <v-list-item-group color="primary">
-              <v-list-item v-for="(item, i) in recipe.recipe_ingredient" :key="i">
-                <v-list-item-content>
-                  <v-list-item-title v-text="item"></v-list-item-title>
-                </v-list-item-content>
-              </v-list-item>
-            </v-list-item-group>
-          </v-list>
-        </v-card-text>
-
-        <v-card-text v-else>
-          <v-list dense>
-            <v-list-item-group color="primary">
-              <v-list-item v-for="(item, i) in rawIngredients" :key="i">
-                <v-list-item-content>
-                  <v-list-item-title v-text="item"></v-list-item-title>
-                </v-list-item-content>
-              </v-list-item>
-            </v-list-item-group>
-          </v-list>
-        </v-card-text>
-
-        <v-divider></v-divider>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-const levenshtein = require("fast-levenshtein");
-export default {
-  data() {
-    return {
-      dialog: false,
-      planID: 0,
-      ingredients: [],
-      rawIngredients: [],
-      group: false,
-    };
-  },
-  methods: {
-    openDialog: function(id) {
-      this.dialog = true;
-      this.planID = id;
-      this.getIngredients();
-    },
-    async getIngredients() {
-      this.ingredients = await api.mealPlans.shoppingList(this.planID);
-      this.getRawIngredients();
-    },
-    getRawIngredients() {
-      this.rawIngredients = [];
-      this.ingredients.forEach(element => {
-        this.rawIngredients.push(element.recipe_ingredient);
-      });
-
-      this.rawIngredients = this.rawIngredients.flat();
-      this.rawIngredients = this.levenshteinFilter(this.rawIngredients);
-    },
-    levenshteinFilter(source, maximum = 5) {
-      let _source, matches, x, y;
-      _source = source.slice();
-      matches = [];
-      for (x = _source.length - 1; x >= 0; x--) {
-        let output = _source.splice(x, 1);
-        for (y = _source.length - 1; y >= 0; y--) {
-          if (levenshtein.get(output[0], _source[y]) <= maximum) {
-            output.push(_source[y]);
-            _source.splice(y, 1);
-            x--;
-          }
-        }
-        matches.push(output);
-      }
-      return matches.flat();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/UI/Buttons/TheButton.vue b/frontend.old/src/components/UI/Buttons/TheButton.vue
deleted file mode 100644
index a3973429b90d..000000000000
--- a/frontend.old/src/components/UI/Buttons/TheButton.vue
+++ /dev/null
@@ -1,163 +0,0 @@
-<template>
-  <v-btn
-    :color="btnAttrs.color"
-    :small="small"
-    :x-small="xSmall"
-    :loading="loading"
-    :disabled="disabled"
-    @click="$emit('click')"
-    :outlined="btnStyle.outlined"
-    :text="btnStyle.text"
-  >
-    <v-icon left>
-      <slot name="icon">
-        {{ btnAttrs.icon }}
-      </slot>
-    </v-icon>
-    <slot>
-      {{ btnAttrs.text }}
-    </slot>
-  </v-btn>
-</template>
-
-<script>
-export default {
-  name: "TheButton",
-  props: {
-    // Types
-    cancel: {
-      type: Boolean,
-      default: false,
-    },
-    create: {
-      type: Boolean,
-      default: false,
-    },
-    update: {
-      type: Boolean,
-      default: false,
-    },
-    edit: {
-      type: Boolean,
-      default: false,
-    },
-    delete: {
-      type: Boolean,
-      default: false,
-    },
-    // Property
-    loading: {
-      type: Boolean,
-      default: false,
-    },
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    // Styles
-    small: {
-      type: Boolean,
-      default: false,
-    },
-    xSmall: {
-      type: Boolean,
-      default: false,
-    },
-    secondary: {
-      type: Boolean,
-      default: false,
-    },
-    minor: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      buttonOptions: {
-        create: {
-          text: this.$t("general.create"),
-          icon: this.$globals.icons.create,
-          color: "success",
-        },
-        update: {
-          text: this.$t("general.update"),
-          icon: this.$globals.icons.update,
-          color: "success",
-        },
-        save: {
-          text: this.$t("general.save"),
-          icon: this.$globals.icons.save,
-          color: "success",
-        },
-        edit: {
-          text: this.$t("general.edit"),
-          icon: this.$globals.icons.edit,
-          color: "info",
-        },
-        delete: {
-          text: this.$t("general.delete"),
-          icon: this.$globals.icons.delete,
-          color: "error",
-        },
-        cancel: {
-          text: this.$t("general.cancel"),
-          icon: this.$globals.icons.close,
-          color: "grey",
-        },
-      },
-      buttonStyles: {
-        defaults: {
-          text: false,
-          outlined: false,
-        },
-        secondary: {
-          text: false,
-          outlined: true,
-        },
-        minor: {
-          outlined: false,
-          text: true,
-        },
-      },
-    };
-  },
-  computed: {
-    btnAttrs() {
-      if (this.delete) {
-        return this.buttonOptions.delete;
-      } else if (this.update) {
-        return this.buttonOptions.update;
-      } else if (this.edit) {
-        return this.buttonOptions.edit;
-      } else if (this.cancel) {
-        this.setMinor();
-        return this.buttonOptions.cancel;
-      } else if (this.save) {
-        return this.buttonOptions.save;
-      }
-
-      return this.buttonOptions.create;
-    },
-    btnStyle() {
-      if (this.secondary) {
-        return this.buttonStyles.secondary;
-      } else if (this.minor) {
-        return this.buttonStyles.minor;
-      }
-      return this.buttonStyles.defaults;
-    },
-  },
-  methods: {
-    setMinor() {
-      this.buttonStyles.defaults = this.buttonStyles.minor;
-    },
-    setSecondary() {
-      this.buttonStyles.defaults = this.buttonStyles.secondary;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/components/UI/Buttons/TheCopyButton.vue b/frontend.old/src/components/UI/Buttons/TheCopyButton.vue
deleted file mode 100644
index adfa5a11ddd2..000000000000
--- a/frontend.old/src/components/UI/Buttons/TheCopyButton.vue
+++ /dev/null
@@ -1,71 +0,0 @@
-<template>
-  <v-tooltip
-    ref="copyToolTip"
-    v-model="show"
-    color="success lighten-1"
-    top
-    :open-on-hover="false"
-    :open-on-click="true"
-    close-delay="500"
-    transition="slide-y-transition"
-  >
-    <template v-slot:activator="{ on }">
-      <v-btn
-        icon
-        :color="color"
-        @click="
-          on.click;
-          textToClipboard();
-        "
-        @blur="on.blur"
-        retain-focus-on-click
-      >
-        <v-icon>{{ $globals.icons.contentCopy }}</v-icon>
-      </v-btn>
-    </template>
-    <span>
-      <v-icon left dark>
-        {{ $globals.icons.clipboardCheck }}
-      </v-icon>
-      <slot> {{ $t("general.copied") }}! </slot>
-    </span>
-  </v-tooltip>
-</template>
-
-<script>
-export default {
-  props: {
-    copyText: {
-      default: "Default Copy Text",
-    },
-    color: {
-      default: "primary",
-    },
-  },
-  data() {
-    return {
-      show: false,
-    };
-  },
-
-  methods: {
-    toggleBlur() {
-      this.$refs.copyToolTip.deactivate();
-    },
-    textToClipboard() {
-      this.show = true;
-      const copyText = this.copyText;
-      navigator.clipboard.writeText(copyText).then(
-        () => console.log("Copied", copyText),
-        () => console.log("Copied Failed", copyText)
-      );
-      setTimeout(() => {
-        this.toggleBlur();
-      }, 500);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/components/UI/Buttons/TheDownloadBtn.vue b/frontend.old/src/components/UI/Buttons/TheDownloadBtn.vue
deleted file mode 100644
index 02e7a21a30e8..000000000000
--- a/frontend.old/src/components/UI/Buttons/TheDownloadBtn.vue
+++ /dev/null
@@ -1,54 +0,0 @@
-<template>
-  <div>
-    <slot v-bind="{ downloading, downloadFile }">
-      <v-btn color="accent" text :loading="downloading" @click="downloadFile">
-        {{ showButtonText }}
-      </v-btn>
-    </slot>
-  </div>
-</template>
-
-<script>
-/**
- * The download button used for the entire site
- * pass a URL to the endpoint that will return a
- * file_token which will then be used to request the file
- * from the server and open that link in a new tab
- */
-import { apiReq } from "@/api/api-utils";
-export default {
-  props: {
-    /**
-     * URL to get token from
-     */
-    downloadUrl: {
-      default: "",
-    },
-    /**
-     * Override button text. Defaults to "Download"
-     */
-    buttonText: {
-      default: null,
-    },
-  },
-  data() {
-    return {
-      downloading: false,
-    };
-  },
-  computed: {
-    showButtonText() {
-      return this.buttonText || this.$t("general.download");
-    },
-  },
-  methods: {
-    async downloadFile() {
-      this.downloading = true;
-      await apiReq.download(this.downloadUrl);
-      this.downloading = false;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/components/UI/Buttons/TheUploadBtn.vue b/frontend.old/src/components/UI/Buttons/TheUploadBtn.vue
deleted file mode 100644
index 95b4a8ce5262..000000000000
--- a/frontend.old/src/components/UI/Buttons/TheUploadBtn.vue
+++ /dev/null
@@ -1,89 +0,0 @@
-<template>
-  <v-form ref="file">
-    <input ref="uploader" class="d-none" type="file" @change="onFileChanged" />
-    <slot v-bind="{ isSelecting, onButtonClick }">
-      <v-btn :loading="isSelecting" @click="onButtonClick" :small="small" color="accent" :text="textBtn">
-        <v-icon left> {{ effIcon }}</v-icon>
-        {{ text ? text : defaultText }}
-      </v-btn>
-    </slot>
-  </v-form>
-</template>
-
-<script>
-const UPLOAD_EVENT = "uploaded";
-import { api } from "@/api";
-export default {
-  props: {
-    small: {
-      default: false,
-    },
-    post: {
-      type: Boolean,
-      default: true,
-    },
-    url: String,
-    text: String,
-    icon: { default: null },
-    fileName: { default: "archive" },
-    textBtn: {
-      default: true,
-    },
-  },
-  data: () => ({
-    file: null,
-    isSelecting: false,
-  }),
-
-  computed: {
-    effIcon() {
-      return this.icon ? this.icon : this.$globals.icons.upload;
-    },
-    defaultText() {
-      return this.$t("general.upload");
-    },
-  },
-
-  methods: {
-    async upload() {
-      if (this.file != null) {
-        this.isSelecting = true;
-
-        if (!this.post) {
-          this.$emit(UPLOAD_EVENT, this.file);
-          this.isSelecting = false;
-          return;
-        }
-
-        let formData = new FormData();
-        formData.append(this.fileName, this.file);
-
-        const response = await api.utils.uploadFile(this.url, formData);
-
-        if (response) {
-          this.$emit(UPLOAD_EVENT, response);
-        }
-        this.isSelecting = false;
-      }
-    },
-    onButtonClick() {
-      this.isSelecting = true;
-      window.addEventListener(
-        "focus",
-        () => {
-          this.isSelecting = false;
-        },
-        { once: true }
-      );
-
-      this.$refs.uploader.click();
-    },
-    onFileChanged(e) {
-      this.file = e.target.files[0];
-      this.upload();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/UI/Dialogs/BackupDialog.vue b/frontend.old/src/components/UI/Dialogs/BackupDialog.vue
deleted file mode 100644
index d9edb45efc53..000000000000
--- a/frontend.old/src/components/UI/Dialogs/BackupDialog.vue
+++ /dev/null
@@ -1,146 +0,0 @@
-<template>
-  <div>
-    <BaseDialog
-      :title="$t('settings.backup.create-heading')"
-      :titleIcon="$globals.icons.database"
-      @submit="createBackup"
-      :submit-text="$t('general.create')"
-      :loading="loading"
-    >
-      <template v-slot:open="{ open }">
-        <v-btn @click="open" class="mx-2" small :color="color">
-          <v-icon left> {{ $globals.icons.create }} </v-icon> {{ $t("general.custom") }}
-        </v-btn>
-      </template>
-      <v-card-text class="mt-6">
-        <v-text-field dense :label="$t('settings.backup.backup-tag')" v-model="tag"></v-text-field>
-      </v-card-text>
-      <v-card-actions class="mt-n9 flex-wrap">
-        <v-switch v-model="fullBackup" :label="switchLabel"></v-switch>
-        <v-spacer></v-spacer>
-      </v-card-actions>
-      <v-expand-transition>
-        <div v-if="!fullBackup">
-          <v-card-text class="mt-n4">
-            <v-row>
-              <v-col sm="4">
-                <p>{{ $t("general.options") }}</p>
-                <ImportOptions @update-options="updateOptions" class="mt-5" />
-              </v-col>
-              <v-col>
-                <p>{{ $t("general.templates") }}</p>
-                <v-checkbox
-                  v-for="template in availableTemplates"
-                  :key="template"
-                  class="mb-n4 mt-n3"
-                  dense
-                  :label="template"
-                  @click="appendTemplate(template)"
-                ></v-checkbox>
-              </v-col>
-            </v-row>
-          </v-card-text>
-        </div>
-      </v-expand-transition>
-    </BaseDialog>
-  </div>
-</template>
-
-<script>
-import BaseDialog from "./BaseDialog";
-import ImportOptions from "@/components/FormHelpers/ImportOptions";
-import { api } from "@/api";
-export default {
-  props: {
-    color: { default: "primary" },
-  },
-  components: {
-    BaseDialog,
-    ImportOptions,
-  },
-  data() {
-    return {
-      tag: null,
-      fullBackup: true,
-      loading: false,
-      options: {
-        recipes: true,
-        settings: true,
-        themes: true,
-        pages: true,
-        users: true,
-        groups: true,
-      },
-      availableTemplates: [],
-      selectedTemplates: [],
-    };
-  },
-  computed: {
-    switchLabel() {
-      if (this.fullBackup) {
-        return this.$t("settings.backup.full-backup");
-      } else return this.$t("settings.backup.partial-backup");
-    },
-  },
-  created() {
-    this.resetData();
-    this.getAvailableBackups();
-  },
-  methods: {
-    resetData() {
-      this.tag = null;
-      this.fullBackup = true;
-      this.loading = false;
-      this.options = {
-        recipes: true,
-        settings: true,
-        themes: true,
-        pages: true,
-        users: true,
-        groups: true,
-        notifications: true,
-      };
-      this.availableTemplates = [];
-      this.selectedTemplates = [];
-    },
-    updateOptions(options) {
-      this.options = options;
-    },
-    async getAvailableBackups() {
-      const response = await api.backups.requestAvailable();
-      response.templates.forEach(element => {
-        this.availableTemplates.push(element);
-      });
-    },
-    async createBackup() {
-      this.loading = true;
-      const data = {
-        tag: this.tag,
-        options: {
-          recipes: this.options.recipes,
-          settings: this.options.settings,
-          pages: this.options.pages,
-          themes: this.options.themes,
-          users: this.options.users,
-          groups: this.options.groups,
-          notifications: this.options.notifications,
-        },
-        templates: this.selectedTemplates,
-      };
-
-      if (await api.backups.create(data)) {
-        this.$emit("created");
-      }
-      this.loading = false;
-    },
-    appendTemplate(templateName) {
-      if (this.selectedTemplates.includes(templateName)) {
-        let index = this.selectedTemplates.indexOf(templateName);
-        if (index !== -1) {
-          this.selectedTemplates.splice(index, 1);
-        }
-      } else this.selectedTemplates.push(templateName);
-    },
-  },
-};
-</script>
diff --git a/frontend.old/src/components/UI/Dialogs/ImportDialog.vue b/frontend.old/src/components/UI/Dialogs/ImportDialog.vue
deleted file mode 100644
index af7002f4cd3b..000000000000
--- a/frontend.old/src/components/UI/Dialogs/ImportDialog.vue
+++ /dev/null
@@ -1,119 +0,0 @@
-<template>
-  <div class="text-center">
-    <BaseDialog
-      :title="name"
-      :titleIcon="$globals.icons.database"
-      :submit-text="$t('general.import')"
-      :loading="loading"
-      ref="baseDialog"
-      @submit="raiseEvent"
-    >
-      <v-card-subtitle class="mb-n3 mt-3" v-if="date"> {{ $d(new Date(date), "medium") }} </v-card-subtitle>
-      <v-divider></v-divider>
-
-      <v-card-text>
-        <ImportOptions @update-options="updateOptions" class="mt-5 mb-2" />
-
-        <v-divider></v-divider>
-
-        <v-checkbox
-          dense
-          :label="$t('settings.remove-existing-entries-matching-imported-entries')"
-          v-model="forceImport"
-        ></v-checkbox>
-      </v-card-text>
-
-      <v-divider></v-divider>
-      <template v-slot:extra-buttons>
-        <TheDownloadBtn :download-url="downloadUrl">
-          <template v-slot:default="{ downloadFile }">
-            <v-btn class="mr-1" color="info" @click="downloadFile">
-              <v-icon left> {{ $globals.icons.download }}</v-icon>
-              {{ $t("general.download") }}
-            </v-btn>
-          </template>
-        </TheDownloadBtn>
-      </template>
-    </BaseDialog>
-  </div>
-</template>
-
-<script>
-const IMPORT_EVENT = "import";
-import { api } from "@/api";
-import BaseDialog from "./BaseDialog";
-import ImportOptions from "@/components/FormHelpers/ImportOptions";
-import TheDownloadBtn from "@/components/UI/Buttons/TheDownloadBtn.vue";
-import { API_ROUTES } from "@/api/apiRoutes";
-export default {
-  components: { ImportOptions, TheDownloadBtn, BaseDialog },
-  props: {
-    name: {
-      default: "Backup Name",
-    },
-    date: {
-      default: "Backup Date",
-    },
-  },
-  data() {
-    return {
-      loading: false,
-      options: {
-        recipes: true,
-        settings: true,
-        themes: true,
-        users: true,
-        groups: true,
-      },
-      dialog: false,
-      forceImport: false,
-      rebaseImport: false,
-      downloading: false,
-    };
-  },
-  computed: {
-    downloadUrl() {
-      return API_ROUTES.backupsFileNameDownload(this.name);
-    },
-  },
-  methods: {
-    updateOptions(options) {
-      this.options = options;
-    },
-    open() {
-      this.dialog = true;
-      this.$refs.baseDialog.open();
-    },
-    close() {
-      this.dialog = false;
-    },
-    async raiseEvent() {
-      const eventData = {
-        name: this.name,
-        force: this.forceImport,
-        rebase: this.rebaseImport,
-        recipes: this.options.recipes,
-        settings: this.options.settings,
-        themes: this.options.themes,
-        users: this.options.users,
-        groups: this.options.groups,
-        notifications: this.options.notifications,
-      };
-      this.loading = true;
-      const importData = await this.importBackup(eventData);
-
-      this.$emit(IMPORT_EVENT, importData);
-      this.loading = false;
-    },
-    async importBackup(data) {
-      this.loading = true;
-      const response = await api.backups.import(data.name, data);
-      if (response) {
-        return response.data;
-      }
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/components/UI/Dialogs/SearchDialog.vue b/frontend.old/src/components/UI/Dialogs/SearchDialog.vue
deleted file mode 100644
index c45dbf9ae276..000000000000
--- a/frontend.old/src/components/UI/Dialogs/SearchDialog.vue
+++ /dev/null
@@ -1,172 +0,0 @@
-<template>
-  <div>
-    <slot v-bind="{ open, close }"> </slot>
-    <v-dialog
-      v-model="dialog"
-      :width="isMobile ? undefined : '65%'"
-      :height="isMobile ? undefined : '0'"
-      :fullscreen="isMobile"
-      content-class="top-dialog"
-      :scrollable="false"
-    >
-      <v-app-bar sticky dark color="primary lighten-1" :rounded="!isMobile">
-        <FuseSearchBar :raw-data="allItems" @results="filterItems" :search="searchString">
-          <v-text-field
-            id="arrow-search"
-            autofocus
-            v-model="searchString"
-            solo
-            flat
-            autocomplete="off"
-            background-color="primary lighten-1"
-            color="white"
-            dense
-            :clearable="!isMobile"
-            class="mx-2 arrow-search"
-            hide-details
-            single-line
-            :placeholder="$t('search.search')"
-            :prepend-inner-icon="$globals.icons.search"
-          >
-          </v-text-field>
-        </FuseSearchBar>
-        <v-btn v-if="isMobile" x-small fab light @click="dialog = false">
-          <v-icon>
-            {{ $globals.icons.close }}
-          </v-icon>
-        </v-btn>
-      </v-app-bar>
-      <v-card class="mt-1 pa-1" relative>
-        <v-card-actions>
-          <div class="mr-auto">
-            {{ $t("search.results") }}
-          </div>
-          <router-link to="/search"> {{ $t("search.advanced-search") }} </router-link>
-        </v-card-actions>
-        <v-card-actions v-if="loading">
-          <SiteLoader :loading="loading" />
-        </v-card-actions>
-        <div v-else>
-          <MobileRecipeCard
-            v-for="(recipe, index) in results.slice(0, 10)"
-            :tabindex="index"
-            :key="index"
-            class="ma-1 arrow-nav"
-            :name="recipe.name"
-            :description="recipe.description"
-            :slug="recipe.slug"
-            :rating="recipe.rating"
-            :image="recipe.image"
-            :route="true"
-            v-on="$listeners.selected ? { selected: () => grabRecipe(recipe) } : {}"
-          />
-        </div>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import SiteLoader from "@/components/UI/SiteLoader";
-const SELECTED_EVENT = "selected";
-import FuseSearchBar from "@/components/UI/Search/FuseSearchBar";
-import MobileRecipeCard from "@/components/Recipe/MobileRecipeCard";
-export default {
-  components: {
-    FuseSearchBar,
-    MobileRecipeCard,
-    SiteLoader,
-  },
-  data() {
-    return {
-      loading: false,
-      selectedIndex: -1,
-      dialog: false,
-      searchString: "",
-      searchResults: [],
-    };
-  },
-  watch: {
-    $route() {
-      this.dialog = false;
-    },
-    async dialog(val) {
-      if (!val) {
-        this.resetSelected();
-      } else if (this.allItems.length <= 0) {
-        this.loading = true;
-        await this.$store.dispatch("requestAllRecipes");
-        this.loading = false;
-      }
-    },
-  },
-  mounted() {
-    document.addEventListener("keydown", this.onUpDown);
-  },
-  beforeDestroy() {
-    document.removeEventListener("keydown", this.onUpDown);
-  },
-
-  computed: {
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-    allItems() {
-      return this.$store.getters.getAllRecipes;
-    },
-    results() {
-      if (this.searchString != null && this.searchString.length >= 1) {
-        return this.searchResults;
-      }
-      return this.allItems;
-    },
-  },
-  methods: {
-    open() {
-      this.dialog = true;
-    },
-    close() {
-      this.dialog = false;
-    },
-    filterItems(val) {
-      this.searchResults = val.map(x => x.item);
-    },
-    grabRecipe(recipe) {
-      this.dialog = false;
-      this.$emit(SELECTED_EVENT, recipe);
-    },
-    onUpDown(e) {
-      if (e.keyCode === 38) {
-        e.preventDefault();
-        this.selectedIndex--;
-      } else if (e.keyCode === 40) {
-        e.preventDefault();
-        this.selectedIndex++;
-      } else {
-        return;
-      }
-      this.selectRecipe();
-    },
-    resetSelected() {
-      this.searchString = "";
-      this.selectedIndex = -1;
-      document.getElementsByClassName("arrow-nav")[0].focus();
-    },
-    selectRecipe() {
-      const recipeCards = document.getElementsByClassName("arrow-nav");
-      if (recipeCards) {
-        if (this.selectedIndex < 0) {
-          this.selectedIndex = -1;
-          document.getElementById("arrow-search").focus();
-          return;
-        }
-        this.selectedIndex >= recipeCards.length ? (this.selectedIndex = recipeCards.length - 1) : null;
-        recipeCards[this.selectedIndex].focus();
-      }
-    },
-  },
-};
-</script>
-
-<style >
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/components/UI/GlobalSnackbar.vue b/frontend.old/src/components/UI/GlobalSnackbar.vue
deleted file mode 100644
index 39b9cfab127c..000000000000
--- a/frontend.old/src/components/UI/GlobalSnackbar.vue
+++ /dev/null
@@ -1,46 +0,0 @@
-<template>
-  <div class="text-center ma-2">
-    <v-snackbar v-model="snackbar.open" top :color="snackbar.color" timeout="3500">
-      <v-icon dark left>
-        {{ icon }}
-      </v-icon>
-
-      {{ snackbar.title }}
-      {{ snackbar.text }}
-
-      <template v-slot:action="{ attrs }">
-        <v-btn text v-bind="attrs" @click="snackbar.open = false">
-          {{ $t("general.close") }}
-        </v-btn>
-      </template>
-    </v-snackbar>
-  </div>
-</template>
-
-<script>
-export default {
-  data: () => ({}),
-  computed: {
-    snackbar: {
-      set(val) {
-        this.$store.commit("setSnackbar", val);
-      },
-      get() {
-        return this.$store.getters.getSnackbar;
-      },
-    },
-    icon() {
-      switch (this.snackbar.color) {
-        case "error":
-          return this.$globals.icons.alert;
-        case "success":
-          return this.$globals.icons.checkboxMarkedCircle;
-        case "info":
-          return this.$globals.icons.information;
-        default:
-          return this.$globals.icons.bellAlert;
-      }
-    },
-  },
-};
-</script>
\ No newline at end of file
diff --git a/frontend.old/src/components/UI/LogCard.vue b/frontend.old/src/components/UI/LogCard.vue
deleted file mode 100644
index 9fbc9a906cda..000000000000
--- a/frontend.old/src/components/UI/LogCard.vue
+++ /dev/null
@@ -1,81 +0,0 @@
-<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="$t('about.log-lines')"
-          type="number"
-          :append-icon="$globals.icons.refreshCircle"
-          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> {{ $globals.icons.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>
\ No newline at end of file
diff --git a/frontend.old/src/components/UI/Search/FuseSearchBar.vue b/frontend.old/src/components/UI/Search/FuseSearchBar.vue
deleted file mode 100644
index fa109197e945..000000000000
--- a/frontend.old/src/components/UI/Search/FuseSearchBar.vue
+++ /dev/null
@@ -1,80 +0,0 @@
-<template>
-  <div>
-    <slot> </slot>
-  </div>
-</template>
-
-<script>
-const RESULTS_EVENT = "results";
-import Fuse from "fuse.js";
-
-export default {
-  props: {
-    search: {
-      default: "",
-    },
-    rawData: {
-      default: true,
-    },
-    /** Defaults to Show All Results  */
-    showAll: {
-      default: true,
-    },
-    keys: {
-      type: Array,
-      default: () => ["name"],
-    },
-    defaultOptions: {
-      default: () => ({
-        shouldSort: true,
-        threshold: 0.6,
-        location: 0,
-        distance: 100,
-        findAllMatches: true,
-        maxPatternLength: 32,
-        minMatchCharLength: 2,
-      }),
-    },
-  },
-  data() {
-    return {
-      results: [],
-      fuseResults: [],
-    };
-  },
-  computed: {
-    options() {
-      return { ...this.defaultOptions, ...{ keys: this.keys } };
-    },
-    autoResults() {
-      return this.fuseResults.length > 1 ? this.fuseResults : this.results;
-    },
-    fuse() {
-      return new Fuse(this.rawData, this.options);
-    },
-    isSearching() {
-      return this.search && this.search.length > 0;
-    },
-  },
-  watch: {
-    search() {
-      try {
-        this.results = this.fuse.search(this.search.trim());
-      } catch {
-        this.results = this.rawData.map(x => ({ item: x })).sort((a, b) => (a.name > b.name ? 1 : -1));
-      }
-      this.$emit(RESULTS_EVENT, this.results);
-
-      if (this.showResults === true) {
-        this.fuseResults = this.results;
-      }
-    },
-  },
-};
-</script>
-
-<style scoped>
-div {
-  width: 100%;
-}
-</style>
diff --git a/frontend.old/src/components/UI/Search/SearchBar.vue b/frontend.old/src/components/UI/Search/SearchBar.vue
deleted file mode 100644
index bf2b145aec01..000000000000
--- a/frontend.old/src/components/UI/Search/SearchBar.vue
+++ /dev/null
@@ -1,65 +0,0 @@
-<template>
-  <SearchDialog ref="searchDialog">
-    <template v-slot="{ open }">
-      <v-text-field
-        readonly
-        @click="open"
-        ref="searchInput"
-        class="my-auto mt-5 pt-1"
-        dense
-        light
-        dark
-        flat
-        :placeholder="$t('search.search-mealie')"
-        background-color="primary lighten-1"
-        color="white"
-        solo=""
-        :style="`max-width: 450;`"
-      >
-        <template #prepend-inner>
-          <v-icon color="grey lighten-3" size="29">
-            {{ $globals.icons.search }}
-          </v-icon>
-        </template>
-      </v-text-field>
-    </template>
-  </SearchDialog>
-</template>
-
-<script>
-import SearchDialog from "@/components/UI/Dialogs/SearchDialog";
-
-export default {
-  components: {
-    SearchDialog,
-  },
-
-  mounted() {
-    document.addEventListener("keydown", this.onDocumentKeydown);
-  },
-  beforeDestroy() {
-    document.removeEventListener("keydown", this.onDocumentKeydown);
-  },
-
-  methods: {
-    highlight(string) {
-      if (!this.search) {
-        return string;
-      }
-      return string.replace(new RegExp(this.search, "gi"), match => `<mark>${match}</mark>`);
-    },
-
-    onDocumentKeydown(e) {
-      if (
-        e.key === "/" &&
-        e.target !== this.$refs.searchInput.$refs.input &&
-        !document.activeElement.id.startsWith("input")
-      ) {
-        e.preventDefault();
-        this.$refs.searchDialog.open();
-      }
-    },
-  },
-};
-</script>
-
diff --git a/frontend.old/src/components/UI/Search/SearchDialog.vue b/frontend.old/src/components/UI/Search/SearchDialog.vue
deleted file mode 100644
index ea4a6f1918f8..000000000000
--- a/frontend.old/src/components/UI/Search/SearchDialog.vue
+++ /dev/null
@@ -1,103 +0,0 @@
-<template>
-  <div class="text-center ">
-    <v-dialog
-      v-model="dialog"
-      :width="isMobile ? undefined : '600'"
-      :height="isMobile ? undefined : '0'"
-      :fullscreen="isMobile"
-      content-class="top-dialog"
-    >
-      <v-card relative>
-        <v-app-bar dark color="primary lighten-1" rounded="0">
-          <SearchBar
-            ref="mealSearchBar"
-            @results="updateResults"
-            @selected="emitSelect"
-            :show-results="!isMobile"
-            :dense="false"
-            :nav-on-click="false"
-            :autofocus="true"
-          />
-        </v-app-bar>
-        <v-card-text v-if="isMobile">
-          <div v-for="recipe in searchResults.slice(0, 7)" :key="recipe.name">
-            <MobileRecipeCard
-              class="ma-1 px-0"
-              :name="recipe.item.name"
-              :description="recipe.item.description"
-              :slug="recipe.item.slug"
-              :rating="recipe.item.rating"
-              :image="recipe.item.image"
-              :route="true"
-              @selected="dialog = false"
-            />
-          </div>
-        </v-card-text>
-        <v-btn v-if="isMobile" fab bottom @click="dialog = false" class="ma-2">
-          <v-icon> {{ $globals.icons.close }} </v-icon>
-        </v-btn>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import SearchBar from "./SearchBar";
-import MobileRecipeCard from "@/components/Recipe/MobileRecipeCard";
-export default {
-  components: {
-    SearchBar,
-    MobileRecipeCard,
-  },
-  data() {
-    return {
-      searchResults: [],
-      dialog: false,
-    };
-  },
-  computed: {
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-  },
-  watch: {
-    "$route.hash"(newHash, oldHash) {
-      if (newHash === "#mobile-search") {
-        this.dialog = true;
-      } else if (oldHash === "#mobile-search") {
-        this.dialog = false;
-      }
-    },
-  },
-  methods: {
-    updateResults(results) {
-      this.searchResults = results;
-    },
-    emitSelect(slug, name) {
-      this.$emit("select", name, slug);
-      this.dialog = false;
-    },
-    open() {
-      this.dialog = true;
-    },
-    toggleDialog(open) {
-      if (open) {
-        this.$router.push("#search");
-      } else {
-        this.$router.back(); // 😎 back button click
-      }
-    },
-  },
-};
-</script>
-
-<style scope>
-.mobile-dialog {
-  align-items: flex-start;
-  justify-content: flex-start;
-}
-
-.top-dialog {
-  align-self: flex-start;
-}
-</style>
diff --git a/frontend.old/src/components/UI/StatCard.vue b/frontend.old/src/components/UI/StatCard.vue
deleted file mode 100644
index a9f11c9451f3..000000000000
--- a/frontend.old/src/components/UI/StatCard.vue
+++ /dev/null
@@ -1,103 +0,0 @@
-w<template>
-  <v-card v-bind="$attrs" :class="classes" class="v-card--material pa-3">
-    <div class="d-flex grow flex-wrap">
-      <slot name="avatar">
-        <v-sheet
-          :color="color"
-          :max-height="icon ? 90 : undefined"
-          :width="icon ? 'auto' : '100%'"
-          elevation="6"
-          class="text-start v-card--material__heading mb-n6 mt-n10 pa-7"
-          dark
-        >
-          <v-icon v-if="icon" size="40" v-text="icon" />
-          <div v-if="text" class="headline font-weight-thin" v-text="text" />
-        </v-sheet>
-      </slot>
-
-      <div v-if="$slots['after-heading']" class="ml-auto">
-        <slot name="after-heading" />
-      </div>
-    </div>
-
-    <slot />
-
-    <template v-if="$slots.actions">
-      <v-divider class="mt-2" />
-
-      <v-card-actions class="pb-0">
-        <slot name="actions" />
-      </v-card-actions>
-    </template>
-
-    <template v-if="$slots.bottom">
-      <v-divider class="mt-2" v-if="!$slots.actions" />
-
-      <div class="pb-0">
-        <slot name="bottom" />
-      </div>
-    </template>
-  </v-card>
-</template>
-
-<script>
-export default {
-  name: "MaterialCard",
-
-  props: {
-    avatar: {
-      type: String,
-      default: "",
-    },
-    color: {
-      type: String,
-      default: "primary",
-    },
-    icon: {
-      type: String,
-      default: undefined,
-    },
-    image: {
-      type: Boolean,
-      default: false,
-    },
-    text: {
-      type: String,
-      default: "",
-    },
-    title: {
-      type: String,
-      default: "",
-    },
-  },
-
-  computed: {
-    classes() {
-      return {
-        "v-card--material--has-heading": this.hasHeading,
-        "mt-3": this.$vuetify.breakpoint.name == "xs" || this.$vuetify.breakpoint.name == "sm"
-      };
-    },
-    hasHeading() {
-      return false;
-    },
-    hasAltHeading() {
-      return false;
-    },
-  },
-};
-</script>
-
-<style lang="sass">
-.v-card--material
-  &__avatar
-    position: relative
-    top: -64px
-    margin-bottom: -32px
-
-    &__heading
-      position: relative
-      top: -40px
-      transition: .3s ease
-      z-index: 1
-</style>
diff --git a/frontend.old/src/components/UI/TheAppBar.vue b/frontend.old/src/components/UI/TheAppBar.vue
deleted file mode 100644
index e54393d7301d..000000000000
--- a/frontend.old/src/components/UI/TheAppBar.vue
+++ /dev/null
@@ -1,102 +0,0 @@
-<template>
-  <div>
-    <TheSidebar ref="theSidebar" />
-    <v-app-bar clipped-left dense app color="primary" dark class="d-print-none" :bottom="isMobile">
-      <v-btn icon @click="openSidebar">
-        <v-icon> {{ $globals.icons.menu }}</v-icon>
-      </v-btn>
-      <router-link to="/">
-        <v-btn icon>
-          <v-icon size="40"> {{ $globals.icons.primary }} </v-icon>
-        </v-btn>
-      </router-link>
-
-      <div v-if="!isMobile" btn class="pl-2">
-        <v-toolbar-title style="cursor: pointer" @click="$router.push('/')">
-          Mealie
-        </v-toolbar-title>
-      </div>
-
-      <v-spacer></v-spacer>
-      <v-tooltip bottom>
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn icon class="mr-1" small v-bind="attrs" v-on="on" @click="isDark = !isDark">
-            <v-icon v-text="isDark ? $globals.icons.weatherSunny : $globals.icons.weatherNight"> </v-icon>
-          </v-btn>
-        </template>
-        <span>{{ isDark ? $t("settings.theme.switch-to-light-mode") : $t("settings.theme.switch-to-dark-mode") }}</span>
-      </v-tooltip>
-      <div v-if="!isMobile" style="width: 350px;">
-        <SearchBar :show-results="true" @selected="navigateFromSearch" :max-width="isMobile ? '100%' : '450px'" />
-      </div>
-      <div v-else>
-        <v-btn icon @click="$refs.recipeSearch.open()">
-          <v-icon> {{ $globals.icons.search }} </v-icon>
-        </v-btn>
-        <SearchDialog ref="recipeSearch" />
-      </div>
-
-      <TheSiteMenu />
-
-      <v-slide-x-reverse-transition>
-        <TheRecipeFab v-if="loggedIn && isMobile" />
-      </v-slide-x-reverse-transition>
-    </v-app-bar>
-    <v-slide-x-reverse-transition>
-      <TheRecipeFab v-if="loggedIn && !isMobile" :absolute="true" />
-    </v-slide-x-reverse-transition>
-  </div>
-</template>
-
-<script>
-import TheSiteMenu from "@/components/UI/TheSiteMenu";
-import SearchBar from "@/components/UI/Search/SearchBar";
-import SearchDialog from "@/components/UI/Dialogs/SearchDialog";
-import TheRecipeFab from "@/components/UI/TheRecipeFab";
-import TheSidebar from "@/components/UI/TheSidebar";
-import { user } from "@/mixins/user";
-export default {
-  name: "AppBar",
-
-  mixins: [user],
-  components: {
-    SearchDialog,
-    TheRecipeFab,
-    TheSidebar,
-    TheSiteMenu,
-    SearchBar,
-  },
-  data() {
-    return {
-      showSidebar: false,
-    };
-  },
-  computed: {
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-    isDark: {
-      get() {
-        return this.$store.getters.getIsDark;
-      },
-      set() {
-        let setVal = "dark";
-        if (this.isDark) {
-          setVal = "light";
-        }
-        this.$store.commit("setDarkMode", setVal);
-      },
-    },
-  },
-  methods: {
-    navigateFromSearch(slug) {
-      this.$router.push(`/recipe/${slug}`);
-    },
-    openSidebar() {
-      this.$refs.theSidebar.toggleSidebar();
-    },
-  },
-};
-</script>
-
-<style scoped></style>
diff --git a/frontend.old/src/components/UI/TheRecipeFab.vue b/frontend.old/src/components/UI/TheRecipeFab.vue
deleted file mode 100644
index 8136527ff534..000000000000
--- a/frontend.old/src/components/UI/TheRecipeFab.vue
+++ /dev/null
@@ -1,247 +0,0 @@
-<template>
-  <div class="text-center d-print-none">
-    <v-dialog v-model="addRecipe" width="650" @click:outside="reset">
-      <v-card :loading="processing">
-        <v-app-bar dark color="primary mb-2">
-          <v-icon large left v-if="!processing"> {{ $globals.icons.link }} </v-icon>
-          <v-progress-circular v-else indeterminate color="white" large class="mr-2"> </v-progress-circular>
-
-          <v-toolbar-title class="headline">
-            {{ $t("new-recipe.from-url") }}
-          </v-toolbar-title>
-
-          <v-spacer></v-spacer>
-        </v-app-bar>
-        <v-form ref="urlForm" @submit.prevent="createRecipe">
-          <v-card-text>
-            <v-text-field
-              v-model="recipeURL"
-              :label="$t('new-recipe.recipe-url')"
-              required
-              validate-on-blur
-              autofocus
-              class="mt-1"
-              :rules="[isValidWebUrl]"
-              :hint="$t('new-recipe.url-form-hint')"
-              persistent-hint
-            ></v-text-field>
-
-            <v-expand-transition>
-              <v-alert v-if="error" color="error" class="mt-6 white--text">
-                <v-card-title class="ma-0 pa-0">
-                  <v-icon left color="white" x-large> {{ $globals.icons.robot }} </v-icon>
-                  {{ $t("new-recipe.error-title") }}
-                </v-card-title>
-                <v-divider class="my-3 mx-2"></v-divider>
-
-                <p>
-                  {{ $t("new-recipe.error-details") }}
-                </p>
-                <div class="d-flex row justify-space-around my-3 force-white">
-                  <a
-                    class="dark"
-                    href="https://developers.google.com/search/docs/data-types/recipe"
-                    target="_blank"
-                    rel="noreferrer nofollow"
-                  >
-                    {{ $t("new-recipe.google-ld-json-info") }}
-                  </a>
-                  <a href="https://github.com/hay-kot/mealie/issues" target="_blank" rel="noreferrer nofollow">
-                    {{ $t("new-recipe.github-issues") }}
-                  </a>
-                  <a href="https://schema.org/Recipe" target="_blank" rel="noreferrer nofollow">
-                    {{ $t("new-recipe.recipe-markup-specification") }}
-                  </a>
-                </div>
-                <div class="d-flex justify-end">
-                  <v-btn
-                    white
-                    outlined
-                    :to="{ path: '/recipes/debugger', query: { test_url: recipeURL } }"
-                    @click="addRecipe = false"
-                  >
-                    <v-icon left> {{ $globals.icons.externalLink }} </v-icon>
-                    {{ $t("new-recipe.view-scraped-data") }}
-                  </v-btn>
-                </div>
-              </v-alert>
-            </v-expand-transition>
-          </v-card-text>
-
-          <v-divider></v-divider>
-
-          <v-card-actions>
-            <v-btn color="grey" text @click="reset">
-              <v-icon left> {{ $globals.icons.close }}</v-icon>
-              {{ $t("general.close") }}
-            </v-btn>
-            <v-spacer></v-spacer>
-            <v-btn color="success" type="submit" :loading="processing">
-              <v-icon left> {{ $globals.icons.create }} </v-icon>
-              {{ $t("general.submit") }}
-            </v-btn>
-          </v-card-actions>
-        </v-form>
-      </v-card>
-    </v-dialog>
-    <BaseDialog
-      :title="$t('new-recipe.upload-a-recipe')"
-      :titleIcon="$globals.icons.zip"
-      :submit-text="$t('general.import')"
-      ref="uploadZipDialog"
-      @submit="uploadZip"
-      :loading="processing"
-    >
-      <v-card-text class="mt-1 pb-0">
-        {{ $t("new-recipe.upload-individual-zip-file") }}
-
-        <div class="headline mx-auto mb-0 pb-0 text-center">
-          {{ this.fileName }}
-        </div>
-      </v-card-text>
-
-      <v-card-actions>
-        <AppButtonUpload class="mx-auto" :text-btn="false" @uploaded="setFile" :post="false"> </AppButtonUpload>
-      </v-card-actions>
-    </BaseDialog>
-    <v-speed-dial v-model="fab" :open-on-hover="absolute" :fixed="absolute" :bottom="absolute" :right="absolute">
-      <template v-slot:activator>
-        <v-btn v-model="fab" :color="absolute ? 'accent' : 'white'" dark :icon="!absolute" :fab="absolute">
-          <v-icon> {{ $globals.icons.createAlt }} </v-icon>
-        </v-btn>
-      </template>
-      <v-tooltip left dark color="primary">
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn fab dark small color="primary" v-bind="attrs" v-on="on" @click="addRecipe = true">
-            <v-icon>{{ $globals.icons.link }} </v-icon>
-          </v-btn>
-        </template>
-        <span>{{ $t("new-recipe.from-url") }}</span>
-      </v-tooltip>
-      <v-tooltip left dark color="accent">
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn fab dark small color="accent" v-bind="attrs" v-on="on" @click="$router.push('/new')">
-            <v-icon>{{ $globals.icons.edit }}</v-icon>
-          </v-btn>
-        </template>
-        <span>{{ $t("general.new") }}</span>
-      </v-tooltip>
-      <v-tooltip left dark color="info">
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn fab dark small color="info" v-bind="attrs" v-on="on" @click="openZipUploader">
-            <v-icon>{{ $globals.icons.zip }}</v-icon>
-          </v-btn>
-        </template>
-        <span>{{ $t("general.upload") }}</span>
-      </v-tooltip>
-    </v-speed-dial>
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-import AppButtonUpload from "@/components/UI/Buttons/AppButtonUpload.vue";
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog.vue";
-export default {
-  components: {
-    AppButtonUpload,
-    BaseDialog,
-  },
-  props: {
-    absolute: {
-      default: false,
-    },
-  },
-  data() {
-    return {
-      error: false,
-      fab: false,
-      addRecipe: false,
-      processing: false,
-      uploadData: {
-        fileName: "archive",
-        file: null,
-      },
-    };
-  },
-
-  mounted() {
-    if (this.$route.query.recipe_import_url) {
-      this.addRecipe = true;
-      this.createRecipe();
-    }
-  },
-
-  computed: {
-    recipeURL: {
-      set(recipe_import_url) {
-        this.$router.replace({ query: { ...this.$route.query, recipe_import_url } });
-      },
-      get() {
-        return this.$route.query.recipe_import_url || "";
-      },
-    },
-    fileName() {
-      return this.uploadData.file?.name || "";
-    },
-  },
-
-  methods: {
-    resetVars() {
-      this.uploadData = {
-        fileName: "archive",
-        file: null,
-      };
-    },
-    setFile(file) {
-      this.uploadData.file = file;
-      console.log("Uploaded");
-    },
-    openZipUploader() {
-      this.resetVars();
-      this.$refs.uploadZipDialog.open();
-    },
-    async uploadZip() {
-      let formData = new FormData();
-      formData.append(this.uploadData.fileName, this.uploadData.file);
-
-      const response = await api.utils.uploadFile("/api/recipes/create-from-zip", formData);
-
-      this.$router.push(`/recipe/${response.data.slug}`);
-    },
-    async createRecipe() {
-      this.error = false;
-      if (this.$refs.urlForm === undefined || this.$refs.urlForm.validate()) {
-        this.processing = true;
-        const response = await api.recipes.createByURL(this.recipeURL);
-        this.processing = false;
-        if (response) {
-          this.addRecipe = false;
-          this.recipeURL = "";
-          this.$router.push(`/recipe/${response.data}`);
-        } else {
-          this.error = true;
-        }
-      }
-    },
-    reset() {
-      this.fab = false;
-      this.error = false;
-      this.addRecipe = false;
-      this.recipeURL = "";
-      this.processing = false;
-    },
-    isValidWebUrl(url) {
-      let regEx =
-        /^https?:\/\/(?:www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,256}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)$/gm;
-      return regEx.test(url) ? true : this.$t("new-recipe.must-be-a-valid-url");
-    },
-  },
-};
-</script>
-
-<style>
-.force-white > a {
-  color: white !important;
-}
-</style>
diff --git a/frontend.old/src/components/UI/TheSidebar.vue b/frontend.old/src/components/UI/TheSidebar.vue
deleted file mode 100644
index 5d64acde2db6..000000000000
--- a/frontend.old/src/components/UI/TheSidebar.vue
+++ /dev/null
@@ -1,253 +0,0 @@
-<template>
-  <div class="d-print-none no-print">
-    <v-navigation-drawer v-model="showSidebar" width="180px" clipped app>
-      <template v-slot:prepend>
-        <UserAvatar v-if="isLoggedIn" :user="user" />
-
-        <v-list-item dense v-if="isLoggedIn" :to="`/user/${user.id}/favorites`">
-          <v-list-item-icon>
-            <v-icon> {{ $globals.icons.heart }} </v-icon>
-          </v-list-item-icon>
-          <v-list-item-content>
-            <v-list-item-title> {{ $t("general.favorites") }} </v-list-item-title>
-          </v-list-item-content>
-        </v-list-item>
-      </template>
-      <v-divider></v-divider>
-
-      <v-list nav dense>
-        <v-list-item v-for="nav in effectiveMenu" :key="nav.title" link :to="nav.to">
-          <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>
-      </v-list>
-
-      <!-- Version List Item -->
-      <v-list nav dense class="fixedBottom" v-if="!isMain">
-        <v-list-item href="https://github.com/sponsors/hay-kot" target="_target">
-          <v-list-item-icon>
-            <v-icon color="pink"> {{ $globals.icons.heart }} </v-icon>
-          </v-list-item-icon>
-          <v-list-item-title> {{ $t("about.support") }} </v-list-item-title>
-        </v-list-item>
-        <v-list-item to="/admin/about">
-          <v-list-item-icon class="mr-3 pt-1">
-            <v-icon :color="newVersionAvailable ? 'red--text' : ''"> {{ $globals.icons.information }} </v-icon>
-          </v-list-item-icon>
-          <v-list-item-content>
-            <v-list-item-title>
-              {{ $t("settings.current") }}
-              {{ appVersion }}
-            </v-list-item-title>
-            <v-list-item-subtitle>
-              <a
-                @click.prevent
-                href="https://github.com/hay-kot/mealie/releases/latest"
-                target="_blank"
-                :class="newVersionAvailable ? 'red--text' : 'green--text'"
-              >
-                {{ $t("settings.latest") }}
-                {{ latestVersion }}
-              </a>
-            </v-list-item-subtitle>
-          </v-list-item-content>
-        </v-list-item>
-      </v-list>
-    </v-navigation-drawer>
-  </div>
-</template>
-
-<script>
-import UserAvatar from "@/components/User/UserAvatar";
-import { initials } from "@/mixins/initials";
-import { user } from "@/mixins/user";
-import axios from "axios";
-export default {
-  components: {
-    UserAvatar,
-  },
-  mixins: [initials, user],
-  data() {
-    return {
-      showSidebar: false,
-      links: [],
-
-      latestVersion: null,
-      hideImage: false,
-    };
-  },
-  created() {
-    this.showSidebar = !this.isMobile;
-  },
-
-  watch: {
-    user() {
-      this.hideImage = false;
-    },
-    isMain(val) {
-      if (val) {
-        this.$store.dispatch("requestCustomPages");
-      } else {
-        this.getVersion();
-      }
-    },
-  },
-
-  computed: {
-    isMain() {
-      const testVal = this.$route.path.split("/");
-      if (testVal[1] === "recipe") this.closeSidebar();
-
-      return !(testVal[1] === "admin");
-    },
-    baseMainLinks() {
-      return [
-        {
-          icon: this.$globals.icons.home,
-          to: "/",
-          title: this.$t("sidebar.home-page"),
-        },
-        {
-          icon: this.$globals.icons.search,
-          to: "/search",
-          title: this.$t("sidebar.search"),
-        },
-        {
-          icon: this.$globals.icons.viewModule,
-          to: "/recipes/all",
-          title: this.$t("sidebar.all-recipes"),
-        },
-        {
-          icon: this.$globals.icons.tags,
-          to: "/recipes/category",
-          title: this.$t("sidebar.categories"),
-        },
-        {
-          icon: this.$globals.icons.tags,
-          to: "/recipes/tag",
-          title: this.$t("sidebar.tags"),
-        },
-      ];
-    },
-    customPages() {
-      const pages = this.$store.getters.getCustomPages;
-      if (pages.length > 0) {
-        pages.sort((a, b) => a.position - b.position);
-        return pages.map(x => ({
-          title: x.name,
-          to: `/pages/${x.slug}`,
-          icon: this.$globals.icons.pages,
-        }));
-      }
-      return [];
-    },
-    mainMenu() {
-      return [...this.baseMainLinks, ...this.customPages];
-    },
-    settingsLinks() {
-      return [
-        {
-          icon: this.$globals.icons.user,
-          to: "/admin/profile",
-          title: this.$t("sidebar.profile"),
-        },
-      ];
-    },
-    adminLinks() {
-      return [
-        {
-          icon: this.$globals.icons.viewDashboard,
-          to: "/admin/dashboard",
-          title: this.$t("sidebar.dashboard"),
-        },
-        {
-          icon: this.$globals.icons.cog,
-          to: "/admin/settings",
-          title: this.$t("sidebar.site-settings"),
-        },
-        {
-          icon: this.$globals.icons.tools,
-          to: "/admin/toolbox",
-          title: this.$t("sidebar.toolbox"),
-        },
-        {
-          icon: this.$globals.icons.group,
-          to: "/admin/manage-users",
-          title: this.$t("sidebar.manage-users"),
-        },
-        {
-          icon: this.$globals.icons.import,
-          to: "/admin/migrations",
-          title: this.$t("sidebar.migrations"),
-        },
-      ];
-    },
-    adminMenu() {
-      if (this.user.admin) {
-        return [...this.settingsLinks, ...this.adminLinks];
-      } else {
-        return this.settingsLinks;
-      }
-    },
-    effectiveMenu() {
-      return this.isMain ? this.mainMenu : this.adminMenu;
-    },
-    userProfileImage() {
-      this.resetImage();
-      return `api/users/${this.user.id}/image`;
-    },
-    newVersionAvailable() {
-      return this.latestVersion == this.appVersion ? false : true;
-    },
-    appVersion() {
-      const appInfo = this.$store.getters.getAppInfo;
-      return appInfo.version;
-    },
-    isLoggedIn() {
-      return this.$store.getters.getIsLoggedIn;
-    },
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-  },
-
-  methods: {
-    resetImage() {
-      this.hideImage == false;
-    },
-
-    toggleSidebar() {
-      this.showSidebar = !this.showSidebar;
-    },
-    closeSidebar() {
-      this.showSidebar = false;
-    },
-    async getVersion() {
-      let response = await axios.get("https://api.github.com/repos/hay-kot/mealie/releases/latest", {
-        headers: {
-          "content-type": "application/json",
-          Authorization: null,
-        },
-      });
-
-      this.latestVersion = response.data.tag_name;
-    },
-  },
-};
-</script>
-
-<style>
-.fixedBottom {
-  position: fixed !important;
-  bottom: 0 !important;
-  width: 100%;
-}
-
-@media print {
-  .no-print {
-    display: none;
-  }
-}
-</style>
diff --git a/frontend.old/src/components/UI/TheSiteMenu.vue b/frontend.old/src/components/UI/TheSiteMenu.vue
deleted file mode 100644
index b9de04a1086b..000000000000
--- a/frontend.old/src/components/UI/TheSiteMenu.vue
+++ /dev/null
@@ -1,109 +0,0 @@
-<template>
-  <div class="text-center">
-    <LoginDialog ref="loginDialog" />
-    <v-menu transition="slide-x-transition" bottom right offset-y offset-overflow open-on-hover close-delay="200">
-      <template v-slot:activator="{ on, attrs }">
-        <v-btn v-bind="attrs" v-on="on" icon>
-          <v-icon>{{ $globals.icons.user }}</v-icon>
-        </v-btn>
-      </template>
-
-      <v-list>
-        <v-list-item
-          v-for="(item, i) in filteredItems"
-          :key="i"
-          link
-          :to="item.nav ? item.nav : null"
-          @click="item.login ? openLoginDialog() : null"
-        >
-          <v-list-item-icon>
-            <v-icon>{{ item.icon }}</v-icon>
-          </v-list-item-icon>
-          <v-list-item-content>
-            <v-list-item-title>
-              {{ item.title }}
-            </v-list-item-title>
-          </v-list-item-content>
-        </v-list-item>
-      </v-list>
-    </v-menu>
-  </div>
-</template>
-
-<script>
-import LoginDialog from "../Login/LoginDialog";
-export default {
-  components: {
-    LoginDialog,
-  },
-  computed: {
-    items() {
-      return [
-        {
-          icon: this.$globals.icons.user,
-          title: this.$t("user.login"),
-          restricted: false,
-          login: true,
-        },
-        {
-          icon: this.$globals.icons.calendarWeek,
-          title: this.$t("meal-plan.dinner-this-week"),
-          nav: "/meal-plan/this-week",
-          restricted: true,
-        },
-        {
-          icon: this.$globals.icons.calendarToday,
-          title: this.$t("meal-plan.dinner-today"),
-          nav: "/meal-plan/today",
-          restricted: true,
-        },
-        {
-          icon: this.$globals.icons.calendarMultiselect,
-          title: this.$t("meal-plan.planner"),
-          nav: "/meal-plan/planner",
-          restricted: true,
-        },
-        {
-          icon: this.$globals.icons.formatListCheck,
-          title: this.$t("shopping-list.shopping-lists"),
-          nav: "/shopping-list",
-          restricted: true,
-        },
-        {
-          icon: this.$globals.icons.logout,
-          title: this.$t("user.logout"),
-          restricted: true,
-          nav: "/logout",
-        },
-        {
-          icon: this.$globals.icons.cog,
-          title: this.$t("general.settings"),
-          nav: "/admin",
-          restricted: true,
-        },
-      ];
-    },
-    filteredItems() {
-      if (this.loggedIn) {
-        return this.items.filter(x => x.restricted == true);
-      } else {
-        return this.items.filter(x => x.restricted == false);
-      }
-    },
-    loggedIn() {
-      return this.$store.getters.getIsLoggedIn;
-    },
-  },
-
-  methods: {
-    openLoginDialog() {
-      this.$refs.loginDialog.open();
-    },
-  },
-};
-</script>
-<style>
-.menu-text {
-  text-align: left !important;
-}
-</style>
diff --git a/frontend.old/src/i18n.js b/frontend.old/src/i18n.js
deleted file mode 100644
index 7433c36a8b24..000000000000
--- a/frontend.old/src/i18n.js
+++ /dev/null
@@ -1,38 +0,0 @@
-import Vue from "vue";
-import VueI18n from "vue-i18n";
-import Vuetify from "@/plugins/vuetify";
-import axios from 'axios';
-
-Vue.use(VueI18n);
-
-const i18n = new VueI18n();
-
-export default i18n;
-
-const loadedLanguages = [];
-
-function setI18nLanguage (lang) {
-  i18n.locale = lang;
-  Vuetify.framework.lang.current = lang;
-  axios.defaults.headers.common['Accept-Language'] = lang
-  document.querySelector('html').setAttribute('lang', lang)
-  return lang
-}
-
-export function loadLanguageAsync(lang) {
-
-  if ( ! loadedLanguages.includes(lang)) {
-    const messages = import(`./locales/messages/${lang}.json`);
-    const dateTimeFormats = import(`./locales/dateTimeFormats/${lang}.json`);
-    
-    return Promise.all([messages, dateTimeFormats]).then(
-      values  => {
-        i18n.setLocaleMessage(lang, values[0].default)
-        i18n.setDateTimeFormat(lang, values[1].default)
-        loadedLanguages.push(lang)
-        return setI18nLanguage(lang)
-      }
-    )
-  }
-  return Promise.resolve(setI18nLanguage(lang))
-}
\ No newline at end of file
diff --git a/frontend.old/src/installCompAPI.js b/frontend.old/src/installCompAPI.js
deleted file mode 100644
index c1a45139dba5..000000000000
--- a/frontend.old/src/installCompAPI.js
+++ /dev/null
@@ -1,3 +0,0 @@
-import Vue from "vue";
-import VueCompositionAPI from "@vue/composition-api";
-Vue.use(VueCompositionAPI);
diff --git a/frontend.old/src/main.js b/frontend.old/src/main.js
deleted file mode 100644
index d7ad28f64372..000000000000
--- a/frontend.old/src/main.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import "./installCompAPI"; // Must Be First
-
-import Vue from "vue";
-import App from "./App.vue";
-import vuetify from "./plugins/vuetify";
-import store from "./store";
-import VueRouter from "vue-router";
-import { router } from "./routes";
-import { globals } from "@/utils/globals";
-import i18n from "./i18n";
-import "typeface-roboto/index.css";
-import "./registerServiceWorker";
-
-Vue.config.productionTip = false;
-Vue.use(VueRouter);
-Vue.component("TheButton", () => import("@/components/UI/Buttons/TheButton.vue"));
-
-Vue.prototype.$globals = globals;
-
-const vueApp = new Vue({
-  vuetify,
-  store,
-  router,
-  i18n,
-  render: h => h(App),
-}).$mount("#app");
-
-// Truncate
-const truncate = function(text, length, clamp) {
-  clamp = clamp || "...";
-  let node = document.createElement("div");
-  node.innerHTML = text;
-  let content = node.textContent;
-  return content.length > length ? content.slice(0, length) + clamp : content;
-};
-
-const titleCase = function(value) {
-  return value.replace(/(?:^|\s|-)\S/g, x => x.toUpperCase());
-};
-
-Vue.filter("truncate", truncate);
-Vue.filter("titleCase", titleCase);
-
-export { router, vueApp };
diff --git a/frontend.old/src/mixins/initials.js b/frontend.old/src/mixins/initials.js
deleted file mode 100644
index 60448d1be521..000000000000
--- a/frontend.old/src/mixins/initials.js
+++ /dev/null
@@ -1,18 +0,0 @@
-export const initials = {
-  computed: {
-    initials() {
-      if (!this.user.fullName) return "00"
-      const allNames = this.user.fullName.trim().split(" ");
-      const initials = allNames.reduce(
-        (acc, curr, index) => {
-          if (index === 0 || index === allNames.length - 1) {
-            acc = `${acc}${curr.charAt(0).toUpperCase()}`;
-          }
-          return acc;
-        },
-        [""]
-      );
-      return initials;
-    },
-  },
-};
diff --git a/frontend.old/src/mixins/user.js b/frontend.old/src/mixins/user.js
deleted file mode 100644
index 2d500bea42d9..000000000000
--- a/frontend.old/src/mixins/user.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import { store } from "@/store";
-export const user = {
-  computed: {
-    user() {
-      return store.getters.getUserData;
-    },
-    loggedIn() {
-      return store.getters.getIsLoggedIn;
-    },
-    initials() {
-      const allNames = this.user.fullName.trim().split(" ");
-      const initials = allNames.reduce(
-        (acc, curr, index) => {
-          if (index === 0 || index === allNames.length - 1) {
-            acc = `${acc}${curr.charAt(0).toUpperCase()}`;
-          }
-          return acc;
-        },
-        [""]
-      );
-      return initials;
-    },
-  },
-};
diff --git a/frontend.old/src/mixins/utilMixins.js b/frontend.old/src/mixins/utilMixins.js
deleted file mode 100644
index 2b9bf8504264..000000000000
--- a/frontend.old/src/mixins/utilMixins.js
+++ /dev/null
@@ -1,7 +0,0 @@
-export const utilMixins = {
-  commputed: {
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-  },
-};
diff --git a/frontend.old/src/mixins/validators.js b/frontend.old/src/mixins/validators.js
deleted file mode 100644
index ba795b3effc8..000000000000
--- a/frontend.old/src/mixins/validators.js
+++ /dev/null
@@ -1,15 +0,0 @@
-const EMAIL_REGEX = /^(([^<>()[\]\\.,;:\s@"]+(\.[^<>()[\]\\.,;:\s@"]+)*)|(".+"))@(([[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
-
-export const validators = {
-  data() {
-    return {
-      emailRule: v => !v || EMAIL_REGEX.test(v) || this.$t("user.e-mail-must-be-valid"),
-
-      existsRule: value => !!value || this.$t("general.field-required"),
-
-      minRule: v => v.length >= 8 || this.$t("user.use-8-characters-or-more-for-your-password"),
-
-      whiteSpace: v => !v || v.split(" ").length <= 1 || this.$t("recipe.no-white-space-allowed"),
-    };
-  },
-};
diff --git a/frontend.old/src/pages/404Page.vue b/frontend.old/src/pages/404Page.vue
deleted file mode 100644
index e98fab51ceee..000000000000
--- a/frontend.old/src/pages/404Page.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template>
-  <v-container class="text-center">
-    <The404 />
-  </v-container>
-</template>
-
-<script>
-import The404 from "@/components/Fallbacks/The404";
-export default {
-  components: { The404 },
-};
-</script>
-
diff --git a/frontend.old/src/pages/Admin/About/index.vue b/frontend.old/src/pages/Admin/About/index.vue
deleted file mode 100644
index fae2ee76d1db..000000000000
--- a/frontend.old/src/pages/Admin/About/index.vue
+++ /dev/null
@@ -1,130 +0,0 @@
-<template>
-  <div>
-    <v-app-bar color="primary">
-      <v-spacer></v-spacer>
-      <v-btn href="https://github.com/sponsors/hay-kot" target="_blank" class="mx-1" color="secondary">
-        <v-icon left>
-          {{ $globals.icons.heart }}
-        </v-icon>
-        {{ $t("about.support") }}
-      </v-btn>
-      <v-btn href="https://github.com/hay-kot" target="_blank" class="mx-1" color="secondary">
-        <v-icon left>
-          {{ $globals.icons.github }}
-        </v-icon>
-        {{ $t("about.github") }}
-      </v-btn>
-      <v-btn href="https://hay-kot.dev" target="_blank" class="mx-1" color="secondary">
-        <v-icon left>
-          {{ $globals.icons.account }}
-        </v-icon>
-        {{ $t("about.portfolio") }}
-      </v-btn>
-      <v-btn href="https://hay-kot.github.io/mealie/" target="_blank" class="mx-1" color="secondary">
-        <v-icon left>
-          {{ $globals.icons.folderOutline }}
-        </v-icon>
-        {{ $t("about.docs") }}
-      </v-btn>
-      <v-spacer></v-spacer>
-    </v-app-bar>
-    <v-card class="mt-3">
-      <v-card-title class="headline">
-        {{ $t("about.about-mealie") }}
-      </v-card-title>
-      <v-divider></v-divider>
-      <v-card-text>
-        <v-list-item-group color="primary">
-          <v-list-item v-for="property in prettyInfo" :key="property.name">
-            <v-list-item-icon>
-              <v-icon> {{ property.icon || $globals.icons.user }} </v-icon>
-            </v-list-item-icon>
-            <v-list-item-content>
-              <v-list-item-title class="pl-4 flex row justify-space-between">
-                <div>{{ property.name }}</div>
-                <div>{{ property.value }}</div>
-              </v-list-item-title>
-            </v-list-item-content>
-          </v-list-item>
-        </v-list-item-group>
-      </v-card-text>
-      <v-card-actions>
-        <v-spacer></v-spacer>
-        <TheDownloadBtn download-url="/api/debug/last-recipe-json">
-          <template v-slot:default="{ downloadFile }">
-            <v-btn color="primary" @click="downloadFile">
-              <v-icon left> {{ $globals.icons.codeBraces }} </v-icon> {{ $t("about.download-recipe-json") }}
-            </v-btn>
-          </template>
-        </TheDownloadBtn>
-      </v-card-actions>
-      <v-divider></v-divider>
-    </v-card>
-    <LogCard />
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-import TheDownloadBtn from "@/components/UI/Buttons/TheDownloadBtn";
-import LogCard from "@/components/UI/LogCard.vue";
-export default {
-  components: { TheDownloadBtn, LogCard },
-  data() {
-    return {
-      prettyInfo: [],
-    };
-  },
-  async created() {
-    await this.getInfo();
-  },
-  methods: {
-    async getInfo() {
-      const debugInfo = await api.meta.getDebugInfo();
-
-      this.prettyInfo = [
-        {
-          name: this.$t("about.version"),
-          icon: this.$globals.icons.information,
-          value: debugInfo.version,
-        },
-        {
-          name: this.$t("about.application-mode"),
-          icon: this.$globals.icons.devTo,
-          value: debugInfo.production ? this.$t("about.production") : this.$t("about.development"),
-        },
-        {
-          name: this.$t("about.demo-status"),
-          icon: this.$globals.icons.testTube,
-          value: debugInfo.demoStatus ? this.$t("about.demo") : this.$t("about.not-demo"),
-        },
-        {
-          name: this.$t("about.api-port"),
-          icon: this.$globals.icons.api,
-          value: debugInfo.apiPort,
-        },
-        {
-          name: this.$t("about.api-docs"),
-          icon: this.$globals.icons.file,
-          value: debugInfo.apiDocs ? this.$t("general.enabled") : this.$t("general.disabled"),
-        },
-        {
-          name: this.$t("about.database-type"),
-          icon: this.$globals.icons.database,
-          value: debugInfo.dbType,
-        },
-        {
-          name: this.$t("about.database-url"),
-          icon: this.$globals.icons.database,
-          value: debugInfo.dbUrl,
-        },
-        {
-          name: this.$t("about.default-group"),
-          icon: this.$globals.icons.group,
-          value: debugInfo.defaultGroup,
-        },
-      ];
-    },
-  },
-};
-</script>
diff --git a/frontend.old/src/pages/Admin/Dashboard/BackupViewer.vue b/frontend.old/src/pages/Admin/Dashboard/BackupViewer.vue
deleted file mode 100644
index e65d29622457..000000000000
--- a/frontend.old/src/pages/Admin/Dashboard/BackupViewer.vue
+++ /dev/null
@@ -1,162 +0,0 @@
-<template>
-  <div>
-    <ImportSummaryDialog ref="report" />
-    <ImportDialog
-      :name="selectedName"
-      :date="selectedDate"
-      ref="import_dialog"
-      @import="importBackup"
-      @delete="deleteBackup"
-    />
-    <ConfirmationDialog
-      :title="$t('settings.backup.delete-backup')"
-      :message="$t('general.confirm-delete-generic')"
-      color="error"
-      :icon="$globals.icons.alertCircle"
-      ref="deleteBackupConfirm"
-      v-on:confirm="emitDelete()"
-    />
-    <StatCard :icon="$globals.icons.backupRestore" :color="color">
-      <template v-slot:after-heading>
-        <div class="ml-auto text-right">
-          <h2 class="body-3 grey--text font-weight-light">
-            {{ $t("settings.backup-and-exports") }}
-          </h2>
-
-          <h3 class="display-2 font-weight-light text--primary">
-            <small> {{ total }}</small>
-          </h3>
-        </div>
-      </template>
-      <div class="d-flex row py-3 justify-end">
-        <AppButtonUpload url="/api/backups/upload" @uploaded="getAvailableBackups">
-          <template v-slot="{ isSelecting, onButtonClick }">
-            <v-btn :loading="isSelecting" class="mx-2" small color="info" @click="onButtonClick">
-              <v-icon left> {{ $globals.icons.upload }} </v-icon> {{ $t("general.upload") }}
-            </v-btn>
-          </template>
-        </AppButtonUpload>
-        <BackupDialog :color="color" />
-
-        <v-btn :loading="loading" class="mx-2" small color="success" @click="createBackup">
-          <v-icon left> {{ $globals.icons.create }} </v-icon> {{ $t("general.create") }}
-        </v-btn>
-      </div>
-      <template v-slot:bottom>
-        <v-virtual-scroll height="290" item-height="70" :items="availableBackups">
-          <template v-slot:default="{ item }">
-            <v-list-item @click.prevent="openDialog(item, btnEvent.IMPORT_EVENT)">
-              <v-list-item-avatar>
-                <v-icon large dark :color="color">
-                  {{ $globals.icons.database }}
-                </v-icon>
-              </v-list-item-avatar>
-
-              <v-list-item-content>
-                <v-list-item-title v-text="item.name"></v-list-item-title>
-
-                <v-list-item-subtitle>
-                  {{ $d(Date.parse(item.date), "medium") }}
-                </v-list-item-subtitle>
-              </v-list-item-content>
-
-              <v-list-item-action class="ml-auto">
-                <v-btn large icon @click.stop="openDialog(item, btnEvent.DELETE_EVENT)">
-                  <v-icon color="error">{{ $globals.icons.delete }}</v-icon>
-                </v-btn>
-              </v-list-item-action>
-            </v-list-item>
-          </template>
-        </v-virtual-scroll>
-      </template>
-    </StatCard>
-  </div>
-</template>
-
-<script>
-import AppButtonUpload from "@/components/UI/Buttons/AppButtonUpload";
-import ImportSummaryDialog from "@/components/ImportSummaryDialog";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog";
-import { api } from "@/api";
-import StatCard from "@/components/UI/StatCard";
-import BackupDialog from "@/components/UI/Dialogs/BackupDialog";
-import ImportDialog from "@/components/UI/Dialogs/ImportDialog";
-const IMPORT_EVENT = "import";
-const DELETE_EVENT = "delete";
-
-export default {
-  components: { StatCard, ImportDialog, AppButtonUpload, ImportSummaryDialog, BackupDialog, ConfirmationDialog },
-  data() {
-    return {
-      color: "accent",
-      selectedName: "",
-      selectedDate: "",
-      loading: false,
-      events: [],
-      availableBackups: [],
-      btnEvent: { IMPORT_EVENT, DELETE_EVENT },
-    };
-  },
-  computed: {
-    total() {
-      return this.availableBackups.length;
-    },
-  },
-  created() {
-    this.getAvailableBackups();
-  },
-  methods: {
-    async getAvailableBackups() {
-      const response = await api.backups.requestAvailable();
-      this.availableBackups = response.imports;
-    },
-
-    async deleteBackup(name) {
-      this.loading = true;
-      await api.backups.delete(name);
-      this.loading = false;
-      this.getAvailableBackups();
-    },
-
-    openDialog(backup, event) {
-      this.selectedDate = backup.date;
-      this.selectedName = backup.name;
-
-      switch (event) {
-        case IMPORT_EVENT:
-          this.$refs.import_dialog.open();
-          break;
-        case DELETE_EVENT:
-          this.$refs.deleteBackupConfirm.open();
-          break;
-      }
-    },
-
-    async importBackup(data) {
-      this.$refs.report.open(data);
-    },
-
-    async createBackup() {
-      this.loading = true;
-
-      let data = {
-        tag: this.tag,
-        options: {},
-        templates: [],
-      };
-
-      if (await api.backups.create(data)) {
-        this.getAvailableBackups();
-      }
-      this.loading = false;
-    },
-
-    emitDelete() {
-      this.deleteBackup(this.selectedName);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/Admin/Dashboard/EventViewer.vue b/frontend.old/src/pages/Admin/Dashboard/EventViewer.vue
deleted file mode 100644
index 5dcd44ec397b..000000000000
--- a/frontend.old/src/pages/Admin/Dashboard/EventViewer.vue
+++ /dev/null
@@ -1,135 +0,0 @@
-<template>
-  <div>
-    <ConfirmationDialog
-      :title="$t('events.delete-event')"
-      :message="$t('general.confirm-delete-generic')"
-      color="error"
-      :icon="$globals.icons.alertCircle"
-      ref="deleteEventConfirm"
-      v-on:confirm="emitDelete()"
-    />
-    <StatCard :icon="$globals.icons.bellAlert" :color="color">
-      <template v-slot:after-heading>
-        <div class="ml-auto text-right">
-          <h2 class="body-3 grey--text font-weight-light">
-            {{ $t("settings.events") }}
-          </h2>
-
-          <h3 class="display-2 font-weight-light text--primary">
-            <small> {{ total }} </small>
-          </h3>
-        </div>
-      </template>
-      <div class="d-flex row py-3 justify-end">
-        <v-btn class="mx-2" small color="error lighten-1" @click="deleteAll">
-          <v-icon left> {{ $globals.icons.notificationClearAll }} </v-icon> {{ $t("general.clear") }}
-        </v-btn>
-      </div>
-      <template v-slot:bottom>
-        <v-virtual-scroll height="290" item-height="70" :items="events">
-          <template v-slot:default="{ item }">
-            <v-list-item>
-              <v-list-item-avatar>
-                <v-icon large dark :color="icons[item.category].color">
-                  {{ icons[item.category].icon }}
-                </v-icon>
-              </v-list-item-avatar>
-
-              <v-list-item-content>
-                <v-list-item-title v-text="item.title"></v-list-item-title>
-
-                <v-list-item-subtitle v-text="item.text"></v-list-item-subtitle>
-                <v-list-item-subtitle>
-                  {{ $d(Date.parse(item.timeStamp), "long") }}
-                </v-list-item-subtitle>
-              </v-list-item-content>
-
-              <v-list-item-action class="ml-auto">
-                <v-btn large icon @click="openDialog(item)">
-                  <v-icon color="error">{{ $globals.icons.delete }}</v-icon>
-                </v-btn>
-              </v-list-item-action>
-            </v-list-item>
-          </template>
-        </v-virtual-scroll>
-      </template>
-    </StatCard>
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-import StatCard from "@/components/UI/StatCard";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog";
-export default {
-  components: { StatCard, ConfirmationDialog },
-  data() {
-    return {
-      color: "accent",
-      total: 0,
-      selectedId: "",
-      events: [],
-      icons: {
-        general: {
-          icon: this.$globals.icons.information,
-          color: "info",
-        },
-        recipe: {
-          icon: this.$globals.icons.primary,
-          color: "primary",
-        },
-        backup: {
-          icon: this.$globals.icons.database,
-          color: "primary",
-        },
-        schedule: {
-          icon: this.$globals.icons.calendar,
-          color: "primary",
-        },
-        migration: {
-          icon: this.$globals.icons.backupRestore,
-          color: "primary",
-        },
-        user: {
-          icon: this.$globals.icons.user,
-          color: "accent",
-        },
-        group: {
-          icon: this.$globals.icons.group,
-          color: "accent",
-        },
-      },
-    };
-  },
-  mounted() {
-    this.getEvents();
-  },
-  methods: {
-    async getEvents() {
-      const events = await api.about.getEvents();
-      this.events = events.events;
-      this.total = events.total;
-    },
-    async deleteEvent(id) {
-      await api.about.deleteEvent(id);
-      this.getEvents();
-    },
-    async deleteAll() {
-      await api.about.deleteAllEvents();
-      this.getEvents();
-    },
-
-    openDialog(events) {
-      this.selectedId = events.id;
-      this.$refs.deleteEventConfirm.open();
-    },
-
-    emitDelete() {
-      this.deleteEvent(this.selectedId);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/Admin/Dashboard/index.vue b/frontend.old/src/pages/Admin/Dashboard/index.vue
deleted file mode 100644
index f217e700551c..000000000000
--- a/frontend.old/src/pages/Admin/Dashboard/index.vue
+++ /dev/null
@@ -1,126 +0,0 @@
-<template>
-  <div class="mt-10">
-    <v-row>
-      <v-col cols="12" sm="12" md="4">
-        <StatCard :icon="$globals.icons.primary">
-          <template v-slot:after-heading>
-            <div class="ml-auto text-right">
-              <h2 class="body-3 grey--text font-weight-light">
-                {{ $t("general.recipes") }}
-              </h2>
-
-              <h3 class="display-2 font-weight-light text--primary">
-                <small> {{ statistics.totalRecipes }}</small>
-              </h3>
-            </div>
-          </template>
-          <template v-slot:actions>
-            <div class="d-flex row py-3 justify-space-around">
-              <v-btn small color="primary" :to="{ path: '/admin/toolbox/', query: { tab: 'organize', filter: 'tag' } }">
-                <v-icon left> {{ $globals.icons.tags }} </v-icon>
-                {{ $tc("tag.untagged-count", [statistics.untaggedRecipes]) }}
-              </v-btn>
-              <v-btn
-                small
-                color="primary"
-                :to="{ path: '/admin/toolbox/', query: { tab: 'organize', filter: 'category' } }"
-              >
-                <v-icon left> {{ $globals.icons.tags }} </v-icon>
-                {{ $tc("category.uncategorized-count", [statistics.uncategorizedRecipes]) }}
-              </v-btn>
-            </div>
-          </template>
-        </StatCard>
-      </v-col>
-      <v-col cols="12" sm="12" md="4">
-        <StatCard :icon="$globals.icons.user">
-          <template v-slot:after-heading>
-            <div class="ml-auto text-right">
-              <h2 class="body-3 grey--text font-weight-light">
-                {{ $t("user.users") }}
-              </h2>
-              <h3 class="display-2 font-weight-light text--primary">
-                <small> {{ statistics.totalUsers }}</small>
-              </h3>
-            </div>
-          </template>
-          <template v-slot:actions>
-            <div class="ml-auto">
-              <v-btn color="primary" small to="/admin/manage-users?tab=users">
-                <v-icon left>{{ $globals.icons.user }}</v-icon>
-                {{ $t("user.manage-users") }}
-              </v-btn>
-            </div>
-          </template>
-        </StatCard>
-      </v-col>
-      <v-col cols="12" sm="12" md="4">
-        <StatCard :icon="$globals.icons.group">
-          <template v-slot:after-heading>
-            <div class="ml-auto text-right">
-              <h2 class="body-3 grey--text font-weight-light">
-                {{ $t("group.groups") }}
-              </h2>
-
-              <h3 class="display-2 font-weight-light text--primary">
-                <small> {{ statistics.totalGroups }}</small>
-              </h3>
-            </div>
-          </template>
-          <template v-slot:actions>
-            <div class="ml-auto">
-              <v-btn color="primary" small to="/admin/manage-users?tab=groups">
-                <v-icon left>{{ $globals.icons.group }}</v-icon>
-                {{ $t("group.manage-groups") }}
-              </v-btn>
-            </div>
-          </template>
-        </StatCard>
-      </v-col>
-    </v-row>
-    <v-row class="mt-10">
-      <v-col cols="12" sm="12" lg="6">
-        <EventViewer />
-      </v-col>
-      <v-col cols="12" sm="12" lg="6"> <BackupViewer /> </v-col>
-    </v-row>
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-import StatCard from "@/components/UI/StatCard";
-import EventViewer from "./EventViewer";
-import BackupViewer from "./BackupViewer";
-export default {
-  components: { StatCard, EventViewer, BackupViewer },
-  data() {
-    return {
-      statistics: {
-        totalGroups: 0,
-        totalRecipes: 0,
-        totalUsers: 0,
-        uncategorizedRecipes: 0,
-        untaggedRecipes: 0,
-      },
-    };
-  },
-  created() {
-    this.getStatistics();
-  },
-  methods: {
-    async getStatistics() {
-      this.statistics = await api.meta.getStatistics();
-    },
-  },
-};
-</script>
-
-<style>
-.grid-style {
-  flex-grow: inherit;
-  display: inline-flex;
-  flex-wrap: wrap;
-  gap: 10px;
-}
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/Admin/ManageUsers/GroupCard.vue b/frontend.old/src/pages/Admin/ManageUsers/GroupCard.vue
deleted file mode 100644
index 3ab26d3f2860..000000000000
--- a/frontend.old/src/pages/Admin/ManageUsers/GroupCard.vue
+++ /dev/null
@@ -1,122 +0,0 @@
-<template>
-  <div>
-    <ConfirmationDialog
-      ref="deleteGroupConfirm"
-      :title="$t('group.confirm-group-deletion')"
-      :message="
-        $t('group.are-you-sure-you-want-to-delete-the-group', {
-          groupName: group.name,
-        })
-      "
-      :icon="$globals.icons.alert"
-      @confirm="deleteGroup"
-      :width="450"
-      @close="closeGroupDelete"
-    />
-    <v-card class="ma-auto" tile min-height="325px">
-      <v-list dense>
-        <v-card-title class="py-1">{{ group.name }}</v-card-title>
-        <v-divider></v-divider>
-        <v-subheader>{{ $t("group.group-id-with-value", { groupID: group.id }) }}</v-subheader>
-        <v-list-item-group color="primary">
-          <v-list-item v-for="property in groupProps" :key="property.text">
-            <v-list-item-icon>
-              <v-icon> {{ property.icon || $globals.icons.user }} </v-icon>
-            </v-list-item-icon>
-            <v-list-item-content>
-              <v-list-item-title class="pl-4 flex row justify-space-between">
-                <div>{{ property.text }}</div>
-                <div>{{ property.value }}</div>
-              </v-list-item-title>
-            </v-list-item-content>
-          </v-list-item>
-        </v-list-item-group>
-      </v-list>
-      <v-card-actions>
-        <v-spacer></v-spacer>
-        <v-btn small color="error" @click="confirmDelete" :disabled="ableToDelete">
-          {{ $t("general.delete") }}
-        </v-btn>
-        <!-- Coming Soon! -->
-        <v-btn small color="success" disabled>
-          {{ $t("general.edit") }}
-        </v-btn>
-      </v-card-actions>
-    </v-card>
-  </div>
-</template>
-
-<script>
-const RENDER_EVENT = "update";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog";
-import { api } from "@/api";
-export default {
-  components: { ConfirmationDialog },
-  props: {
-    group: {
-      default: {
-        name: "DEFAULT_NAME",
-        id: 1,
-        users: [],
-        mealplans: [],
-        categories: [],
-        webhookUrls: [],
-        webhookTime: "00:00",
-        webhookEnable: false,
-      },
-    },
-  },
-  data() {
-    return {
-      groupProps: {},
-    };
-  },
-  computed: {
-    ableToDelete() {
-      return this.group.users.length >= 1 ? true : false;
-    },
-  },
-  created() {
-    this.buildData();
-  },
-  methods: {
-    confirmDelete() {
-      this.$refs.deleteGroupConfirm.open();
-    },
-    async deleteGroup() {
-      if (await api.groups.delete(this.group.id)) {
-        this.$emit(RENDER_EVENT);
-      }
-    },
-    closeGroupDelete() {
-      console.log("Close Delete");
-    },
-    buildData() {
-      this.groupProps = [
-        {
-          text: this.$t("user.total-users"),
-          icon: this.$globals.icons.user,
-          value: this.group.users.length,
-        },
-        {
-          text: this.$t("user.total-mealplans"),
-          icon: this.$globals.icons.food,
-          value: this.group.mealplans.length,
-        },
-        {
-          text: this.$t("user.webhooks-enabled"),
-          icon: this.$globals.icons.webhook,
-          value: this.group.webhookEnable ? this.$t("general.yes") : this.$t("general.no"),
-        },
-        {
-          text: this.$t("user.webhook-time"),
-          icon: this.$globals.icons.clockOutline,
-          value: this.group.webhookTime,
-        },
-      ];
-    },
-  },
-};
-</script>
-
-<style scoped></style>
diff --git a/frontend.old/src/pages/Admin/ManageUsers/GroupDashboard.vue b/frontend.old/src/pages/Admin/ManageUsers/GroupDashboard.vue
deleted file mode 100644
index 1b83f80100b1..000000000000
--- a/frontend.old/src/pages/Admin/ManageUsers/GroupDashboard.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-<template>
-  <div>
-    <v-card outlined class="mt-n1">
-      <v-card-actions>
-        <v-spacer></v-spacer>
-        <div width="100px">
-          <v-text-field
-            v-model="filter"
-            clearable
-            class="mr-2 pt-0"
-            :append-icon="$globals.icons.filter"
-            :label="$t('general.filter')"
-            single-line
-            hide-details
-          ></v-text-field>
-        </div>
-        <v-dialog v-model="groupDialog" max-width="400">
-          <template v-slot:activator="{ on, attrs }">
-            <v-btn class="mx-2" small color="success" dark v-bind="attrs" v-on="on">
-              {{ $t("group.create-group") }}
-            </v-btn>
-          </template>
-          <v-card>
-            <v-app-bar dark dense color="primary">
-              <v-icon left>
-                {{ $globals.icons.group }}
-              </v-icon>
-
-              <v-toolbar-title class="headline">
-                {{ $t("group.create-group") }}
-              </v-toolbar-title>
-
-              <v-spacer></v-spacer>
-            </v-app-bar>
-            <v-form ref="newGroup" @submit.prevent="createGroup">
-              <v-card-text>
-                <v-text-field
-                  v-model="newGroupName"
-                  :label="$t('group.group-name')"
-                  :rules="[existsRule]"
-                ></v-text-field>
-              </v-card-text>
-
-              <v-card-actions>
-                <v-spacer></v-spacer>
-                <v-btn color="grey" text @click="groupDialog = false">
-                  {{ $t("general.cancel") }}
-                </v-btn>
-                <v-btn color="primary" type="submit">
-                  {{ $t("general.create") }}
-                </v-btn>
-              </v-card-actions>
-            </v-form>
-          </v-card>
-        </v-dialog>
-      </v-card-actions>
-      <v-card-text>
-        <v-row>
-          <v-col :sm="6" :md="6" :lg="4" :xl="3" v-for="group in groups" :key="group.id">
-            <GroupCard :group="group" @update="$store.dispatch('requestAllGroups')" />
-          </v-col>
-        </v-row>
-      </v-card-text>
-    </v-card>
-  </div>
-</template>
-
-<script>
-import { validators } from "@/mixins/validators";
-import { api } from "@/api";
-import GroupCard from "./GroupCard";
-export default {
-  components: { GroupCard },
-  mixins: [validators],
-  data() {
-    return {
-      filter: "",
-      groupDialog: false,
-      newGroupName: "",
-    };
-  },
-  computed: {
-    groups() {
-      return this.$store.getters.getGroups;
-    },
-  },
-  methods: {
-    async createGroup() {
-      this.groupLoading = true;
-      if (await api.groups.create(this.newGroupName)) {
-        this.groupDialog = false;
-        this.$store.dispatch("requestAllGroups");
-      }
-      this.groupLoading = false;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/ManageUsers/TheSignUpTable.vue b/frontend.old/src/pages/Admin/ManageUsers/TheSignUpTable.vue
deleted file mode 100644
index 95a442535eb4..000000000000
--- a/frontend.old/src/pages/Admin/ManageUsers/TheSignUpTable.vue
+++ /dev/null
@@ -1,230 +0,0 @@
-<template>
-  <v-card outlined class="mt-n1">
-    <ConfirmationDialog
-      ref="deleteTokenDialog"
-      :title="$t('user.confirm-link-deletion')"
-      :message="
-        $t('user.are-you-sure-you-want-to-delete-the-link', {
-          link: activeName,
-        })
-      "
-      :icon="$globals.icons.alert"
-      @confirm="deleteToken"
-      :width="450"
-      @close="closeDelete"
-    />
-    <v-toolbar flat>
-      <v-icon large color="accent" class="mr-1">
-        {{ $globals.icons.externalLink }}
-      </v-icon>
-      <v-toolbar-title class="headine">
-        {{ $t("signup.sign-up-links") }}
-      </v-toolbar-title>
-
-      <v-spacer> </v-spacer>
-      <v-dialog v-model="dialog" max-width="500">
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn small color="success" dark v-bind="attrs" v-on="on">
-            {{ $t("user.create-link") }}
-          </v-btn>
-        </template>
-        <v-card>
-          <v-app-bar dark dense color="primary">
-            <v-icon left>
-              {{ $globals.icons.user }}
-            </v-icon>
-
-            <v-toolbar-title class="headline">
-              {{ $t("user.create-link") }}
-            </v-toolbar-title>
-
-            <v-spacer></v-spacer>
-          </v-app-bar>
-          <v-form ref="newUser" @submit.prevent="save">
-            <v-card-text>
-              <v-text-field
-                v-model="editedItem.name"
-                :label="$t('user.link-name')"
-                :rules="[existsRule]"
-                validate-on-blur
-              ></v-text-field>
-              <v-checkbox v-model="editedItem.admin" :label="$t('user.admin')"></v-checkbox>
-            </v-card-text>
-
-            <v-card-actions>
-              <v-spacer></v-spacer>
-              <v-btn color="grey" text @click="close">
-                {{ $t("general.cancel") }}
-              </v-btn>
-              <v-btn color="primary" type="submit">
-                {{ $t("general.save") }}
-              </v-btn>
-            </v-card-actions>
-          </v-form>
-        </v-card>
-      </v-dialog>
-    </v-toolbar>
-    <v-divider></v-divider>
-
-    <v-card-text>
-      <v-data-table :headers="headers" :items="links" sort-by="calories">
-        <template v-slot:item.token="{ item }">
-          {{ `${baseURL}/sign-up/${item.token}` }}
-          <AppCopyButton :copy-text="`${baseURL}/sign-up/${item.token}`" />
-        </template>
-        <template v-slot:item.admin="{ item }">
-          <v-btn small :color="item.admin ? 'success' : 'error'" text>
-            <v-icon small left>
-              {{ $globals.icons.admin }}
-            </v-icon>
-            {{ item.admin ? $t("general.yes") : $t("general.no") }}
-          </v-btn>
-        </template>
-        <template v-slot:item.actions="{ item }">
-          <v-btn class="mr-1" small color="error" @click="deleteItem(item)">
-            <v-icon small left>
-              {{ $globals.icons.delete }}
-            </v-icon>
-            {{ $t("general.delete") }}
-          </v-btn>
-        </template>
-      </v-data-table>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import AppCopyButton from "@/components/UI/Buttons/AppCopyButton";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-export default {
-  components: { ConfirmationDialog, AppCopyButton },
-  mixins: [validators],
-  data() {
-    return {
-      dialog: false,
-      activeId: null,
-      activeName: null,
-      headers: [
-        {
-          text: this.$t("user.link-id"),
-          align: "start",
-          sortable: false,
-          value: "id",
-        },
-        { text: this.$t("general.name"), value: "name" },
-        { text: this.$t("general.token"), value: "token" },
-        { text: this.$t("user.admin"), value: "admin", align: "center" },
-        { text: "", value: "actions", sortable: false, align: "center" },
-      ],
-      links: [],
-      editedIndex: -1,
-      editedItem: {
-        name: "",
-        admin: false,
-        token: "",
-        id: 0,
-      },
-      defaultItem: {
-        name: "",
-        token: "",
-        admin: false,
-        id: 0,
-      },
-    };
-  },
-
-  computed: {
-    baseURL() {
-      return window.location.origin;
-    },
-  },
-
-  watch: {
-    dialog(val) {
-      val || this.close();
-    },
-    dialogDelete(val) {
-      val || this.closeDelete();
-    },
-  },
-
-  created() {
-    this.initialize();
-  },
-
-  methods: {
-    updateClipboard(newClip) {
-      navigator.clipboard.writeText(newClip).then(
-        () => {
-          console.log("Copied", newClip);
-        },
-        () => {
-          console.log("Copy Failed", newClip);
-        }
-      );
-    },
-    async initialize() {
-      this.links = await api.signUps.getAll();
-    },
-
-    async deleteToken() {
-      if (await api.signUps.deleteToken(this.activeId)) {
-        this.initialize();
-      }
-    },
-
-    editItem(item) {
-      this.editedIndex = this.links.indexOf(item);
-      this.editedItem = Object.assign({}, item);
-      this.dialog = true;
-    },
-
-    deleteItem(item) {
-      this.activeId = item.token;
-      this.activeName = item.name;
-      this.editedIndex = this.links.indexOf(item);
-      this.editedItem = Object.assign({}, item);
-      this.$refs.deleteTokenDialog.open();
-    },
-
-    deleteItemConfirm() {
-      this.links.splice(this.editedIndex, 1);
-      this.closeDelete();
-    },
-
-    close() {
-      this.dialog = false;
-      this.$nextTick(() => {
-        this.editedItem = Object.assign({}, this.defaultItem);
-        this.editedIndex = -1;
-      });
-    },
-
-    closeDelete() {
-      this.dialogDelete = false;
-      this.$nextTick(() => {
-        this.editedItem = Object.assign({}, this.defaultItem);
-        this.editedIndex = -1;
-      });
-    },
-
-    async save() {
-      if (this.editedIndex > -1) {
-        api.links.update(this.editedItem);
-        this.close();
-      } else if (this.$refs.newUser.validate()) {
-        api.signUps.createToken({
-          name: this.editedItem.name,
-          admin: this.editedItem.admin,
-        });
-        this.close();
-      }
-      await this.initialize();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/ManageUsers/TheUserTable.vue b/frontend.old/src/pages/Admin/ManageUsers/TheUserTable.vue
deleted file mode 100644
index 45f0350057ed..000000000000
--- a/frontend.old/src/pages/Admin/ManageUsers/TheUserTable.vue
+++ /dev/null
@@ -1,284 +0,0 @@
-<template>
-  <v-card outlined class="mt-n1">
-    <ConfirmationDialog
-      ref="deleteUserDialog"
-      :title="$t('user.confirm-user-deletion')"
-      :message="
-        $t('user.are-you-sure-you-want-to-delete-the-user', {
-          activeName,
-          activeId,
-        })
-      "
-      :icon="$globals.icons.alert"
-      @confirm="deleteUser"
-      :width="450"
-      @close="closeDelete"
-    />
-    <v-toolbar flat>
-      <v-spacer> </v-spacer>
-      <div width="100px">
-        <v-text-field
-          v-model="search"
-          class="mr-2"
-          :append-icon="$globals.icons.filter"
-          :label="$t('general.filter')"
-          single-line
-          hide-details
-        ></v-text-field>
-      </div>
-
-      <v-dialog v-model="dialog" max-width="600px">
-        <template v-slot:activator="{ on, attrs }">
-          <v-btn small color="success" dark v-bind="attrs" v-on="on">
-            {{ $t("user.create-user") }}
-          </v-btn>
-        </template>
-        <v-card>
-          <v-app-bar dark dense color="primary">
-            <v-icon left>
-              {{ $globals.icons.user }}
-            </v-icon>
-
-            <v-toolbar-title class="headline">
-              {{ formTitle }}
-            </v-toolbar-title>
-
-            <v-spacer></v-spacer>
-            <v-toolbar-title class="headline" v-if="!this.createMode">
-              {{ $t("user.user-id-with-value", { id: editedItem.id }) }}
-            </v-toolbar-title>
-          </v-app-bar>
-          <v-form ref="newUser" @submit.prevent="save">
-            <v-card-text>
-              <v-row>
-                <v-col cols="12" sm="12" md="6">
-                  <v-text-field
-                    v-model="editedItem.fullName"
-                    :label="$t('user.full-name')"
-                    :rules="[existsRule]"
-                    validate-on-blur
-                  ></v-text-field>
-                </v-col>
-                <v-col cols="12" sm="12" md="6">
-                  <v-text-field
-                    v-model="editedItem.email"
-                    :label="$t('user.email')"
-                    :rules="[existsRule, emailRule]"
-                    validate-on-blur
-                  ></v-text-field>
-                </v-col>
-                <v-col cols="12" sm="12" md="6">
-                  <v-select
-                    dense
-                    v-model="editedItem.group"
-                    :items="existingGroups"
-                    :label="$t('group.user-group')"
-                  ></v-select>
-                </v-col>
-                <v-col cols="12" sm="12" md="6" v-if="createMode">
-                  <v-text-field
-                    dense
-                    v-model="editedItem.password"
-                    :label="$t('user.user-password')"
-                    :rules="[existsRule, minRule]"
-                  ></v-text-field>
-                </v-col>
-                <v-col cols="12" sm="12" md="3">
-                  <v-switch v-model="editedItem.admin" :label="$t('user.admin')"></v-switch>
-                </v-col>
-              </v-row>
-            </v-card-text>
-
-            <v-card-actions>
-              <v-btn color="info" text @click="resetPassword" v-if="!createMode">
-                {{ $t("user.reset-password") }}
-              </v-btn>
-              <v-spacer></v-spacer>
-              <v-btn color="grey" text @click="close">
-                {{ $t("general.cancel") }}
-              </v-btn>
-              <v-btn color="primary" type="submit">
-                {{ $t("general.save") }}
-              </v-btn>
-            </v-card-actions>
-          </v-form>
-        </v-card>
-      </v-dialog>
-    </v-toolbar>
-    <v-divider></v-divider>
-    <v-card-text>
-      <v-data-table :headers="headers" :items="users" sort-by="calories" :search="search">
-        <template v-slot:item.actions="{ item }">
-          <v-btn class="mr-1" small color="error" @click="deleteItem(item)">
-            <v-icon small left>
-              {{ $globals.icons.delete }}
-            </v-icon>
-            {{ $t("general.delete") }}
-          </v-btn>
-          <v-btn small color="success" @click="editItem(item)">
-            <v-icon small left class="mr-2">
-              {{ $globals.icons.edit }}
-            </v-icon>
-            {{ $t("general.edit") }}
-          </v-btn>
-        </template>
-        <template v-slot:item.admin="{ item }">
-          {{ item.admin ? "Admin" : "User" }}
-        </template>
-        <template v-slot:no-data>
-          <v-btn color="primary" @click="initialize">
-            {{ $t("general.reset") }}
-          </v-btn>
-        </template>
-      </v-data-table>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-export default {
-  components: { ConfirmationDialog },
-  mixins: [validators],
-  data() {
-    return {
-      search: "",
-      dialog: false,
-      activeId: null,
-      activeName: null,
-      headers: [
-        {
-          text: this.$t("user.user-id"),
-          align: "start",
-          sortable: false,
-          value: "id",
-        },
-        { text: this.$t("user.username"), value: "username" },
-        { text: this.$t("user.full-name"), value: "fullName" },
-        { text: this.$t("user.email"), value: "email" },
-        { text: this.$t("group.group"), value: "group" },
-        { text: this.$t("user.admin"), value: "admin" },
-        { text: "", value: "actions", sortable: false, align: "center" },
-      ],
-      users: [],
-      editedIndex: -1,
-      editedItem: {
-        id: 0,
-        fullName: "",
-        password: "",
-        email: "",
-        group: "",
-        admin: false,
-      },
-      defaultItem: {
-        id: 0,
-        fullName: "",
-        password: "",
-        email: "",
-        group: "",
-        admin: false,
-      },
-    };
-  },
-
-  computed: {
-    formTitle() {
-      return this.createMode ? this.$t("user.new-user") : this.$t("user.edit-user");
-    },
-    createMode() {
-      return this.editedIndex === -1 ? true : false;
-    },
-    existingGroups() {
-      return this.$store.getters.getGroupNames;
-    },
-  },
-
-  watch: {
-    dialog(val) {
-      val || this.close();
-    },
-    dialogDelete(val) {
-      val || this.closeDelete();
-    },
-  },
-
-  created() {
-    this.initialize();
-  },
-
-  methods: {
-    async initialize() {
-      this.users = await api.users.allUsers();
-    },
-
-    async deleteUser() {
-      if (await api.users.delete(this.activeId)) {
-        this.initialize();
-      }
-    },
-
-    editItem(item) {
-      this.editedIndex = this.users.indexOf(item);
-      this.editedItem = Object.assign({}, item);
-      this.dialog = true;
-    },
-
-    deleteItem(item) {
-      this.activeId = item.id;
-      this.activeName = item.fullName;
-      this.editedIndex = this.users.indexOf(item);
-      this.editedItem = Object.assign({}, item);
-      this.$refs.deleteUserDialog.open();
-    },
-
-    deleteItemConfirm() {
-      this.users.splice(this.editedIndex, 1);
-      this.closeDelete();
-    },
-
-    close() {
-      this.dialog = false;
-      this.$nextTick(() => {
-        this.editedItem = Object.assign({}, this.defaultItem);
-        this.editedIndex = -1;
-      });
-    },
-
-    closeDelete() {
-      this.dialogDelete = false;
-      this.$nextTick(() => {
-        this.editedItem = Object.assign({}, this.defaultItem);
-        this.editedIndex = -1;
-      });
-    },
-
-    async save() {
-      if (this.editedIndex > -1) {
-        this.updateUser();
-      } else if (this.$refs.newUser.validate()) {
-        this.createUser();
-      }
-      await this.initialize();
-    },
-    resetPassword() {
-      api.users.resetPassword(this.editedItem.id);
-    },
-
-    async createUser() {
-      if (await api.users.create(this.editedItem)) {
-        this.close();
-      }
-    },
-
-    async updateUser() {
-      if (await api.users.update(this.editedItem)) {
-        this.close();
-      }
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/ManageUsers/index.vue b/frontend.old/src/pages/Admin/ManageUsers/index.vue
deleted file mode 100644
index 15e1888877ef..000000000000
--- a/frontend.old/src/pages/Admin/ManageUsers/index.vue
+++ /dev/null
@@ -1,68 +0,0 @@
-<template>
-  <div>
-    <v-card flat>
-      <v-tabs v-model="tab" background-color="primary" centered dark icons-and-text show-arrows>
-        <v-tabs-slider></v-tabs-slider>
-
-        <v-tab href="#users">
-          {{ $t("user.users") }}
-          <v-icon>{{ $globals.icons.user }}</v-icon>
-        </v-tab>
-
-        <v-tab href="#sign-ups">
-          {{ $t("signup.sign-up-links") }}
-          <v-icon>{{ $globals.icons.accountPlusOutline }}</v-icon>
-        </v-tab>
-
-        <v-tab href="#groups" @click="reqGroups">
-          {{ $t("group.groups") }}
-          <v-icon>{{ $globals.icons.group }}</v-icon>
-        </v-tab>
-      </v-tabs>
-
-      <v-tabs-items v-model="tab">
-        <v-tab-item value="users">
-          <TheUserTable />
-        </v-tab-item>
-        <v-tab-item value="sign-ups">
-          <TheSignUpTable />
-        </v-tab-item>
-        <v-tab-item value="groups">
-          <GroupDashboard />
-        </v-tab-item>
-      </v-tabs-items>
-    </v-card>
-  </div>
-</template>
-
-<script>
-import TheUserTable from "./TheUserTable";
-import GroupDashboard from "./GroupDashboard";
-import TheSignUpTable from "./TheSignUpTable";
-export default {
-  components: { TheUserTable, GroupDashboard, TheSignUpTable },
-  data() {
-    return {};
-  },
-  computed: {
-    tab: {
-      set(tab) {
-        this.$router.replace({ query: { ...this.$route.query, tab } });
-      },
-      get() {
-        return this.$route.query.tab;
-      },
-    },
-  },
-  created() {
-    this.reqGroups();
-  },
-  methods: {
-    reqGroups() {
-      this.$store.dispatch("requestAllGroups");
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Migration/MigrationCard.vue b/frontend.old/src/pages/Admin/Migration/MigrationCard.vue
deleted file mode 100644
index 54492f0486eb..000000000000
--- a/frontend.old/src/pages/Admin/Migration/MigrationCard.vue
+++ /dev/null
@@ -1,94 +0,0 @@
-<template>
-  <v-card outlined class="my-2" :loading="loading">
-    <MigrationDialog ref="migrationDialog" />
-    <v-card-title>
-      {{ title }}
-      <v-spacer></v-spacer>
-      <span>
-        <AppButtonUpload
-          class="mt-1"
-          :url="`/api/migrations/${folder}/upload`"
-          fileName="archive"
-          @uploaded="$emit('refresh')"
-          :post="true"
-        />
-      </span>
-    </v-card-title>
-    <v-card-text> {{ description }}</v-card-text>
-    <div v-if="available[0]">
-      <v-card outlined v-for="migration in available" :key="migration.name" class="ma-2">
-        <v-card-text>
-          <v-row align="center">
-            <v-col cols="2">
-              <v-icon large color="primary">{{ $globals.icons.import }}</v-icon>
-            </v-col>
-            <v-col cols="10">
-              <div class="text-truncate">
-                <strong>{{ migration.name }}</strong>
-              </div>
-              <div class="text-truncate">
-                {{ $d(new Date(migration.date), "medium") }}
-              </div>
-            </v-col>
-          </v-row>
-        </v-card-text>
-        <v-card-actions class="mt-n6">
-          <v-spacer></v-spacer>
-          <v-btn color="error" text @click="deleteMigration(migration.name)">
-            {{ $t("general.delete") }}
-          </v-btn>
-          <v-btn color="accent" text @click="importMigration(migration.name)" :loading="loading" :disabled="loading">
-            {{ $t("general.import") }}
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </div>
-    <div v-else>
-      <v-card outlined class="text-center ma-2">
-        <v-card-text>
-          {{ $t("migration.no-migration-data-available") }}
-        </v-card-text>
-      </v-card>
-    </div>
-    <br />
-  </v-card>
-</template>
-
-<script>
-import AppButtonUpload from "@/components/UI/Buttons/AppButtonUpload";
-import { api } from "@/api";
-import MigrationDialog from "./MigrationDialog";
-export default {
-  props: {
-    folder: String,
-    title: String,
-    description: String,
-    available: Array,
-  },
-  components: {
-    AppButtonUpload,
-    MigrationDialog,
-  },
-  data() {
-    return {
-      loading: false,
-    };
-  },
-  methods: {
-    async deleteMigration(file_name) {
-      if (await api.migrations.delete(this.folder, file_name)) {
-        this.$emit("refresh");
-      }
-    },
-    async importMigration(file_name) {
-      this.loading = true;
-      let response = await api.migrations.import(this.folder, file_name);
-      this.$refs.migrationDialog.open(response);
-      // this.$emit("imported", response.successful, response.failed);
-      this.loading = false;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Migration/MigrationDialog.vue b/frontend.old/src/pages/Admin/Migration/MigrationDialog.vue
deleted file mode 100644
index 5b5b3ab7bf54..000000000000
--- a/frontend.old/src/pages/Admin/Migration/MigrationDialog.vue
+++ /dev/null
@@ -1,106 +0,0 @@
-<template>
-  <div class="text-center">
-    <v-dialog v-model="dialog" width="70%">
-      <v-card>
-        <v-app-bar dark color="primary mb-2">
-          <v-icon large left>
-            {{ $globals.icons.import }}
-          </v-icon>
-          <v-toolbar-title class="headline">
-            Migration Summary
-          </v-toolbar-title>
-          <v-spacer></v-spacer>
-        </v-app-bar>
-        <v-card-text class="mb-n4">
-          <v-row>
-            <div v-for="values in allNumbers" :key="values.title">
-              <v-card-text>
-                <div>
-                  <h3>{{ values.title }}</h3>
-                </div>
-                <div class="success--text">Success: {{ values.success }}</div>
-                <div class="error--text">Failed: {{ values.failure }}</div>
-              </v-card-text>
-            </div>
-          </v-row>
-        </v-card-text>
-        <v-tabs v-model="tab" show-arrows="">
-          <v-tab>{{ $t("general.recipes") }}</v-tab>
-        </v-tabs>
-        <v-tabs-items v-model="tab">
-          <v-tab-item v-for="(table, index) in allTables" :key="index">
-            <v-card flat>
-              <DataTable :data-headers="importHeaders" :data-set="table" />
-            </v-card>
-          </v-tab-item>
-        </v-tabs-items>
-      </v-card>
-    </v-dialog>
-  </div>
-</template>
-
-<script>
-import DataTable from "@/components/ImportSummaryDialog/DataTable";
-export default {
-  components: {
-    DataTable,
-  },
-  data: () => ({
-    tab: null,
-    dialog: false,
-    recipeData: [],
-    themeData: [],
-    settingsData: [],
-    userData: [],
-    groupData: [],
-    pageData: [],
-    importHeaders: [
-      {
-        text: "Status",
-        value: "status",
-      },
-      {
-        text: "Name",
-        align: "start",
-        sortable: true,
-        value: "name",
-      },
-
-      { text: "Exception", value: "data-table-expand", align: "center" },
-    ],
-    allDataTables: [],
-  }),
-
-  computed: {
-    recipeNumbers() {
-      return this.calculateNumbers(this.$t("general.recipes"), this.recipeData);
-    },
-    allNumbers() {
-      return [this.recipeNumbers];
-    },
-    allTables() {
-      return [this.recipeData];
-    },
-  },
-
-  methods: {
-    calculateNumbers(title, list_array) {
-      if (!list_array) return;
-      let numbers = { title: title, success: 0, failure: 0 };
-      list_array.forEach(element => {
-        if (element.status) {
-          numbers.success++;
-        } else numbers.failure++;
-      });
-      return numbers;
-    },
-    open(importData) {
-      this.recipeData = importData;
-
-      this.dialog = true;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Migration/index.vue b/frontend.old/src/pages/Admin/Migration/index.vue
deleted file mode 100644
index c345bde2996f..000000000000
--- a/frontend.old/src/pages/Admin/Migration/index.vue
+++ /dev/null
@@ -1,82 +0,0 @@
-<template>
-  <div>
-    <v-card :loading="loading">
-      <v-card-title class="headline">
-        {{ $t("migration.recipe-migration") }}
-      </v-card-title>
-      <v-divider></v-divider>
-
-      <v-card-text>
-        <v-row dense>
-          <v-col :cols="12" :sm="6" :md="6" :lg="4" :xl="3" v-for="migration in migrations" :key="migration.title">
-            <MigrationCard
-              :title="migration.title"
-              :folder="migration.urlVariable"
-              :description="migration.description"
-              :available="migration.availableImports"
-              @refresh="getAvailableMigrations"
-              @imported="showReport"
-            />
-          </v-col>
-        </v-row>
-      </v-card-text>
-    </v-card>
-  </div>
-</template>
-
-<script>
-import MigrationCard from "./MigrationCard";
-import { api } from "@/api";
-export default {
-  components: {
-    MigrationCard,
-  },
-  data() {
-    return {
-      loading: false,
-      success: [],
-      failed: [],
-      migrations: {
-        nextcloud: {
-          title: this.$t("migration.nextcloud.title"),
-          description: this.$t("migration.nextcloud.description"),
-          urlVariable: "nextcloud",
-          availableImports: [],
-        },
-        chowdown: {
-          title: this.$t("migration.chowdown.title"),
-          description: this.$t("migration.chowdown.description"),
-          urlVariable: "chowdown",
-          availableImports: [],
-        },
-      },
-    };
-  },
-  created() {
-    this.getAvailableMigrations();
-  },
-  methods: {
-    finished() {
-      this.loading = false;
-      this.$store.dispatch("requestRecentRecipes");
-    },
-    async getAvailableMigrations() {
-      let response = await api.migrations.getMigrations();
-      response.forEach(element => {
-        if (element.type === "nextcloud") {
-          this.migrations.nextcloud.availableImports = element.files;
-        } else if (element.type === "chowdown") {
-          this.migrations.chowdown.availableImports = element.files;
-        }
-      });
-    },
-    showReport(successful, failed) {
-      this.success = successful;
-      this.failed = failed;
-      this.$refs.report.open();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Profile/APITokenCard.vue b/frontend.old/src/pages/Admin/Profile/APITokenCard.vue
deleted file mode 100644
index 6977229a5fc7..000000000000
--- a/frontend.old/src/pages/Admin/Profile/APITokenCard.vue
+++ /dev/null
@@ -1,150 +0,0 @@
-<template>
-  <StatCard :icon="$globals.icons.api" color="accent">
-    <template v-slot:after-heading>
-      <div class="ml-auto text-right">
-        <h2 class="body-3 grey--text font-weight-light">
-          {{ $t("settings.token.api-tokens") }}
-        </h2>
-        <h3 class="display-2 font-weight-light text--primary">
-          <small> {{ user.tokens.length }} </small>
-        </h3>
-      </div>
-    </template>
-    <template v-slot:bottom>
-      <v-subheader class="mb-n2">{{ $t("settings.token.active-tokens") }}</v-subheader>
-      <v-virtual-scroll height="210" item-height="70" :items="user.tokens" class="mt-2">
-        <template v-slot:default="{ item }">
-          <v-divider></v-divider>
-          <v-list-item @click.prevent>
-            <v-list-item-avatar>
-              <v-icon large dark color="accent">
-                {{ $globals.icons.api }}
-              </v-icon>
-            </v-list-item-avatar>
-
-            <v-list-item-content>
-              <v-list-item-title v-text="item.name"></v-list-item-title>
-            </v-list-item-content>
-
-            <v-list-item-action class="ml-auto">
-              <v-btn large icon @click.stop="deleteToken(item.id)">
-                <v-icon color="accent">{{ $globals.icons.delete }}</v-icon>
-              </v-btn>
-            </v-list-item-action>
-          </v-list-item>
-          <v-divider></v-divider>
-        </template>
-      </v-virtual-scroll>
-
-      <v-divider></v-divider>
-      <v-card-actions class="pb-1 pt-3">
-        <v-spacer></v-spacer>
-        <BaseDialog
-          :title="$t('settings.token.create-an-api-token')"
-          :title-icon="$globals.icons.api"
-          @submit="createToken"
-          :submit-text="buttonText"
-          :loading="loading"
-        >
-          <v-card-text>
-            <v-form ref="newTokenForm">
-              <v-text-field v-model="name" :label="$t('settings.token.token-name')" required> </v-text-field>
-            </v-form>
-
-            <div v-if="createdToken != ''">
-              <v-textarea
-                class="mb-0 pb-0"
-                :label="$t('settings.token.api-token')"
-                readonly
-                v-model="createdToken"
-                :append-outer-icon="$globals.icons.contentCopy"
-                @click:append-outer="copyToken"
-              >
-              </v-textarea>
-              <v-subheader class="text-center">
-                {{
-                  $t(
-                    "settings.token.copy-this-token-for-use-with-an-external-application-this-token-will-not-be-viewable-again"
-                  )
-                }}
-              </v-subheader>
-            </div>
-          </v-card-text>
-
-          <template v-slot:open="{ open }">
-            <TheButton create @click="open" />
-          </template>
-        </BaseDialog>
-      </v-card-actions>
-    </template>
-  </StatCard>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import StatCard from "@/components/UI/StatCard";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-import { initials } from "@/mixins/initials";
-export default {
-  components: {
-    BaseDialog,
-    StatCard,
-  },
-  mixins: [validators, initials],
-  data() {
-    return {
-      name: "",
-      loading: false,
-      createdToken: "",
-    };
-  },
-
-  created() {
-    this.$store.dispatch("requestUserData");
-  },
-
-  computed: {
-    user() {
-      return this.$store.getters.getUserData;
-    },
-    buttonText() {
-      if (this.createdToken === "") {
-        return this.$t("general.create");
-      } else {
-        return this.$t("general.close");
-      }
-    },
-  },
-
-  methods: {
-    async createToken() {
-      if (this.loading === true) {
-        this.loading = false;
-        this.$store.dispatch("requestUserData");
-        this.createdToken = "";
-        this.name = "";
-        return;
-      }
-      this.loading = true;
-      if (this.$refs.newTokenForm.validate()) {
-        const response = await api.users.createAPIToken(this.name);
-        this.createdToken = response.token;
-      }
-    },
-    async deleteToken(id) {
-      await api.users.deleteAPIToken(id);
-      this.$store.dispatch("requestUserData");
-    },
-    copyToken() {
-      const copyText = this.createdToken;
-      navigator.clipboard.writeText(copyText).then(
-        () => console.log("Copied", copyText),
-        () => console.log("Copied Failed", copyText)
-      );
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Profile/ProfileGroupCard.vue b/frontend.old/src/pages/Admin/Profile/ProfileGroupCard.vue
deleted file mode 100644
index 27c4f5fb8187..000000000000
--- a/frontend.old/src/pages/Admin/Profile/ProfileGroupCard.vue
+++ /dev/null
@@ -1,211 +0,0 @@
-<template>
-  <StatCard :icon="$globals.icons.group">
-    <template v-slot:after-heading>
-      <div class="ml-auto text-right">
-        <div class="body-3 grey--text font-weight-light" v-text="$t('group.group')" />
-
-        <h3 class="display-2 font-weight-light text--primary">
-          <small> {{ currentGroup.name }} </small>
-        </h3>
-      </div>
-    </template>
-    <template v-slot:bottom>
-      <div v-if="todaysMeal">
-        <v-subheader>{{ $t("meal-plan.dinner-tonight") }}</v-subheader>
-        <MobileRecipeCard
-          :name="todaysMeal.name"
-          :slug="todaysMeal.slug"
-          :description="todaysMeal.description"
-          :rating="todaysMeal.rating"
-          :tags="true"
-        />
-      </div>
-
-      <v-subheader>{{ $t("user.users-header") }}</v-subheader>
-      <v-divider></v-divider>
-
-      <v-virtual-scroll v-if="currentGroup.users" :items="currentGroup.users" height="257" item-height="64">
-        <template v-slot:default="{ item }">
-          <v-list-item :key="item.id" @click.prevent>
-            <v-list-item-action>
-              <v-btn fab small depressed color="primary">
-                {{ generateInitials(item.fullName) }}
-              </v-btn>
-            </v-list-item-action>
-
-            <v-list-item-content>
-              <v-list-item-title>
-                {{ item.fullName }}
-              </v-list-item-title>
-            </v-list-item-content>
-          </v-list-item>
-          <v-divider></v-divider>
-        </template>
-      </v-virtual-scroll>
-
-      <div class="mt-3">
-        <h3 class="display-2 font-weight-light text--primary">
-          <v-icon x-large>
-            {{ $globals.icons.food }}
-          </v-icon>
-          <small> {{ $t("meal-plan.mealplan-settings") }} </small>
-        </h3>
-      </div>
-      <v-divider></v-divider>
-
-      <v-subheader>{{ $t("meal-plan.mealplan-categories") }}</v-subheader>
-      <v-card-text class="mt-0 pt-0">
-        {{ $t("meal-plan.only-recipes-with-these-categories-will-be-used-in-meal-plans") }}
-      </v-card-text>
-      <CategoryTagSelector
-        :solo="true"
-        :dense="false"
-        v-model="groupSettings.categories"
-        :return-object="true"
-        :show-add="true"
-      />
-
-      <v-divider></v-divider>
-      <v-subheader>{{ $t("settings.webhooks.webhooks-caps") }}</v-subheader>
-      <v-card-text class="mt-0 pt-0">
-        {{
-          $t(
-            "settings.webhooks.the-urls-listed-below-will-recieve-webhooks-containing-the-recipe-data-for-the-meal-plan-on-its-scheduled-day-currently-webhooks-will-execute-at"
-          )
-        }}
-        <strong>{{ groupSettings.webhookTime }}</strong>
-      </v-card-text>
-      <v-row dense class="flex align-center">
-        <v-switch class="ml-5 mr-auto" v-model="groupSettings.webhookEnable" :label="$t('general.enabled')"></v-switch>
-        <TimePickerDialog @save-time="saveTime" class="" />
-      </v-row>
-
-      <v-card-text>
-        <v-text-field
-          :prepend-icon="$globals.icons.delete"
-          v-for="(url, index) in groupSettings.webhookUrls"
-          @click:prepend="removeWebhook(index)"
-          :key="index"
-          v-model="groupSettings.webhookUrls[index]"
-          :label="$t('settings.webhooks.webhook-url')"
-        ></v-text-field>
-        <v-card-actions class="pa-0">
-          <v-spacer></v-spacer>
-          <v-btn small color="success" @click="addWebhook">
-            <v-icon left> {{ $globals.icons.webhook }} </v-icon>
-            {{ $t("general.new") }}
-          </v-btn>
-        </v-card-actions>
-      </v-card-text>
-
-      <v-divider></v-divider>
-      <v-card-actions class="pb-0">
-        <v-btn class="ma-2" color="info" @click="testWebhooks">
-          <v-icon left> {{ $globals.icons.webhook }} </v-icon>
-          {{ $t("settings.webhooks.test-webhooks") }}
-        </v-btn>
-        <v-spacer></v-spacer>
-        <TheButton update @click="saveGroupSettings" />
-      </v-card-actions>
-    </template>
-  </StatCard>
-</template>
-
-<script>
-import TimePickerDialog from "@/components/FormHelpers/TimePickerDialog";
-import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
-import StatCard from "@/components/UI/StatCard";
-import MobileRecipeCard from "@/components/Recipe/MobileRecipeCard";
-import { validators } from "@/mixins/validators";
-import { initials } from "@/mixins/initials";
-import { api } from "@/api";
-export default {
-  components: {
-    StatCard,
-    MobileRecipeCard,
-    CategoryTagSelector,
-    TimePickerDialog,
-  },
-  mixins: [validators, initials],
-  data() {
-    return {
-      todaysMeal: false,
-      hideImage: false,
-      passwordLoading: false,
-      password: {
-        current: "",
-        newOne: "",
-        newTwo: "",
-      },
-      groupSettings: {},
-      showPassword: false,
-      loading: false,
-      user: {
-        fullName: "",
-        email: "",
-        group: "",
-        admin: false,
-        id: 0,
-      },
-    };
-  },
-
-  computed: {
-    userProfileImage() {
-      this.resetImage();
-      return `api/users/${this.user.id}/image`;
-    },
-    currentGroup() {
-      return this.$store.getters.getCurrentGroup;
-    },
-  },
-
-  async created() {
-    this.getTodaysMeal();
-    await this.$store.dispatch("requestCurrentGroup");
-    this.getSiteSettings();
-  },
-
-  methods: {
-    async getTodaysMeal() {
-      const response = await api.mealPlans.today();
-      this.todaysMeal = response.data;
-    },
-    generateInitials(text) {
-      const allNames = text.trim().split(" ");
-      return allNames.reduce(
-        (acc, curr, index) => {
-          if (index === 0 || index === allNames.length - 1) {
-            acc = `${acc}${curr.charAt(0).toUpperCase()}`;
-          }
-          return acc;
-        },
-        [""]
-      );
-    },
-    getSiteSettings() {
-      this.groupSettings = this.$store.getters.getCurrentGroup;
-    },
-    saveTime(value) {
-      this.groupSettings.webhookTime = value;
-    },
-    addWebhook() {
-      this.groupSettings.webhookUrls.push(" ");
-    },
-    removeWebhook(index) {
-      this.groupSettings.webhookUrls.splice(index, 1);
-    },
-    async saveGroupSettings() {
-      if (await api.groups.update(this.groupSettings)) {
-        await this.$store.dispatch("requestCurrentGroup");
-        this.getSiteSettings();
-      }
-    },
-    testWebhooks() {
-      api.settings.testWebhooks();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Profile/ProfileThemeCard.vue b/frontend.old/src/pages/Admin/Profile/ProfileThemeCard.vue
deleted file mode 100644
index 6a2559eead38..000000000000
--- a/frontend.old/src/pages/Admin/Profile/ProfileThemeCard.vue
+++ /dev/null
@@ -1,225 +0,0 @@
-<template>
-  <div>
-    <StatCard :icon="$globals.icons.formatColorFill" :color="color">
-      <template v-slot:after-heading>
-        <div class="ml-auto text-right">
-          <div class="body-3 grey--text font-weight-light" v-text="$t('general.themes')" />
-
-          <h3 class="display-2 font-weight-light text--primary">
-            <small> {{ selectedTheme.name }} </small>
-          </h3>
-        </div>
-      </template>
-
-      <template v-slot:actions>
-        <v-btn-toggle v-model="darkMode" color="primary " mandatory>
-          <v-btn small value="system">
-            <v-icon>{{ $globals.icons.desktopTowerMonitor }}</v-icon>
-            <span class="ml-1" v-show="$vuetify.breakpoint.smAndUp">
-              {{ $t("settings.theme.default-to-system") }}
-            </span>
-          </v-btn>
-
-          <v-btn small value="light">
-            <v-icon>{{ $globals.icons.weatherSunny }}</v-icon>
-            <span class="ml-1" v-show="$vuetify.breakpoint.smAndUp">
-              {{ $t("settings.theme.light") }}
-            </span>
-          </v-btn>
-
-          <v-btn small value="dark">
-            <v-icon>{{ $globals.icons.weatherNight }}</v-icon>
-            <span class="ml-1" v-show="$vuetify.breakpoint.smAndUp">
-              {{ $t("settings.theme.dark") }}
-            </span>
-          </v-btn>
-        </v-btn-toggle>
-      </template>
-
-      <template v-slot:bottom>
-        <v-virtual-scroll height="290" item-height="70" :items="availableThemes" class="mt-2">
-          <template v-slot:default="{ item }">
-            <v-divider></v-divider>
-            <v-list-item @click="selectedTheme = item">
-              <v-list-item-avatar>
-                <v-icon large dark :color="item.colors.primary">
-                  {{ $globals.icons.formatColorFill }}
-                </v-icon>
-              </v-list-item-avatar>
-
-              <v-list-item-content>
-                <v-list-item-title v-text="item.name"></v-list-item-title>
-
-                <v-row flex align-center class="mt-2 justify-space-around px-4 pb-2">
-                  <v-sheet
-                    class="rounded flex mx-1"
-                    v-for="(item, index) in item.colors"
-                    :key="index"
-                    :color="item"
-                    height="20"
-                  >
-                  </v-sheet>
-                </v-row>
-              </v-list-item-content>
-
-              <v-list-item-action class="ml-auto">
-                <v-btn large icon @click.stop="editTheme(item)">
-                  <v-icon color="accent">{{ $globals.icons.edit }}</v-icon>
-                </v-btn>
-              </v-list-item-action>
-            </v-list-item>
-            <v-divider></v-divider>
-          </template>
-        </v-virtual-scroll>
-        <v-divider></v-divider>
-        <v-card-actions>
-          <TheButton class="ml-auto mt-1 mb-n1" create @click="createTheme" />
-        </v-card-actions>
-      </template>
-    </StatCard>
-    <BaseDialog
-      :loading="loading"
-      :title="modalLabel.title"
-      :title-icon="$globals.icons.formatColorFill"
-      modal-width="700"
-      ref="themeDialog"
-      :submit-text="modalLabel.button"
-      @submit="processSubmit"
-      @delete="deleteTheme"
-    >
-      <v-card-text class="mt-3">
-        <v-text-field
-          :label="$t('settings.theme.theme-name')"
-          v-model="defaultData.name"
-          :rules="[rules.required]"
-          :append-outer-icon="jsonEditor ? $globals.icons.formSelect : $globals.icons.codeBraces"
-          @click:append-outer="jsonEditor = !jsonEditor"
-        ></v-text-field>
-        <v-row dense dflex wrap justify-content-center v-if="defaultData.colors && !jsonEditor">
-          <v-col cols="12" sm="6" v-for="(_, key) in defaultData.colors" :key="key">
-            <ColorPickerDialog :button-text="labels[key]" v-model="defaultData.colors[key]" />
-          </v-col>
-        </v-row>
-        <VJsoneditor @error="logError()" v-else v-model="defaultData" height="250px" :options="jsonEditorOptions" />
-      </v-card-text>
-    </BaseDialog>
-  </div>
-</template>
-
-<script>
-import { api } from "@/api";
-import ColorPickerDialog from "@/components/FormHelpers/ColorPickerDialog";
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import StatCard from "@/components/UI/StatCard";
-export default {
-  components: {
-    StatCard,
-    BaseDialog,
-    ColorPickerDialog,
-    VJsoneditor: () => import(/* webpackChunkName: "json-editor" */ "v-jsoneditor"),
-  },
-  data() {
-    return {
-      jsonEditor: false,
-      jsonEditorOptions: {
-        mode: "code",
-        search: false,
-        mainMenuBar: false,
-      },
-      availableThemes: [],
-      color: "accent",
-      newTheme: false,
-      loading: false,
-      defaultData: {
-        name: "",
-        colors: {
-          primary: "#E58325",
-          accent: "#00457A",
-          secondary: "#973542",
-          success: "#43A047",
-          info: "#4990BA",
-          warning: "#FF4081",
-          error: "#EF5350",
-        },
-      },
-      rules: {
-        required: val => !!val || this.$t("settings.theme.theme-name-is-required"),
-      },
-    };
-  },
-  computed: {
-    labels() {
-      return {
-        primary: this.$t("settings.theme.primary"),
-        secondary: this.$t("settings.theme.secondary"),
-        accent: this.$t("settings.theme.accent"),
-        success: this.$t("settings.theme.success"),
-        info: this.$t("settings.theme.info"),
-        warning: this.$t("settings.theme.warning"),
-        error: this.$t("settings.theme.error"),
-      };
-    },
-    modalLabel() {
-      if (this.newTheme) {
-        return {
-          title: this.$t("settings.add-a-new-theme"),
-          button: this.$t("general.create"),
-        };
-      } else {
-        return {
-          title: "Update Theme",
-          button: this.$t("general.update"),
-        };
-      }
-    },
-    selectedTheme: {
-      set(val) {
-        this.$store.commit("setTheme", val);
-      },
-      get() {
-        return this.$store.getters.getActiveTheme;
-      },
-    },
-    darkMode: {
-      set(val) {
-        this.$store.commit("setDarkMode", val);
-      },
-      get() {
-        return this.$store.getters.getDarkMode;
-      },
-    },
-  },
-  async created() {
-    await this.getAllThemes();
-  },
-  methods: {
-    async getAllThemes() {
-      this.availableThemes = await api.themes.requestAll();
-    },
-    editTheme(theme) {
-      this.defaultData = theme;
-      this.newTheme = false;
-      this.$refs.themeDialog.open();
-    },
-    createTheme() {
-      this.newTheme = true;
-      this.$refs.themeDialog.open();
-    },
-    async processSubmit() {
-      if (this.newTheme) {
-        await api.themes.create(this.defaultData);
-      } else {
-        await api.themes.update(this.defaultData);
-      }
-      this.getAllThemes();
-    },
-    async deleteTheme() {
-      await api.themes.delete(this.defaultData.id);
-      this.getAllThemes();
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/Admin/Profile/UserCard.vue b/frontend.old/src/pages/Admin/Profile/UserCard.vue
deleted file mode 100644
index 11519ce55d35..000000000000
--- a/frontend.old/src/pages/Admin/Profile/UserCard.vue
+++ /dev/null
@@ -1,198 +0,0 @@
-<template>
-  <StatCard :icon="$globals.icons.user">
-    <template v-slot:avatar>
-      <v-avatar color="accent" size="120" class="white--text headline mt-n16">
-        <img :src="userProfileImage" v-if="!hideImage" @error="hideImage = true" @load="hideImage = false" />
-        <div v-else>
-          {{ initials }}
-        </div>
-      </v-avatar>
-    </template>
-    <template v-slot:after-heading>
-      <div class="ml-auto text-right">
-        <div class="body-3 grey--text font-weight-light" v-text="$t('user.user-id-with-value', { id: user.id })" />
-
-        <h3 class="display-2 font-weight-light text--primary">
-          <small> {{ $t("group.group-with-value", { groupID: user.group }) }}</small>
-        </h3>
-      </div>
-    </template>
-    <template v-slot:actions>
-      <BaseDialog
-        :title="$t('user.reset-password')"
-        :title-icon="$globals.icons.lock"
-        :submit-text="$t('settings.change-password')"
-        @submit="changePassword"
-        :loading="loading"
-        :top="true"
-      >
-        <template v-slot:open="{ open }">
-          <v-btn color="info" class="mr-1" small @click="open">
-            <v-icon left>{{ $globals.icons.lock }}</v-icon>
-            {{ $t("settings.change-password") }}
-          </v-btn>
-        </template>
-
-        <v-card-text>
-          <v-form ref="passChange">
-            <v-text-field
-              v-model="password.current"
-              :prepend-icon="$globals.icons.lock"
-              :label="$t('user.current-password')"
-              :rules="[existsRule]"
-              validate-on-blur
-              :type="showPassword ? 'text' : 'password'"
-              @click:append="showPassword.current = !showPassword.current"
-            ></v-text-field>
-            <v-text-field
-              v-model="password.newOne"
-              :prepend-icon="$globals.icons.lock"
-              :label="$t('user.new-password')"
-              :rules="[minRule]"
-              :type="showPassword ? 'text' : 'password'"
-              @click:append="showPassword.newOne = !showPassword.newOne"
-            ></v-text-field>
-            <v-text-field
-              v-model="password.newTwo"
-              :prepend-icon="$globals.icons.lock"
-              :label="$t('user.confirm-password')"
-              :rules="[password.newOne === password.newTwo || $t('user.password-must-match')]"
-              validate-on-blur
-              :type="showPassword ? 'text' : 'password'"
-              @click:append="showPassword.newTwo = !showPassword.newTwo"
-            ></v-text-field>
-          </v-form>
-        </v-card-text>
-      </BaseDialog>
-    </template>
-    <template v-slot:bottom>
-      <v-card-text>
-        <v-form ref="userUpdate">
-          <v-text-field
-            :label="$t('user.username')"
-            required
-            v-model="user.username"
-            :rules="[existsRule]"
-            validate-on-blur
-          >
-          </v-text-field>
-          <v-text-field
-            :label="$t('user.full-name')"
-            required
-            v-model="user.fullName"
-            :rules="[existsRule]"
-            validate-on-blur
-          >
-          </v-text-field>
-          <v-text-field :label="$t('user.email')" :rules="[emailRule]" validate-on-blur required v-model="user.email">
-          </v-text-field>
-        </v-form>
-      </v-card-text>
-      <v-divider></v-divider>
-      <v-card-actions class="pb-1 pt-3">
-        <AppButtonUpload
-          :icon="$globals.icons.fileImage"
-          :text="$t('user.upload-photo')"
-          :url="userProfileImage"
-          file-name="profile_image"
-        />
-        <v-spacer></v-spacer>
-        <TheButton update @click="updateUser" />
-      </v-card-actions>
-    </template>
-  </StatCard>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import StatCard from "@/components/UI/StatCard";
-import AppButtonUpload from "@/components/UI/Buttons/AppButtonUpload";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-import { initials } from "@/mixins/initials";
-export default {
-  components: {
-    BaseDialog,
-    AppButtonUpload,
-    StatCard,
-  },
-  mixins: [validators, initials],
-  data() {
-    return {
-      hideImage: false,
-      passwordLoading: false,
-      password: {
-        current: "",
-        newOne: "",
-        newTwo: "",
-      },
-      showPassword: false,
-      loading: false,
-      user: {},
-    };
-  },
-
-  computed: {
-    userProfileImage() {
-      return api.users.userProfileImage(this.user.id);
-    },
-  },
-
-  async created() {
-    this.refreshProfile();
-  },
-
-  watch: {
-    userProfileImage() {
-      this.hideImage = false;
-    },
-  },
-
-  methods: {
-    async refreshProfile() {
-      const [response, err] = await api.users.self();
-
-      if (err) {
-        return; // TODO: Log or Notifty User of Error
-      }
-
-      this.user = response.data;
-    },
-    openAvatarPicker() {
-      this.showAvatarPicker = true;
-    },
-    selectAvatar(avatar) {
-      this.user.avatar = avatar;
-    },
-    async updateUser() {
-      if (!this.$refs.userUpdate.validate()) {
-        return;
-      }
-      this.loading = true;
-      const response = await api.users.update(this.user);
-      if (response) {
-        this.$store.commit("setToken", response.data.access_token);
-        this.refreshProfile();
-        this.loading = false;
-        this.$store.dispatch("requestUserData");
-      }
-    },
-    async changePassword() {
-      this.paswordLoading = true;
-      let data = {
-        currentPassword: this.password.current,
-        newPassword: this.password.newOne,
-      };
-
-      if (this.$refs.passChange.validate()) {
-        if (await api.users.changePassword(this.user.id, data)) {
-          this.$emit("refresh");
-        }
-      }
-      this.paswordLoading = false;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Profile/index.vue b/frontend.old/src/pages/Admin/Profile/index.vue
deleted file mode 100644
index e6cfa1a38301..000000000000
--- a/frontend.old/src/pages/Admin/Profile/index.vue
+++ /dev/null
@@ -1,35 +0,0 @@
-<template>
-  <div class="mt-10">
-    <v-row>
-      <v-col cols="12" sm="12" lg="6">
-        <UserCard />
-        <ProfileThemeCard class="mt-10" />
-        <APITokenCard class="mt-10" />
-      </v-col>
-      <v-col cols="12" sm="12" lg="6">
-        <ProfileGroupCard />
-      </v-col>
-    </v-row>
-    <v-row class="mt-7">
-      <v-col cols="12" sm="12" lg="6"> </v-col>
-      <v-col cols="12" sm="12" lg="6"> </v-col>
-    </v-row>
-  </div>
-</template>
-
-<script>
-import ProfileThemeCard from "./ProfileThemeCard";
-import ProfileGroupCard from "./ProfileGroupCard";
-import APITokenCard from "./APITokenCard";
-import UserCard from "./UserCard";
-export default {
-  components: {
-    UserCard,
-    ProfileThemeCard,
-    ProfileGroupCard,
-    APITokenCard,
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Settings/CreatePageDialog.vue b/frontend.old/src/pages/Admin/Settings/CreatePageDialog.vue
deleted file mode 100644
index 355e5a060bce..000000000000
--- a/frontend.old/src/pages/Admin/Settings/CreatePageDialog.vue
+++ /dev/null
@@ -1,98 +0,0 @@
-<template>
-  <v-dialog v-model="pageDialog" max-width="500">
-    <v-card>
-      <v-app-bar dark dense color="primary">
-        <v-icon left>
-          {{ $globals.icons.pageLayoutBody }}
-        </v-icon>
-
-        <v-toolbar-title class="headline">
-          {{ title }}
-        </v-toolbar-title>
-
-        <v-spacer></v-spacer>
-      </v-app-bar>
-      <v-form ref="newGroup" @submit.prevent="submitForm">
-        <v-card-text>
-          <v-text-field autofocus v-model="page.name" :label="$t('settings.page-name')"></v-text-field>
-          <CategoryTagSelector
-            v-model="page.categories"
-            ref="categoryFormSelector"
-            @mounted="catMounted = true"
-            :tag-selector="false"
-          />
-        </v-card-text>
-
-        <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn color="grey" text @click="pageDialog = false">
-            {{ $t("general.cancel") }}
-          </v-btn>
-          <v-btn color="primary" type="submit">
-            {{ buttonText }}
-          </v-btn>
-        </v-card-actions>
-      </v-form>
-    </v-card>
-  </v-dialog>
-</template>
-
-<script>
-const NEW_PAGE_EVENT = "refresh-page";
-import { api } from "@/api";
-import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
-export default {
-  components: {
-    CategoryTagSelector,
-  },
-  data() {
-    return {
-      catMounted: false,
-      title: "",
-      buttonText: "",
-      create: false,
-      pageDialog: false,
-      page: {
-        name: "",
-        position: 0,
-        categories: [],
-      },
-    };
-  },
-  watch: {
-    catMounted(val) {
-      if (val) this.pushSelected();
-    },
-  },
-  methods: {
-    open(parameters) {
-      this.page = parameters.data;
-      this.create = parameters.create;
-      this.buttonText = parameters.buttonText;
-      this.title = parameters.title;
-      this.pageDialog = true;
-
-      if (this.catMounted) this.pushSelected();
-    },
-    pushSelected() {
-      this.$refs.categoryFormSelector.setInit(this.page.categories);
-    },
-    async submitForm() {
-      let response;
-      if (this.create) {
-        response = await api.siteSettings.createPage(this.page);
-      } else {
-        response = await api.siteSettings.updatePage(this.page);
-      }
-
-      if (response) {
-        this.pageDialog = false;
-        this.page.categories = [];
-        this.$emit(NEW_PAGE_EVENT);
-      }
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/pages/Admin/Settings/CustomPageCreator.vue b/frontend.old/src/pages/Admin/Settings/CustomPageCreator.vue
deleted file mode 100644
index 2da1ce91f97e..000000000000
--- a/frontend.old/src/pages/Admin/Settings/CustomPageCreator.vue
+++ /dev/null
@@ -1,126 +0,0 @@
-<template>
-  <v-card flat>
-    <CreatePageDialog ref="createDialog" @refresh-page="getPages" />
-    <v-card-text>
-      <h2 class="mt-1 mb-1 ">
-        {{ $t("settings.custom-pages") }}
-        <span>
-          <TheButton create small class="ml-3" @click="newPage" />
-        </span>
-      </h2>
-      <draggable class="row mt-1" v-model="customPages">
-        <v-col :sm="6" :md="6" :lg="4" :xl="3" v-for="(item, index) in customPages" :key="item + item.id">
-          <v-card>
-            <v-card-text class="mb-0 pb-0">
-              <h3>{{ item.name }}</h3>
-              <v-divider></v-divider>
-            </v-card-text>
-            <v-card-text class="mt-0">
-              <div>
-                <v-chip
-                  v-for="cat in item.categories"
-                  :key="cat.slug + cat.id"
-                  class="my-2 mr-2"
-                  label
-                  small
-                  color="accent lighten-1"
-                >
-                  {{ cat.name }}
-                </v-chip>
-              </div>
-            </v-card-text>
-
-            <v-card-actions>
-              <ConfirmationDialog
-                :title="$t('page.page') + ' ' + $t('general.delete')"
-                :icon="$globals.icons.pages"
-                :message="$t('general.confirm-delete-generic')"
-                @confirm="deletePage(item.id)"
-              >
-                <template v-slot="{ open }">
-                  <TheButton delete small minor @click="open" />
-                </template>
-              </ConfirmationDialog>
-              <v-spacer> </v-spacer>
-              <TheButton edit small @click="editPage(index)" />
-            </v-card-actions>
-          </v-card>
-        </v-col>
-      </draggable>
-    </v-card-text>
-    <v-card-actions>
-      <v-spacer></v-spacer>
-      <TheButton update @click="savePages" />
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script>
-import draggable from "vuedraggable";
-import CreatePageDialog from "./CreatePageDialog";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog.vue";
-import TheButton from "@/components/UI/Buttons/TheButton.vue";
-import { api } from "@/api";
-export default {
-  components: {
-    draggable,
-    CreatePageDialog,
-    ConfirmationDialog,
-    TheButton,
-  },
-  data() {
-    return {
-      pageDialog: false,
-      customPages: [],
-      newPageData: {
-        create: true,
-        title: this.$t("settings.new-page"),
-        buttonText: this.$t("general.create"),
-        data: {
-          name: "",
-          categories: [],
-          position: 0,
-        },
-      },
-      editPageData: {
-        create: false,
-        title: this.$t("settings.edit-page"),
-        buttonText: this.$t("general.update"),
-        data: {},
-      },
-    };
-  },
-  async created() {
-    this.getPages();
-  },
-  methods: {
-    async getPages() {
-      this.customPages = await api.siteSettings.getPages();
-      this.customPages.sort((a, b) => a.position - b.position);
-    },
-    async deletePage(id) {
-      await api.siteSettings.deletePage(id);
-      this.getPages();
-    },
-    async savePages() {
-      this.customPages.forEach((element, index) => {
-        element.position = index;
-      });
-
-      if (await api.siteSettings.updateAllPages(this.customPages)) {
-        this.getPages();
-      }
-    },
-    editPage(index) {
-      this.editPageData.data = this.customPages[index];
-      this.$refs.createDialog.open(this.editPageData);
-    },
-    newPage() {
-      this.newPageData.position = this.customPages.length;
-      this.$refs.createDialog.open(this.newPageData);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/pages/Admin/Settings/HomePageSettings.vue b/frontend.old/src/pages/Admin/Settings/HomePageSettings.vue
deleted file mode 100644
index 14c0c8ec8966..000000000000
--- a/frontend.old/src/pages/Admin/Settings/HomePageSettings.vue
+++ /dev/null
@@ -1,220 +0,0 @@
-<template>
-  <v-card flat>
-    <v-card-text>
-      <h2 class="mt-1 mb-1">{{ $t("settings.homepage.home-page") }}</h2>
-      <v-row align="center" justify="center" dense class="mb-n7 pb-n5">
-        <v-col cols="12" sm="3" md="2">
-          <v-switch v-model="settings.showRecent" :label="$t('settings.homepage.show-recent')"></v-switch>
-        </v-col>
-        <v-col cols="12" sm="5" md="5">
-          <v-slider
-            class="pt-sm-4"
-            :label="$t('settings.homepage.card-per-section')"
-            v-model="settings.cardsPerSection"
-            max="30"
-            dense
-            color="primary"
-            min="3"
-            thumb-label
-          >
-          </v-slider>
-        </v-col>
-        <v-spacer></v-spacer>
-      </v-row>
-    </v-card-text>
-    <v-card-text>
-      <v-row>
-        <v-col cols="12" sm="6">
-          <v-card outlined min-height="350px">
-            <v-app-bar dark dense color="primary">
-              <v-icon left>
-                {{ $globals.icons.home }}
-              </v-icon>
-
-              <v-toolbar-title class="headline">
-                {{ $t("settings.homepage.home-page-sections") }}
-              </v-toolbar-title>
-
-              <v-spacer></v-spacer>
-            </v-app-bar>
-            <v-list height="300" dense style="overflow:auto">
-              <v-list-item-group>
-                <draggable
-                  v-model="settings.categories"
-                  group="categories"
-                  :style="{
-                    minHeight: `150px`,
-                  }"
-                >
-                  <v-list-item v-for="(item, index) in settings.categories" :key="`${item.name}-${index}`">
-                    <v-list-item-icon>
-                      <v-icon> {{ $globals.icons.menu }}</v-icon>
-                    </v-list-item-icon>
-
-                    <v-list-item-content>
-                      <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>{{ $globals.icons.delete }}</v-icon>
-                    </v-list-item-icon>
-                  </v-list-item>
-                </draggable>
-              </v-list-item-group>
-            </v-list>
-          </v-card>
-        </v-col>
-        <v-col cols="12" sm="6">
-          <v-card outlined height="350px">
-            <v-app-bar dark dense color="primary">
-              <v-icon left>
-                {{ $globals.icons.tags }}
-              </v-icon>
-
-              <v-toolbar-title class="headline">
-                {{ $t("settings.homepage.all-categories") }}
-              </v-toolbar-title>
-
-              <v-spacer></v-spacer>
-              <NewCategoryTagDialog :tag-dialog="false" />
-            </v-app-bar>
-            <v-list height="300" dense style="overflow:auto">
-              <v-list-item-group>
-                <draggable
-                  v-model="allCategories"
-                  group="categories"
-                  :style="{
-                    minHeight: `150px`,
-                  }"
-                >
-                  <v-list-item v-for="(item, index) in allCategories" :key="`${item.name}-${index}`">
-                    <v-list-item-icon>
-                      <v-icon>{{ $globals.icons.menu }}</v-icon>
-                    </v-list-item-icon>
-
-                    <v-list-item-content>
-                      <v-list-item-title v-text="item.name"></v-list-item-title>
-                    </v-list-item-content>
-                    <v-list-item-icon @click="deleteCategoryfromDatabase(item.slug)">
-                      <v-icon>{{ $globals.icons.delete }}</v-icon>
-                    </v-list-item-icon>
-                  </v-list-item>
-                </draggable>
-              </v-list-item-group>
-            </v-list>
-          </v-card>
-        </v-col>
-      </v-row>
-    </v-card-text>
-    <v-card-text>
-      <h2 class="mt-1 mb-4">{{ $t("settings.locale-settings") }}</h2>
-      <v-row>
-        <v-col cols="12" md="3" sm="12">
-          <LanguageSelector @select-lang="writeLang" :site-settings="true" />
-        </v-col>
-        <v-col cols="12" md="3" sm="12">
-          <v-select
-            dense
-            :prepend-icon="$globals.icons.calendarWeekBegin"
-            v-model="settings.firstDayOfWeek"
-            :items="allDays"
-            item-text="name"
-            item-value="value"
-            :label="$t('settings.first-day-of-week')"
-          />
-        </v-col>
-      </v-row>
-    </v-card-text>
-    <v-card-actions>
-      <v-spacer></v-spacer>
-      <TheButton class="mr-2" update @click="saveSettings" />
-    </v-card-actions>
-  </v-card>
-</template>
-
-<script>
-import { api } from "@/api";
-import LanguageSelector from "@/components/FormHelpers/LanguageSelector";
-import draggable from "vuedraggable";
-import NewCategoryTagDialog from "@/components/UI/Dialogs/NewCategoryTagDialog.vue";
-
-export default {
-  components: {
-    draggable,
-    LanguageSelector,
-    NewCategoryTagDialog,
-  },
-  data() {
-    return {
-      settings: {
-        language: "en",
-        firstDayOfWeek: 0,
-        showRecent: null,
-        cardsPerSection: null,
-        categories: [],
-      },
-    };
-  },
-  created() {
-    this.getOptions();
-  },
-  computed: {
-    allCategories() {
-      return this.$store.getters.getAllCategories;
-    },
-    allDays() {
-      return [
-        {
-          name: this.$t("general.sunday"),
-          value: 0,
-        },
-        {
-          name: this.$t("general.monday"),
-          value: 1,
-        },
-        {
-          name: this.$t("general.tuesday"),
-          value: 2,
-        },
-        {
-          name: this.$t("general.wednesday"),
-          value: 3,
-        },
-        {
-          name: this.$t("general.thursday"),
-          value: 4,
-        },
-        {
-          name: this.$t("general.friday"),
-          value: 5,
-        },
-        {
-          name: this.$t("general.saturday"),
-          value: 6,
-        },
-      ];
-    },
-  },
-
-  methods: {
-    writeLang(val) {
-      this.settings.language = val;
-    },
-    deleteCategoryfromDatabase(category) {
-      api.categories.delete(category);
-    },
-    async getOptions() {
-      this.settings = await api.siteSettings.get();
-    },
-    deleteActiveCategory(index) {
-      this.settings.categories.splice(index, 1);
-    },
-    async saveSettings() {
-      if (await api.siteSettings.update(this.settings)) {
-        this.getOptions();
-      }
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/Settings/index.vue b/frontend.old/src/pages/Admin/Settings/index.vue
deleted file mode 100644
index c94954efcdbd..000000000000
--- a/frontend.old/src/pages/Admin/Settings/index.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<template>
-  <v-card>
-    <v-card-title class="headline">
-      {{ $t("settings.admin-settings") }}
-      <v-spacer></v-spacer>
-      <span>
-        <v-btn class="pt-1" text href="/docs">
-          {{ $t("settings.local-api") }}
-          <v-icon right>{{ $globals.icons.openInNew }}</v-icon>
-        </v-btn>
-      </span>
-    </v-card-title>
-
-    <v-divider></v-divider>
-    <HomePageSettings />
-    <v-divider></v-divider>
-    <CustomPageCreator />
-    <v-divider></v-divider>
-  </v-card>
-</template>
-
-<script>
-import HomePageSettings from "./HomePageSettings";
-import CustomPageCreator from "./CustomPageCreator";
-
-export default {
-  components: {
-    HomePageSettings,
-    CustomPageCreator,
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/BulkAssign.vue b/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/BulkAssign.vue
deleted file mode 100644
index 19c0aec4cfec..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/BulkAssign.vue
+++ /dev/null
@@ -1,149 +0,0 @@
-<template>
-  <div>
-    <BaseDialog
-      ref="assignDialog"
-      :title-icon="$globals.icons.tags"
-      color="primary"
-      :title="$t('settings.toolbox.bulk-assign')"
-      :loading="loading"
-      modal-width="700"
-      :top="true"
-    >
-      <v-card-text>
-        <v-text-field v-model="search" autocomplete="off" :label="$t('general.keyword')"></v-text-field>
-        <CategoryTagSelector :tag-selector="false" v-model="catsToAssign" :return-object="false" />
-        <CategoryTagSelector :tag-selector="true" v-model="tagsToAssign" :return-object="false" />
-      </v-card-text>
-      <template slot="card-actions">
-        <v-btn text color="grey" @click="closeDialog">
-          {{ $t("general.cancel") }}
-        </v-btn>
-        <v-spacer></v-spacer>
-        <v-btn color="success" @click="assignAll" :loading="loading" :disabled="results.length < 1">
-          {{ $t("settings.toolbox.assign-all") }}
-        </v-btn>
-      </template>
-      <template slot="below-actions">
-        <v-card-title class="headline"> </v-card-title>
-        <CardSection
-          class="px-2 pb-2"
-          :title="$tc('settings.toolbox.recipes-affected', results.length || 0)"
-          :mobile-cards="true"
-          :recipes="results"
-          :single-column="true"
-        />
-      </template>
-    </BaseDialog>
-
-    <v-btn @click="openDialog" small color="success">
-      {{ $t("settings.toolbox.bulk-assign") }}
-    </v-btn>
-  </div>
-</template>
-
-<script>
-import CardSection from "@/components/UI/CardSection";
-import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import { api } from "@/api";
-export default {
-  props: {
-    isTags: {
-      default: true,
-    },
-  },
-  components: {
-    CardSection,
-    BaseDialog,
-    CategoryTagSelector,
-  },
-  data() {
-    return {
-      results: [],
-      search: "",
-      loading: false,
-      assignTargetRecipes: [],
-      catsToAssign: [],
-      tagsToAssign: [],
-    };
-  },
-  created() {
-    this.$store.dispatch("requestAllRecipes");
-  },
-  watch: {
-    search() {
-      this.getResults();
-    },
-  },
-  computed: {
-    allRecipes() {
-      return this.$store.getters.getAllRecipes;
-    },
-    // results() {
-    //   if (this.search === null || this.search === "") {
-    //     return [];
-    //   }
-    //   return this.allRecipes.filter(x => {
-    //     return (
-    //       this.checkForKeywords(x.name) || this.checkForKeywords(x.description)
-    //     );
-    //   });
-    // },
-    keywords() {
-      const lowered = this.search.toLowerCase();
-      return lowered.split(" ");
-    },
-  },
-  methods: {
-    reset() {
-      this.search = "";
-      this.loading = false;
-      this.assignTargetRecipes = [];
-      this.catsToAssign = [];
-      this.tagsToAssign = [];
-    },
-    assignAll() {
-      this.loading = true;
-      this.results.forEach(async element => {
-        element.recipeCategory = element.recipeCategory.concat(this.catsToAssign);
-        element.tags = element.tags.concat(this.tagsToAssign);
-        await api.recipes.patch(element);
-      });
-      this.loading = false;
-      this.closeDialog();
-    },
-    closeDialog() {
-      this.$refs.assignDialog.close();
-    },
-    async openDialog() {
-      this.$refs.assignDialog.open();
-      this.reset();
-    },
-    getResults() {
-      this.loading = true;
-
-      // cancel pending call
-      clearTimeout(this._timerId);
-      this._timerId = setTimeout(() => {
-        this.results = this.filterResults();
-      }, 300);
-      this.loading = false;
-      // delay new call 500ms
-    },
-    filterResults() {
-      if (this.search === null || this.search === "") {
-        return [];
-      }
-      return this.allRecipes.filter(x => {
-        return this.checkForKeywords(x.name) || this.checkForKeywords(x.description);
-      });
-    },
-    checkForKeywords(str) {
-      const searchStr = str.toLowerCase();
-      return this.keywords.some(x => searchStr.includes(x));
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/RemoveUnused.vue b/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/RemoveUnused.vue
deleted file mode 100644
index c5df2b71a451..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/RemoveUnused.vue
+++ /dev/null
@@ -1,89 +0,0 @@
-<template>
-  <div>
-    <base-dialog
-      ref="deleteDialog"
-      :title-icon="$globals.icons.tags"
-      color="error"
-      :title="$t('general.delete') + ' ' + (isTags ? $t('tag.tags') : $t('recipe.categories'))"
-      :loading="loading"
-      modal-width="400"
-    >
-      <v-list v-if="deleteList.length > 0">
-        <v-list-item v-for="item in deleteList" :key="item.slug">
-          <v-list-item-content>
-            {{ item.name }}
-          </v-list-item-content>
-        </v-list-item>
-      </v-list>
-      <v-card-text v-else class=" mt-4 text-center">
-        {{ $t("settings.toolbox.no-unused-items") }}
-      </v-card-text>
-      <template slot="card-actions">
-        <v-btn text color="grey" @click="closeDialog">
-          {{ $t("general.cancel") }}
-        </v-btn>
-        <v-spacer></v-spacer>
-        <v-btn color="error" @click="deleteUnused" :loading="loading" :disabled="deleteList.length < 1">
-          {{ $t("general.delete") }}
-        </v-btn>
-      </template>
-    </base-dialog>
-
-    <v-btn @click="openDialog" small color="error" class="mr-1">
-      {{ $t("settings.toolbox.remove-unused") }}
-    </v-btn>
-  </div>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import { api } from "@/api";
-export default {
-  props: {
-    isTags: {
-      default: true,
-    },
-  },
-  components: {
-    BaseDialog,
-  },
-  data() {
-    return {
-      deleteList: [],
-      loading: false,
-    };
-  },
-  methods: {
-    closeDialog() {
-      this.$refs.deleteDialog.close();
-    },
-    async openDialog() {
-      this.$refs.deleteDialog.open();
-      if (this.isTags) {
-        this.deleteList = await api.tags.getEmpty();
-      } else {
-        this.deleteList = await api.categories.getEmpty();
-      }
-    },
-
-    async deleteUnused() {
-      this.loading = true;
-      if (this.isTags) {
-        this.deleteList.forEach(async element => {
-          await api.tags.delete(element.slug, true);
-        });
-        this.$store.dispatch("requestTags");
-      } else {
-        this.deleteList.forEach(async element => {
-          await api.categories.delete(element.slug, true);
-        });
-        this.$store.dispatch("requestCategories");
-      }
-      this.loading = false;
-      this.closeDialog();
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue b/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue
deleted file mode 100644
index d3fe0715b182..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/CategoryTagEditor/index.vue
+++ /dev/null
@@ -1,237 +0,0 @@
-<template>
-  <v-card outlined class="mt-n1">
-    <BaseDialog
-      ref="renameDialog"
-      :title-icon="$globals.icons.tags"
-      :title="renameTarget.title"
-      :submit-text="$t('general.update')"
-      modal-width="800"
-      @submit="renameFromDialog(renameTarget.slug, renameTarget.newName)"
-    >
-      <v-form ref="renameForm">
-        <v-card-text>
-          <v-text-field
-            :placeholder="$t('settings.toolbox.new-name')"
-            :rules="[existsRule]"
-            v-model="renameTarget.newName"
-          ></v-text-field>
-        </v-card-text>
-      </v-form>
-      <template slot="below-actions">
-        <v-card-title class="headline">
-          {{ $tc("settings.toolbox.recipes-affected", renameTarget.recipes.length || 0) }}
-        </v-card-title>
-        <MobileRecipeCard
-          class="ml-2 mr-2 mt-2 mb-2"
-          v-for="recipe in renameTarget.recipes"
-          :key="recipe.slug"
-          :slug="recipe.slug"
-          :name="recipe.name"
-          :description="recipe.description"
-          :rating="recipe.rating"
-          :route="false"
-          :tags="recipe.tags"
-        />
-      </template>
-    </BaseDialog>
-
-    <div class="d-flex justify-center align-center pa-2 flex-wrap">
-      <NewCategoryTagDialog ref="newDialog" :tag-dialog="isTags">
-        <v-btn @click="openNewDialog" small color="success" class="mr-1 mb-1">
-          {{ $t("general.create") }}
-        </v-btn>
-      </NewCategoryTagDialog>
-
-      <BulkAssign isTags="isTags" class="mr-1 mb-1" />
-
-      <v-btn @click="titleCaseAll" small color="success" class="mr-1 mb-1" :loading="loadingTitleCase">
-        {{ $t("settings.toolbox.title-case-all") }}
-      </v-btn>
-      <RemoveUnused :isTags="isTags" class="mb-1" />
-
-      <v-spacer v-if="!isMobile"> </v-spacer>
-
-      <fuse-search-bar class="fit-search mr-2" :raw-data="allItems" @results="filterItems" :search="searchString">
-        <v-text-field
-          v-model="searchString"
-          clearable
-          solo
-          dense
-          class="mx-2"
-          hide-details
-          single-line
-          :placeholder="$t('search.search')"
-          :prepend-inner-icon="$globals.icons.search"
-        >
-        </v-text-field>
-      </fuse-search-bar>
-    </div>
-    <v-divider></v-divider>
-
-    <v-card-text>
-      <v-row>
-        <v-col cols="12" :sm="12" :md="6" :lg="4" :xl="3" v-for="item in results" :key="item.id">
-          <v-card>
-            <v-card-title class="py-1">{{ item.name }}</v-card-title>
-            <v-divider class="mx-2"></v-divider>
-            <v-card-actions>
-              <ConfirmationDialog
-                :title="$t('general.confirm') + ' ' + $t('general.delete')"
-                :icon="$globals.icons.tags"
-                :message="$t('general.confirm-delete-generic')"
-                @confirm="deleteItem(item.slug)"
-              >
-                <template v-slot="{ open }">
-                  <TheButton minor small delete @click="open"></TheButton>
-                </template>
-              </ConfirmationDialog>
-              <v-spacer></v-spacer>
-              <TheButton small edit @click="openEditDialog(item)" />
-            </v-card-actions>
-          </v-card>
-        </v-col>
-      </v-row>
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import FuseSearchBar from "@/components/UI/Search/FuseSearchBar";
-import MobileRecipeCard from "@/components/Recipe/MobileRecipeCard";
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-import RemoveUnused from "./RemoveUnused";
-import BulkAssign from "./BulkAssign";
-import NewCategoryTagDialog from "@/components/UI/Dialogs/NewCategoryTagDialog";
-import ConfirmationDialog from "@/components/UI/Dialogs/ConfirmationDialog.vue";
-import TheButton from "@/components/UI/Buttons/TheButton.vue";
-export default {
-  mixins: [validators],
-  components: {
-    BaseDialog,
-    MobileRecipeCard,
-    FuseSearchBar,
-    RemoveUnused,
-    NewCategoryTagDialog,
-    BulkAssign,
-    ConfirmationDialog,
-    TheButton,
-  },
-  props: {
-    isTags: {
-      default: true,
-    },
-  },
-  data() {
-    return {
-      loadingTitleCase: false,
-      searchString: "",
-      searchResults: [],
-      renameTarget: {
-        title: "",
-        name: "",
-        slug: "",
-        newName: "",
-        recipes: [],
-      },
-    };
-  },
-  computed: {
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-    allItems() {
-      return this.isTags ? this.$store.getters.getAllTags : this.$store.getters.getAllCategories;
-    },
-    results() {
-      if (this.searchString != null && this.searchString.length >= 1) {
-        return this.searchResults;
-      }
-      return this.allItems;
-    },
-  },
-  methods: {
-    filterItems(val) {
-      this.searchResults = val.map(x => x.item);
-    },
-    openNewDialog() {
-      this.$refs.newDialog.open();
-    },
-    async openEditDialog(item) {
-      let fromAPI = {};
-      if (this.isTags) {
-        fromAPI = await api.tags.getRecipesInTag(item.slug);
-      } else {
-        fromAPI = await api.categories.getRecipesInCategory(item.slug);
-      }
-
-      this.renameTarget = {
-        title: this.$t("general.rename-object", [item.name]),
-        name: item.name,
-        slug: item.slug,
-        newName: "",
-        recipes: fromAPI.recipes,
-      };
-
-      this.$refs.renameDialog.open();
-    },
-    async deleteItem(name) {
-      if (this.isTags) {
-        await api.tags.delete(name);
-      } else {
-        await api.categories.delete(name);
-      }
-    },
-    async renameFromDialog(name, newName) {
-      if (this.$refs.renameForm.validate()) {
-        await this.rename(name, newName);
-      }
-      this.$refs.renameDialog.close();
-    },
-    async rename(name, newName) {
-      if (this.isTags) {
-        await api.tags.update(name, newName);
-      } else {
-        await api.categories.update(name, newName);
-      }
-    },
-    titleCase(lowerName) {
-      return lowerName.replace(/(?:^|\s|-)\S/g, x => x.toUpperCase());
-    },
-    async titleCaseAll() {
-      this.loadingTitleCase = true;
-      const renameList = this.allItems.map(x => ({
-        slug: x.slug,
-        name: x.name,
-        newName: this.titleCase(x.name),
-      }));
-
-      if (this.isTags) {
-        renameList.forEach(async element => {
-          if (element.name === element.newName) return;
-          await api.tags.update(element.slug, element.newName, true);
-        });
-        this.$store.dispatch("requestTags");
-      } else {
-        renameList.forEach(async element => {
-          if (element.name === element.newName) return;
-          await api.categories.update(element.slug, element.newName, true);
-        });
-        this.$store.dispatch("requestCategories");
-      }
-      this.loadingTitleCase = false;
-    },
-  },
-};
-</script>
-
-<style>
-.overflow-fix .v-toolbar__content {
-  height: auto !important;
-  flex-wrap: wrap;
-}
-.fit-search {
-  max-width: 300px;
-}
-</style>
diff --git a/frontend.old/src/pages/Admin/ToolBox/EventNotification.vue b/frontend.old/src/pages/Admin/ToolBox/EventNotification.vue
deleted file mode 100644
index c022dbb3c1e5..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/EventNotification.vue
+++ /dev/null
@@ -1,213 +0,0 @@
-<template>
-  <div>
-    <v-card outlined class="mt-n1">
-      <v-card-actions>
-        <v-spacer></v-spacer>
-        <BaseDialog
-          :keep-open="keepDialogOpen"
-          :title-icon="$globals.icons.bellAlert"
-          :title="$t('general.new') + ' ' + $t('events.notification')"
-          @submit="createNotification"
-        >
-          <template v-slot:open="{ open }">
-            <TheButton create small @click="open"> {{ $t("events.notification") }}</TheButton>
-          </template>
-          <template v-slot:default>
-            <v-card-text class="mt-2">
-              {{ $t("events.new-notification-form-description") }}
-
-              <div class="d-flex justify-space-around mt-1 mb-3">
-                <a href="https://github.com/caronc/apprise/wiki" target="_blanks"> Apprise </a>
-                <a href="https://github.com/caronc/apprise/wiki/Notify_gotify" target="_blanks"> Gotify </a>
-                <a href="https://github.com/caronc/apprise/wiki/Notify_discord" target="_blanks"> Discord </a>
-                <a href="https://github.com/caronc/apprise/wiki/Notify_homeassistant" target="_blanks">
-                  Home Assistant
-                </a>
-                <a href="https://github.com/caronc/apprise/wiki/Notify_matrix" target="_blanks"> Matrix </a>
-                <a href="https://github.com/caronc/apprise/wiki/Notify_pushover" target="_blanks"> Pushover </a>
-              </div>
-
-              <v-form ref="notificationForm">
-                <v-select
-                  :label="$t('general.type')"
-                  :rules="[existsRule]"
-                  :items="notificationTypes"
-                  item-value="text"
-                  v-model="newNotification.type"
-                >
-                </v-select>
-                <v-text-field :rules="[existsRule]" :label="$t('general.name')" v-model="newNotification.name">
-                </v-text-field>
-                <v-text-field
-                  required
-                  :rules="[existsRule]"
-                  :label="$t('events.apprise-url')"
-                  v-model="newNotification.notificationUrl"
-                >
-                </v-text-field>
-                <v-btn class="d-flex ml-auto" small color="info" @click="testByURL(newNotification.notificationUrl)">
-                  <v-icon left> {{ $globals.icons.testTube }}</v-icon>
-                  {{ $t("general.test") }}
-                </v-btn>
-                <v-subheader class="pa-0 mb-0">
-                  {{ $t("events.subscribed-events") }}
-                </v-subheader>
-                <v-row class="mt-1">
-                  <v-col cols="3" v-for="(item, key, index) in newNotificationOptions" :key="index">
-                    <v-checkbox class="my-n3 py-0" v-model="newNotificationOptions[key]" :label="key"> </v-checkbox>
-                  </v-col>
-                </v-row>
-              </v-form>
-            </v-card-text>
-          </template>
-        </BaseDialog>
-      </v-card-actions>
-      <v-data-table
-        disable-sort
-        :headers="headers"
-        :items="notifications"
-        class="elevation-1 text-center"
-        :footer-props="{
-          'items-per-page-options': [10, 20, 30, 40, -1],
-        }"
-        :items-per-page="10"
-      >
-        <template v-for="boolHeader in headers" v-slot:[`item.${boolHeader.value}`]="{ item }">
-          <div :key="boolHeader.value">
-            <div v-if="boolHeader.value === 'type'">
-              <v-avatar size="35" class="ma-1" :color="getIcon(item.type).icon ? 'primary' : undefined">
-                <v-icon dark v-if="getIcon(item.type).icon"> {{ getIcon(item.type).icon }}</v-icon>
-                <v-img v-else :src="getIcon(item.type).image"> </v-img>
-              </v-avatar>
-              {{ item[boolHeader.value] }}
-            </div>
-            <v-icon
-              v-else-if="item[boolHeader.value] === true || item[boolHeader.value] === false"
-              :color="item[boolHeader.value] ? 'success' : 'gray'"
-            >
-              {{ item[boolHeader.value] ? $globals.icons.check : $globals.icons.close }}
-            </v-icon>
-            <div v-else-if="boolHeader.text === 'Actions'">
-              <TheButton class="mr-1" delete x-small minor @click="deleteNotification(item.id)" />
-              <TheButton edit x-small @click="testByID(item.id)">
-                <template v-slot:icon>
-                  {{ $globals.icons.testTube }}
-                </template>
-                {{ $t("general.test") }}
-              </TheButton>
-            </div>
-            <div v-else>
-              {{ item[boolHeader.value] }}
-            </div>
-          </div>
-        </template>
-      </v-data-table>
-    </v-card>
-  </div>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import { api } from "@/api";
-import { validators } from "@/mixins/validators";
-export default {
-  components: {
-    BaseDialog,
-  },
-  mixins: [validators],
-  data() {
-    return {
-      keepDialogOpen: false,
-      notifications: [],
-      newNotification: {
-        type: "General",
-        name: "",
-        notificationUrl: "",
-      },
-      newNotificationOptions: {
-        general: true,
-        recipe: true,
-        backup: true,
-        scheduled: true,
-        migration: true,
-        group: true,
-        user: true,
-      },
-      notificationTypes: [
-        {
-          text: "General",
-          icon: this.$globals.icons.bellAlert,
-        },
-        {
-          text: "Discord",
-          image: "/static/discord.svg",
-        },
-        {
-          text: "Gotify",
-          image: "/static/gotify.png",
-        },
-        {
-          text: "Home Assistant",
-          image: "/static/home-assistant.png",
-        },
-        {
-          text: "Pushover",
-          image: "/static/pushover.svg",
-        },
-      ],
-    };
-  },
-  created() {
-    this.getAllNotifications();
-  },
-  computed: {
-    headers() {
-      return [
-        { text: this.$t("general.type"), value: "type" },
-        { text: this.$t("general.name"), value: "name" },
-        { text: this.$t("general.general"), value: "general", align: "center" },
-        { text: this.$t("general.recipe"), value: "recipe", align: "center" },
-        { text: this.$t("events.database"), value: "backup", align: "center" },
-        { text: this.$t("events.scheduled"), value: "scheduled", align: "center" },
-        { text: this.$t("settings.migrations"), value: "migration", align: "center" },
-        { text: this.$t("group.group"), value: "group", align: "center" },
-        { text: this.$t("user.user"), value: "user", align: "center" },
-        { text: "Actions", align: "center" },
-      ];
-    },
-  },
-  methods: {
-    getIcon(textValue) {
-      return this.notificationTypes.find(x => x.text === textValue);
-    },
-    async getAllNotifications() {
-      this.notifications = await api.about.allEventNotifications();
-    },
-    async createNotification() {
-      if (this.$refs.notificationForm.validate()) {
-        this.keepDialogOpen = false;
-        await api.about.createNotification({ ...this.newNotification, ...this.newNotificationOptions });
-        this.getAllNotifications();
-      } else {
-        this.keepDialogOpen = true;
-      }
-    },
-    async deleteNotification(id) {
-      await api.about.deleteNotification(id);
-      this.getAllNotifications();
-    },
-    async testByID(id) {
-      await api.about.testNotificationByID(id);
-    },
-    async testByURL(url) {
-      await api.about.testNotificationByURL(url);
-    },
-  },
-};
-</script>
-
-<style scoped>
-th {
-  text-align: center !important;
-}
-</style>
diff --git a/frontend.old/src/pages/Admin/ToolBox/RecipeOrganizer.vue b/frontend.old/src/pages/Admin/ToolBox/RecipeOrganizer.vue
deleted file mode 100644
index 9e08cfb536be..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/RecipeOrganizer.vue
+++ /dev/null
@@ -1,91 +0,0 @@
-<template>
-  <v-card outlined class="mt-n1">
-    <div class="d-flex justify-center align-center pa-2 flex-wrap">
-      <v-btn-toggle v-model="filter" mandatory color="primary">
-        <v-btn small value="category">
-          <v-icon>{{ $globals.icons.tags }}-multiple</v-icon>
-          {{ $t("recipe.categories") }}
-        </v-btn>
-
-        <v-btn small value="tag">
-          <v-icon>{{ $globals.icons.tags }}-multiple</v-icon>
-          {{ $t("tag.tags") }}
-        </v-btn>
-      </v-btn-toggle>
-      <v-spacer v-if="!isMobile"> </v-spacer>
-    </div>
-    <v-card-text>
-      <CardSection :sortable="true" :title="$t('settings.toolbox.unorganized')" :recipes="shownRecipes" @sort="assignSorted" />
-    </v-card-text>
-  </v-card>
-</template>
-
-<script>
-import { api } from "@/api";
-import CardSection from "@/components/UI/CardSection";
-export default {
-  components: {
-    // FuseSearchBar,
-    CardSection,
-  },
-  data() {
-    return {
-      buttonToggle: 0,
-      tagRecipes: [],
-      categoryRecipes: [],
-      searchString: "",
-      sortedResults: [],
-    };
-  },
-  computed: {
-    shownRecipes() {
-      if (this.sortedResults.length > 0) {
-        return this.sortedResults;
-      } else {
-        switch (this.filter) {
-          case "category":
-            return this.categoryRecipes;
-          case "tag":
-            return this.tagRecipes;
-          default:
-            return [];
-        }
-      }
-    },
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-    isCategory() {
-      return this.buttonToggle === 0;
-    },
-    filter: {
-      set(filter) {
-        this.$router.replace({ query: { ...this.$route.query, filter } });
-      },
-      get() {
-        return this.$route.query.filter;
-      },
-    },
-  },
-  created() {
-    this.refreshUnorganized();
-  },
-  methods: {
-    filterItems(val) {
-      this.searchResults = val.map(x => x.item);
-    },
-    async refreshUnorganized() {
-      this.loading = true;
-      this.tagRecipes = await api.recipes.allUntagged();
-      this.categoryRecipes = await api.recipes.allUnategorized();
-      this.loading = false;
-    },
-    assignSorted(val) {
-      this.sortedResults = val;
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped>
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/Admin/ToolBox/index.vue b/frontend.old/src/pages/Admin/ToolBox/index.vue
deleted file mode 100644
index c80cce98db44..000000000000
--- a/frontend.old/src/pages/Admin/ToolBox/index.vue
+++ /dev/null
@@ -1,62 +0,0 @@
-<template>
-  <div>
-    <v-card flat>
-      <v-tabs v-model="tab" background-color="primary" centered dark icons-and-text show-arrows>
-        <v-tabs-slider></v-tabs-slider>
-
-        <v-tab href="#event-notifications">
-          {{ $t("settings.notify") }}
-          <v-icon>{{ $globals.icons.bellAlert }}</v-icon>
-        </v-tab>
-        <v-tab href="#category-editor">
-          {{ $t("recipe.categories") }}
-          <v-icon>{{ $globals.icons.tags }}</v-icon>
-        </v-tab>
-
-        <v-tab href="#tag-editor">
-          {{ $t("tag.tags") }}
-          <v-icon>{{ $globals.icons.tags }}</v-icon>
-        </v-tab>
-        <v-tab href="#organize">
-          {{ $t("settings.organize") }}
-          <v-icon>{{ $globals.icons.broom }}</v-icon>
-        </v-tab>
-      </v-tabs>
-
-      <v-tabs-items v-model="tab">
-        <v-tab-item value="event-notifications"> <EventNotification /></v-tab-item>
-        <v-tab-item value="category-editor"> <CategoryTagEditor :is-tags="false"/></v-tab-item>
-        <v-tab-item value="tag-editor"> <CategoryTagEditor :is-tags="true" /> </v-tab-item>
-        <v-tab-item value="organize"> <RecipeOrganizer /> </v-tab-item>
-      </v-tabs-items>
-    </v-card>
-  </div>
-</template>
-
-<script>
-import EventNotification from "./EventNotification";
-import CategoryTagEditor from "./CategoryTagEditor";
-import RecipeOrganizer from "./RecipeOrganizer";
-export default {
-  components: {
-    CategoryTagEditor,
-    EventNotification,
-    RecipeOrganizer,
-  },
-  computed: {
-    tab: {
-      set(tab) {
-        this.$router.replace({ query: { ...this.$route.query, tab } });
-      },
-      get() {
-        return this.$route.query.tab;
-      },
-    },
-  },
-  data() {
-    return {};
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Admin/index.vue b/frontend.old/src/pages/Admin/index.vue
deleted file mode 100644
index 55456e5b9030..000000000000
--- a/frontend.old/src/pages/Admin/index.vue
+++ /dev/null
@@ -1,13 +0,0 @@
-<template>
-  <v-container fluid class="pa-5">
-    <v-slide-x-transition hide-on-leave>
-      <router-view></router-view>
-    </v-slide-x-transition>
-  </v-container>
-</template>
-
-<script>
-export default {};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Debug.vue b/frontend.old/src/pages/Debug.vue
deleted file mode 100644
index d4b8db4ee2a2..000000000000
--- a/frontend.old/src/pages/Debug.vue
+++ /dev/null
@@ -1,19 +0,0 @@
-<template>
-  <v-container>
-    <LastRecipe />
-    <LogFile class="mt-2" />
-  </v-container>
-</template>
-
-<script>
-import LastRecipe from "@/components/Debug/LastRecipe";
-import LogFile from "@/components/Debug/LogFile";
-export default {
-  components: {
-    LastRecipe,
-    LogFile,
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/HomePage.vue b/frontend.old/src/pages/HomePage.vue
deleted file mode 100644
index 74b8449e824d..000000000000
--- a/frontend.old/src/pages/HomePage.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <v-container>
-    <CardSection
-      title-icon="mdi-none"
-      v-if="siteSettings.showRecent"
-      :title="$t('general.recent')"
-      :recipes="recentRecipes"
-      :hard-limit="siteSettings.cardsPerSection"
-    />
-    <CardSection
-      :sortable="true"
-      v-for="(section, index) in recipeByCategory"
-      :key="section.name + section.position"
-      :title="section.name"
-      :recipes="section.recipes"
-      :hard-limit="siteSettings.cardsPerSection"
-      @sort="sortAZ(index)"
-      @sort-recent="sortRecent(index)"
-    />
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-import CardSection from "../components/UI/CardSection";
-
-export default {
-  components: {
-    CardSection,
-  },
-  data() {
-    return {
-      recipeByCategory: [],
-    };
-  },
-  async created() {
-    await this.$store.dispatch("requestRecentRecipes");
-    await this.buildPage();
-    this.recipeByCategory.sort((a, b) => a.position - b.position);
-  },
-  computed: {
-    siteSettings() {
-      return this.$store.getters.getSiteSettings;
-    },
-    recentRecipes() {
-      return this.$store.getters.getRecentRecipes;
-    },
-  },
-
-  methods: {
-    async buildPage() {
-      await this.$store.dispatch("requestSiteSettings");
-      this.siteSettings.categories.forEach(async element => {
-        let recipes = await this.getRecipeByCategory(element.slug);
-        if (recipes.recipes.length < 0) recipes.recipes = [];
-        this.recipeByCategory.push(recipes);
-      });
-    },
-    async getRecipeByCategory(category) {
-      return await api.categories.getRecipesInCategory(category);
-    },
-    getRecentRecipes() {
-      this.$store.dispatch("requestRecentRecipes");
-    },
-    sortAZ(index) {
-      this.recipeByCategory[index].recipes.sort((a, b) => (a.name > b.name ? 1 : -1));
-    },
-    sortRecent(index) {
-      this.recipeByCategory[index].recipes.sort((a, b) => (a.dateAdded > b.dateAdded ? -1 : 1));
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/LoginPage.vue b/frontend.old/src/pages/LoginPage.vue
deleted file mode 100644
index 996b40b5235c..000000000000
--- a/frontend.old/src/pages/LoginPage.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<template>
-  <v-container fill-height class="text-center">
-    <v-row>
-      <v-flex class="d-flex justify-center" width="500px">
-        <LoginForm @logged-in="redirectMe" class="ma-1" />
-      </v-flex>
-    </v-row>
-    <v-row></v-row>
-  </v-container>
-</template>
-
-<script>
-import LoginForm from "../components/Login/LoginForm";
-export default {
-  components: {
-    LoginForm,
-  },
-  computed: {
-    viewScale() {
-      switch (this.$vuetify.breakpoint.name) {
-        case "xs":
-          return true;
-        case "sm":
-          return true;
-        default:
-          return false;
-      }
-    },
-  },
-  methods: {
-    redirectMe() {
-      if (this.$route.query.redirect) {
-        this.$router.push(this.$route.query.redirect);
-      } else this.$router.push({ path: "/" });
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/MealPlan/Planner.vue b/frontend.old/src/pages/MealPlan/Planner.vue
deleted file mode 100644
index 15c1dc59c0b7..000000000000
--- a/frontend.old/src/pages/MealPlan/Planner.vue
+++ /dev/null
@@ -1,150 +0,0 @@
-<template>
-  <v-container>
-    <EditPlan v-if="editMealPlan" :meal-plan="editMealPlan" @updated="planUpdated" />
-    <NewMeal v-else @created="requestMeals" class="mb-5" />
-
-    <v-card class="my-2">
-      <v-card-title class="headline">
-        {{ $t("meal-plan.meal-plans") }}
-      </v-card-title>
-      <v-divider></v-divider>
-    </v-card>
-    <v-row dense>
-      <v-col :sm="6" :md="6" :lg="4" :xl="3" v-for="(mealplan, i) in plannedMeals" :key="i">
-        <v-card class="mt-1">
-          <v-card-title class="mb-0 pb-0">
-            {{ $d(new Date(mealplan.startDate.replaceAll("-", "/")), "short") }} -
-            {{ $d(new Date(mealplan.endDate.replaceAll("-", "/")), "short") }}
-          </v-card-title>
-          <v-divider class="mx-2 pa-1"></v-divider>
-          <v-card-actions class="mb-0 px-2 py-0">
-            <v-btn text small v-if="!mealplan.shoppingList" color="info" @click="createShoppingList(mealplan.uid)">
-              <v-icon left small>
-                {{ $globals.icons.cartCheck }}
-              </v-icon>
-              {{ $t("shopping-list.create-shopping-list") }}
-            </v-btn>
-            <v-btn
-              text
-              small
-              v-else
-              color="info"
-              class="mx-0"
-              :to="{ path: '/shopping-list', query: { list: mealplan.shoppingList } }"
-            >
-              <v-icon left small>
-                {{ $globals.icons.mdiCartCheck }}
-              </v-icon>
-              {{ $t("shopping-list.shopping-list") }}
-            </v-btn>
-            <v-spacer></v-spacer>
-            <AppCopyButton color="info" :copy-text="mealPlanURL(mealplan.uid)">
-              {{ $t("general.link-copied") }}
-            </AppCopyButton>
-          </v-card-actions>
-
-          <v-list class="mt-0 pt-0">
-            <v-list-group v-for="(planDay, pdi) in mealplan.planDays" :key="`planDays-${pdi}`">
-              <template v-slot:activator>
-                <v-list-item-avatar color="primary" class="headline font-weight-light white--text">
-                  <v-img :src="getImage(planDay['meals'][0].slug)"></v-img>
-                </v-list-item-avatar>
-                <v-list-item-content>
-                  <v-list-item-title
-                    v-html="$d(new Date(planDay.date.replaceAll('-', '/')), 'short')"
-                  ></v-list-item-title>
-                  <v-list-item-subtitle v-html="planDay['meals'][0].name"></v-list-item-subtitle>
-                </v-list-item-content>
-              </template>
-
-              <v-list-item
-                three-line
-                v-for="(meal, index) in planDay.meals"
-                :key="generateKey(meal.slug, index)"
-                :to="meal.slug ? `/recipe/${meal.slug}` : null"
-              >
-                <v-list-item-avatar color="primary" class="headline font-weight-light white--text">
-                  <v-img :src="getImage(meal.slug)"></v-img>
-                </v-list-item-avatar>
-                <v-list-item-content>
-                  <v-list-item-title v-html="meal.name"></v-list-item-title>
-                  <v-list-item-subtitle v-html="meal.description"> </v-list-item-subtitle>
-                </v-list-item-content>
-              </v-list-item>
-            </v-list-group>
-          </v-list>
-
-          <v-card-actions class="mt-n3">
-            <TheButton small secondary delete @click="deletePlan(mealplan.uid)" />
-            <v-spacer></v-spacer>
-            <TheButton small edit @click="editPlan(mealplan.uid)" />
-          </v-card-actions>
-        </v-card>
-      </v-col>
-    </v-row>
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-import { utils } from "@/utils";
-import NewMeal from "@/components/MealPlan/MealPlanNew";
-import EditPlan from "@/components/MealPlan/MealPlanEditor";
-import AppCopyButton from "@/components/UI/Buttons/AppCopyButton";
-export default {
-  components: {
-    NewMeal,
-    EditPlan,
-    AppCopyButton,
-  },
-  data: () => ({
-    plannedMeals: [],
-    editMealPlan: null,
-  }),
-  async created() {
-    this.requestMeals();
-  },
-  methods: {
-    async requestMeals() {
-      const response = await api.mealPlans.all();
-      this.plannedMeals = response.data;
-    },
-    mealPlanURL(uid) {
-      return window.location.origin + "/meal-plan?id=" + uid;
-    },
-    generateKey(name, index) {
-      return utils.generateUniqueKey(name, index);
-    },
-    getImage(image) {
-      return api.recipes.recipeTinyImage(image);
-    },
-
-    editPlan(id) {
-      this.plannedMeals.forEach((element) => {
-        if (element.uid === id) {
-          this.editMealPlan = element;
-        }
-      });
-    },
-    planUpdated() {
-      this.editMealPlan = null;
-      this.requestMeals();
-    },
-    async deletePlan(id) {
-      if (await api.mealPlans.delete(id)) {
-        this.requestMeals();
-      }
-    },
-    async createShoppingList(id) {
-      await api.mealPlans.shoppingList(id);
-      this.requestMeals();
-      this.$store.dispatch("requestCurrentGroup");
-    },
-    redirectToList(id) {
-      this.$router.push(id);
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/MealPlan/ThisWeek.vue b/frontend.old/src/pages/MealPlan/ThisWeek.vue
deleted file mode 100644
index 002d4da30654..000000000000
--- a/frontend.old/src/pages/MealPlan/ThisWeek.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <v-container>
-    <div v-for="(planDay, index) in mealPlan.planDays" :key="index" class="mb-5">
-      <v-card-title class="headline">
-        {{ $d(new Date(planDay.date), "short") }}
-      </v-card-title>
-      <v-divider class="mx-2"></v-divider>
-      <v-row>
-        <v-col cols="12" md="5" sm="12">
-          <v-card-title class="headline">{{ $t('meal-plan.main') }}</v-card-title>
-          <RecipeCard
-            :name="planDay.meals[0].name"
-            :slug="planDay.meals[0].slug"
-            :description="planDay.meals[0].description"
-          />
-        </v-col>
-        <v-col cols="12" lg="6" md="6" sm="12">
-          <v-card-title class="headline">{{ $t('meal-plan.sides') }}</v-card-title>
-          <MobileRecipeCard
-            class="mb-1"
-            v-for="(side, index) in planDay.meals.slice(1)"
-            :key="`side-${index}`"
-            :name="side.name"
-            :slug="side.slug"
-            :description="side.description"
-          />
-        </v-col>
-      </v-row>
-    </div>
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-import { utils } from "@/utils";
-import RecipeCard from "@/components/Recipe/RecipeCard";
-import MobileRecipeCard from "@/components/Recipe/MobileRecipeCard";
-export default {
-  components: {
-    RecipeCard,
-    MobileRecipeCard,
-  },
-  data() {
-    return {
-      mealPlan: {},
-    };
-  },
-  async created() {
-    if (this.mealplanId) {
-      this.mealPlan = await api.mealPlans.getById(this.mealplanId);
-    } else {
-      this.mealPlan = await api.mealPlans.thisWeek();
-    }
-    if (!this.mealPlan) {
-      utils.notify.warning(this.$t("meal-plan.no-meal-plan-defined-yet"));
-    }
-  },
-  computed: {
-    mealplanId() {
-      return this.$route.query.id || false;
-    },
-  },
-  methods: {
-    getOrder(index) {
-      if (index % 2 == 0) return 2;
-      else return 0;
-    },
-    getImage(image) {
-      return api.recipes.recipeImage(image);
-    },
-  },
-};
-</script>
-
-<style scoped></style>
diff --git a/frontend.old/src/pages/Recipe/NewRecipe.vue b/frontend.old/src/pages/Recipe/NewRecipe.vue
deleted file mode 100644
index 6e100865d900..000000000000
--- a/frontend.old/src/pages/Recipe/NewRecipe.vue
+++ /dev/null
@@ -1,126 +0,0 @@
-<template>
-  <v-container>
-    <v-card :loading="isLoading">
-      <v-img v-if="image" height="400" :src="image">
-        <template v-slot:placeholder>
-          <v-row class="fill-height ma-0" align="center" justify="center">
-            <v-progress-circular indeterminate color="grey lighten-5"></v-progress-circular>
-          </v-row>
-        </template>
-      </v-img>
-      <br v-else />
-
-      <RecipePageActionMenu
-        logged-in
-        :value="true"
-        @json="jsonEditor = true"
-        @edit="jsonEditor = false"
-        @save="createRecipe"
-      />
-
-      <div v-if="jsonEditor">
-        <!-- Probably not the best way, but it works! -->
-        <br />
-        <br />
-        <VJsoneditor v-model="recipeDetails" height="1500px" :options="jsonEditorOptions" />
-      </div>
-
-      <RecipeEditor ref="recipeEditor" v-else v-model="recipeDetails" @upload="getImage" />
-    </v-card>
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-
-import RecipeEditor from "@/components/Recipe/RecipeEditor";
-import RecipePageActionMenu from "@/components/Recipe/RecipePageActionMenu";
-export default {
-  components: {
-    VJsoneditor: () => import(/* webpackChunkName: "json-editor" */ "v-jsoneditor"),
-    RecipeEditor,
-    RecipePageActionMenu,
-  },
-  data() {
-    return {
-      isLoading: false,
-      fileObject: null,
-      selectedFile: null,
-      image: null,
-      jsonEditor: false,
-      jsonEditorOptions: {
-        mode: "code",
-        search: false,
-        mainMenuBar: false,
-      },
-      recipeDetails: {
-        name: "",
-        description: "",
-        image: "",
-        recipeYield: "",
-        recipeIngredient: [],
-        recipeInstructions: [],
-        slug: "",
-        filePath: "",
-        tags: [],
-        categories: [],
-        // dateAdded: "",
-        notes: [],
-        extras: {},
-        assets: [],
-        settings: {
-          public: true,
-          showNutrition: true,
-          showAssets: true,
-          landscapeView: true,
-          disableComments: false,
-          disableAmount: true,
-        },
-      },
-    };
-  },
-  created() {
-    this.getDefaultSettings();
-  },
-
-  methods: {
-    async getDefaultSettings() {
-      const response = await api.recipes.getDefaultSettings();
-      this.recipeDetails.settings = response.data;
-    },
-    getImage(fileObject) {
-      this.fileObject = fileObject;
-      this.onFileChange();
-    },
-    onFileChange() {
-      this.image = URL.createObjectURL(this.fileObject);
-    },
-
-    async createRecipe() {
-      if (this.$refs.recipeEditor.validateRecipe()) {
-        this.isLoading = true;
-
-        if (this.fileObject) {
-          this.recipeDetails.image = this.fileObject.name;
-        }
-        let slug = await api.recipes.create(this.recipeDetails);
-
-        if (this.fileObject) {
-          api.recipes.updateImage(slug, this.fileObject, true);
-        }
-
-        this.isLoading = false;
-
-        this.$router.push(`/recipe/${slug}`);
-      }
-    },
-  },
-};
-</script>
-
-<style>
-.img-input {
-  position: absolute;
-  bottom: 0;
-}
-</style>
diff --git a/frontend.old/src/pages/Recipe/ScraperDebugger.vue b/frontend.old/src/pages/Recipe/ScraperDebugger.vue
deleted file mode 100644
index 8b91bfb85b0c..000000000000
--- a/frontend.old/src/pages/Recipe/ScraperDebugger.vue
+++ /dev/null
@@ -1,61 +0,0 @@
-<template>
-  <v-container>
-    <v-text-field v-model="testUrl" outlined single-line label="Recipe Url"> </v-text-field>
-    <div class="d-flex">
-      <v-btn class="mt-0 ml-auto" color="info" @click="getTestData">
-        <v-icon left> {{ $globals.icons.testTube }} </v-icon>
-        Test Scrape
-      </v-btn>
-    </div>
-    <VJsoneditor class="mt-2" v-model="recipeJson" height="1500px" :options="jsonEditorOptions" />
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-export default {
-  components: {
-    VJsoneditor: () => import(/* webpackChunkName: "json-editor" */ "v-jsoneditor"),
-  },
-  data() {
-    return {
-      jsonEditorOptions: {
-        mode: "code",
-        search: false,
-        mainMenuBar: false,
-      },
-      recipeJson: {},
-      defaultMessage: { details: "site failed to return valid schema" },
-    };
-  },
-  created() {
-    if (this.$route.query.test_url) {
-      this.getTestData();
-    }
-  },
-  computed: {
-    testUrl: {
-      set(test_url) {
-        this.$router.replace({ query: { ...this.$route.query, test_url } });
-      },
-      get() {
-        return this.$route.query.test_url || "";
-      },
-    },
-  },
-  methods: {
-    async getTestData() {
-      const response = await api.recipes.testScrapeURL(this.testUrl).catch(() => {
-        this.recipeJson = this.defaultMessage;
-      });
-
-      if (response.length < 1) {
-        this.recipeJson = this.defaultMessage;
-        return;
-      }
-
-      this.recipeJson = response;
-    },
-  },
-};
-</script>
diff --git a/frontend.old/src/pages/Recipe/ViewRecipe.vue b/frontend.old/src/pages/Recipe/ViewRecipe.vue
deleted file mode 100644
index 3cc353258b9d..000000000000
--- a/frontend.old/src/pages/Recipe/ViewRecipe.vue
+++ /dev/null
@@ -1,271 +0,0 @@
-<template>
-  <v-container>
-    <v-card v-if="skeleton" :color="`white ${theme.isDark ? 'darken-2' : 'lighten-4'}`" class="pa-3">
-      <v-skeleton-loader class="mx-auto" height="700px" type="card"></v-skeleton-loader>
-    </v-card>
-    <NoRecipe v-else-if="loadFailed" />
-    <v-card v-else-if="!loadFailed" id="myRecipe" class="d-print-none">
-      <v-img
-        :height="hideImage ? '50' : imageHeight"
-        @error="hideImage = true"
-        :src="getImage(recipeDetails.slug)"
-        class="d-print-none"
-        :key="imageKey"
-      >
-        <RecipeTimeCard
-          :class="isMobile ? undefined : 'force-bottom'"
-          :prepTime="recipeDetails.prepTime"
-          :totalTime="recipeDetails.totalTime"
-          :performTime="recipeDetails.performTime"
-        />
-      </v-img>
-      <RecipePageActionMenu
-        :slug="recipeDetails.slug"
-        :name="recipeDetails.name"
-        v-model="form"
-        :logged-in="loggedIn"
-        :open="showIcons"
-        @close="form = false"
-        @json="jsonEditor = !jsonEditor"
-        @edit="
-          jsonEditor = false;
-          form = true;
-        "
-        @save="saveRecipe"
-        @delete="deleteRecipe"
-        class="ml-auto"
-      />
-
-      <RecipeViewer v-if="!form" :recipe="recipeDetails" />
-      <VJsoneditor
-        @error="logError()"
-        class="mt-10"
-        v-else-if="showJsonEditor"
-        v-model="recipeDetails"
-        height="1500px"
-        :options="jsonEditorOptions"
-      />
-      <RecipeEditor
-        v-else
-        v-model="recipeDetails"
-        :class="$vuetify.breakpoint.xs ? 'mt-5' : ''"
-        ref="recipeEditor"
-        @upload="getImageFile"
-      />
-    </v-card>
-    <CommentsSection
-      v-if="recipeDetails.settings && !recipeDetails.settings.disableComments"
-      class="mt-2 d-print-none"
-      :slug="recipeDetails.slug"
-      :comments="recipeDetails.comments"
-      @new-comment="getRecipeDetails"
-      @update-comment="getRecipeDetails"
-    />
-    <PrintView :recipe="recipeDetails" />
-  </v-container>
-</template>
-
-<script>
-import RecipePageActionMenu from "@/components/Recipe/RecipePageActionMenu.vue";
-import { api } from "@/api";
-import RecipeViewer from "@/components/Recipe/RecipeViewer";
-import PrintView from "@/components/Recipe/PrintView";
-import RecipeEditor from "@/components/Recipe/RecipeEditor";
-import RecipeTimeCard from "@/components/Recipe/RecipeTimeCard.vue";
-import NoRecipe from "@/components/Fallbacks/NoRecipe";
-import { user } from "@/mixins/user";
-import { router } from "@/routes";
-import CommentsSection from "@/components/Recipe/CommentSection";
-
-export default {
-  components: {
-    VJsoneditor: () => import(/* webpackChunkName: "json-editor" */ "v-jsoneditor"),
-    RecipeViewer,
-    RecipeEditor,
-    RecipeTimeCard,
-    RecipePageActionMenu,
-    PrintView,
-    NoRecipe,
-    CommentsSection,
-  },
-  mixins: [user],
-  inject: {
-    theme: {
-      default: { isDark: false },
-    },
-  },
-  data() {
-    return {
-      hideImage: false,
-      loadFailed: false,
-      skeleton: true,
-      form: false,
-      jsonEditor: false,
-      jsonEditorOptions: {
-        mode: "code",
-        search: false,
-        mainMenuBar: false,
-      },
-      // Recipe Details //
-      recipeDetails: {
-        name: "",
-        description: "",
-        image: "",
-        recipeYield: "",
-        recipeIngredient: [],
-        recipeInstructions: [],
-        slug: "",
-        filePath: "",
-        url: "",
-        tags: [],
-        categories: [],
-        dateAdded: "",
-        notes: [],
-        rating: 0,
-      },
-      imageKey: 1,
-    };
-  },
-
-  created() {
-    this.getRecipeDetails();
-    this.jsonEditor = false;
-    this.form = this.$route.query.edit === "true" && this.loggedIn;
-  },
-
-  async mounted() {
-    this.checkPrintRecipe();
-  },
-
-  watch: {
-    $route: function() {
-      this.getRecipeDetails();
-      this.checkPrintRecipe();
-    },
-  },
-
-  computed: {
-    loggedIn() {
-      return this.$store.getters.getIsLoggedIn;
-    },
-    isMobile() {
-      return this.$vuetify.breakpoint.name === "xs";
-    },
-    imageHeight() {
-      return this.isMobile ? "200" : "400";
-    },
-    currentRecipe() {
-      return this.$route.params.recipe;
-    },
-    edit() {
-      return true;
-    },
-    showIcons() {
-      return this.form;
-    },
-    showJsonEditor() {
-      if ((this.form === true) & (this.jsonEditor === true)) {
-        return true;
-      } else {
-        return false;
-      }
-    },
-  },
-  methods: {
-    checkPrintRecipe() {
-      if (this.$route.query.print) {
-        this.printPage();
-        this.$router.push(this.$route.path);
-        this.$route.query.print = null;
-      }
-    },
-    getImageFile(fileObject) {
-      this.fileObject = fileObject;
-      this.saveImage();
-    },
-    async getRecipeDetails() {
-      if (this.currentRecipe === "null") {
-        this.skeleton = false;
-        this.loadFailed = true;
-        return;
-      }
-
-      const [response, error] = await api.recipes.requestDetails(this.currentRecipe);
-
-      if (error) {
-        if (error.response.status === 401) router.push(`/login`);
-        if (error.response.status === 404) router.push("/page-not-found");
-      }
-
-      this.recipeDetails = response.data;
-      this.skeleton = false;
-    },
-    getImage(slug) {
-      if (slug) {
-        return api.recipes.recipeImage(slug, this.imageKey, this.recipeDetails.image);
-      }
-    },
-    async deleteRecipe() {
-      let response = await api.recipes.delete(this.recipeDetails.slug);
-      if (response) {
-        router.push(`/`);
-      }
-    },
-    validateRecipe() {
-      if (this.jsonEditor) {
-        return true;
-      } else {
-        return this.$refs.recipeEditor.validateRecipe();
-      }
-    },
-    async saveImage(overrideSuccessMsg = false) {
-      if (this.fileObject) {
-        const newVersion = await api.recipes.updateImage(this.recipeDetails.slug, this.fileObject, overrideSuccessMsg);
-        if (newVersion) {
-          this.recipeDetails.image = newVersion.data.version;
-          this.imageKey += 1;
-        }
-      }
-    },
-    async saveRecipe() {
-      if (this.validateRecipe()) {
-        let slug = await api.recipes.update(this.recipeDetails);
-        if (!slug) return;
-
-        if (this.fileObject) {
-          this.saveImage(true);
-        }
-
-        this.form = false;
-        if (slug != this.recipeDetails.slug) {
-          this.$router.push(`/recipe/${slug}`);
-        }
-        window.URL.revokeObjectURL(this.getImage(this.recipeDetails.slug));
-      }
-    },
-    printPage() {
-      window.print();
-    },
-  },
-};
-</script>
-
-<style>
-.card-btn {
-  margin-top: -10px;
-}
-.disabled-card {
-  opacity: 0.5;
-}
-
-.force-bottom {
-  position: absolute;
-  width: 100%;
-  bottom: 0;
-}
-.sticky {
-  position: sticky !important;
-  top: 0;
-  z-index: 2;
-}
-</style>
diff --git a/frontend.old/src/pages/Recipes/AllRecipes.vue b/frontend.old/src/pages/Recipes/AllRecipes.vue
deleted file mode 100644
index da1069b18d02..000000000000
--- a/frontend.old/src/pages/Recipes/AllRecipes.vue
+++ /dev/null
@@ -1,58 +0,0 @@
-<template>
-  <v-container>
-    <CardSection
-      title-icon=""
-      :sortable="true"
-      :title="$t('page.all-recipes')"
-      :recipes="shownRecipes"
-      @sort="assignSorted"
-    />
-    <v-row class="d-flex">
-      <SiteLoader class="mx-auto" v-if="loading" :loading="loading" />
-    </v-row>
-  </v-container>
-</template>
-
-<script>
-import SiteLoader from "@/components/UI/SiteLoader";
-import CardSection from "@/components/UI/CardSection";
-
-export default {
-  components: {
-    SiteLoader,
-    CardSection,
-  },
-  data() {
-    return {
-      loading: false,
-      sortedResults: [],
-    };
-  },
-  async created() {
-    if (this.allRecipes.length < 1) {
-      this.loading = true;
-    }
-    await this.$store.dispatch("requestAllRecipes");
-    this.loading = false;
-  },
-  computed: {
-    allRecipes() {
-      return this.$store.getters.getAllRecipes;
-    },
-    shownRecipes() {
-      if (this.sortedResults.length > 0) {
-        return this.sortedResults;
-      } else {
-        return this.allRecipes;
-      }
-    },
-  },
-  methods: {
-    assignSorted(val) {
-      this.sortedResults = val;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Recipes/CategoryTagPage.vue b/frontend.old/src/pages/Recipes/CategoryTagPage.vue
deleted file mode 100644
index eff8a13ddfd6..000000000000
--- a/frontend.old/src/pages/Recipes/CategoryTagPage.vue
+++ /dev/null
@@ -1,108 +0,0 @@
-<template>
-  <v-container>
-    <div v-if="selectItems">
-      <v-app-bar color="transparent" flat class="mt-n1 rounded">
-        <v-icon large left>
-          {{ $globals.icons.tags }}
-        </v-icon>
-        <v-toolbar-title class="headline"> {{ altTitle }} </v-toolbar-title>
-        <v-spacer></v-spacer>
-      </v-app-bar>
-      <v-slide-x-transition hide-on-leave>
-        <v-row>
-          <v-col cols="12" :sm="12" :md="6" :lg="4" :xl="3" v-for="item in selectItems" :key="item.id">
-            <v-card hover :to="`/recipes/${routerTagCat}/${item.slug}`">
-              <v-card-actions>
-                <v-icon>
-                  {{ $globals.icons.tags }}
-                </v-icon>
-                <v-card-title class="py-1">{{ item.name }}</v-card-title>
-                <v-spacer></v-spacer>
-              </v-card-actions>
-            </v-card>
-          </v-col>
-        </v-row>
-      </v-slide-x-transition>
-    </div>
-    <CardSection v-else :sortable="true" :title="title" :recipes="shownRecipes" @sort="assignSorted" />
-  </v-container>
-</template>
-
-<script>
-import { api } from "@/api";
-import CardSection from "@/components/UI/CardSection";
-export default {
-  components: {
-    CardSection,
-  },
-  data() {
-    return {
-      title: "",
-      recipes: [],
-      sortedResults: [],
-    };
-  },
-  computed: {
-    currentCategory() {
-      return this.$route.params.category || false;
-    },
-    currentTag() {
-      return this.$route.params.tag || false;
-    },
-    TagOrCategory() {
-      return this.currentCategory || this.currentTag;
-    },
-    routerTagCat() {
-      return this.$route.path.split("/")[2];
-    },
-    altTitle() {
-      return this.routerTagCat === "category" ? this.$t("recipe.categories") : this.$t("tag.tags");
-    },
-
-    selectItems() {
-      if (this.TagOrCategory) return false;
-      if (this.routerTagCat === "category") {
-        return this.$store.getters.getAllCategories;
-      }
-      return this.$store.getters.getAllTags;
-    },
-
-    shownRecipes() {
-      if (this.sortedResults.length > 0) {
-        return this.sortedResults;
-      } else {
-        return this.recipes;
-      }
-    },
-  },
-  watch: {
-    async TagOrCategory() {
-      this.sortedResults = [];
-      this.getRecipes();
-    },
-  },
-  created() {
-    this.getRecipes();
-    this.sortedResults = [];
-  },
-  methods: {
-    async getRecipes() {
-      if (!this.TagOrCategory === null || this.selectItems) return;
-
-      let data = {};
-      if (this.currentCategory) {
-        data = await api.categories.getRecipesInCategory(this.TagOrCategory);
-      } else {
-        data = await api.tags.getRecipesInTag(this.TagOrCategory);
-      }
-      this.title = data.name;
-      this.recipes = data.recipes;
-    },
-    assignSorted(val) {
-      this.sortedResults = val.slice();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/Recipes/CustomPage.vue b/frontend.old/src/pages/Recipes/CustomPage.vue
deleted file mode 100644
index c9b91b70e5ab..000000000000
--- a/frontend.old/src/pages/Recipes/CustomPage.vue
+++ /dev/null
@@ -1,75 +0,0 @@
-<template>
-  <v-container>
-    <v-app-bar color="transparent" flat class="mt-n1 rounded">
-      <v-icon large left> {{ $globals.icons.pages }} </v-icon>
-      <v-toolbar-title class="headline"> {{ page.name }} </v-toolbar-title>
-    </v-app-bar>
-
-    <div v-if="render">
-      <v-tabs v-model="tab" background-color="transparent" grow show-arrows="">
-        <v-tab v-for="item in page.categories" :key="item.slug" :href="`#${item.slug}`">
-          {{ item.name }}
-        </v-tab>
-      </v-tabs>
-
-      <v-tabs-items class="transparent" v-model="tab">
-        <v-tab-item v-for="(item, index) in page.categories" :key="item.slug + index" :value="item.slug">
-          <CardSection class="mb-5 mx-1" :recipes="item.recipes" @sort="sortRecipes($event, index)" />
-        </v-tab-item>
-      </v-tabs-items>
-    </div>
-  </v-container>
-</template>
-
-<script>
-import CardSection from "@/components/UI/CardSection";
-import { api } from "@/api";
-
-export default {
-  components: {
-    CardSection,
-  },
-  data() {
-    return {
-      page: "",
-      title: "",
-      render: false,
-      recipeStore: [],
-      categories: [],
-    };
-  },
-  computed: {
-    pageSlug() {
-      return this.$route.params.customPage;
-    },
-    tab: {
-      set(tab) {
-        this.$router.replace({ query: { ...this.$route.query, tab } });
-      },
-      get() {
-        return this.$route.query.tab;
-      },
-    },
-  },
-
-  watch: {
-    pageSlug() {
-      this.buildPage();
-    },
-  },
-
-  async created() {
-    await this.buildPage();
-    this.render = true;
-  },
-  methods: {
-    async buildPage() {
-      this.page = await api.siteSettings.getPage(this.pageSlug);
-      this.tab = this.page.categories[0];
-    },
-    sortRecipes(sortedRecipes, destKey) {
-      this.page.categories[destKey].recipes = sortedRecipes;
-    },
-  },
-};
-</script>
diff --git a/frontend.old/src/pages/Recipes/Favorites.vue b/frontend.old/src/pages/Recipes/Favorites.vue
deleted file mode 100644
index 950210eff97f..000000000000
--- a/frontend.old/src/pages/Recipes/Favorites.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<template>
-  <v-container>
-    <CardSection
-      :sortable="true"
-      :title-icon="$globals.icons.user"
-      :title="userData.username"
-      :recipes="shownRecipes"
-      @sort="assignSorted"
-    />
-  </v-container>
-</template>
-
-
-<script>
-import { api } from "@/api";
-import CardSection from "@/components/UI/CardSection";
-export default {
-  components: {
-    CardSection,
-  },
-  data() {
-    return {
-      title: "",
-      userData: {},
-      sortedResults: [],
-    };
-  },
-  computed: {
-    shownRecipes() {
-      if (this.sortedResults.length > 0) {
-        return this.sortedResults;
-      } else {
-        return this.userData.favoriteRecipes;
-      }
-    },
-  },
-  async created() {
-    this.userData = await api.users.getFavorites(this.$route.params.id);
-    this.sortedResults = [];
-  },
-  methods: {
-    assignSorted(val) {
-      this.sortedResults = val.slice();
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/SearchPage/FilterSelector.vue b/frontend.old/src/pages/SearchPage/FilterSelector.vue
deleted file mode 100644
index 43ed22f47b33..000000000000
--- a/frontend.old/src/pages/SearchPage/FilterSelector.vue
+++ /dev/null
@@ -1,52 +0,0 @@
-<template>
-  <v-toolbar dense flat>
-    <v-btn-toggle tile group v-model="selected" color="primary accent-3" @change="emitMulti" mandatory>
-      <v-btn small :value="false">
-        {{ $t("search.include") }}
-      </v-btn>
-
-      <v-btn small :value="true">
-        {{ $t("search.exclude") }}
-      </v-btn>
-    </v-btn-toggle>
-    <v-spacer></v-spacer>
-    <v-btn-toggle tile group v-model="match" color="primary accent-3" @change="emitMulti" mandatory>
-      <v-btn small :value="false">
-        {{ $t("search.and") }}
-      </v-btn>
-      <v-btn small :value="true">
-        {{ $t("search.or") }}
-      </v-btn>
-    </v-btn-toggle>
-  </v-toolbar>
-</template>
-
-<script>
-export default {
-  props: {
-    value: {
-      default: "include", // Optionas: "include", "exclude", "any"
-    },
-  },
-  data() {
-    return {
-      selected: false,
-      match: false,
-    };
-  },
-  methods: {
-    emitChange() {
-      this.$emit("input", this.selected);
-    },
-    emitMulti() {
-      const updateData = {
-        exclude: this.selected,
-        matchAny: this.match,
-      };
-      this.$emit("update", updateData);
-    },
-  },
-};
-</script>
-
-<style lang="scss" scoped></style>
diff --git a/frontend.old/src/pages/SearchPage/index.vue b/frontend.old/src/pages/SearchPage/index.vue
deleted file mode 100644
index 8d8ffdaa6e4b..000000000000
--- a/frontend.old/src/pages/SearchPage/index.vue
+++ /dev/null
@@ -1,168 +0,0 @@
-<template>
-  <v-container>
-    <v-row dense>
-      <v-col>
-        <v-text-field
-          v-model="searchString"
-          outlined
-          color="primary accent-3"
-          :placeholder="$t('search.search-placeholder')"
-          :append-icon="$globals.icons.search"
-        >
-        </v-text-field>
-      </v-col>
-      <v-col cols="12" md="2" sm="12">
-        <v-text-field class="mt-0 pt-0" :label="$t('search.max-results')" v-model="maxResults" type="number" outlined />
-      </v-col>
-    </v-row>
-
-    <v-row dense class="my-0 flex-row align-center justify-space-around">
-      <v-col>
-        <h3 class="pl-2 text-center headline">
-          {{ $t("category.category-filter") }}
-        </h3>
-        <FilterSelector class="mb-1" @update="updateCatParams" />
-        <CategoryTagSelector :solo="true" :dense="false" v-model="includeCategories" :return-object="false" />
-      </v-col>
-      <v-col>
-        <h3 class="pl-2 text-center headline">
-          {{ $t("search.tag-filter") }}
-        </h3>
-        <FilterSelector class="mb-1" @update="updateTagParams" />
-        <CategoryTagSelector
-          :solo="true"
-          :dense="false"
-          v-model="includeTags"
-          :return-object="false"
-          :tag-selector="true"
-        />
-      </v-col>
-    </v-row>
-
-    <CardSection
-      class="mt-n9"
-      :title-icon="$globals.icons.magnify"
-      :recipes="showRecipes"
-      :hardLimit="maxResults"
-      @sort="assignFuzzy"
-    />
-  </v-container>
-</template>
-
-<script>
-import Fuse from "fuse.js";
-import CategoryTagSelector from "@/components/FormHelpers/CategoryTagSelector";
-import CardSection from "@/components/UI/CardSection";
-import FilterSelector from "./FilterSelector.vue";
-
-export default {
-  components: {
-    CardSection,
-    CategoryTagSelector,
-    FilterSelector,
-  },
-  data() {
-    return {
-      maxResults: 21,
-      searchResults: [],
-      catFilter: {
-        exclude: false,
-        matchAny: false,
-      },
-      tagFilter: {
-        exclude: false,
-        matchAny: false,
-      },
-      sortedResults: [],
-      includeCategories: [],
-      includeTags: [],
-      options: {
-        shouldSort: true,
-        threshold: 0.6,
-        location: 0,
-        distance: 100,
-        findAllMatches: true,
-        maxPatternLength: 32,
-        minMatchCharLength: 2,
-        keys: ["name", "description"],
-      },
-    };
-  },
-  created() {
-    this.$store.dispatch("requestAllRecipes");
-  },
-  computed: {
-    searchString: {
-      set(q) {
-        this.$router.replace({ query: { ...this.$route.query, q } });
-      },
-      get() {
-        return this.$route.query.q || "";
-      },
-    },
-    allRecipes() {
-      return this.$store.getters.getAllRecipes;
-    },
-    filteredRecipes() {
-      return this.allRecipes.filter(recipe => {
-        const includesTags = this.check(this.includeTags, recipe.tags, this.tagFilter.matchAny, this.tagFilter.exclude);
-        const includesCats = this.check(
-          this.includeCategories,
-          recipe.recipeCategory,
-          this.catFilter.matchAny,
-          this.catFilter.exclude
-        );
-        return [includesTags, includesCats].every(x => x === true);
-      });
-    },
-    fuse() {
-      return new Fuse(this.filteredRecipes, this.options);
-    },
-    fuzzyRecipes() {
-      if (this.searchString.trim() === "") {
-        return this.filteredRecipes;
-      }
-      const result = this.fuse.search(this.searchString.trim());
-      return result.map(x => x.item);
-    },
-    isSearching() {
-      return this.searchString && this.searchString.length > 0;
-    },
-    showRecipes() {
-      if (this.sortedResults.length > 0) {
-        return this.sortedResults;
-      } else {
-        return this.fuzzyRecipes;
-      }
-    },
-  },
-  methods: {
-    assignFuzzy(val) {
-      this.sortedResults = val;
-    },
-    check(filterBy, recipeList, matchAny, exclude) {
-      let isMatch = true;
-      if (filterBy.length === 0) return isMatch;
-
-      if (recipeList) {
-        if (matchAny) {
-          isMatch = filterBy.some(t => recipeList.includes(t)); // Checks if some items are a match
-        } else {
-          isMatch = filterBy.every(t => recipeList.includes(t)); // Checks if every items is a match
-        }
-        return exclude ? !isMatch : isMatch;
-      } else;
-      return false;
-    },
-
-    updateTagParams(params) {
-      this.tagFilter = params;
-    },
-    updateCatParams(params) {
-      this.catFilter = params;
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/pages/ShoppingList/index.vue b/frontend.old/src/pages/ShoppingList/index.vue
deleted file mode 100644
index 051c9eb54c53..000000000000
--- a/frontend.old/src/pages/ShoppingList/index.vue
+++ /dev/null
@@ -1,281 +0,0 @@
-<template>
-  <v-container>
-    <v-app-bar color="transparent" flat class="mt-n1 rounded">
-      <v-btn v-if="list" color="info" @click="list = null">
-        <v-icon left>
-          {{ $globals.icons.arrowLeftBold }}
-        </v-icon>
-        {{ $t("shopping-list.all-lists") }}
-      </v-btn>
-      <v-icon v-if="!list" large left>
-        {{ $globals.icons.formatListChecks }}
-      </v-icon>
-      <v-toolbar-title v-if="!list" class="headline"> {{ $t("shopping-list.shopping-lists") }} </v-toolbar-title>
-      <v-spacer></v-spacer>
-      <BaseDialog
-        :title="$t('shopping-list.new-list')"
-        :title-icon="$globals.icons.formatListChecks"
-        :submit-text="$t('general.create')"
-        @submit="createNewList"
-      >
-        <template v-slot:open="{ open }">
-          <TheButton create @click="open" />
-        </template>
-        <v-card-text>
-          <v-text-field autofocus v-model="newList.name" :label="$t('shopping-list.list-name')"> </v-text-field>
-        </v-card-text>
-      </BaseDialog>
-    </v-app-bar>
-
-    <v-slide-x-transition hide-on-leave>
-      <v-row v-if="list == null">
-        <v-col cols="12" :sm="6" :md="6" :lg="4" :xl="3" v-for="(item, index) in group.shoppingLists" :key="index">
-          <v-card>
-            <v-card-title class="headline">
-              {{ item.name }}
-            </v-card-title>
-            <v-divider class="mx-2"></v-divider>
-            <v-card-actions>
-              <TheButton delete minor @click="deleteList(item.id)" />
-              <v-spacer></v-spacer>
-              <v-btn color="info" @click="list = item.id">
-                <v-icon left>
-                  {{ $globals.icons.cartCheck }}
-                </v-icon>
-                {{ $t("general.view") }}
-              </v-btn>
-            </v-card-actions>
-          </v-card>
-        </v-col>
-      </v-row>
-
-      <v-card v-else-if="activeList">
-        <v-card-title class="headline">
-          <AppCopyButton v-if="!edit" :copy-text="listAsText" color="info" />
-          <v-text-field label="Name" single-line dense v-if="edit" v-model="activeList.name"> </v-text-field>
-          <div v-else>
-            {{ activeList.name }}
-          </div>
-          <v-spacer></v-spacer>
-          <TheButton v-if="edit" update @click="saveList" />
-          <TheButton v-else edit @click="edit = true" />
-        </v-card-title>
-        <v-divider class="mx-2 mb-1"></v-divider>
-
-        <SearchDialog ref="searchRecipe" @selected="importIngredients" />
-        <v-card-text>
-          <v-row dense v-for="(item, index) in activeList.items" :key="index">
-            <v-col v-if="edit" cols="12" class="d-flex no-wrap align-center">
-              <p class="mb-0">{{ $t("shopping-list.quantity", [item.quantity]) }}</p>
-              <div v-if="edit">
-                <v-btn x-small text class="ml-1" @click="activeList.items[index].quantity -= 1">
-                  <v-icon>
-                    {{ $globals.icons.mdiMinus }}
-                  </v-icon>
-                </v-btn>
-                <v-btn x-small text class="mr-1" @click="activeList.items[index].quantity += 1">
-                  <v-icon>
-                    {{ $globals.icons.create }}
-                  </v-icon>
-                </v-btn>
-              </div>
-              <v-spacer></v-spacer>
-              <v-btn v-if="edit" icon @click="removeItemByIndex(index)" color="error">
-                <v-icon>{{ $globals.icons.delete }}</v-icon>
-              </v-btn>
-            </v-col>
-
-            <v-col cols="12" class="no-wrap align-center" :class="!edit ? 'd-flex' : null">
-              <v-checkbox
-                v-if="!edit"
-                hide-details
-                v-model="activeList.items[index].checked"
-                class="pt-0 my-auto py-auto"
-                color="secondary"
-                @change="saveList"
-              ></v-checkbox>
-
-              <p v-if="!edit" class="mb-0">{{ item.quantity }}</p>
-
-              <v-icon v-if="!edit" x-small class="mx-3">
-                {{ $globals.icons.windowClose }}
-              </v-icon>
-
-              <v-lazy>
-                <vue-markdown v-if="!edit" class="dense-markdown" :source="item.text"> </vue-markdown>
-                <v-textarea
-                  single-line
-                  rows="1"
-                  auto-grow
-                  class="mb-n2 pa-0"
-                  dense
-                  v-else
-                  v-model="activeList.items[index].text"
-                ></v-textarea>
-              </v-lazy>
-            </v-col>
-            <v-divider class="ma-1"></v-divider>
-          </v-row>
-        </v-card-text>
-
-        <v-card-actions>
-          <v-spacer></v-spacer>
-          <v-btn v-if="edit" color="success" @click="openSearch">
-            <v-icon left>
-              {{ $globals.icons.primary }}
-            </v-icon>
-            {{ $t("shopping-list.from-recipe") }}
-          </v-btn>
-          <v-btn v-if="edit" color="success" @click="newItem">
-            <v-icon left>
-              {{ $globals.icons.create }}
-            </v-icon>
-            {{ $t("general.new") }}
-          </v-btn>
-        </v-card-actions>
-      </v-card>
-    </v-slide-x-transition>
-  </v-container>
-</template>
-
-<script>
-import BaseDialog from "@/components/UI/Dialogs/BaseDialog";
-import SearchDialog from "@/components/UI/Dialogs/SearchDialog";
-import AppCopyButton from "@/components/UI/Buttons/AppCopyButton";
-import VueMarkdown from "@adapttive/vue-markdown";
-import { api } from "@/api";
-export default {
-  components: {
-    BaseDialog,
-    SearchDialog,
-    AppCopyButton,
-    VueMarkdown,
-  },
-  data() {
-    return {
-      newList: {
-        name: "",
-        group: "",
-        items: [],
-      },
-      activeList: null,
-
-      edit: false,
-    };
-  },
-  computed: {
-    group() {
-      return this.$store.getters.getCurrentGroup;
-    },
-    list: {
-      set(list) {
-        this.$router.replace({ query: { ...this.$route.query, list } });
-      },
-      get() {
-        return this.$route.query.list;
-      },
-    },
-    listAsText() {
-      const formatList = this.activeList.items.map((x) => {
-        return `${x.quantity} - ${x.text}`;
-      });
-
-      return formatList.join("\n");
-    },
-  },
-  watch: {
-    group: {
-      immediate: true,
-      handler: "setActiveList",
-    },
-    list: {
-      immediate: true,
-      handler: "setActiveList",
-    },
-  },
-  methods: {
-    openSearch() {
-      this.$refs.searchRecipe.open();
-    },
-    async importIngredients(selected) {
-      const [response, error] = await api.recipes.requestDetails(selected.slug);
-
-      if (error) {
-        console.log(error);
-      }
-
-      const recipe = response.data;
-
-      const ingredients = recipe.recipeIngredient.map((x) => ({
-        title: "",
-        text: x.note,
-        quantity: 1,
-        checked: false,
-      }));
-
-      this.activeList.items = [...this.activeList.items, ...ingredients];
-      this.consolidateList();
-    },
-    consolidateList() {
-      const allText = this.activeList.items.map((x) => x.text);
-
-      const uniqueText = allText.filter((item, index) => {
-        return allText.indexOf(item) === index;
-      });
-
-      const newItems = uniqueText.map((x) => {
-        let matchingItems = this.activeList.items.filter((y) => y.text === x);
-        matchingItems[0].quantity = this.sumQuantiy(matchingItems);
-        return matchingItems[0];
-      });
-
-      this.activeList.items = newItems;
-    },
-    sumQuantiy(itemList) {
-      let quantity = 0;
-      itemList.forEach((element) => {
-        quantity += element.quantity;
-      });
-      return quantity;
-    },
-    setActiveList() {
-      if (!this.list) return null;
-      if (!this.group.shoppingLists) return null;
-      this.activeList = this.group.shoppingLists.find((x) => x.id == this.list);
-    },
-    async createNewList() {
-      this.newList.group = this.group.name;
-
-      await api.shoppingLists.createShoppingList(this.newList);
-
-      this.$store.dispatch("requestCurrentGroup");
-    },
-    async deleteList(id) {
-      await api.shoppingLists.deleteShoppingList(id);
-      this.$store.dispatch("requestCurrentGroup");
-    },
-    removeItemByIndex(index) {
-      this.activeList.items.splice(index, 1);
-    },
-    newItem() {
-      this.activeList.items.push({
-        title: null,
-        text: "",
-        quantity: 1,
-        checked: false,
-      });
-    },
-    async saveList() {
-      await this.consolidateList();
-      await api.shoppingLists.updateShoppingList(this.activeList.id, this.activeList);
-      this.edit = false;
-    },
-  },
-};
-</script>
-
-<style  >
-.dense-markdown p {
-  margin: auto !important;
-}
-</style>
\ No newline at end of file
diff --git a/frontend.old/src/pages/SignUpPage.vue b/frontend.old/src/pages/SignUpPage.vue
deleted file mode 100644
index d1e79154f9df..000000000000
--- a/frontend.old/src/pages/SignUpPage.vue
+++ /dev/null
@@ -1,40 +0,0 @@
-<template>
-  <v-container fill-height class="text-center">
-    <v-row>
-      <v-flex class="d-flex justify-center" width="500px">
-        <SignUpForm @logged-in="redirectMe" class="ma-1" />
-      </v-flex>
-    </v-row>
-    <v-row></v-row>
-  </v-container>
-</template>
-
-<script>
-import SignUpForm from "../components/Login/SignUpForm";
-export default {
-  components: {
-    SignUpForm,
-  },
-  computed: {
-    viewScale() {
-      switch (this.$vuetify.breakpoint.name) {
-        case "xs":
-          return true;
-        case "sm":
-          return true;
-        default:
-          return false;
-      }
-    },
-  },
-  methods: {
-    redirectMe() {
-      if (this.$route.query.redirect) {
-        this.$router.push(this.$route.query.redirect);
-      } else this.$router.push({ path: "/" });
-    },
-  },
-};
-</script>
-
-<style></style>
diff --git a/frontend.old/src/plugins/vuetify.js b/frontend.old/src/plugins/vuetify.js
deleted file mode 100644
index 6f54f8ad73ee..000000000000
--- a/frontend.old/src/plugins/vuetify.js
+++ /dev/null
@@ -1,63 +0,0 @@
-import Vue from "vue";
-import Vuetify from "vuetify/lib";
-
-Vue.use(Vuetify);
-
-import de from "vuetify/es5/locale/de";
-import en from "vuetify/es5/locale/en";
-import es from "vuetify/es5/locale/es";
-import fr from "vuetify/es5/locale/fr";
-import it from "vuetify/es5/locale/it";
-import nl from "vuetify/es5/locale/nl";
-import pl from "vuetify/es5/locale/pl";
-import sv from "vuetify/es5/locale/sv";
-import zhHans from "vuetify/es5/locale/zh-Hans";
-
-const vuetify = new Vuetify({
-  theme: {
-    dark: false,
-    options: { customProperties: true },
-
-    themes: {
-      light: {
-        primary: "#E58325",
-        accent: "#00457A",
-        secondary: "#973542",
-        success: "#43A047",
-        info: "#FFFD99",
-        warning: "#FF4081",
-        error: "#EF5350",
-      },
-      dark: {
-        primary: "#4527A0",
-        accent: "#FF4081",
-        secondary: "#26C6DA",
-        success: "#43A047",
-        info: "#2196F3",
-        warning: "#FB8C00",
-        error: "#FF5252",
-      },
-    },
-  },
-  lang: {
-    locales: {
-      "de-DE": de,
-      "en-US": en,
-      "en-GB": en,
-      "es-ES": es,
-      "fr-FR": fr,
-      "it-IT": it,
-      "nl-NL": nl,
-      "pl-PL": pl,
-      "sv-SE": sv,
-      "zh-CN": zhHans,
-    },
-    current: "en-US",
-  },
-  icons: {
-    iconfont: "mdiSvg",
-  },
-});
-
-export default vuetify;
-export { vuetify };
diff --git a/frontend.old/src/registerServiceWorker.js b/frontend.old/src/registerServiceWorker.js
deleted file mode 100644
index 6cb38651365d..000000000000
--- a/frontend.old/src/registerServiceWorker.js
+++ /dev/null
@@ -1,39 +0,0 @@
-/* eslint-disable no-console */
-
-import { register } from "register-service-worker";
-
-if (process.env.NODE_ENV === "production") {
-  register(`${process.env.BASE_URL}service-worker.js`, {
-    ready() {
-      console.log("Service worker is active.");
-    },
-    registered(registration) {
-      console.log("Service worker has been registered.");
-
-      // Routinely check for app updates by testing for a new service worker.
-      setInterval(() => {
-        registration.update();
-      }, 1000 * 60 * 60); // hourly checks
-    },
-    cached() {
-      console.log("Content has been cached for offline use.");
-    },
-    updatefound() {
-      console.log("New content is downloading.");
-    },
-    updated(registration) {
-      console.log("New content is available; please refresh.");
-
-      // Add a custom event and dispatch it.
-      // Used to display of a 'refresh' banner following a service worker update.
-      // Set the event payload to the service worker registration object.
-      document.dispatchEvent(new CustomEvent("swUpdated", { detail: registration }));
-    },
-    offline() {
-      console.log("No internet connection found. App is running in offline mode.");
-    },
-    error(error) {
-      console.error("Error during service worker registration:", error);
-    },
-  });
-}
diff --git a/frontend.old/src/routes/admin.js b/frontend.old/src/routes/admin.js
deleted file mode 100644
index 4f580245d0ed..000000000000
--- a/frontend.old/src/routes/admin.js
+++ /dev/null
@@ -1,74 +0,0 @@
-const Admin = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin");
-const Migration = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/Migration");
-const Profile = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/Profile");
-const ManageUsers = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/ManageUsers");
-const Settings = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/Settings");
-const About = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/About");
-const ToolBox = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/ToolBox");
-const Dashboard = () => import(/* webpackChunkName: "admin-pages" */ "@/pages/Admin/Dashboard");
-import { store } from "../store";
-
-export const adminRoutes = {
-  path: "/admin",
-  component: Admin,
-  beforeEnter: (to, _from, next) => {
-    if (store.getters.getIsLoggedIn) {
-      next();
-    } else next({ path: "/login", query: { redirect: to.fullPath } });
-  },
-  children: [
-    {
-      path: "",
-      component: Profile,
-    },
-    {
-      path: "profile",
-      component: Profile,
-      meta: {
-        title: "settings.profile",
-      },
-    },
-    {
-      path: "migrations",
-      component: Migration,
-      meta: {
-        title: "settings.migrations",
-      },
-    },
-    {
-      path: "manage-users",
-      component: ManageUsers,
-      meta: {
-        title: "user.manage-users",
-      },
-    },
-    {
-      path: "settings",
-      component: Settings,
-      meta: {
-        title: "settings.site-settings",
-      },
-    },
-    {
-      path: "toolbox",
-      component: ToolBox,
-      meta: {
-        title: "settings.toolbox.toolbox",
-      },
-    },
-    {
-      path: "about",
-      component: About,
-      meta: {
-        title: "about.about",
-      },
-    },
-    {
-      path: "dashboard",
-      component: Dashboard,
-      meta: {
-        title: "general.dashboard",
-      },
-    },
-  ],
-};
diff --git a/frontend.old/src/routes/auth.js b/frontend.old/src/routes/auth.js
deleted file mode 100644
index 742472dd31a5..000000000000
--- a/frontend.old/src/routes/auth.js
+++ /dev/null
@@ -1,18 +0,0 @@
-const LoginPage = () => import("@/pages/LoginPage");
-const SignUpPage = () => import("@/pages/SignUpPage");
-import { store } from "../store";
-
-export const authRoutes = [
-  {
-    path: "/logout",
-    beforeEnter: (_to, _from, next) => {
-      store.commit("setToken", "");
-      store.commit("setIsLoggedIn", false);
-      next("/");
-    },
-  },
-  { path: "/login", component: LoginPage },
-
-  { path: "/sign-up", redirect: "/" },
-  { path: "/sign-up/:token", component: SignUpPage },
-];
diff --git a/frontend.old/src/routes/general.js b/frontend.old/src/routes/general.js
deleted file mode 100644
index f7802fa94718..000000000000
--- a/frontend.old/src/routes/general.js
+++ /dev/null
@@ -1,16 +0,0 @@
-const SearchPage = () => import("@/pages/SearchPage");
-const ShoppingList = () => import("@/pages/ShoppingList");
-import HomePage from "@/pages/HomePage";
-
-export const generalRoutes = [
-  { path: "/", name: "home", component: HomePage },
-  { path: "/mealie", component: HomePage },
-  { path: "/shopping-list", component: ShoppingList },
-  {
-    path: "/search",
-    component: SearchPage,
-    meta: {
-      title: "search.search",
-    },
-  },
-];
diff --git a/frontend.old/src/routes/index.js b/frontend.old/src/routes/index.js
deleted file mode 100644
index 9ac473e420b3..000000000000
--- a/frontend.old/src/routes/index.js
+++ /dev/null
@@ -1,51 +0,0 @@
-import Page404 from "@/pages/404Page";
-import { adminRoutes } from "./admin";
-import { authRoutes } from "./auth";
-import { recipeRoutes } from "./recipes";
-import { mealRoutes } from "./meal";
-import { generalRoutes } from "./general";
-import { store } from "@/store";
-import VueRouter from "vue-router";
-import { loadLanguageAsync } from "@/i18n";
-import Vue from "vue";
-import i18n from "@/i18n.js";
-
-export const routes = [
-  ...generalRoutes,
-  adminRoutes,
-  ...authRoutes,
-  ...mealRoutes,
-  ...recipeRoutes,
-
-  { path: "/page-not-found", component: Page404 },
-  { path: "*", component: Page404 },
-];
-
-const router = new VueRouter({
-  base: process.env.BASE_URL,
-  routes,
-  mode: process.env.NODE_ENV === "production" ? "history" : "hash",
-  scrollBehavior() {
-    return { x: 0, y: 0 };
-  },
-});
-
-const DEFAULT_TITLE = "Mealie";
-const TITLE_SEPARATOR = "|";
-const TITLE_SUFFIX = " " + TITLE_SEPARATOR + " " + DEFAULT_TITLE;
-router.afterEach(to => {
-  Vue.nextTick(async () => {
-    if (typeof to.meta.title === "function") {
-      const title = await to.meta.title(to);
-      document.title = title + TITLE_SUFFIX;
-    } else {
-      document.title = i18n.t(to.meta.title) ? i18n.t(to.meta.title) + TITLE_SUFFIX : DEFAULT_TITLE;
-    }
-  });
-});
-
-router.beforeEach((__, _, next) => {
-  loadLanguageAsync(store.getters.getActiveLang).then(() => next());
-});
-
-export { router };
diff --git a/frontend.old/src/routes/meal.js b/frontend.old/src/routes/meal.js
deleted file mode 100644
index 4aca00dd883e..000000000000
--- a/frontend.old/src/routes/meal.js
+++ /dev/null
@@ -1,51 +0,0 @@
-const Planner = () => import("@/pages/MealPlan/Planner");
-const ThisWeek = () => import("@/pages/MealPlan/ThisWeek");
-import { api } from "@/api";
-import { utils } from "@/utils";
-import i18n from "@/i18n.js";
-
-export const mealRoutes = [
-  {
-    path: "/meal-plan",
-    component: ThisWeek,
-    meta: {
-      title: "meal-plan.dinner-this-week",
-    },
-  },
-  {
-    path: "/meal-plan/planner",
-    component: Planner,
-    meta: {
-      title: "meal-plan.meal-planner",
-    },
-  },
-  {
-    path: "/meal-plan/this-week",
-    component: ThisWeek,
-    meta: {
-      title: "meal-plan.dinner-this-week",
-    },
-  },
-  {
-    path: "/meal-plan/today",
-    beforeEnter: async (_to, _from, next) => {
-      await todaysMealRoute().then(redirect => {
-        if (redirect) {
-          next(redirect);
-        } else {
-          utils.notify.error(i18n.t("meal-plan.no-meal-planned-for-today"));
-          next(_from);
-        }
-      });
-    },
-  },
-];
-
-async function todaysMealRoute() {
-  const response = await api.mealPlans.today();
-  if (response.status == 200 && response.data) {
-    return "/recipe/" + response.data.slug;
-  } else {
-    return null;
-  }
-}
diff --git a/frontend.old/src/routes/recipes.js b/frontend.old/src/routes/recipes.js
deleted file mode 100644
index e2e3967aac2a..000000000000
--- a/frontend.old/src/routes/recipes.js
+++ /dev/null
@@ -1,37 +0,0 @@
-const ViewRecipe = () => import(/* webpackChunkName: "recipe-page" */ "@/pages/Recipe/ViewRecipe");
-const NewRecipe = () => import(/* webpackChunkName: "recipe-page" */ "@/pages/Recipe/NewRecipe");
-const ScraperDebugger = () => import("@/pages/Recipe/ScraperDebugger");
-const CustomPage = () => import("@/pages/Recipes/CustomPage");
-const AllRecipes = () => import("@/pages/Recipes/AllRecipes");
-const CategoryTagPage = () => import("@/pages/Recipes/CategoryTagPage");
-const Favorites = () => import("@/pages/Recipes/Favorites");
-import { api } from "@/api";
-
-export const recipeRoutes = [
-  // Recipes
-  { path: "/recipes/all", component: AllRecipes },
-  { path: "/recipes/debugger", component: ScraperDebugger },
-  { path: "/user/:id/favorites", component: Favorites },
-  { path: "/recipes/tag/:tag", component: CategoryTagPage },
-  { path: "/recipes/tag", component: CategoryTagPage },
-  { path: "/recipes/category", component: CategoryTagPage },
-  { path: "/recipes/category/:category", component: CategoryTagPage },
-  // Misc
-  { path: "/new/", component: NewRecipe },
-  { path: "/pages/:customPage", component: CustomPage },
-
-  // Recipe Page
-  {
-    path: "/recipe/:recipe",
-    component: ViewRecipe,
-    meta: {
-      title: async route => {
-        const [response, error] = await api.recipes.requestDetails(route.params.recipe);
-        if (error) console.log({ error });
-        const recipe = response.data;
-        if (recipe && recipe.name) return recipe.name;
-        else return null;
-      },
-    },
-  },
-];
diff --git a/frontend.old/src/store/index.js b/frontend.old/src/store/index.js
deleted file mode 100644
index 4ce1d97653ae..000000000000
--- a/frontend.old/src/store/index.js
+++ /dev/null
@@ -1,80 +0,0 @@
-import Vue from "vue";
-import Vuex from "vuex";
-import { api } from "@/api";
-import createPersistedState from "vuex-persistedstate";
-import userSettings from "./modules/userSettings";
-import language from "./modules/language";
-import siteSettings from "./modules/siteSettings";
-import recipes from "./modules/recipes";
-import groups from "./modules/groups";
-import snackbar from "./modules/snackbar";
-
-Vue.use(Vuex);
-
-const store = new Vuex.Store({
-  plugins: [
-    createPersistedState({
-      paths: ["userSettings", "siteSettings"],
-    }),
-  ],
-  modules: {
-    userSettings,
-    language,
-    siteSettings,
-    groups,
-    recipes,
-    snackbar,
-  },
-  state: {
-    // All Recipe Data Store
-    recentRecipes: [],
-    allRecipes: [],
-    mealPlanCategories: [],
-    allCategories: [],
-    allTags: [],
-    appInfo: {
-      version: "",
-      demoStatus: false,
-    },
-  },
-
-  mutations: {
-    setMealPlanCategories(state, payload) {
-      state.mealPlanCategories = payload;
-    },
-    setAllCategories(state, payload) {
-      state.allCategories = payload;
-    },
-    setAllTags(state, payload) {
-      state.allTags = payload;
-    },
-    setAppInfo(state, payload) {
-      state.appInfo = payload;
-    },
-  },
-
-  actions: {
-    async requestCategories({ commit }) {
-      const categories = await api.categories.getAll();
-      commit("setAllCategories", categories);
-    },
-    async requestTags({ commit }) {
-      const tags = await api.tags.getAll();
-      commit("setAllTags", tags);
-    },
-    async requestAppInfo({ commit }) {
-      const response = await api.meta.getAppInfo();
-      commit("setAppInfo", response);
-    },
-  },
-
-  getters: {
-    getMealPlanCategories: state => state.mealPlanCategories,
-    getAllCategories: state => state.allCategories.sort((a, b) => (a.slug > b.slug ? 1 : -1)),
-    getAllTags: state => state.allTags.sort((a, b) => (a.slug > b.slug ? 1 : -1)),
-    getAppInfo: state => state.appInfo,
-  },
-});
-
-export default store;
-export { store };
diff --git a/frontend.old/src/store/modules/groups.js b/frontend.old/src/store/modules/groups.js
deleted file mode 100644
index 03e66fc80dc9..000000000000
--- a/frontend.old/src/store/modules/groups.js
+++ /dev/null
@@ -1,39 +0,0 @@
-import { api } from "@/api";
-
-const state = {
-  groups: [],
-  currentGroup: {},
-};
-
-const mutations = {
-  setGroups(state, payload) {
-    state.groups = payload;
-  },
-  setCurrentGroup(state, payload) {
-    state.currentGroup = payload;
-  },
-};
-
-const actions = {
-  async requestAllGroups({ commit }) {
-    const groups = await api.groups.allGroups();
-    commit("setGroups", groups);
-  },
-  async requestCurrentGroup({ commit }) {
-    const group = await api.groups.current();
-    commit("setCurrentGroup", group);
-  },
-};
-
-const getters = {
-  getGroups: state => state.groups,
-  getGroupNames: state => Array.from(state.groups, x => x.name),
-  getCurrentGroup: state => state.currentGroup,
-};
-
-export default {
-  state,
-  mutations,
-  actions,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/homePage.js b/frontend.old/src/store/modules/homePage.js
deleted file mode 100644
index c7b2112b49a4..000000000000
--- a/frontend.old/src/store/modules/homePage.js
+++ /dev/null
@@ -1,44 +0,0 @@
-import { api } from "@/api";
-
-const state = {
-  showRecent: true,
-  showLimit: 9,
-  categories: [],
-  homeCategories: [],
-};
-
-const mutations = {
-  setShowRecent(state, payload) {
-    state.showRecent = payload;
-  },
-  setShowLimit(state, payload) {
-    state.showLimit = payload;
-  },
-  setCategories(state, payload) {
-    state.categories = payload.sort((a, b) => (a.name > b.name ? 1 : -1));
-  },
-  setHomeCategories(state, payload) {
-    state.homeCategories = payload;
-  },
-};
-
-const actions = {
-  async requestHomePageSettings() {
-    let categories = await api.categories.get_all();
-    this.commit("setCategories", categories);
-  },
-};
-
-const getters = {
-  getShowRecent: state => state.showRecent,
-  getShowLimit: state => state.showLimit,
-  getCategories: state => state.categories,
-  getHomeCategories: state => state.homeCategories,
-};
-
-export default {
-  state,
-  mutations,
-  actions,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/language.js b/frontend.old/src/store/modules/language.js
deleted file mode 100644
index c9d4ea6c4815..000000000000
--- a/frontend.old/src/store/modules/language.js
+++ /dev/null
@@ -1,54 +0,0 @@
-// This is the data store for the options for language selection. Property is reference only, you cannot set this property.
-const state = {
-  allLangs: [
-    {
-      name: "American English",
-      value: "en-US",
-    },
-    {
-      name: "British English",
-      value: "en-GB",
-    },
-    {
-      name: "Deutsch (German)",
-      value: "de-DE",
-    },
-    {
-      name: "Español (Spanish)",
-      value: "es-ES",
-    },
-    {
-      name: "Français (French)",
-      value: "fr-FR",
-    },
-    {
-      name: "Italiano (Italian)",
-      value: "it-IT",
-    },
-    {
-      name: "Nederlands (Dutch)",
-      value: "nl-NL",
-    },
-    {
-      name: "Polski (Polish)",
-      value: "pl-PL",
-    },
-    {
-      name: "Svenska (Swedish)",
-      value: "sv-SE",
-    },
-    {
-      name: "简体中文 (Chinese simplified)",
-      value: "zh-CN",
-    },
-  ],
-};
-
-const getters = {
-  getAllLangs: state => state.allLangs,
-};
-
-export default {
-  state,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/recipes.js b/frontend.old/src/store/modules/recipes.js
deleted file mode 100644
index f2270eb941f2..000000000000
--- a/frontend.old/src/store/modules/recipes.js
+++ /dev/null
@@ -1,76 +0,0 @@
-import { api } from "@/api";
-import Vue from "vue";
-import { recipe } from "@/utils/recipe";
-
-const state = {
-  recentRecipes: [],
-  allRecipes: [],
-};
-
-const mutations = {
-  setRecentRecipes(state, payload) {
-    state.recentRecipes = payload;
-  },
-  patchRecentRecipes(state, payload) {
-    if (state.recentRecipes[payload.id]) {
-      state.recentRecipes[payload.id] = payload;
-    }
-  },
-  dropRecentRecipes(state, payload) {
-    if (state.recentRecipes[payload.id]) {
-      Vue.delete(state.recentRecipes, payload.id);
-    }
-  },
-  setAllRecipes(state, payload) {
-    state.allRecipes = payload;
-  },
-  patchAllRecipes(state, payload) {
-    state.allRecipes[payload.id] = payload;
-  },
-  dropAllRecipes(state, payload) {
-    if (state.allRecipes[payload.id]) {
-      Vue.delete(state.allRecipes, payload.id);
-    }
-  },
-};
-
-const actions = {
-  async requestRecentRecipes() {
-    const payload = await api.recipes.allSummary(0, 30);
-    const hash = Object.fromEntries(payload.map(e => [e.id, e]));
-    this.commit("setRecentRecipes", hash);
-  },
-  async requestAllRecipes({ getters }) {
-    const all = getters.getAllRecipes;
-    const payload = await api.recipes.allSummary(all.length, 9999);
-    const hash = Object.fromEntries([...all, ...payload].map(e => [e.id, e]));
-
-    this.commit("setAllRecipes", hash);
-  },
-  patchRecipe({ commit }, payload) {
-    commit("patchAllRecipes", payload);
-    commit("patchRecentRecipes", payload);
-  },
-  dropRecipe({ commit }, payload) {
-    commit("dropAllRecipes", payload);
-    commit("dropRecentRecipes", payload);
-  },
-};
-
-const getters = {
-  getAllRecipes: state => Object.values(state.allRecipes),
-  getAllRecipesHash: state => state.allRecipes,
-  getRecentRecipes: state => {
-    let list = Object.values(state.recentRecipes);
-    recipe.sortByUpdated(list);
-    return list;
-  },
-  getRecentRecipesHash: state => state.recentRecipes,
-};
-
-export default {
-  state,
-  mutations,
-  actions,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/siteSettings.js b/frontend.old/src/store/modules/siteSettings.js
deleted file mode 100644
index 3095830d0ede..000000000000
--- a/frontend.old/src/store/modules/siteSettings.js
+++ /dev/null
@@ -1,47 +0,0 @@
-import { api } from "@/api";
-import { loadLanguageAsync } from "@/i18n"
-
-const state = {
-  siteSettings: {
-    language: "en-US",
-    firstDayOfWeek: 0,
-    showRecent: true,
-    cardsPerSection: 9,
-    categories: [],
-  },
-  customPages: [],
-};
-
-const mutations = {
-  setSettings(state, payload) {
-    state.siteSettings = payload;
-    loadLanguageAsync(payload.language);
-  },
-  setCustomPages(state, payload) {
-    state.customPages = payload;
-  },
-};
-
-const actions = {
-  async requestSiteSettings({ commit }) {
-    let settings = await api.siteSettings.get();
-    commit("setSettings", settings);
-  },
-  async requestCustomPages({ commit }) {
-    const customPages = await api.siteSettings.getPages();
-    commit("setCustomPages", customPages);
-  },
-};
-
-const getters = {
-  getActiveLang: state => state.siteSettings.language,
-  getSiteSettings: state => state.siteSettings,
-  getCustomPages: state => state.customPages,
-};
-
-export default {
-  state,
-  mutations,
-  actions,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/snackbar.js b/frontend.old/src/store/modules/snackbar.js
deleted file mode 100644
index 21ae1a3982af..000000000000
--- a/frontend.old/src/store/modules/snackbar.js
+++ /dev/null
@@ -1,23 +0,0 @@
-const state = {
-  snackbar: {
-    open: false,
-    text: "Hello From The Store",
-    color: "info",
-  },
-};
-
-const mutations = {
-  setSnackbar(state, payload) {
-    state.snackbar = payload;
-  },
-};
-
-const getters = {
-  getSnackbar: state => state.snackbar,
-};
-
-export default {
-  state,
-  mutations,
-  getters,
-};
diff --git a/frontend.old/src/store/modules/userSettings.js b/frontend.old/src/store/modules/userSettings.js
deleted file mode 100644
index 39337cf93433..000000000000
--- a/frontend.old/src/store/modules/userSettings.js
+++ /dev/null
@@ -1,121 +0,0 @@
-import { api } from "@/api";
-import Vuetify from "@/plugins/vuetify";
-import axios from "axios";
-
-function inDarkMode(payload) {
-  let isDark;
-
-  if (payload === "system") {
-    //Get System Preference from browser
-    const darkMediaQuery = window.matchMedia("(prefers-color-scheme: dark)");
-    isDark = darkMediaQuery.matches;
-  } else if (payload === "dark") isDark = true;
-  else if (payload === "light") isDark = false;
-
-  return isDark;
-}
-
-const state = {
-  activeTheme: {},
-  darkMode: "light", // light, dark, system
-  isDark: false,
-  isLoggedIn: false,
-  token: "",
-  userData: {},
-};
-
-const mutations = {
-  setTheme(state, payload) {
-    Vuetify.framework.theme.themes.dark = payload.colors;
-    Vuetify.framework.theme.themes.light = payload.colors;
-    state.activeTheme = payload;
-  },
-  setDarkMode(state, payload) {
-    let isDark = inDarkMode(payload);
-
-    if (isDark !== null) {
-      Vuetify.framework.theme.dark = isDark;
-      state.isDark = isDark;
-      state.darkMode = payload;
-    }
-  },
-  setIsLoggedIn(state, payload) {
-    state.isLoggedIn = payload;
-  },
-  setToken(state, payload) {
-    state.isLoggedIn = true;
-    axios.defaults.headers.common["Authorization"] = `Bearer ${payload}`;
-    state.token = payload;
-  },
-
-  setUserData(state, payload) {
-    state.userData = payload;
-  },
-};
-
-const actions = {
-  async requestUserData({ getters, commit }) {
-    if (getters.getIsLoggedIn) {
-      const [response, err] = await api.users.self();
-
-      if (err) {
-        return; // TODO: Log or Notifty User of Error
-      }
-
-      commit("setUserData", response.data);
-    }
-  },
-
-  async resetTheme({ commit }) {
-    const defaultTheme = await api.themes.requestByName(1);
-    if (defaultTheme.colors) {
-      Vuetify.framework.theme.themes.dark = defaultTheme.colors;
-      Vuetify.framework.theme.themes.light = defaultTheme.colors;
-      commit("setTheme", defaultTheme);
-    }
-  },
-
-  async refreshToken({ commit, getters }) {
-    if (!getters.getIsLoggedIn) {
-      commit("setIsLoggedIn", false); // This has to be here... for some reasons?  ¯\_(ツ)_/¯
-      console.log("Not Logged In");
-      return;
-    }
-
-    const [response, err] = await api.users.refresh();
-
-    if (err) {
-      console.log("Failed Token Refresh, Logging Out...");
-      commit("setIsLoggedIn", false);
-    }
-
-    commit("setToken", response.data.access_token);
-  },
-
-  async initTheme({ dispatch, getters }) {
-    //If theme is empty resetTheme
-    if (Object.keys(getters.getActiveTheme).length === 0) {
-      await dispatch("resetTheme");
-    } else {
-      Vuetify.framework.theme.dark = inDarkMode(getters.getDarkMode);
-      Vuetify.framework.theme.themes.dark = getters.getActiveTheme.colors;
-      Vuetify.framework.theme.themes.light = getters.getActiveTheme.colors;
-    }
-  },
-};
-
-const getters = {
-  getActiveTheme: state => state.activeTheme,
-  getDarkMode: state => state.darkMode,
-  getIsDark: state => state.isDark,
-  getIsLoggedIn: state => state.isLoggedIn,
-  getToken: state => state.token,
-  getUserData: state => state.userData,
-};
-
-export default {
-  state,
-  mutations,
-  actions,
-  getters,
-};
diff --git a/frontend.old/src/sw.js b/frontend.old/src/sw.js
deleted file mode 100644
index 4b1037930aa1..000000000000
--- a/frontend.old/src/sw.js
+++ /dev/null
@@ -1,75 +0,0 @@
-/* eslint-disable no-undef, no-underscore-dangle, no-restricted-globals */
-
-self.addEventListener("install", event => {
-  event.waitUntil(preLoad());
-});
-
-var preLoad = async () => {
-  console.log("Installing web app");
-  const cache = await caches.open("offline");
-  console.log("caching index and important routes");
-  return await cache.addAll(["/", "/recipes/all"]);
-};
-
-self.addEventListener("fetch", event => {
-  event.respondWith(
-    checkResponse(event.request).catch(() => {
-      return returnFromCache(event.request);
-    })
-  );
-  event.waitUntil(addToCache(event.request));
-});
-
-var checkResponse = request => {
-  return new Promise(function(fulfill, reject) {
-    fetch(request).then(function(response) {
-      if (response.status !== 404) {
-        fulfill(response);
-      } else {
-        reject();
-      }
-    }, reject);
-  });
-};
-
-var addToCache = async request => {
-  const cache = await caches.open("offline");
-  const response = await fetch(request);
-  console.log(response.url + " was cached");
-  return await cache.put(request, response);
-};
-
-var returnFromCache = async request => {
-  const cache = await caches.open("offline");
-  const matching = await cache.match(request);
-  if (!matching || matching.status == 404) {
-    return cache.match("offline.html");
-  } else {
-    return matching;
-  }
-};
-
-// This is the code piece that GenerateSW mode can't provide for us.
-// This code listens for the user's confirmation to update the app.
-self.addEventListener("message", e => {
-  if (!e.data) {
-    return;
-  }
-
-  switch (e.data) {
-    case "skipWaiting":
-      self.skipWaiting();
-      break;
-    default:
-      // NOOP
-      break;
-  }
-});
-
-workbox.core.clientsClaim(); // Vue CLI 4 and Workbox v4, else
-// workbox.clientsClaim(); // Vue CLI 3 and Workbox v3.
-
-// The precaching code provided by Workbox.
-self.__precacheManifest = [].concat(self.__precacheManifest || []);
-// workbox.precaching.suppressWarnings(); // Only used with Vue CLI 3 and Workbox v3.
-workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
diff --git a/frontend.old/vue.config.js b/frontend.old/vue.config.js
deleted file mode 100644
index 442baa0130e5..000000000000
--- a/frontend.old/vue.config.js
+++ /dev/null
@@ -1,50 +0,0 @@
-const path = require("path");
-const manifestJSON = require("./public/manifest.json");
-const PreloadWebpackPlugin = require("preload-webpack-plugin");
-
-module.exports = {
-  transpileDependencies: ["vuetify"],
-  publicPath: process.env.NODE_ENV === "production" ? "/" : "/",
-  outputDir: process.env.NODE_ENV === "production" ? "./dist" : "../mealie/web",
-  devServer: {
-    proxy: {
-      "/api": {
-        target: process.env.VUE_APP_API_BASE_URL,
-        secure: false,
-      },
-    },
-  },
-  pluginOptions: {
-    i18n: {
-      locale: "en",
-      fallbackLocale: "en",
-      localeDir: "locales",
-      enableInSFC: true,
-    },
-    webpackBundleAnalyzer: {
-      openAnalyzer: process.env.PREVIEW_BUNDLE,
-    },
-  },
-  configureWebpack: {
-    resolve: {
-      alias: {
-        "@": path.resolve("src"),
-      },
-      plugins: [new PreloadWebpackPlugin({})],
-    },
-  },
-  pwa: {
-    name: manifestJSON.short_name,
-    themeColor: manifestJSON.theme_color,
-    msTileColor: manifestJSON.background_color,
-    appleMobileWebAppCapable: "yes",
-    appleMobileWebAppStatusBarStyle: "black",
-    manifestCrossorigin: "use-credentials",
-
-    workboxPluginMode: "InjectManifest",
-    workboxOptions: {
-      swSrc: "./src/sw.js",
-      swDest: "service-worker.js",
-    },
-  },
-};
diff --git a/frontend/components/Domain/Recipe/RecipeDialogBulkAdd.vue b/frontend/components/Domain/Recipe/RecipeDialogBulkAdd.vue
index bc893174ed5f..ad5385c5aff8 100644
--- a/frontend/components/Domain/Recipe/RecipeDialogBulkAdd.vue
+++ b/frontend/components/Domain/Recipe/RecipeDialogBulkAdd.vue
@@ -40,8 +40,8 @@
 </template>
 
 <script lang="ts">
-import { reactive, toRefs } from "@nuxtjs/composition-api";
-export default {
+import { reactive, toRefs, defineComponent } from "@nuxtjs/composition-api";
+export default defineComponent({
   setup(_, context) {
     const state = reactive({
       dialog: false,
@@ -74,5 +74,5 @@ export default {
       ...toRefs(state),
     };
   },
-};
+});
 </script>
diff --git a/frontend/pages/user/profile/edit.vue b/frontend/pages/user/profile/edit.vue
index cabfc34875b0..810f925fd8e0 100644
--- a/frontend/pages/user/profile/edit.vue
+++ b/frontend/pages/user/profile/edit.vue
@@ -73,7 +73,7 @@
                 </v-card-text>
                 <v-card-actions>
                   <v-spacer></v-spacer>
-                  <BaseButton update @click="updateUser" />
+                  <BaseButton update @click="updatePassword" />
                 </v-card-actions>
               </v-card>
             </div>
@@ -164,28 +164,6 @@ export default defineComponent({
       title: this.$t("settings.profile") as string,
     };
   },
-
-  methods: {
-    async changePassword() {
-      // @ts-ignore
-      this.paswordLoading = true;
-      const data = {
-        currentPassword: this.password.current,
-        newPassword: this.password.newOne,
-      };
-
-      // @ts-ignore
-      if (this.$refs.passChange.validate()) {
-        // @ts-ignore
-        if (await api.users.changePassword(this.user.id, data)) {
-          this.$emit("refresh");
-        }
-      }
-
-      // @ts-ignore
-      this.paswordLoading = false;
-    },
-  },
 });
 </script>
     
diff --git a/makefile b/makefile
index 8763736d95b5..fe0ecc5a0ed6 100644
--- a/makefile
+++ b/makefile
@@ -69,14 +69,15 @@ coverage: ## ☂️  Check code coverage quickly with the default Python
 	poetry run coverage html
 	$(BROWSER) htmlcov/index.html
 
+.PHONY: setup
 setup: ## 🏗  Setup Development Instance
-	cp template.env .env -n 
 	poetry install && \
 	cd frontend && \
-	cp template.env .env -n 
 	yarn install && \
 	cd ..
 
+	echo "Be sure to copy the template.env files"
+
 backend: ## 🎬 Start Mealie Backend Development Server
 	poetry run python mealie/db/init_db.py && \
 	poetry run python mealie/services/image/minify.py && \
diff --git a/mealie/db/data_access_layer/access_model_factory.py b/mealie/db/data_access_layer/access_model_factory.py
index 5dabf64b53ff..04fc5e79f765 100644
--- a/mealie/db/data_access_layer/access_model_factory.py
+++ b/mealie/db/data_access_layer/access_model_factory.py
@@ -14,11 +14,9 @@ from mealie.db.models.recipe.ingredient import IngredientFoodModel, IngredientUn
 from mealie.db.models.recipe.recipe import RecipeModel
 from mealie.db.models.recipe.tag import Tag
 from mealie.db.models.server.task import ServerTaskModel
-from mealie.db.models.settings import SiteSettings
 from mealie.db.models.sign_up import SignUp
 from mealie.db.models.users import LongLiveToken, User
 from mealie.db.models.users.password_reset import PasswordResetModel
-from mealie.schema.admin import SiteSettings as SiteSettingsSchema
 from mealie.schema.cookbook.cookbook import ReadCookBook
 from mealie.schema.events import Event as EventSchema
 from mealie.schema.events import EventNotificationIn
@@ -94,10 +92,6 @@ class Database:
     # ================================================================
     # Site Items
 
-    @cached_property
-    def settings(self) -> AccessModel[SiteSettingsSchema, SiteSettings]:
-        return AccessModel(self.session, pk_id, SiteSettings, SiteSettingsSchema)
-
     @cached_property
     def sign_up(self) -> AccessModel[SignUpOut, SignUp]:
         return AccessModel(self.session, pk_id, SignUp, SignUpOut)
diff --git a/mealie/db/init_db.py b/mealie/db/init_db.py
index 5f960eb12dff..c63c7a946a53 100644
--- a/mealie/db/init_db.py
+++ b/mealie/db/init_db.py
@@ -6,7 +6,6 @@ from mealie.db.data_initialization.init_users import default_user_init
 from mealie.db.database import get_database
 from mealie.db.db_setup import create_session, engine
 from mealie.db.models._model_base import SqlAlchemyBase
-from mealie.schema.admin import SiteSettings
 from mealie.schema.user.user import GroupBase
 from mealie.services.events import create_general_event
 from mealie.services.group_services.group_utils import create_new_group
@@ -24,16 +23,10 @@ def create_all_models():
 
 def init_db(db: Database) -> None:
     default_group_init(db)
-    default_settings_init(db)
     default_user_init(db)
     default_recipe_unit_init(db)
 
 
-def default_settings_init(db: Database):
-    document = db.settings.create(SiteSettings().dict())
-    logger.info(f"Created Site Settings: \n {document}")
-
-
 def default_group_init(db: Database):
     logger.info("Generating Default Group")
     create_new_group(db, GroupBase(name=settings.DEFAULT_GROUP))
diff --git a/mealie/db/models/_all_models.py b/mealie/db/models/_all_models.py
index 7cb43654f344..02c4986b6a51 100644
--- a/mealie/db/models/_all_models.py
+++ b/mealie/db/models/_all_models.py
@@ -2,6 +2,5 @@ from .event import *
 from .group import *
 from .recipe.recipe import *
 from .server import *
-from .settings import *
 from .sign_up import *
 from .users import *
diff --git a/mealie/db/models/_model_base.py b/mealie/db/models/_model_base.py
index 907eb90ca97d..fc8d93bfa39a 100644
--- a/mealie/db/models/_model_base.py
+++ b/mealie/db/models/_model_base.py
@@ -19,9 +19,6 @@ class BaseMixins:
     `cls.get_ref` method which will return the object from the database or none. Useful for many-to-many relationships.
     """
 
-    class Config:
-        get_attr = "id"
-
     def update(self, *args, **kwarg):
         self.__init__(*args, **kwarg)
 
diff --git a/mealie/db/models/_model_utils.py b/mealie/db/models/_model_utils.py
deleted file mode 100644
index c0f15881afb6..000000000000
--- a/mealie/db/models/_model_utils.py
+++ /dev/null
@@ -1,119 +0,0 @@
-from functools import wraps
-from typing import Union
-
-from sqlalchemy.orm import MANYTOMANY, MANYTOONE, ONETOMANY
-
-
-def handle_one_to_many_list(get_attr, relation_cls, all_elements: list[dict]):
-    elems_to_create = []
-    updated_elems = []
-
-    for elem in all_elements:
-        elem_id = elem.get(get_attr, None)
-
-        existing_elem = relation_cls.get_ref(match_value=elem_id)
-
-        if existing_elem is None:
-
-            elems_to_create.append(elem)
-
-        else:
-            for key, value in elem.items():
-                setattr(existing_elem, key, value)
-
-            updated_elems.append(existing_elem)
-
-    new_elems = []
-    for elem in elems_to_create:
-        new_elems = [relation_cls(**elem) for elem in all_elements]
-
-    return new_elems
-
-
-def auto_init(exclude: Union[set, list] = None):  # sourcery no-metrics
-    """Wraps the `__init__` method of a class to automatically set the common
-    attributes.
-
-    Args:
-        exclude (Union[set, list], optional): [description]. Defaults to None.
-    """
-
-    exclude = exclude or set()
-    exclude.add("id")
-
-    def decorator(init):
-        @wraps(init)
-        def wrapper(self, *args, **kwargs):  # sourcery no-metrics
-            """
-            Custom initializer that allows nested children initialization.
-            Only keys that are present as instance's class attributes are allowed.
-            These could be, for example, any mapped columns or relationships.
-
-            Code inspired from GitHub.
-            Ref: https://github.com/tiangolo/fastapi/issues/2194
-            """
-            cls = self.__class__
-            model_columns = self.__mapper__.columns
-            relationships = self.__mapper__.relationships
-
-            session = kwargs.get("session", None)
-
-            for key, val in kwargs.items():
-                if key in exclude:
-                    continue
-
-                if not hasattr(cls, key):
-                    continue
-                    # raise TypeError(f"Invalid keyword argument: {key}")
-
-                if key in model_columns:
-                    setattr(self, key, val)
-                    continue
-
-                if key in relationships:
-                    relation_dir = relationships[key].direction.name
-                    relation_cls = relationships[key].mapper.entity
-                    use_list = relationships[key].uselist
-
-                    try:
-                        get_attr = relation_cls.Config.get_attr
-                        if get_attr is None:
-                            get_attr = "id"
-                    except Exception:
-                        get_attr = "id"
-
-                    if relation_dir == ONETOMANY.name and use_list:
-                        instances = handle_one_to_many_list(get_attr, relation_cls, val)
-                        setattr(self, key, instances)
-
-                    if relation_dir == ONETOMANY.name and not use_list:
-                        instance = relation_cls(**val)
-                        setattr(self, key, instance)
-
-                    elif relation_dir == MANYTOONE.name and not use_list:
-                        if isinstance(val, dict):
-                            val = val.get(get_attr)
-
-                            if val is None:
-                                raise ValueError(f"Expected 'id' to be provided for {key}")
-
-                        if isinstance(val, (str, int)):
-                            instance = relation_cls.get_ref(match_value=val, session=session)
-                            setattr(self, key, instance)
-
-                    elif relation_dir == MANYTOMANY.name:
-
-                        if not isinstance(val, list):
-                            raise ValueError(f"Expected many to many input to be of type list for {key}")
-
-                        if len(val) > 0 and isinstance(val[0], dict):
-                            val = [elem.get(get_attr) for elem in val]
-
-                        instances = [x for x in [relation_cls.get_ref(elem, session=session) for elem in val] if x]
-                        setattr(self, key, instances)
-
-            return init(self, *args, **kwargs)
-
-        return wrapper
-
-    return decorator
diff --git a/mealie/db/models/_model_utils/__init__.py b/mealie/db/models/_model_utils/__init__.py
new file mode 100644
index 000000000000..9949173723f8
--- /dev/null
+++ b/mealie/db/models/_model_utils/__init__.py
@@ -0,0 +1 @@
+from .auto_init import auto_init
diff --git a/mealie/db/models/_model_utils/auto_init.py b/mealie/db/models/_model_utils/auto_init.py
new file mode 100644
index 000000000000..120c94803fc9
--- /dev/null
+++ b/mealie/db/models/_model_utils/auto_init.py
@@ -0,0 +1,184 @@
+from __future__ import annotations
+
+from functools import wraps
+
+from pydantic import BaseModel, Field
+from sqlalchemy.orm import MANYTOMANY, MANYTOONE, ONETOMANY, Session
+from sqlalchemy.orm.decl_api import DeclarativeMeta
+from sqlalchemy.orm.mapper import Mapper
+from sqlalchemy.orm.relationships import RelationshipProperty
+from sqlalchemy.sql.base import ColumnCollection
+from sqlalchemy.util._collections import ImmutableProperties
+
+from .helpers import safe_call
+
+
+def _default_exclusion() -> set[str]:
+    return {"id"}
+
+
+class AutoInitConfig(BaseModel):
+    """
+    Config class for `auto_init` decorator.
+    """
+
+    get_attr: str = None
+    exclude: set = Field(default_factory=_default_exclusion)
+    # auto_create: bool = False
+
+
+def _get_config(relation_cls: DeclarativeMeta) -> AutoInitConfig:
+    """
+    Returns the config for the given class.
+    """
+    cfg = AutoInitConfig()
+    cfgKeys = cfg.dict().keys()
+    # Get the config for the class
+    try:
+        class_config: AutoInitConfig = relation_cls.Config
+    except AttributeError:
+        return cfg
+    # Map all matching attributes in Config to all AutoInitConfig attributes
+    for attr in dir(class_config):
+        if attr in cfgKeys:
+            setattr(cfg, attr, getattr(class_config, attr))
+
+    return cfg
+
+
+def get_lookup_attr(relation_cls: DeclarativeMeta) -> str:
+    """Returns the primary key attribute of the related class as a string.
+
+    Args:
+        relation_cls (DeclarativeMeta): The SQLAlchemy class to get the primary_key from
+
+    Returns:
+        Any: [description]
+    """
+
+    cfg = _get_config(relation_cls)
+
+    try:
+        get_attr = cfg.get_attr
+        if get_attr is None:
+            get_attr = relation_cls.__table__.primary_key.columns.keys()[0]
+    except Exception:
+        get_attr = "id"
+    return get_attr
+
+
+def handle_many_to_many(session, get_attr, relation_cls, all_elements: list[dict]):
+    """
+    Proxy call to `handle_one_to_many_list` for many-to-many relationships. Because functionally, they do the same
+    """
+    return handle_one_to_many_list(session, get_attr, relation_cls, all_elements)
+
+
+def handle_one_to_many_list(session: Session, get_attr, relation_cls, all_elements: list[dict]):
+    elems_to_create: list[dict] = []
+    updated_elems: list[dict] = []
+
+    for elem in all_elements:
+        elem_id = elem.get(get_attr, None)
+
+        existing_elem = session.query(relation_cls).filter_by(**{get_attr: elem_id}).one_or_none()
+
+        if existing_elem is None:
+            elems_to_create.append(elem)
+
+        else:
+            for key, value in elem.items():
+                setattr(existing_elem, key, value)
+
+            updated_elems.append(existing_elem)
+
+    new_elems = [safe_call(relation_cls, elem) for elem in elems_to_create]
+    return new_elems + updated_elems
+
+
+def auto_init():  # sourcery no-metrics
+    """Wraps the `__init__` method of a class to automatically set the common
+    attributes.
+
+    Args:
+        exclude (Union[set, list], optional): [description]. Defaults to None.
+    """
+
+    def decorator(init):
+        @wraps(init)
+        def wrapper(self: DeclarativeMeta, *args, **kwargs):  # sourcery no-metrics
+            """
+            Custom initializer that allows nested children initialization.
+            Only keys that are present as instance's class attributes are allowed.
+            These could be, for example, any mapped columns or relationships.
+
+            Code inspired from GitHub.
+            Ref: https://github.com/tiangolo/fastapi/issues/2194
+            """
+            cls = self.__class__
+
+            exclude = _get_config(cls).exclude
+
+            alchemy_mapper: Mapper = self.__mapper__
+            model_columns: ColumnCollection = alchemy_mapper.columns
+            relationships: ImmutableProperties = alchemy_mapper.relationships
+
+            session = kwargs.get("session", None)
+
+            if session is None:
+                raise ValueError("Session is required to initialize the model with `auto_init`")
+
+            for key, val in kwargs.items():
+                if key in exclude:
+                    continue
+
+                if not hasattr(cls, key):
+                    continue
+                    # raise TypeError(f"Invalid keyword argument: {key}")
+
+                if key in model_columns:
+                    setattr(self, key, val)
+                    continue
+
+                if key in relationships:
+                    prop: RelationshipProperty = relationships[key]
+
+                    # Identifies the type of relationship (ONETOMANY, MANYTOONE, many-to-one, many-to-many)
+                    relation_dir = prop.direction
+
+                    # Identifies the parent class of the related object.
+                    relation_cls: DeclarativeMeta = prop.mapper.entity
+
+                    # Identifies if the relationship was declared with use_list=True
+                    use_list: bool = prop.uselist
+
+                    get_attr = get_lookup_attr(relation_cls)
+
+                    if relation_dir == ONETOMANY and use_list:
+                        instances = handle_one_to_many_list(session, get_attr, relation_cls, val)
+                        setattr(self, key, instances)
+
+                    elif relation_dir == ONETOMANY:
+                        instance = safe_call(relation_cls, val)
+                        setattr(self, key, instance)
+
+                    elif relation_dir == MANYTOONE and not use_list:
+                        if isinstance(val, dict):
+                            val = val.get(get_attr)
+
+                            if val is None:
+                                raise ValueError(f"Expected 'id' to be provided for {key}")
+
+                        if isinstance(val, (str, int)):
+                            instance = session.query(relation_cls).filter_by(**{get_attr: val}).one_or_none()
+                            setattr(self, key, instance)
+
+                    elif relation_dir == MANYTOMANY:
+                        instances = handle_many_to_many(session, get_attr, relation_cls, val)
+                        setattr(self, key, instances)
+
+            return init(self, *args, **kwargs)
+
+        return wrapper
+
+    return decorator
diff --git a/mealie/db/models/_model_utils/helpers.py b/mealie/db/models/_model_utils/helpers.py
new file mode 100644
index 000000000000..fa0f56c1e592
--- /dev/null
+++ b/mealie/db/models/_model_utils/helpers.py
@@ -0,0 +1,39 @@
+import inspect
+from typing import Any, Callable
+
+
+def get_valid_call(func: Callable, args_dict) -> dict:
+    """
+    Returns a dictionary of valid arguemnts for the supplied function. if kwargs are accepted,
+    the original dictionary will be returned.
+    """
+
+    def get_valid_args(func: Callable) -> tuple:
+        """
+        Returns a tuple of valid arguemnts for the supplied function.
+        """
+        return inspect.getfullargspec(func).args
+
+    def accepts_kwargs(func: Callable) -> bool:
+        """
+        Returns True if the function accepts keyword arguments.
+        """
+        return inspect.getfullargspec(func).varkw is not None
+
+    if accepts_kwargs(func):
+        return args_dict
+
+    valid_args = get_valid_args(func)
+
+    return {k: v for k, v in args_dict.items() if k in valid_args}
+
+
+def safe_call(func, dict) -> Any:
+    """
+    Safely calls the supplied function with the supplied dictionary of arguments.
+    by removing any invalid arguments.
+    """
+    try:
+        return func(**get_valid_call(func, dict))
+    except TypeError:
+        return func(**dict)
diff --git a/mealie/db/models/group/group.py b/mealie/db/models/group/group.py
index fdc52e4cbb31..21629c055f4f 100644
--- a/mealie/db/models/group/group.py
+++ b/mealie/db/models/group/group.py
@@ -46,7 +46,10 @@ class Group(SqlAlchemyBase, BaseMixins):
     server_tasks = orm.relationship(ServerTaskModel, back_populates="group", single_parent=True)
     shopping_lists = orm.relationship("ShoppingList", back_populates="group", single_parent=True)
 
-    @auto_init({"users", "webhooks", "shopping_lists", "cookbooks", "preferences", "invite_tokens", "mealplans"})
+    class Config:
+        exclude = {"users", "webhooks", "shopping_lists", "cookbooks", "preferences", "invite_tokens", "mealplans"}
+
+    @auto_init()
     def __init__(self, **_) -> None:
         pass
 
diff --git a/mealie/db/models/recipe/assets.py b/mealie/db/models/recipe/assets.py
index 196c65c93d88..8f18a2d4dc45 100644
--- a/mealie/db/models/recipe/assets.py
+++ b/mealie/db/models/recipe/assets.py
@@ -11,12 +11,7 @@ class RecipeAsset(SqlAlchemyBase):
     icon = sa.Column(sa.String)
     file_name = sa.Column(sa.String)
 
-    def __init__(
-        self,
-        name=None,
-        icon=None,
-        file_name=None,
-    ) -> None:
+    def __init__(self, name=None, icon=None, file_name=None) -> None:
         self.name = name
         self.file_name = file_name
         self.icon = icon
diff --git a/mealie/db/models/recipe/category.py b/mealie/db/models/recipe/category.py
index f4f320dcbc30..7aa7aaef7ca4 100644
--- a/mealie/db/models/recipe/category.py
+++ b/mealie/db/models/recipe/category.py
@@ -8,12 +8,6 @@ from mealie.db.models._model_base import BaseMixins, SqlAlchemyBase
 
 logger = root_logger.get_logger()
 
-site_settings2categories = sa.Table(
-    "site_settings2categories",
-    SqlAlchemyBase.metadata,
-    sa.Column("site_settings.id", sa.Integer, sa.ForeignKey("site_settings.id")),
-    sa.Column("category_id", sa.Integer, sa.ForeignKey("categories.id")),
-)
 
 group2categories = sa.Table(
     "group2categories",
diff --git a/mealie/db/models/recipe/recipe.py b/mealie/db/models/recipe/recipe.py
index 2a9365631027..1b4f71f40828 100644
--- a/mealie/db/models/recipe/recipe.py
+++ b/mealie/db/models/recipe/recipe.py
@@ -86,14 +86,7 @@ class RecipeModel(SqlAlchemyBase, BaseMixins):
 
     class Config:
         get_attr = "slug"
-
-    @validates("name")
-    def validate_name(self, key, name):
-        assert name != ""
-        return name
-
-    @auto_init(
-        {
+        exclude = {
             "assets",
             "extras",
             "notes",
@@ -103,7 +96,13 @@ class RecipeModel(SqlAlchemyBase, BaseMixins):
             "settings",
             "tools",
         }
-    )
+
+    @validates("name")
+    def validate_name(self, key, name):
+        assert name != ""
+        return name
+
+    @auto_init()
     def __init__(
         self,
         session,
@@ -115,7 +114,7 @@ class RecipeModel(SqlAlchemyBase, BaseMixins):
         recipe_instructions: list[dict] = None,
         settings: dict = None,
         tools: list[str] = None,
-        **_
+        **_,
     ) -> None:
         self.nutrition = Nutrition(**nutrition) if nutrition else Nutrition()
         self.tools = [Tool(tool=x) for x in tools] if tools else []
diff --git a/mealie/db/models/settings.py b/mealie/db/models/settings.py
deleted file mode 100644
index 79464f0bf3a2..000000000000
--- a/mealie/db/models/settings.py
+++ /dev/null
@@ -1,35 +0,0 @@
-import sqlalchemy as sa
-import sqlalchemy.orm as orm
-from sqlalchemy.orm import Session
-
-from mealie.db.models._model_base import BaseMixins, SqlAlchemyBase
-from mealie.db.models.recipe.category import Category, site_settings2categories
-
-
-class SiteSettings(SqlAlchemyBase, BaseMixins):
-    __tablename__ = "site_settings"
-    id = sa.Column(sa.Integer, primary_key=True)
-    language = sa.Column(sa.String)
-    first_day_of_week = sa.Column(sa.Integer)
-    categories = orm.relationship("Category", secondary=site_settings2categories, single_parent=True)
-    show_recent = sa.Column(sa.Boolean, default=True)
-    cards_per_section = sa.Column(sa.Integer)
-
-    def __init__(
-        self,
-        session: Session = None,
-        language="en",
-        first_day_of_week: int = 0,
-        categories: list = [],
-        show_recent=True,
-        cards_per_section: int = 9,
-    ) -> None:
-        session.commit()
-        self.language = language
-        self.first_day_of_week = first_day_of_week
-        self.cards_per_section = cards_per_section
-        self.show_recent = show_recent
-        self.categories = [Category.get_ref(session=session, slug=cat.get("slug")) for cat in categories]
-
-    def update(self, *args, **kwarg):
-        self.__init__(*args, **kwarg)
diff --git a/mealie/db/models/users/users.py b/mealie/db/models/users/users.py
index 77b4f09f1367..916bf6777862 100644
--- a/mealie/db/models/users/users.py
+++ b/mealie/db/models/users/users.py
@@ -11,7 +11,6 @@ settings = get_app_settings()
 
 class LongLiveToken(SqlAlchemyBase, BaseMixins):
     __tablename__ = "long_live_tokens"
-    id = Column(Integer, primary_key=True)
     parent_id = Column(Integer, ForeignKey("users.id"))
     name = Column(String, nullable=False)
     token = Column(String, nullable=False)
@@ -25,7 +24,6 @@ class LongLiveToken(SqlAlchemyBase, BaseMixins):
 
 class User(SqlAlchemyBase, BaseMixins):
     __tablename__ = "users"
-    id = Column(Integer, primary_key=True)
     full_name = Column(String, index=True)
     username = Column(String, index=True, unique=True)
     email = Column(String, unique=True, index=True)
@@ -41,7 +39,6 @@ class User(SqlAlchemyBase, BaseMixins):
     can_invite = Column(Boolean, default=False)
     can_organize = Column(Boolean, default=False)
 
-    # Recipes
     tokens: list[LongLiveToken] = orm.relationship(
         LongLiveToken, back_populates="user", cascade="all, delete, delete-orphan", single_parent=True
     )
@@ -67,67 +64,52 @@ class User(SqlAlchemyBase, BaseMixins):
         password,
         favorite_recipes: list[str] = None,
         group: str = settings.DEFAULT_GROUP,
-        admin=False,
         advanced=False,
-        can_manage=False,
-        can_invite=False,
-        can_organize=False,
-        **_
+        **kwargs
     ) -> None:
-
         group = group or settings.DEFAULT_GROUP
         favorite_recipes = favorite_recipes or []
+        self.group = Group.get_ref(session, group)
+
         self.full_name = full_name
         self.email = email
-        self.group = Group.get_ref(session, group)
-        self.admin = admin
         self.password = password
         self.advanced = advanced
 
-        if self.admin:
-            self.can_manage = True
-            self.can_invite = True
-            self.can_organize = True
-        else:
-            self.can_manage = can_manage
-            self.can_invite = can_invite
-            self.can_organize = can_organize
-
         self.favorite_recipes = []
 
         if self.username is None:
             self.username = full_name
 
-    def update(
-        self,
-        full_name,
-        email,
-        group,
-        admin,
-        username,
-        session=None,
-        favorite_recipes=None,
-        password=None,
-        advanced=False,
-        can_manage=False,
-        can_invite=False,
-        can_organize=False,
-        **_
-    ):
+        self._set_permissions(**kwargs)
+
+    def update(self, full_name, email, group, username, session=None, favorite_recipes=None, advanced=False, **kwargs):
         favorite_recipes = favorite_recipes or []
         self.username = username
         self.full_name = full_name
         self.email = email
+
         self.group = Group.get_ref(session, group)
-        self.admin = admin
         self.advanced = advanced
 
         if self.username is None:
             self.username = full_name
 
-        if password:
-            self.password = password
+        self._set_permissions(**kwargs)
 
+    def update_password(self, password):
+        self.password = password
+
+    def _set_permissions(self, admin, can_manage=False, can_invite=False, can_organize=False, **_):
+        """Set user permissions based on the admin flag and the passed in kwargs
+
+        Args:
+            admin (bool):
+            can_manage (bool):
+            can_invite (bool):
+            can_organize (bool):
+        """
+        self.admin = admin
         if self.admin:
             self.can_manage = True
             self.can_invite = True
@@ -137,9 +119,6 @@ class User(SqlAlchemyBase, BaseMixins):
             self.can_invite = can_invite
             self.can_organize = can_organize
 
-    def update_password(self, password):
-        self.password = password
-
     @staticmethod
     def get_ref(session, id: str):
         return session.query(User).filter(User.id == id).one()
diff --git a/mealie/routes/site_settings/site_settings.py b/mealie/routes/site_settings/site_settings.py
index 23e272e526cd..01dda81a7539 100644
--- a/mealie/routes/site_settings/site_settings.py
+++ b/mealie/routes/site_settings/site_settings.py
@@ -5,7 +5,6 @@ from mealie.core.dependencies import get_current_user
 from mealie.db.database import get_database
 from mealie.db.db_setup import generate_session
 from mealie.routes.routers import AdminAPIRouter
-from mealie.schema.admin import SiteSettings
 from mealie.schema.user import GroupInDB, PrivateUser
 from mealie.utils.post_webhooks import post_webhooks
 
@@ -21,16 +20,6 @@ def get_main_settings(session: Session = Depends(generate_session)):
     return db.settings.get(1)
 
 
-@admin_router.put("")
-def update_settings(
-    data: SiteSettings,
-    session: Session = Depends(generate_session),
-):
-    """ Returns Site Settings """
-    db = get_database(session)
-    db.settings.update(1, data.dict())
-
-
 @admin_router.post("/webhooks/test")
 def test_webhooks(
     current_user: PrivateUser = Depends(get_current_user),
diff --git a/mealie/routes/users/passwords.py b/mealie/routes/users/passwords.py
index 7986a517fe7e..c760b31359c4 100644
--- a/mealie/routes/users/passwords.py
+++ b/mealie/routes/users/passwords.py
@@ -24,10 +24,9 @@ async def reset_user_password(id: int, session: Session = Depends(generate_sessi
     db.users.update_password(id, new_password)
 
 
-@user_router.put("/{id}/password")
+@user_router.put("/{item_id}/password")
 def update_password(password_change: ChangePassword, user_service: UserService = Depends(UserService.write_existing)):
     """ Resets the User Password"""
-
     return user_service.change_password(password_change)
 
 
diff --git a/mealie/schema/admin/settings.py b/mealie/schema/admin/settings.py
index 4002db51bb8f..31468754bb3f 100644
--- a/mealie/schema/admin/settings.py
+++ b/mealie/schema/admin/settings.py
@@ -4,31 +4,7 @@ from fastapi_camelcase import CamelModel
 from pydantic import validator
 from slugify import slugify
 
-from ..recipe.recipe_category import CategoryBase, RecipeCategoryResponse
-
-
-class SiteSettings(CamelModel):
-    language: str = "en-US"
-    first_day_of_week: int = 0
-    show_recent: bool = True
-    cards_per_section: int = 9
-    categories: Optional[list[CategoryBase]] = []
-
-    class Config:
-        orm_mode = True
-
-        schema_extra = {
-            "example": {
-                "language": "en",
-                "firstDayOfWeek": 0,
-                "showRecent": True,
-                "categories": [
-                    {"id": 1, "name": "thanksgiving", "slug": "thanksgiving"},
-                    {"id": 2, "name": "homechef", "slug": "homechef"},
-                    {"id": 3, "name": "potatoes", "slug": "potatoes"},
-                ],
-            }
-        }
+from ..recipe.recipe_category import RecipeCategoryResponse
 
 
 class CustomPageBase(CamelModel):
diff --git a/mealie/services/backups/imports.py b/mealie/services/backups/imports.py
index bf511e3f39d4..3c483bc957b1 100644
--- a/mealie/services/backups/imports.py
+++ b/mealie/services/backups/imports.py
@@ -11,15 +11,7 @@ from mealie.core.config import get_app_dirs
 
 app_dirs = get_app_dirs()
 from mealie.db.database import get_database
-from mealie.schema.admin import (
-    CommentImport,
-    GroupImport,
-    NotificationImport,
-    RecipeImport,
-    SettingsImport,
-    SiteSettings,
-    UserImport,
-)
+from mealie.schema.admin import CommentImport, GroupImport, NotificationImport, RecipeImport, UserImport
 from mealie.schema.events import EventNotificationIn
 from mealie.schema.recipe import CommentOut, Recipe
 from mealie.schema.user import PrivateUser, UpdateGroup
@@ -181,19 +173,7 @@ class ImportDatabase:
         return import_notifications
 
     def import_settings(self):
-        settings_file = self.import_dir.joinpath("settings", "settings.json")
-        settings = ImportDatabase.read_models_file(settings_file, SiteSettings)
-        settings = settings[0]
-
-        try:
-            self.db.settings.update(1, settings.dict())
-            import_status = SettingsImport(name="Site Settings", status=True)
-
-        except Exception as inst:
-            self.session.rollback()
-            import_status = SettingsImport(name="Site Settings", status=False, exception=str(inst))
-
-        return [import_status]
+        return []
 
     def import_groups(self):
         groups_file = self.import_dir.joinpath("groups", "groups.json")
diff --git a/mealie/services/migrations/_migration_base.py b/mealie/services/migrations/_migration_base.py
index 78659be25681..f39ea2fd1901 100644
--- a/mealie/services/migrations/_migration_base.py
+++ b/mealie/services/migrations/_migration_base.py
@@ -181,7 +181,7 @@ class MigrationBase(BaseModel):
 
             except Exception as inst:
                 exception = inst
-                logger.error(inst)
+                logger.exception(inst)
                 self.session.rollback()
 
             import_status = MigrationImport(slug=recipe.slug, name=recipe.name, status=status, exception=str(exception))
diff --git a/mealie/services/user_services/user_service.py b/mealie/services/user_services/user_service.py
index 9b8fb38a006e..59f5c692ae2d 100644
--- a/mealie/services/user_services/user_service.py
+++ b/mealie/services/user_services/user_service.py
@@ -13,7 +13,12 @@ class UserService(UserHttpService[int, str]):
     event_func = create_user_event
     acting_user: PrivateUser = None
 
+    def populate_item(self, item_id: int) -> None:
+        self.acting_user = self.db.users.get_one(item_id)
+        return self.acting_user
+
     def assert_existing(self, id) -> PrivateUser:
+        self.populate_item(id)
         self._populate_target_user(id)
         self._assert_user_change_allowed()
         return self.target_user
@@ -32,7 +37,6 @@ class UserService(UserHttpService[int, str]):
             self.target_user = self.acting_user
 
     def change_password(self, password_change: ChangePassword) -> PrivateUser:
-        """"""
         if not verify_password(password_change.current_password, self.target_user.password):
             raise HTTPException(status.HTTP_400_BAD_REQUEST)
 
diff --git a/poetry.lock b/poetry.lock
index 8ccdf36004f4..a66ab7c783de 100644
--- a/poetry.lock
+++ b/poetry.lock
@@ -41,7 +41,7 @@ six = "*"
 
 [[package]]
 name = "apscheduler"
-version = "3.8.0"
+version = "3.8.1"
 description = "In-process task scheduler with Cron-like capabilities"
 category = "main"
 optional = false
@@ -50,7 +50,7 @@ python-versions = ">=2.7, !=3.0.*, !=3.1.*, !=3.2.*, !=3.3.*, !=3.4.*, <4"
 [package.dependencies]
 pytz = "*"
 six = ">=1.4.0"
-tzlocal = ">=2.0,<3.0"
+tzlocal = ">=2.0,<3.0.0 || >=4.0.0"
 
 [package.extras]
 asyncio = ["trollius"]
@@ -67,7 +67,7 @@ zookeeper = ["kazoo"]
 
 [[package]]
 name = "astroid"
-version = "2.8.3"
+version = "2.8.4"
 description = "An abstract syntax tree for Python with inference support."
 category = "dev"
 optional = false
@@ -646,7 +646,7 @@ i18n = ["babel (>=2.9.0)"]
 
 [[package]]
 name = "mkdocs-material"
-version = "7.3.4"
+version = "7.3.6"
 description = "A Material Design theme for MkDocs"
 category = "dev"
 optional = false
@@ -657,7 +657,7 @@ jinja2 = ">=2.11.1"
 markdown = ">=3.2"
 mkdocs = ">=1.2.3"
 mkdocs-material-extensions = ">=1.0"
-pygments = ">=2.4"
+pygments = ">=2.10"
 pymdown-extensions = ">=9.0"
 
 [[package]]
@@ -691,14 +691,14 @@ signedtoken = ["cryptography (>=3.0.0,<4)", "pyjwt (>=2.0.0,<3)"]
 
 [[package]]
 name = "packaging"
-version = "21.0"
+version = "21.2"
 description = "Core utilities for Python packages"
 category = "dev"
 optional = false
 python-versions = ">=3.6"
 
 [package.dependencies]
-pyparsing = ">=2.0.2"
+pyparsing = ">=2.0.2,<3"
 
 [[package]]
 name = "passlib"
@@ -1044,6 +1044,17 @@ category = "main"
 optional = false
 python-versions = "*"
 
+[[package]]
+name = "pytz-deprecation-shim"
+version = "0.1.0.post0"
+description = "Shims to make deprecation of pytz easier"
+category = "main"
+optional = false
+python-versions = "!=3.0.*,!=3.1.*,!=3.2.*,!=3.3.*,!=3.4.*,!=3.5.*,>=2.7"
+
+[package.dependencies]
+tzdata = {version = "*", markers = "python_version >= \"3.6\""}
+
 [[package]]
 name = "pyyaml"
 version = "5.4.1"
@@ -1263,16 +1274,29 @@ category = "main"
 optional = false
 python-versions = "*"
 
+[[package]]
+name = "tzdata"
+version = "2021.5"
+description = "Provider of IANA time zone data"
+category = "main"
+optional = false
+python-versions = ">=2"
+
 [[package]]
 name = "tzlocal"
-version = "2.1"
+version = "4.1"
 description = "tzinfo object for the local timezone"
 category = "main"
 optional = false
-python-versions = "*"
+python-versions = ">=3.6"
 
 [package.dependencies]
-pytz = "*"
+pytz-deprecation-shim = "*"
+tzdata = {version = "*", markers = "platform_system == \"Windows\""}
+
+[package.extras]
+devenv = ["black", "pyroma", "pytest-cov", "zest.releaser"]
+test = ["pytest-mock (>=3.3)", "pytest (>=4.3)"]
 
 [[package]]
 name = "urllib3"
@@ -1370,7 +1394,7 @@ python-versions = ">=3.6.1"
 
 [[package]]
 name = "wrapt"
-version = "1.13.2"
+version = "1.13.3"
 description = "Module for decorators, wrappers and monkey patching."
 category = "dev"
 optional = false
@@ -1414,12 +1438,12 @@ apprise = [
     {file = "apprise-0.9.3.tar.gz", hash = "sha256:c8ace9c891d4224558570acbea808f31df9049530bd9ccd69901c27a65d600c4"},
 ]
 apscheduler = [
-    {file = "APScheduler-3.8.0-py2.py3-none-any.whl", hash = "sha256:82d6d21b2f0343510d07bb35618333a794653439a265635555b12935647b460a"},
-    {file = "APScheduler-3.8.0.tar.gz", hash = "sha256:793b2d37c52ece53e34626619e6142e99b20b59a12155f39e1e6932e324f079d"},
+    {file = "APScheduler-3.8.1-py2.py3-none-any.whl", hash = "sha256:c22cb14b411a31435eb2c530dfbbec948ac63015b517087c7978adb61b574865"},
+    {file = "APScheduler-3.8.1.tar.gz", hash = "sha256:5cf344ebcfbdaa48ae178c029c055cec7bc7a4a47c21e315e4d1f08bd35f2355"},
 ]
 astroid = [
-    {file = "astroid-2.8.3-py3-none-any.whl", hash = "sha256:f9d66e3a4a0e5b52819b2ff41ac2b179df9d180697db71c92beb33a60c661794"},
-    {file = "astroid-2.8.3.tar.gz", hash = "sha256:0e361da0744d5011d4f5d57e64473ba9b7ab4da1e2d45d6631ebd67dd28c3cce"},
+    {file = "astroid-2.8.4-py3-none-any.whl", hash = "sha256:0755c998e7117078dcb7d0bda621391dd2a85da48052d948c7411ab187325346"},
+    {file = "astroid-2.8.4.tar.gz", hash = "sha256:1e83a69fd51b013ebf5912d26b9338d6643a55fec2f20c787792680610eed4a2"},
 ]
 atomicwrites = [
     {file = "atomicwrites-1.4.0-py2.py3-none-any.whl", hash = "sha256:6d1784dea7c0c8d4a5172b6c620f40b6e4cbfdf96d783691f2e1302a7b88e197"},
@@ -1820,12 +1844,28 @@ markdown = [
     {file = "Markdown-3.3.4.tar.gz", hash = "sha256:31b5b491868dcc87d6c24b7e3d19a0d730d59d3e46f4eea6430a321bed387a49"},
 ]
 markupsafe = [
+    {file = "MarkupSafe-2.0.1-cp310-cp310-macosx_10_9_universal2.whl", hash = "sha256:d8446c54dc28c01e5a2dbac5a25f071f6653e6e40f3a8818e8b45d790fe6ef53"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-macosx_10_9_x86_64.whl", hash = "sha256:36bc903cbb393720fad60fc28c10de6acf10dc6cc883f3e24ee4012371399a38"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:2d7d807855b419fc2ed3e631034685db6079889a1f01d5d9dac950f764da3dad"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:add36cb2dbb8b736611303cd3bfcee00afd96471b09cda130da3581cbdc56a6d"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:168cd0a3642de83558a5153c8bd34f175a9a6e7f6dc6384b9655d2697312a646"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-musllinux_1_1_aarch64.whl", hash = "sha256:4dc8f9fb58f7364b63fd9f85013b780ef83c11857ae79f2feda41e270468dd9b"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-musllinux_1_1_i686.whl", hash = "sha256:20dca64a3ef2d6e4d5d615a3fd418ad3bde77a47ec8a23d984a12b5b4c74491a"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-musllinux_1_1_x86_64.whl", hash = "sha256:cdfba22ea2f0029c9261a4bd07e830a8da012291fbe44dc794e488b6c9bb353a"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-win32.whl", hash = "sha256:99df47edb6bda1249d3e80fdabb1dab8c08ef3975f69aed437cb69d0a5de1e28"},
+    {file = "MarkupSafe-2.0.1-cp310-cp310-win_amd64.whl", hash = "sha256:e0f138900af21926a02425cf736db95be9f4af72ba1bb21453432a07f6082134"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-macosx_10_9_x86_64.whl", hash = "sha256:f9081981fe268bd86831e5c75f7de206ef275defcb82bc70740ae6dc507aee51"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux1_i686.whl", hash = "sha256:0955295dd5eec6cb6cc2fe1698f4c6d84af2e92de33fbcac4111913cd100a6ff"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux1_x86_64.whl", hash = "sha256:0446679737af14f45767963a1a9ef7620189912317d095f2d9ffa183a4d25d2b"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux2010_i686.whl", hash = "sha256:f826e31d18b516f653fe296d967d700fddad5901ae07c622bb3705955e1faa94"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux2010_x86_64.whl", hash = "sha256:fa130dd50c57d53368c9d59395cb5526eda596d3ffe36666cd81a44d56e48872"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux2014_aarch64.whl", hash = "sha256:905fec760bd2fa1388bb5b489ee8ee5f7291d692638ea5f67982d968366bef9f"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:bf5d821ffabf0ef3533c39c518f3357b171a1651c1ff6827325e4489b0e46c3c"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:0d4b31cc67ab36e3392bbf3862cfbadac3db12bdd8b02a2731f509ed5b829724"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:baa1a4e8f868845af802979fcdbf0bb11f94f1cb7ced4c4b8a351bb60d108145"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-musllinux_1_1_aarch64.whl", hash = "sha256:deb993cacb280823246a026e3b2d81c493c53de6acfd5e6bfe31ab3402bb37dd"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-musllinux_1_1_i686.whl", hash = "sha256:63f3268ba69ace99cab4e3e3b5840b03340efed0948ab8f78d2fd87ee5442a4f"},
+    {file = "MarkupSafe-2.0.1-cp36-cp36m-musllinux_1_1_x86_64.whl", hash = "sha256:8d206346619592c6200148b01a2142798c989edcb9c896f9ac9722a99d4e77e6"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-win32.whl", hash = "sha256:6c4ca60fa24e85fe25b912b01e62cb969d69a23a5d5867682dd3e80b5b02581d"},
     {file = "MarkupSafe-2.0.1-cp36-cp36m-win_amd64.whl", hash = "sha256:b2f4bf27480f5e5e8ce285a8c8fd176c0b03e93dcc6646477d4630e83440c6a9"},
     {file = "MarkupSafe-2.0.1-cp37-cp37m-macosx_10_9_x86_64.whl", hash = "sha256:0717a7390a68be14b8c793ba258e075c6f4ca819f15edfc2a3a027c823718567"},
@@ -1834,14 +1874,27 @@ markupsafe = [
     {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux2010_i686.whl", hash = "sha256:d7f9850398e85aba693bb640262d3611788b1f29a79f0c93c565694658f4071f"},
     {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux2010_x86_64.whl", hash = "sha256:6a7fae0dd14cf60ad5ff42baa2e95727c3d81ded453457771d02b7d2b3f9c0c2"},
     {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux2014_aarch64.whl", hash = "sha256:b7f2d075102dc8c794cbde1947378051c4e5180d52d276987b8d28a3bd58c17d"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:e9936f0b261d4df76ad22f8fee3ae83b60d7c3e871292cd42f40b81b70afae85"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:2a7d351cbd8cfeb19ca00de495e224dea7e7d919659c2841bbb7f420ad03e2d6"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:60bf42e36abfaf9aff1f50f52644b336d4f0a3fd6d8a60ca0d054ac9f713a864"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-musllinux_1_1_aarch64.whl", hash = "sha256:d6c7ebd4e944c85e2c3421e612a7057a2f48d478d79e61800d81468a8d842207"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-musllinux_1_1_i686.whl", hash = "sha256:f0567c4dc99f264f49fe27da5f735f414c4e7e7dd850cfd8e69f0862d7c74ea9"},
+    {file = "MarkupSafe-2.0.1-cp37-cp37m-musllinux_1_1_x86_64.whl", hash = "sha256:89c687013cb1cd489a0f0ac24febe8c7a666e6e221b783e53ac50ebf68e45d86"},
     {file = "MarkupSafe-2.0.1-cp37-cp37m-win32.whl", hash = "sha256:a30e67a65b53ea0a5e62fe23682cfe22712e01f453b95233b25502f7c61cb415"},
     {file = "MarkupSafe-2.0.1-cp37-cp37m-win_amd64.whl", hash = "sha256:611d1ad9a4288cf3e3c16014564df047fe08410e628f89805e475368bd304914"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-macosx_10_9_universal2.whl", hash = "sha256:5bb28c636d87e840583ee3adeb78172efc47c8b26127267f54a9c0ec251d41a9"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-macosx_10_9_x86_64.whl", hash = "sha256:be98f628055368795d818ebf93da628541e10b75b41c559fdf36d104c5787066"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux1_i686.whl", hash = "sha256:1d609f577dc6e1aa17d746f8bd3c31aa4d258f4070d61b2aa5c4166c1539de35"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux1_x86_64.whl", hash = "sha256:7d91275b0245b1da4d4cfa07e0faedd5b0812efc15b702576d103293e252af1b"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux2010_i686.whl", hash = "sha256:01a9b8ea66f1658938f65b93a85ebe8bc016e6769611be228d797c9d998dd298"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux2010_x86_64.whl", hash = "sha256:47ab1e7b91c098ab893b828deafa1203de86d0bc6ab587b160f78fe6c4011f75"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux2014_aarch64.whl", hash = "sha256:97383d78eb34da7e1fa37dd273c20ad4320929af65d156e35a5e2d89566d9dfb"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:6fcf051089389abe060c9cd7caa212c707e58153afa2c649f00346ce6d260f1b"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:5855f8438a7d1d458206a2466bf82b0f104a3724bf96a1c781ab731e4201731a"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:3dd007d54ee88b46be476e293f48c85048603f5f516008bee124ddd891398ed6"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-musllinux_1_1_aarch64.whl", hash = "sha256:aca6377c0cb8a8253e493c6b451565ac77e98c2951c45f913e0b52facdcff83f"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-musllinux_1_1_i686.whl", hash = "sha256:04635854b943835a6ea959e948d19dcd311762c5c0c6e1f0e16ee57022669194"},
+    {file = "MarkupSafe-2.0.1-cp38-cp38-musllinux_1_1_x86_64.whl", hash = "sha256:6300b8454aa6930a24b9618fbb54b5a68135092bc666f7b06901f897fa5c2fee"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-win32.whl", hash = "sha256:023cb26ec21ece8dc3907c0e8320058b2e0cb3c55cf9564da612bc325bed5e64"},
     {file = "MarkupSafe-2.0.1-cp38-cp38-win_amd64.whl", hash = "sha256:984d76483eb32f1bcb536dc27e4ad56bba4baa70be32fa87152832cdd9db0833"},
     {file = "MarkupSafe-2.0.1-cp39-cp39-macosx_10_9_universal2.whl", hash = "sha256:2ef54abee730b502252bcdf31b10dacb0a416229b72c18b19e24a4509f273d26"},
@@ -1851,6 +1904,12 @@ markupsafe = [
     {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux2010_i686.whl", hash = "sha256:4efca8f86c54b22348a5467704e3fec767b2db12fc39c6d963168ab1d3fc9135"},
     {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux2010_x86_64.whl", hash = "sha256:ab3ef638ace319fa26553db0624c4699e31a28bb2a835c5faca8f8acf6a5a902"},
     {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux2014_aarch64.whl", hash = "sha256:f8ba0e8349a38d3001fae7eadded3f6606f0da5d748ee53cc1dab1d6527b9509"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:c47adbc92fc1bb2b3274c4b3a43ae0e4573d9fbff4f54cd484555edbf030baf1"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:37205cac2a79194e3750b0af2a5720d95f786a55ce7df90c3af697bfa100eaac"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:1f2ade76b9903f39aa442b4aadd2177decb66525062db244b35d71d0ee8599b6"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-musllinux_1_1_aarch64.whl", hash = "sha256:4296f2b1ce8c86a6aea78613c34bb1a672ea0e3de9c6ba08a960efe0b0a09047"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-musllinux_1_1_i686.whl", hash = "sha256:9f02365d4e99430a12647f09b6cc8bab61a6564363f313126f775eb4f6ef798e"},
+    {file = "MarkupSafe-2.0.1-cp39-cp39-musllinux_1_1_x86_64.whl", hash = "sha256:5b6d930f030f8ed98e3e6c98ffa0652bdb82601e7a016ec2ab5d7ff23baa78d1"},
     {file = "MarkupSafe-2.0.1-cp39-cp39-win32.whl", hash = "sha256:10f82115e21dc0dfec9ab5c0223652f7197feb168c940f3ef61563fc2d6beb74"},
     {file = "MarkupSafe-2.0.1-cp39-cp39-win_amd64.whl", hash = "sha256:693ce3f9e70a6cf7d2fb9e6c9d8b204b6b39897a2c4a1aa65728d5ac97dcc1d8"},
     {file = "MarkupSafe-2.0.1.tar.gz", hash = "sha256:594c67807fb16238b30c44bdf74f36c02cdf22d1c8cda91ef8a0ed8dabf5620a"},
@@ -1871,8 +1930,8 @@ mkdocs = [
     {file = "mkdocs-1.2.3.tar.gz", hash = "sha256:89f5a094764381cda656af4298727c9f53dc3e602983087e1fe96ea1df24f4c1"},
 ]
 mkdocs-material = [
-    {file = "mkdocs-material-7.3.4.tar.gz", hash = "sha256:9cc0ea54933322792855150ffb89401ff4eaf7737aadca5155fa679195ad803a"},
-    {file = "mkdocs_material-7.3.4-py2.py3-none-any.whl", hash = "sha256:6a9c5a2f18a39ac0b6af73d23c452cdb1f9a07bf6365d43ee54cb796b1d2c7eb"},
+    {file = "mkdocs-material-7.3.6.tar.gz", hash = "sha256:1b1dbd8ef2508b358d93af55a5c5db3f141c95667fad802301ec621c40c7c217"},
+    {file = "mkdocs_material-7.3.6-py2.py3-none-any.whl", hash = "sha256:1b6b3e9e09f922c2d7f1160fe15c8f43d4adc0d6fb81aa6ff0cbc7ef5b78ec75"},
 ]
 mkdocs-material-extensions = [
     {file = "mkdocs-material-extensions-1.0.3.tar.gz", hash = "sha256:bfd24dfdef7b41c312ede42648f9eb83476ea168ec163b613f9abd12bbfddba2"},
@@ -1887,8 +1946,8 @@ oauthlib = [
     {file = "oauthlib-3.1.1.tar.gz", hash = "sha256:8f0215fcc533dd8dd1bee6f4c412d4f0cd7297307d43ac61666389e3bc3198a3"},
 ]
 packaging = [
-    {file = "packaging-21.0-py3-none-any.whl", hash = "sha256:c86254f9220d55e31cc94d69bade760f0847da8000def4dfe1c6b872fd14ff14"},
-    {file = "packaging-21.0.tar.gz", hash = "sha256:7dc96269f53a4ccec5c0670940a4281106dd0bb343f47b7471f779df49c2fbe7"},
+    {file = "packaging-21.2-py3-none-any.whl", hash = "sha256:14317396d1e8cdb122989b916fa2c7e9ca8e2be9e8060a6eff75b6b7b4d8a7e0"},
+    {file = "packaging-21.2.tar.gz", hash = "sha256:096d689d78ca690e4cd8a89568ba06d07ca097e3306a4381635073ca91479966"},
 ]
 passlib = [
     {file = "passlib-1.7.4-py2.py3-none-any.whl", hash = "sha256:aa6bca462b8d8bda89c70b382f0c298a20b5560af6cbfa2dce410c0a2fb669f1"},
@@ -1959,6 +2018,11 @@ premailer = [
 ]
 psycopg2-binary = [
     {file = "psycopg2-binary-2.9.1.tar.gz", hash = "sha256:b0221ca5a9837e040ebf61f48899926b5783668b7807419e4adae8175a31f773"},
+    {file = "psycopg2_binary-2.9.1-cp310-cp310-macosx_10_14_x86_64.macosx_10_9_intel.macosx_10_9_x86_64.macosx_10_10_intel.macosx_10_10_x86_64.whl", hash = "sha256:24b0b6688b9f31a911f2361fe818492650795c9e5d3a1bc647acbd7440142a4f"},
+    {file = "psycopg2_binary-2.9.1-cp310-cp310-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:542875f62bc56e91c6eac05a0deadeae20e1730be4c6334d8f04c944fcd99759"},
+    {file = "psycopg2_binary-2.9.1-cp310-cp310-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:661509f51531ec125e52357a489ea3806640d0ca37d9dada461ffc69ee1e7b6e"},
+    {file = "psycopg2_binary-2.9.1-cp310-cp310-manylinux_2_24_aarch64.whl", hash = "sha256:d92272c7c16e105788efe2cfa5d680f07e34e0c29b03c1908f8636f55d5f915a"},
+    {file = "psycopg2_binary-2.9.1-cp310-cp310-manylinux_2_24_ppc64le.whl", hash = "sha256:736b8797b58febabb85494142c627bd182b50d2a7ec65322983e71065ad3034c"},
     {file = "psycopg2_binary-2.9.1-cp36-cp36m-macosx_10_14_x86_64.macosx_10_9_intel.macosx_10_9_x86_64.macosx_10_10_intel.macosx_10_10_x86_64.whl", hash = "sha256:c250a7ec489b652c892e4f0a5d122cc14c3780f9f643e1a326754aedf82d9a76"},
     {file = "psycopg2_binary-2.9.1-cp36-cp36m-manylinux_2_17_i686.manylinux2014_i686.whl", hash = "sha256:aef9aee84ec78af51107181d02fe8773b100b01c5dfde351184ad9223eab3698"},
     {file = "psycopg2_binary-2.9.1-cp36-cp36m-manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:123c3fb684e9abfc47218d3784c7b4c47c8587951ea4dd5bc38b6636ac57f616"},
@@ -2106,6 +2170,10 @@ pytz = [
     {file = "pytz-2021.3-py2.py3-none-any.whl", hash = "sha256:3672058bc3453457b622aab7a1c3bfd5ab0bdae451512f6cf25f64ed37f5b87c"},
     {file = "pytz-2021.3.tar.gz", hash = "sha256:acad2d8b20a1af07d4e4c9d2e9285c5ed9104354062f275f3fcd88dcef4f1326"},
 ]
+pytz-deprecation-shim = [
+    {file = "pytz_deprecation_shim-0.1.0.post0-py2.py3-none-any.whl", hash = "sha256:8314c9692a636c8eb3bda879b9f119e350e93223ae83e70e80c31675a0fdc1a6"},
+    {file = "pytz_deprecation_shim-0.1.0.post0.tar.gz", hash = "sha256:af097bae1b616dde5c5744441e2ddc69e74dfdcb0c263129610d85b87445a59d"},
+]
 pyyaml = [
     {file = "PyYAML-5.4.1-cp27-cp27m-macosx_10_9_x86_64.whl", hash = "sha256:3b2b1824fe7112845700f815ff6a489360226a5609b96ec2190a45e62a9fc922"},
     {file = "PyYAML-5.4.1-cp27-cp27m-win32.whl", hash = "sha256:129def1b7c1bf22faffd67b8f3724645203b79d8f4cc81f674654d9902cb4393"},
@@ -2113,18 +2181,26 @@ pyyaml = [
     {file = "PyYAML-5.4.1-cp27-cp27mu-manylinux1_x86_64.whl", hash = "sha256:bb4191dfc9306777bc594117aee052446b3fa88737cd13b7188d0e7aa8162185"},
     {file = "PyYAML-5.4.1-cp36-cp36m-macosx_10_9_x86_64.whl", hash = "sha256:6c78645d400265a062508ae399b60b8c167bf003db364ecb26dcab2bda048253"},
     {file = "PyYAML-5.4.1-cp36-cp36m-manylinux1_x86_64.whl", hash = "sha256:4e0583d24c881e14342eaf4ec5fbc97f934b999a6828693a99157fde912540cc"},
+    {file = "PyYAML-5.4.1-cp36-cp36m-manylinux2014_aarch64.whl", hash = "sha256:72a01f726a9c7851ca9bfad6fd09ca4e090a023c00945ea05ba1638c09dc3347"},
+    {file = "PyYAML-5.4.1-cp36-cp36m-manylinux2014_s390x.whl", hash = "sha256:895f61ef02e8fed38159bb70f7e100e00f471eae2bc838cd0f4ebb21e28f8541"},
     {file = "PyYAML-5.4.1-cp36-cp36m-win32.whl", hash = "sha256:3bd0e463264cf257d1ffd2e40223b197271046d09dadf73a0fe82b9c1fc385a5"},
     {file = "PyYAML-5.4.1-cp36-cp36m-win_amd64.whl", hash = "sha256:e4fac90784481d221a8e4b1162afa7c47ed953be40d31ab4629ae917510051df"},
     {file = "PyYAML-5.4.1-cp37-cp37m-macosx_10_9_x86_64.whl", hash = "sha256:5accb17103e43963b80e6f837831f38d314a0495500067cb25afab2e8d7a4018"},
     {file = "PyYAML-5.4.1-cp37-cp37m-manylinux1_x86_64.whl", hash = "sha256:e1d4970ea66be07ae37a3c2e48b5ec63f7ba6804bdddfdbd3cfd954d25a82e63"},
+    {file = "PyYAML-5.4.1-cp37-cp37m-manylinux2014_aarch64.whl", hash = "sha256:cb333c16912324fd5f769fff6bc5de372e9e7a202247b48870bc251ed40239aa"},
+    {file = "PyYAML-5.4.1-cp37-cp37m-manylinux2014_s390x.whl", hash = "sha256:fe69978f3f768926cfa37b867e3843918e012cf83f680806599ddce33c2c68b0"},
     {file = "PyYAML-5.4.1-cp37-cp37m-win32.whl", hash = "sha256:dd5de0646207f053eb0d6c74ae45ba98c3395a571a2891858e87df7c9b9bd51b"},
     {file = "PyYAML-5.4.1-cp37-cp37m-win_amd64.whl", hash = "sha256:08682f6b72c722394747bddaf0aa62277e02557c0fd1c42cb853016a38f8dedf"},
     {file = "PyYAML-5.4.1-cp38-cp38-macosx_10_9_x86_64.whl", hash = "sha256:d2d9808ea7b4af864f35ea216be506ecec180628aced0704e34aca0b040ffe46"},
     {file = "PyYAML-5.4.1-cp38-cp38-manylinux1_x86_64.whl", hash = "sha256:8c1be557ee92a20f184922c7b6424e8ab6691788e6d86137c5d93c1a6ec1b8fb"},
+    {file = "PyYAML-5.4.1-cp38-cp38-manylinux2014_aarch64.whl", hash = "sha256:fd7f6999a8070df521b6384004ef42833b9bd62cfee11a09bda1079b4b704247"},
+    {file = "PyYAML-5.4.1-cp38-cp38-manylinux2014_s390x.whl", hash = "sha256:bfb51918d4ff3d77c1c856a9699f8492c612cde32fd3bcd344af9be34999bfdc"},
     {file = "PyYAML-5.4.1-cp38-cp38-win32.whl", hash = "sha256:fa5ae20527d8e831e8230cbffd9f8fe952815b2b7dae6ffec25318803a7528fc"},
     {file = "PyYAML-5.4.1-cp38-cp38-win_amd64.whl", hash = "sha256:0f5f5786c0e09baddcd8b4b45f20a7b5d61a7e7e99846e3c799b05c7c53fa696"},
     {file = "PyYAML-5.4.1-cp39-cp39-macosx_10_9_x86_64.whl", hash = "sha256:294db365efa064d00b8d1ef65d8ea2c3426ac366c0c4368d930bf1c5fb497f77"},
     {file = "PyYAML-5.4.1-cp39-cp39-manylinux1_x86_64.whl", hash = "sha256:74c1485f7707cf707a7aef42ef6322b8f97921bd89be2ab6317fd782c2d53183"},
+    {file = "PyYAML-5.4.1-cp39-cp39-manylinux2014_aarch64.whl", hash = "sha256:d483ad4e639292c90170eb6f7783ad19490e7a8defb3e46f97dfe4bacae89122"},
+    {file = "PyYAML-5.4.1-cp39-cp39-manylinux2014_s390x.whl", hash = "sha256:fdc842473cd33f45ff6bce46aea678a54e3d21f1b61a7750ce3c498eedfe25d6"},
     {file = "PyYAML-5.4.1-cp39-cp39-win32.whl", hash = "sha256:49d4cdd9065b9b6e206d0595fee27a96b5dd22618e7520c33204a4a3239d5b10"},
     {file = "PyYAML-5.4.1-cp39-cp39-win_amd64.whl", hash = "sha256:c20cfa2d49991c8b4147af39859b167664f2ad4561704ee74c1de03318e898db"},
     {file = "PyYAML-5.4.1.tar.gz", hash = "sha256:607774cbba28732bfa802b54baa7484215f530991055bb562efbed5b2f20a45e"},
@@ -2221,6 +2297,8 @@ sqlalchemy = [
     {file = "SQLAlchemy-1.4.26-cp27-cp27mu-manylinux_2_5_x86_64.manylinux1_x86_64.whl", hash = "sha256:c757ba1279b85b3460e72e8b92239dae6f8b060a75fb24b3d9be984dd78cfa55"},
     {file = "SQLAlchemy-1.4.26-cp310-cp310-macosx_10_14_x86_64.whl", hash = "sha256:c24c01dcd03426a5fe5ee7af735906bec6084977b9027a3605d11d949a565c01"},
     {file = "SQLAlchemy-1.4.26-cp310-cp310-manylinux_2_17_aarch64.manylinux2014_aarch64.whl", hash = "sha256:c46f013ff31b80cbe36410281675e1fb4eaf3e25c284fd8a69981c73f6fa4cb4"},
+    {file = "SQLAlchemy-1.4.26-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:fb2aa74a6e3c2cebea38dd21633671841fbe70ea486053cba33d68e3e22ccc0a"},
+    {file = "SQLAlchemy-1.4.26-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_17_x86_64.manylinux2014_x86_64.whl", hash = "sha256:ad7e403fc1e3cb76e802872694e30d6ca6129b9bc6ad4e7caa48ca35f8a144f8"},
     {file = "SQLAlchemy-1.4.26-cp310-cp310-win32.whl", hash = "sha256:7ef421c3887b39c6f352e5022a53ac18de8387de331130481cb956b2d029cad6"},
     {file = "SQLAlchemy-1.4.26-cp310-cp310-win_amd64.whl", hash = "sha256:908fad32c53b17aad12d722379150c3c5317c422437e44032256a77df1746292"},
     {file = "SQLAlchemy-1.4.26-cp36-cp36m-macosx_10_14_x86_64.whl", hash = "sha256:1ef37c9ec2015ce2f0dc1084514e197f2f199d3dc3514190db7620b78e6004c8"},
@@ -2298,9 +2376,13 @@ typing-extensions = [
     {file = "typing_extensions-3.10.0.2-py3-none-any.whl", hash = "sha256:f1d25edafde516b146ecd0613dabcc61409817af4766fbbcfb8d1ad4ec441a34"},
     {file = "typing_extensions-3.10.0.2.tar.gz", hash = "sha256:49f75d16ff11f1cd258e1b988ccff82a3ca5570217d7ad8c5f48205dd99a677e"},
 ]
+tzdata = [
+    {file = "tzdata-2021.5-py2.py3-none-any.whl", hash = "sha256:3eee491e22ebfe1e5cfcc97a4137cd70f092ce59144d81f8924a844de05ba8f5"},
+    {file = "tzdata-2021.5.tar.gz", hash = "sha256:68dbe41afd01b867894bbdfd54fa03f468cfa4f0086bfb4adcd8de8f24f3ee21"},
+]
 tzlocal = [
-    {file = "tzlocal-2.1-py2.py3-none-any.whl", hash = "sha256:e2cb6c6b5b604af38597403e9852872d7f534962ae2954c7f35efcb1ccacf4a4"},
-    {file = "tzlocal-2.1.tar.gz", hash = "sha256:643c97c5294aedc737780a49d9df30889321cbe1204eac2c2ec6134035a92e44"},
+    {file = "tzlocal-4.1-py3-none-any.whl", hash = "sha256:28ba8d9fcb6c9a782d6e0078b4f6627af1ea26aeaa32b4eab5324abc7df4149f"},
+    {file = "tzlocal-4.1.tar.gz", hash = "sha256:0f28015ac68a5c067210400a9197fc5d36ba9bc3f8eaf1da3cbd59acdfed9e09"},
 ]
 urllib3 = [
     {file = "urllib3-1.26.7-py2.py3-none-any.whl", hash = "sha256:c4fdf4019605b6e5423637e01bc9fe4daef873709a7973e195ceba0a62bbc844"},
@@ -2390,50 +2472,57 @@ websockets = [
     {file = "websockets-8.1.tar.gz", hash = "sha256:5c65d2da8c6bce0fca2528f69f44b2f977e06954c8512a952222cea50dad430f"},
 ]
 wrapt = [
-    {file = "wrapt-1.13.2-cp27-cp27m-macosx_10_9_x86_64.whl", hash = "sha256:3de7b4d3066cc610054e7aa2c005645e308df2f92be730aae3a47d42e910566a"},
-    {file = "wrapt-1.13.2-cp27-cp27m-manylinux1_i686.whl", hash = "sha256:8164069f775c698d15582bf6320a4f308c50d048c1c10cf7d7a341feaccf5df7"},
-    {file = "wrapt-1.13.2-cp27-cp27m-manylinux1_x86_64.whl", hash = "sha256:9adee1891253670575028279de8365c3a02d3489a74a66d774c321472939a0b1"},
-    {file = "wrapt-1.13.2-cp27-cp27m-manylinux2010_i686.whl", hash = "sha256:a70d876c9aba12d3bd7f8f1b05b419322c6789beb717044eea2c8690d35cb91b"},
-    {file = "wrapt-1.13.2-cp27-cp27m-manylinux2010_x86_64.whl", hash = "sha256:3f87042623530bcffea038f824b63084180513c21e2e977291a9a7e65a66f13b"},
-    {file = "wrapt-1.13.2-cp27-cp27mu-manylinux1_i686.whl", hash = "sha256:e634136f700a21e1fcead0c137f433dde928979538c14907640607d43537d468"},
-    {file = "wrapt-1.13.2-cp27-cp27mu-manylinux1_x86_64.whl", hash = "sha256:3e33c138d1e3620b1e0cc6fd21e46c266393ed5dae0d595b7ed5a6b73ed57aa0"},
-    {file = "wrapt-1.13.2-cp27-cp27mu-manylinux2010_i686.whl", hash = "sha256:283e402e5357e104ac1e3fba5791220648e9af6fb14ad7d9cc059091af2b31d2"},
-    {file = "wrapt-1.13.2-cp27-cp27mu-manylinux2010_x86_64.whl", hash = "sha256:ccb34ce599cab7f36a4c90318697ead18312c67a9a76327b3f4f902af8f68ea1"},
-    {file = "wrapt-1.13.2-cp35-cp35m-manylinux1_i686.whl", hash = "sha256:fbad5ba74c46517e6488149514b2e2348d40df88cd6b52a83855b7a8bf04723f"},
-    {file = "wrapt-1.13.2-cp35-cp35m-manylinux1_x86_64.whl", hash = "sha256:724ed2bc9c91a2b9026e5adce310fa60c6e7c8760b03391445730b9789b9d108"},
-    {file = "wrapt-1.13.2-cp35-cp35m-manylinux2010_i686.whl", hash = "sha256:83f2793ec6f3ef513ad8d5b9586f5ee6081cad132e6eae2ecb7eac1cc3decae0"},
-    {file = "wrapt-1.13.2-cp35-cp35m-manylinux2010_x86_64.whl", hash = "sha256:0473d1558b93e314e84313cc611f6c86be779369f9d3734302bf185a4d2625b1"},
-    {file = "wrapt-1.13.2-cp35-cp35m-win32.whl", hash = "sha256:15eee0e6fd07f48af2f66d0e6f2ff1916ffe9732d464d5e2390695296872cad9"},
-    {file = "wrapt-1.13.2-cp35-cp35m-win_amd64.whl", hash = "sha256:bc85d17d90201afd88e3d25421da805e4e135012b5d1f149e4de2981394b2a52"},
-    {file = "wrapt-1.13.2-cp36-cp36m-macosx_10_9_x86_64.whl", hash = "sha256:c6ee5f8734820c21b9b8bf705e99faba87f21566d20626568eeb0d62cbeaf23c"},
-    {file = "wrapt-1.13.2-cp36-cp36m-manylinux1_i686.whl", hash = "sha256:53c6706a1bcfb6436f1625511b95b812798a6d2ccc51359cd791e33722b5ea32"},
-    {file = "wrapt-1.13.2-cp36-cp36m-manylinux1_x86_64.whl", hash = "sha256:fbe6aebc9559fed7ea27de51c2bf5c25ba2a4156cf0017556f72883f2496ee9a"},
-    {file = "wrapt-1.13.2-cp36-cp36m-manylinux2010_i686.whl", hash = "sha256:0582180566e7a13030f896c2f1ac6a56134ab5f3c3f4c5538086f758b1caf3f2"},
-    {file = "wrapt-1.13.2-cp36-cp36m-manylinux2010_x86_64.whl", hash = "sha256:bff0a59387a0a2951cb869251257b6553663329a1b5525b5226cab8c88dcbe7e"},
-    {file = "wrapt-1.13.2-cp36-cp36m-win32.whl", hash = "sha256:df3eae297a5f1594d1feb790338120f717dac1fa7d6feed7b411f87e0f2401c7"},
-    {file = "wrapt-1.13.2-cp36-cp36m-win_amd64.whl", hash = "sha256:1eb657ed84f4d3e6ad648483c8a80a0cf0a78922ef94caa87d327e2e1ad49b48"},
-    {file = "wrapt-1.13.2-cp37-cp37m-macosx_10_9_x86_64.whl", hash = "sha256:a0cdedf681db878416c05e1831ec69691b0e6577ac7dca9d4f815632e3549580"},
-    {file = "wrapt-1.13.2-cp37-cp37m-manylinux1_i686.whl", hash = "sha256:87ee3c73bdfb4367b26c57259995935501829f00c7b3eed373e2ad19ec21e4e4"},
-    {file = "wrapt-1.13.2-cp37-cp37m-manylinux1_x86_64.whl", hash = "sha256:3e0d16eedc242d01a6f8cf0623e9cdc3b869329da3f97a15961d8864111d8cf0"},
-    {file = "wrapt-1.13.2-cp37-cp37m-manylinux2010_i686.whl", hash = "sha256:8318088860968c07e741537030b1abdd8908ee2c71fbe4facdaade624a09e006"},
-    {file = "wrapt-1.13.2-cp37-cp37m-manylinux2010_x86_64.whl", hash = "sha256:d90520616fce71c05dedeac3a0fe9991605f0acacd276e5f821842e454485a70"},
-    {file = "wrapt-1.13.2-cp37-cp37m-win32.whl", hash = "sha256:22142afab65daffc95863d78effcbd31c19a8003eca73de59f321ee77f73cadb"},
-    {file = "wrapt-1.13.2-cp37-cp37m-win_amd64.whl", hash = "sha256:d0d717e10f952df7ea41200c507cc7e24458f4c45b56c36ad418d2e79dacd1d4"},
-    {file = "wrapt-1.13.2-cp38-cp38-macosx_10_9_x86_64.whl", hash = "sha256:593cb049ce1c391e0288523b30426c4430b26e74c7e6f6e2844bd99ac7ecc831"},
-    {file = "wrapt-1.13.2-cp38-cp38-manylinux1_i686.whl", hash = "sha256:8860c8011a6961a651b1b9f46fdbc589ab63b0a50d645f7d92659618a3655867"},
-    {file = "wrapt-1.13.2-cp38-cp38-manylinux1_x86_64.whl", hash = "sha256:ada5e29e59e2feb710589ca1c79fd989b1dd94d27079dc1d199ec954a6ecc724"},
-    {file = "wrapt-1.13.2-cp38-cp38-manylinux2010_i686.whl", hash = "sha256:fdede980273aeca591ad354608778365a3a310e0ecdd7a3587b38bc5be9b1808"},
-    {file = "wrapt-1.13.2-cp38-cp38-manylinux2010_x86_64.whl", hash = "sha256:af9480de8e63c5f959a092047aaf3d7077422ded84695b3398f5d49254af3e90"},
-    {file = "wrapt-1.13.2-cp38-cp38-win32.whl", hash = "sha256:c65e623ea7556e39c4f0818200a046cbba7575a6b570ff36122c276fdd30ab0a"},
-    {file = "wrapt-1.13.2-cp38-cp38-win_amd64.whl", hash = "sha256:b20703356cae1799080d0ad15085dc3213c1ac3f45e95afb9f12769b98231528"},
-    {file = "wrapt-1.13.2-cp39-cp39-macosx_10_9_x86_64.whl", hash = "sha256:1c5c4cf188b5643a97e87e2110bbd4f5bc491d54a5b90633837b34d5df6a03fe"},
-    {file = "wrapt-1.13.2-cp39-cp39-manylinux1_i686.whl", hash = "sha256:82223f72eba6f63eafca87a0f614495ae5aa0126fe54947e2b8c023969e9f2d7"},
-    {file = "wrapt-1.13.2-cp39-cp39-manylinux1_x86_64.whl", hash = "sha256:81a4cf257263b299263472d669692785f9c647e7dca01c18286b8f116dbf6b38"},
-    {file = "wrapt-1.13.2-cp39-cp39-manylinux2010_i686.whl", hash = "sha256:728e2d9b7a99dd955d3426f237b940fc74017c4a39b125fec913f575619ddfe9"},
-    {file = "wrapt-1.13.2-cp39-cp39-manylinux2010_x86_64.whl", hash = "sha256:7574de567dcd4858a2ffdf403088d6df8738b0e1eabea220553abf7c9048f59e"},
-    {file = "wrapt-1.13.2-cp39-cp39-win32.whl", hash = "sha256:c7ac2c7a8e34bd06710605b21dd1f3576764443d68e069d2afba9b116014d072"},
-    {file = "wrapt-1.13.2-cp39-cp39-win_amd64.whl", hash = "sha256:6e6d1a8eeef415d7fb29fe017de0e48f45e45efd2d1bfda28fc50b7b330859ef"},
-    {file = "wrapt-1.13.2.tar.gz", hash = "sha256:dca56cc5963a5fd7c2aa8607017753f534ee514e09103a6c55d2db70b50e7447"},
+    {file = "wrapt-1.13.3-cp27-cp27m-macosx_10_9_x86_64.whl", hash = "sha256:e05e60ff3b2b0342153be4d1b597bbcfd8330890056b9619f4ad6b8d5c96a81a"},
+    {file = "wrapt-1.13.3-cp27-cp27m-manylinux1_i686.whl", hash = "sha256:85148f4225287b6a0665eef08a178c15097366d46b210574a658c1ff5b377489"},
+    {file = "wrapt-1.13.3-cp27-cp27m-manylinux1_x86_64.whl", hash = "sha256:2dded5496e8f1592ec27079b28b6ad2a1ef0b9296d270f77b8e4a3a796cf6909"},
+    {file = "wrapt-1.13.3-cp27-cp27m-manylinux2010_i686.whl", hash = "sha256:e94b7d9deaa4cc7bac9198a58a7240aaf87fe56c6277ee25fa5b3aa1edebd229"},
+    {file = "wrapt-1.13.3-cp27-cp27m-manylinux2010_x86_64.whl", hash = "sha256:498e6217523111d07cd67e87a791f5e9ee769f9241fcf8a379696e25806965af"},
+    {file = "wrapt-1.13.3-cp27-cp27mu-manylinux1_i686.whl", hash = "sha256:ec7e20258ecc5174029a0f391e1b948bf2906cd64c198a9b8b281b811cbc04de"},
+    {file = "wrapt-1.13.3-cp27-cp27mu-manylinux1_x86_64.whl", hash = "sha256:87883690cae293541e08ba2da22cacaae0a092e0ed56bbba8d018cc486fbafbb"},
+    {file = "wrapt-1.13.3-cp27-cp27mu-manylinux2010_i686.whl", hash = "sha256:f99c0489258086308aad4ae57da9e8ecf9e1f3f30fa35d5e170b4d4896554d80"},
+    {file = "wrapt-1.13.3-cp27-cp27mu-manylinux2010_x86_64.whl", hash = "sha256:6a03d9917aee887690aa3f1747ce634e610f6db6f6b332b35c2dd89412912bca"},
+    {file = "wrapt-1.13.3-cp310-cp310-macosx_10_9_x86_64.whl", hash = "sha256:936503cb0a6ed28dbfa87e8fcd0a56458822144e9d11a49ccee6d9a8adb2ac44"},
+    {file = "wrapt-1.13.3-cp310-cp310-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:f9c51d9af9abb899bd34ace878fbec8bf357b3194a10c4e8e0a25512826ef056"},
+    {file = "wrapt-1.13.3-cp310-cp310-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:220a869982ea9023e163ba915077816ca439489de6d2c09089b219f4e11b6785"},
+    {file = "wrapt-1.13.3-cp310-cp310-musllinux_1_1_i686.whl", hash = "sha256:0877fe981fd76b183711d767500e6b3111378ed2043c145e21816ee589d91096"},
+    {file = "wrapt-1.13.3-cp310-cp310-musllinux_1_1_x86_64.whl", hash = "sha256:43e69ffe47e3609a6aec0fe723001c60c65305784d964f5007d5b4fb1bc6bf33"},
+    {file = "wrapt-1.13.3-cp310-cp310-win32.whl", hash = "sha256:78dea98c81915bbf510eb6a3c9c24915e4660302937b9ae05a0947164248020f"},
+    {file = "wrapt-1.13.3-cp310-cp310-win_amd64.whl", hash = "sha256:ea3e746e29d4000cd98d572f3ee2a6050a4f784bb536f4ac1f035987fc1ed83e"},
+    {file = "wrapt-1.13.3-cp35-cp35m-manylinux1_i686.whl", hash = "sha256:8c73c1a2ec7c98d7eaded149f6d225a692caa1bd7b2401a14125446e9e90410d"},
+    {file = "wrapt-1.13.3-cp35-cp35m-manylinux1_x86_64.whl", hash = "sha256:086218a72ec7d986a3eddb7707c8c4526d677c7b35e355875a0fe2918b059179"},
+    {file = "wrapt-1.13.3-cp35-cp35m-manylinux2010_i686.whl", hash = "sha256:e92d0d4fa68ea0c02d39f1e2f9cb5bc4b4a71e8c442207433d8db47ee79d7aa3"},
+    {file = "wrapt-1.13.3-cp35-cp35m-manylinux2010_x86_64.whl", hash = "sha256:d4a5f6146cfa5c7ba0134249665acd322a70d1ea61732723c7d3e8cc0fa80755"},
+    {file = "wrapt-1.13.3-cp35-cp35m-win32.whl", hash = "sha256:8aab36778fa9bba1a8f06a4919556f9f8c7b33102bd71b3ab307bb3fecb21851"},
+    {file = "wrapt-1.13.3-cp35-cp35m-win_amd64.whl", hash = "sha256:944b180f61f5e36c0634d3202ba8509b986b5fbaf57db3e94df11abee244ba13"},
+    {file = "wrapt-1.13.3-cp36-cp36m-macosx_10_9_x86_64.whl", hash = "sha256:2ebdde19cd3c8cdf8df3fc165bc7827334bc4e353465048b36f7deeae8ee0918"},
+    {file = "wrapt-1.13.3-cp36-cp36m-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:610f5f83dd1e0ad40254c306f4764fcdc846641f120c3cf424ff57a19d5f7ade"},
+    {file = "wrapt-1.13.3-cp36-cp36m-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:5601f44a0f38fed36cc07db004f0eedeaadbdcec90e4e90509480e7e6060a5bc"},
+    {file = "wrapt-1.13.3-cp36-cp36m-musllinux_1_1_i686.whl", hash = "sha256:e6906d6f48437dfd80464f7d7af1740eadc572b9f7a4301e7dd3d65db285cacf"},
+    {file = "wrapt-1.13.3-cp36-cp36m-musllinux_1_1_x86_64.whl", hash = "sha256:766b32c762e07e26f50d8a3468e3b4228b3736c805018e4b0ec8cc01ecd88125"},
+    {file = "wrapt-1.13.3-cp36-cp36m-win32.whl", hash = "sha256:5f223101f21cfd41deec8ce3889dc59f88a59b409db028c469c9b20cfeefbe36"},
+    {file = "wrapt-1.13.3-cp36-cp36m-win_amd64.whl", hash = "sha256:f122ccd12fdc69628786d0c947bdd9cb2733be8f800d88b5a37c57f1f1d73c10"},
+    {file = "wrapt-1.13.3-cp37-cp37m-macosx_10_9_x86_64.whl", hash = "sha256:46f7f3af321a573fc0c3586612db4decb7eb37172af1bc6173d81f5b66c2e068"},
+    {file = "wrapt-1.13.3-cp37-cp37m-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:778fd096ee96890c10ce96187c76b3e99b2da44e08c9e24d5652f356873f6709"},
+    {file = "wrapt-1.13.3-cp37-cp37m-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:0cb23d36ed03bf46b894cfec777eec754146d68429c30431c99ef28482b5c1df"},
+    {file = "wrapt-1.13.3-cp37-cp37m-musllinux_1_1_i686.whl", hash = "sha256:96b81ae75591a795d8c90edc0bfaab44d3d41ffc1aae4d994c5aa21d9b8e19a2"},
+    {file = "wrapt-1.13.3-cp37-cp37m-musllinux_1_1_x86_64.whl", hash = "sha256:7dd215e4e8514004c8d810a73e342c536547038fb130205ec4bba9f5de35d45b"},
+    {file = "wrapt-1.13.3-cp37-cp37m-win32.whl", hash = "sha256:47f0a183743e7f71f29e4e21574ad3fa95676136f45b91afcf83f6a050914829"},
+    {file = "wrapt-1.13.3-cp37-cp37m-win_amd64.whl", hash = "sha256:fd76c47f20984b43d93de9a82011bb6e5f8325df6c9ed4d8310029a55fa361ea"},
+    {file = "wrapt-1.13.3-cp38-cp38-macosx_10_9_x86_64.whl", hash = "sha256:b73d4b78807bd299b38e4598b8e7bd34ed55d480160d2e7fdaabd9931afa65f9"},
+    {file = "wrapt-1.13.3-cp38-cp38-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:ec9465dd69d5657b5d2fa6133b3e1e989ae27d29471a672416fd729b429eb554"},
+    {file = "wrapt-1.13.3-cp38-cp38-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:dd91006848eb55af2159375134d724032a2d1d13bcc6f81cd8d3ed9f2b8e846c"},
+    {file = "wrapt-1.13.3-cp38-cp38-musllinux_1_1_i686.whl", hash = "sha256:ae9de71eb60940e58207f8e71fe113c639da42adb02fb2bcbcaccc1ccecd092b"},
+    {file = "wrapt-1.13.3-cp38-cp38-musllinux_1_1_x86_64.whl", hash = "sha256:51799ca950cfee9396a87f4a1240622ac38973b6df5ef7a41e7f0b98797099ce"},
+    {file = "wrapt-1.13.3-cp38-cp38-win32.whl", hash = "sha256:4b9c458732450ec42578b5642ac53e312092acf8c0bfce140ada5ca1ac556f79"},
+    {file = "wrapt-1.13.3-cp38-cp38-win_amd64.whl", hash = "sha256:7dde79d007cd6dfa65afe404766057c2409316135cb892be4b1c768e3f3a11cb"},
+    {file = "wrapt-1.13.3-cp39-cp39-macosx_10_9_x86_64.whl", hash = "sha256:981da26722bebb9247a0601e2922cedf8bb7a600e89c852d063313102de6f2cb"},
+    {file = "wrapt-1.13.3-cp39-cp39-manylinux_2_5_i686.manylinux1_i686.manylinux_2_12_i686.manylinux2010_i686.whl", hash = "sha256:705e2af1f7be4707e49ced9153f8d72131090e52be9278b5dbb1498c749a1e32"},
+    {file = "wrapt-1.13.3-cp39-cp39-manylinux_2_5_x86_64.manylinux1_x86_64.manylinux_2_12_x86_64.manylinux2010_x86_64.whl", hash = "sha256:25b1b1d5df495d82be1c9d2fad408f7ce5ca8a38085e2da41bb63c914baadff7"},
+    {file = "wrapt-1.13.3-cp39-cp39-musllinux_1_1_i686.whl", hash = "sha256:77416e6b17926d953b5c666a3cb718d5945df63ecf922af0ee576206d7033b5e"},
+    {file = "wrapt-1.13.3-cp39-cp39-musllinux_1_1_x86_64.whl", hash = "sha256:865c0b50003616f05858b22174c40ffc27a38e67359fa1495605f96125f76640"},
+    {file = "wrapt-1.13.3-cp39-cp39-win32.whl", hash = "sha256:0a017a667d1f7411816e4bf214646d0ad5b1da2c1ea13dec6c162736ff25a374"},
+    {file = "wrapt-1.13.3-cp39-cp39-win_amd64.whl", hash = "sha256:81bd7c90d28a4b2e1df135bfbd7c23aee3050078ca6441bead44c42483f9ebfb"},
+    {file = "wrapt-1.13.3.tar.gz", hash = "sha256:1fea9cd438686e6682271d36f3481a9f3636195578bab9ca3382e2f5f01fc185"},
 ]
 zipp = [
     {file = "zipp-3.6.0-py3-none-any.whl", hash = "sha256:9fe5ea21568a0a70e50f273397638d39b03353731e6cbbb3fd8502a33fec40bc"},
diff --git a/tests/integration_tests/test_settings_routes.py b/tests/integration_tests/test_settings_routes.py
deleted file mode 100644
index f245c82729d5..000000000000
--- a/tests/integration_tests/test_settings_routes.py
+++ /dev/null
@@ -1,32 +0,0 @@
-import json
-
-import pytest
-from fastapi.testclient import TestClient
-
-from mealie.schema.admin import SiteSettings
-from tests.app_routes import AppRoutes
-
-
-@pytest.fixture(scope="function")
-def default_settings():
-    return SiteSettings().dict(by_alias=True)
-
-
-def test_default_settings(api_client: TestClient, api_routes: AppRoutes, default_settings):
-    response = api_client.get(api_routes.site_settings)
-
-    assert response.status_code == 200
-
-    assert json.loads(response.content) == default_settings
-
-
-def test_update_settings(api_client: TestClient, api_routes: AppRoutes, default_settings, admin_token):
-    default_settings["language"] = "fr"
-    default_settings["showRecent"] = False
-
-    response = api_client.put(api_routes.site_settings, json=default_settings, headers=admin_token)
-
-    assert response.status_code == 200
-
-    response = api_client.get(api_routes.site_settings)
-    assert json.loads(response.content) == default_settings