feat: add download backup button

Author: spikeninja

src/pages/tasks/index.vue

@@ -39,44 +39,55 @@ function limitText(text: string, length: number) {
 }
 
 function handleNext() {
-  router.push({
-    path: "/tasks",
-    query: {
-      page: page.value + 1,
-      search: searchRef.value || undefined,
-    },
-  })
+  if (page.value < totalPages.value) {
+    router.push({
+      path: "/tasks",
+      query: {
+        page: page.value + 1,
+        search: searchRef.value || undefined,
+      },
+    })
+  }
 }
 
 function handlePrev() {
-  router.push({
-    path: "/tasks",
-    query: {
-      page: page.value - 1,
-      search: searchRef.value || undefined,
-    },
-  })
+  if (page.value > 1) {
+    router.push({
+      path: "/tasks",
+      query: {
+        page: page.value - 1,
+        search: searchRef.value || undefined,
+      },
+    })
+  }
 }
 </script>
 
 <template>
   <div class="container-fluid py-4">
-    <form method="get" action="">
-      <div class="row mb-3">
-        <div class="col">
-          <div class="d-flex justify-content-end">
-            <input
-              type="search"
-              name="search"
-              class="form-control w-auto"
-              placeholder="Search tasks..."
-              v-model="searchRef"
-            />
-            <button type="submit" class="btn btn-primary ml-2">Search</button>
+    <div class="flex justify-between">
+      <div>
+        <button class="btn btn-outline-primary">
+          <NuxtLink to="/api/tasks/backup" target="_blank"> Backup </NuxtLink>
+        </button>
+      </div>
+      <form method="get" action="">
+        <div class="row mb-3">
+          <div class="col">
+            <div class="d-flex justify-content-end">
+              <input
+                type="search"
+                name="search"
+                class="form-control w-auto"
+                placeholder="Search tasks..."
+                v-model="searchRef"
+              />
+              <button type="submit" class="btn btn-primary ml-2">Search</button>
+            </div>
           </div>
         </div>
-      </div>
-    </form>
+      </form>
+    </div>
 
     <div class="table-responsive">
       <table class="table table-striped table-hover">

src/server/api/tasks/backup.get.ts

@@ -0,0 +1,10 @@
+import fs from "fs"
+import { envVariables } from "~/server/env"
+
+export default defineEventHandler(async (event) => {
+  const stream = fs.createReadStream(envVariables.dbFilePath)
+  setHeader(event, "Content-Type", "application/octet-stream")
+  setHeader(event, "Content-Disposition", 'attachment; filename="database.db"')
+
+  return sendStream(event, stream)
+})

src/server/env.ts

@@ -1,3 +1,4 @@
 export const envVariables = {
+  dbFilePath: process.env.DB_FILE_PATH!,
   taskiqAdminApiToken: process.env.TASKIQ_ADMIN_API_TOKEN!,
 }