diff --git a/apps/wizarr-frontend/src/components/TaskList/TaskList.vue b/apps/wizarr-frontend/src/components/TaskList/TaskList.vue
index 7f1973cbf..71ef2fc00 100644
--- a/apps/wizarr-frontend/src/components/TaskList/TaskList.vue
+++ b/apps/wizarr-frontend/src/components/TaskList/TaskList.vue
@@ -1,12 +1,5 @@
 <template>
-    <Draggable
-        v-model="jobs"
-        tag="ul"
-        group="jobs"
-        ghost-class="moving-card"
-        :animation="200"
-        item-key="id"
-    >
+    <Draggable v-model="jobs" tag="ul" group="jobs" ghost-class="moving-card" :animation="200" item-key="id">
         <template #item="{ element }">
             <li class="mb-2">
                 <TaskItem :task="element" />
@@ -16,24 +9,24 @@
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
-import { useTasksStore } from '@/stores/tasks';
-import { mapActions, mapWritableState } from 'pinia';
+import { defineComponent } from "vue";
+import { useTasksStore } from "@/stores/tasks";
+import { mapActions, mapWritableState } from "pinia";
 
-import Draggable from 'vuedraggable';
-import TaskItem from './TaskItem.vue';
+import Draggable from "vuedraggable";
+import TaskItem from "./TaskItem.vue";
 
 export default defineComponent({
-    name: 'TasksView',
+    name: "TasksView",
     components: {
         Draggable,
         TaskItem,
     },
     computed: {
-        ...mapWritableState(useTasksStore, ['jobs']),
+        ...mapWritableState(useTasksStore, ["jobs"]),
     },
     methods: {
-        ...mapActions(useTasksStore, ['getJobs']),
+        ...mapActions(useTasksStore, ["getJobs"]),
     },
     async created() {
         await this.getJobs();
diff --git a/apps/wizarr-frontend/src/components/Toasts/BadBackend.vue b/apps/wizarr-frontend/src/components/Toasts/BadBackend.vue
index 73e640c8b..374af764b 100644
--- a/apps/wizarr-frontend/src/components/Toasts/BadBackend.vue
+++ b/apps/wizarr-frontend/src/components/Toasts/BadBackend.vue
@@ -1,21 +1,15 @@
 <template>
     <div class="flex flex-col justify-start items-start">
-        <span class="text-md font-semibold text-gray-900 dark:text-white"
-            >Connection Error</span
-        >
-        <span class="text-sm text-gray-900 dark:text-white"
-            >We were unable to connect to the backend.</span
-        >
-        <span class="text-sm text-gray-900 dark:text-white"
-            >Wizarr may not function correctly.</span
-        >
+        <span class="text-md font-semibold text-gray-900 dark:text-white">Connection Error</span>
+        <span class="text-sm text-gray-900 dark:text-white">We were unable to connect to the backend.</span>
+        <span class="text-sm text-gray-900 dark:text-white">Wizarr may not function correctly.</span>
     </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent } from "vue";
 
 export default defineComponent({
-    name: 'BadBackend',
+    name: "BadBackend",
 });
 </script>
diff --git a/apps/wizarr-frontend/src/components/Toasts/DefaultToast.vue b/apps/wizarr-frontend/src/components/Toasts/DefaultToast.vue
index 352a70a03..ed184bf12 100644
--- a/apps/wizarr-frontend/src/components/Toasts/DefaultToast.vue
+++ b/apps/wizarr-frontend/src/components/Toasts/DefaultToast.vue
@@ -1,5 +1,5 @@
 <script lang="ts">
-import { defineComponent, h } from 'vue';
+import { defineComponent, h } from "vue";
 
 // A function that generates the component and returns it
 const generateComponent = (title: string, message: string) => {
@@ -12,24 +12,16 @@ const generateComponent = (title: string, message: string) => {
             };
         },
         render() {
-            return h(
-                'div',
-                { class: 'flex flex-col justify-start items-start' },
-                [
-                    h(
-                        'span',
-                        {
-                            class: 'text-md font-semibold text-gray-900 dark:text-white',
-                        },
-                        this.title,
-                    ),
-                    h(
-                        'span',
-                        { class: 'text-sm text-gray-900 dark:text-white' },
-                        this.message,
-                    ),
-                ],
-            );
+            return h("div", { class: "flex flex-col justify-start items-start" }, [
+                h(
+                    "span",
+                    {
+                        class: "text-md font-semibold text-gray-900 dark:text-white",
+                    },
+                    this.title,
+                ),
+                h("span", { class: "text-sm text-gray-900 dark:text-white" }, this.message),
+            ]);
         },
     });
 };
diff --git a/apps/wizarr-frontend/src/components/Toasts/UpdateAvailable.vue b/apps/wizarr-frontend/src/components/Toasts/UpdateAvailable.vue
index 5484a637d..b772c037c 100644
--- a/apps/wizarr-frontend/src/components/Toasts/UpdateAvailable.vue
+++ b/apps/wizarr-frontend/src/components/Toasts/UpdateAvailable.vue
@@ -1,18 +1,14 @@
 <template>
     <div class="flex flex-col justify-start items-start">
-        <span class="text-md font-semibold text-gray-900 dark:text-white"
-            >Update Available</span
-        >
-        <span class="text-sm text-gray-900 dark:text-white"
-            >Please update to the latest version!</span
-        >
+        <span class="text-md font-semibold text-gray-900 dark:text-white">Update Available</span>
+        <span class="text-sm text-gray-900 dark:text-white">Please update to the latest version!</span>
     </div>
 </template>
 
 <script lang="ts">
-import { defineComponent } from 'vue';
+import { defineComponent } from "vue";
 
 export default defineComponent({
-    name: 'UpdateAvailable',
+    name: "UpdateAvailable",
 });
 </script>