Add backup validation to settings

2026-05-08 08:58:38 +01:00 · 2025-04-15 16:04:30 -07:00
parent fef6706a75
commit f68ef019a5
16 changed files with 292 additions and 34 deletions
@@ -0,0 +1,104 @@
+// Copyright 2025 Signal Messenger, LLC
+// SPDX-License-Identifier: AGPL-3.0-only
+
+import React, { useState, useCallback } from 'react';
+import type { LocalizerType } from '../types/I18N';
+import { toLogFormat } from '../types/errors';
+import { formatFileSize } from '../util/formatFileSize';
+import type { ExportResultType as BackupExportResultType } from '../services/backups';
+import { SettingsRow, SettingsControl } from './PreferencesUtil';
+import { Button, ButtonVariant } from './Button';
+import { Spinner } from './Spinner';
+
+export function PreferencesInternal({
+  i18n,
+  validateBackup: doValidateBackup,
+}: {
+  i18n: LocalizerType;
+  validateBackup: () => Promise<BackupExportResultType>;
+}): JSX.Element {
+  const [isValidationPending, setIsValidationPending] = useState(false);
+  const [validationResult, setValidationResult] = useState<
+    | {
+        result: BackupExportResultType;
+      }
+    | {
+        error: Error;
+      }
+    | undefined
+  >();
+
+  const validateBackup = useCallback(async () => {
+    setIsValidationPending(true);
+    setValidationResult(undefined);
+    try {
+      setValidationResult({ result: await doValidateBackup() });
+    } catch (error) {
+      setValidationResult({ error });
+    } finally {
+      setIsValidationPending(false);
+    }
+  }, [doValidateBackup]);
+
+  let validationElem: JSX.Element | undefined;
+  if (validationResult != null) {
+    if ('result' in validationResult) {
+      const {
+        result: { totalBytes, stats },
+      } = validationResult;
+
+      validationElem = (
+        <div className="Preferences--internal--validate-backup--result">
+          <p>File size: {formatFileSize(totalBytes)}</p>
+          <pre>
+            <code>{JSON.stringify(stats, null, 2)}</code>
+          </pre>
+        </div>
+      );
+    } else {
+      const { error } = validationResult;
+
+      validationElem = (
+        <div className="Preferences--internal--validate-backup--error">
+          <pre>
+            <code>{toLogFormat(error)}</code>
+          </pre>
+        </div>
+      );
+    }
+  }
+
+  return (
+    <>
+      <div className="Preferences__title Preferences__title--internal">
+        <div className="Preferences__title--header">
+          {i18n('icu:Preferences__button--internal')}
+        </div>
+      </div>
+
+      <SettingsRow
+        className="Preferences--internal--backups"
+        title={i18n('icu:Preferences__button--backups')}
+      >
+        <SettingsControl
+          left={i18n('icu:Preferences__internal__validate-backup--description')}
+          right={
+            <Button
+              variant={ButtonVariant.Secondary}
+              onClick={validateBackup}
+              disabled={isValidationPending}
+            >
+              {isValidationPending ? (
+                <Spinner size="22px" svgSize="small" />
+              ) : (
+                i18n('icu:Preferences__internal__validate-backup')
+              )}
+            </Button>
+          }
+        />
+
+        {validationElem}
+      </SettingsRow>
+    </>
+  );
+}