feat: implement backup-while-running preference

Signed-off-by: Evan Song <theevansong@gmail.com>

apps/frontend/src/pages/servers/manage/[id]/backups.vue

@@ -142,7 +142,16 @@
             </div>
             <div class="flex w-full gap-2 sm:w-fit">
               <ButtonStyled type="standard" color="brand">
-                <button class="w-full sm:w-fit" @click="showCreateModel">
+                <button
+                  v-tooltip="
+                    isServerRunning && !userPreferences.backupWhileRunning
+                      ? 'Cannot create backup while server is running. You can disable this from your server Options > Preferences.'
+                      : ''
+                  "
+                  class="w-full sm:w-fit"
+                  :disabled="isServerRunning && !userPreferences.backupWhileRunning"
+                  @click="showCreateModel"
+                >
                   <PlusIcon class="h-5 w-5" />
                   Create backup
                 </button>
@@ -221,6 +230,7 @@
 
 <script setup lang="ts">
 import { ButtonStyled, OverflowMenu, NewModal } from "@modrinth/ui";
+import { useStorage } from "@vueuse/core";
 import {
   PlusIcon,
   CheckIcon,
@@ -239,8 +249,16 @@ import type { Server } from "~/composables/pyroServers";
 
 const props = defineProps<{
   server: Server<["general", "mods", "backups", "network", "startup", "ws", "fs"]>;
+  isServerRunning: boolean;
 }>();
 
+const route = useNativeRoute();
+const serverId = route.params.id;
+
+const userPreferences = useStorage(`pyro-server-${serverId}-preferences`, {
+  backupWhileRunning: false,
+});
+
 defineEmits(["onDownload"]);
 
 const data = computed(() => props.server.general);

apps/frontend/src/pages/servers/manage/[id]/options/preferences.vue

@@ -53,6 +53,10 @@ const preferences = {
     description:
       "Don't ask for confirmation when starting, stopping, restarting, or killing the server.",
   },
+  backupWhileRunning: {
+    displayName: "Create backups while running",
+    description: "Allow backups to be created while the server is online.",
+  },
 } as const;
 
 type PreferenceKeys = keyof typeof preferences;
@@ -65,6 +69,7 @@ const defaultPreferences: UserPreferences = {
   ramAsNumber: false,
   autoRestart: false,
   dontAskAgain: false,
+  backupWhileRunning: false,
 };
 
 const userPreferences = useStorage<UserPreferences>(