show errors when using backup in web

Author: AndreWohnsland

web_client/src/api/options.ts

@@ -55,21 +55,27 @@ export const updateSoftware = async (): Promise<{ message: string }> => {
 };
 
 export const createBackup = async (): Promise<{ data: Blob; fileName: string }> => {
-  const response = await axiosInstance.get(`${optionsUrl}/backup`, {
-    responseType: 'blob',
-  });
+  try {
+    const response = await axiosInstance.get(`${optionsUrl}/backup`, {
+      responseType: 'blob',
+    });
 
-  const contentDisposition = response.headers['content-disposition'];
-  let fileName = 'backup.zip'; // fallback filename
+    const contentDisposition = response.headers['content-disposition'];
+    let fileName = 'backup.zip'; // fallback filename
 
-  if (contentDisposition) {
-    const match = contentDisposition.match(/filename="(.+?)"/);
-    if (match?.[1]) {
-      fileName = match[1];
+    if (contentDisposition) {
+      const match = contentDisposition.match(/filename="(.+?)"/);
+      if (match?.[1]) fileName = match[1];
     }
+    return { data: response.data, fileName };
+  } catch (error: any) {
+    if (error instanceof Blob) {
+      const text = await error.text();
+      const json = JSON.parse(text);
+      throw new Error(json.detail || 'An error occurred while creating the backup');
+    }
+    throw error;
   }
-
-  return { data: response.data, fileName };
 };
 
 export const uploadBackup = async (file: File): Promise<{ message: string }> => {

web_client/src/components/options/OptionWindow.tsx

@@ -38,34 +38,27 @@ const OptionWindow = () => {
   };
 
   const getBackupClick = async () => {
-    try {
-      const { data, fileName } = await createBackup();
-      const options = {
-        suggestedName: fileName,
-        types: [
-          {
-            description: 'Backup Files',
-            accept: { 'application/octet-stream': ['.zip'] },
-          },
-        ],
-      };
-      const fileHandle = await window.showSaveFilePicker(options);
-      const writable = await fileHandle.createWritable();
-      await writable.write(new Blob([data], { type: 'application/octet-stream' }));
-      await writable.close();
-    } catch (error) {
-      console.error('Error saving backup:', error);
-    }
+    const { data, fileName } = await createBackup();
+    const options = {
+      suggestedName: fileName,
+      types: [
+        {
+          description: 'Backup Files',
+          accept: { 'application/octet-stream': ['.zip'] },
+        },
+      ],
+    };
+    const fileHandle = await window.showSaveFilePicker(options);
+    const writable = await fileHandle.createWritable();
+    await writable.write(new Blob([data], { type: 'application/octet-stream' }));
+    await writable.close();
+    return Promise.resolve(t('options.backupSavedSuccessfully', { fileName: fileHandle.name }));
   };
 
   const uploadBackupClick = async () => {
     let file = undefined;
-    try {
-      const [fileHandle] = await window.showOpenFilePicker();
-      file = await fileHandle.getFile();
-    } catch {
-      return;
-    }
+    const [fileHandle] = await window.showOpenFilePicker();
+    file = await fileHandle.getFile();
     return uploadBackup(file);
   };
 

web_client/src/locales/de/translation.json

@@ -68,28 +68,29 @@
     "adjustHeader": "Füllstand der Flasche anpassen, Maximum ist {{maximum}}"
   },
   "options": {
-    "cleaning": "Reinigung",
+    "addons": "Addons",
+    "adjustTime": "Zeit Anpassen",
+    "backup": "Sicherung",
+    "backupSavedSuccessfully": "Backup wurde erfolgreich unter: {{fileName}} gespeichert",
     "calibration": "Kalibrierung",
+    "cleaning": "Reinigung",
+    "cleaningTheMachine": "Reinigung der Machine",
     "configuration": "Konfiguration",
     "data": "Daten",
-    "backup": "Sicherung",
-    "restore": "Wiederherstellen",
-    "reboot": "Neustart",
-    "shutdown": "Herunterfahren",
-    "logs": "Logs",
-    "updateSystem": "System aktualisieren",
-    "systemResourceUsage": "System Ressourcen Auslastung",
-    "updateCocktailBerry": "CocktailBerry Software aktualisieren",
-    "wifi": "WLAN",
     "internetCheck": "Internetprüfung",
-    "addons": "Addons",
-    "adjustTime": "Zeit Anpassen",
     "issues": "Probleme",
-    "cleaningTheMachine": "Reinigung der Machine",
-    "startCleaningProgram": "Möchtest du das Reinigungsprogramm starten?",
+    "logs": "Logs",
+    "reboot": "Neustart",
     "rebootTheSystem": "Möchtest du das System neu starten?",
+    "restore": "Wiederherstellen",
+    "shutdown": "Herunterfahren",
     "shutdownTheSystem": "Möchtest du das System herunterfahren?",
-    "updateTheSystem": "Möchtest du das System aktualisieren?"
+    "startCleaningProgram": "Möchtest du das Reinigungsprogramm starten?",
+    "systemResourceUsage": "System Ressourcen Auslastung",
+    "updateCocktailBerry": "CocktailBerry Software aktualisieren",
+    "updateSystem": "System aktualisieren",
+    "updateTheSystem": "Möchtest du das System aktualisieren?",
+    "wifi": "WLAN"
   },
   "calibration": {
     "pumpCalibrationProgram": "Pumpen Kalibrieren",

web_client/src/locales/en/translation.json

@@ -68,28 +68,29 @@
     "adjustHeader": "Adjust the fill level of the bottle, maximum is {{maximum}}"
   },
   "options": {
-    "cleaning": "Cleaning",
+    "addons": "Addons",
+    "adjustTime": "Adjust Time",
+    "backup": "Backup",
+    "backupSavedSuccessfully": "Backup was saved at: {{fileName}}",
     "calibration": "Calibration",
+    "cleaning": "Cleaning",
+    "cleaningTheMachine": "Cleaning the Machine",
     "configuration": "Configuration",
     "data": "Data",
-    "backup": "Backup",
-    "restore": "Restore",
-    "reboot": "Reboot",
-    "shutdown": "Shutdown",
-    "logs": "Logs",
-    "updateSystem": "Update System",
-    "systemResourceUsage": "System Resource Usage",
-    "updateCocktailBerry": "Update CocktailBerry Software",
-    "wifi": "WiFi",
     "internetCheck": "Internet Check",
-    "addons": "Addons",
-    "adjustTime": "Adjust Time",
     "issues": "Issues",
-    "cleaningTheMachine": "Cleaning the Machine",
-    "startCleaningProgram": "Do you want to start the Cleaning Program?",
+    "logs": "Logs",
+    "reboot": "Reboot",
     "rebootTheSystem": "Do you want to reboot the System?",
+    "restore": "Restore",
+    "shutdown": "Shutdown",
     "shutdownTheSystem": "Do you want to shutdown the System?",
-    "updateTheSystem": "Do you want to update the System?"
+    "startCleaningProgram": "Do you want to start the Cleaning Program?",
+    "systemResourceUsage": "System Resource Usage",
+    "updateCocktailBerry": "Update CocktailBerry Software",
+    "updateSystem": "Update System",
+    "updateTheSystem": "Do you want to update the System?",
+    "wifi": "WiFi"
   },
   "calibration": {
     "pumpCalibrationProgram": "Pump Calibration Program",