@futo-org/backups-orchestrator-ui 0.35.1 → 0.37.0

package/dist/components/backups/BackupItem.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import type { LocalRepositoryDto } from "../../fetch-client";
   import { getRepositoryActions } from "../../services/repository.service";
+  import { getBackupOutcome } from "../../utils/backup-status";
   import { Badge, FormatBytes, Icon } from "@immich/ui";
   import { mdiArchiveOutline } from "@mdi/js";
   import StackListItem from "../ui/StackListItem.svelte";
@@ -18,12 +19,7 @@
     s3: "S3 Server",
   };
 
-  const failed = $derived(
-    repository.metrics.lastBackup &&
-      (!repository.metrics.lastSuccessfulBackup ||
-        +new Date(repository.metrics.lastBackup) >
-          +new Date(repository.metrics.lastSuccessfulBackup)),
-  );
+  const outcome = $derived(getBackupOutcome(repository.metrics));
 
   const { BackupNow, Snapshots, History, Configure, Import, MetricsHistory } =
     $derived(getRepositoryActions(repository));
@@ -31,7 +27,7 @@
 
 <StackListItem
   title={repository.name}
-  color={failed ? "danger" : "primary"}
+  color={outcome === "failed" ? "danger" : "primary"}
   actions={[BackupNow, Snapshots, History, Configure, Import, MetricsHistory]}
 >
   {#snippet icon()}
@@ -57,15 +53,17 @@
       <Badge size="tiny" color="danger">Offline</Badge>
     {/if}
 
-    {#if failed}
+    {#if outcome === "failed"}
       <Badge size="tiny" color="danger">
         Failed <RelativeTime time={repository.metrics.lastBackup!} />
       </Badge>
-    {:else if repository.metrics.lastSuccessfulBackup}
+    {:else if outcome === "warn"}
+      <Badge size="tiny" color="warning">
+        Warnings <RelativeTime time={repository.metrics.lastBackup!} />
+      </Badge>
+    {:else if outcome === "complete"}
       <Badge size="tiny" color="success">
-        Successful <RelativeTime
-          time={repository.metrics.lastSuccessfulBackup}
-        />
+        Successful <RelativeTime time={repository.metrics.lastBackup!} />
       </Badge>
     {:else}
       <Badge size="tiny" color="warning">Never backed up</Badge>

package/dist/components/backups/BackupStatus.svelte

@@ -5,6 +5,7 @@
     | "connecting"
     | "running"
     | "complete"
+    | "warned"
     | "failed";
 </script>
 
@@ -50,8 +51,6 @@
     onRetry,
   }: Props = $props();
 
-  let showErrors = $state(false);
-
   const phases: Record<BackupStatusType, [string, string, string]> = {
     backup: ["Preparing backup", "Backing up", "Finalizing backup"],
     restore: ["Preparing restore", "Restoring", "Finalizing restore"],
@@ -64,6 +63,12 @@
     forget: "Old backups were pruned successfully",
   };
 
+  const warned: Record<BackupStatusType, string> = {
+    backup: "Your library was backed up, with warnings",
+    restore: "Your library was restored, with warnings",
+    forget: "Old backups were pruned, with warnings",
+  };
+
   const failed: Record<BackupStatusType, string> = {
     backup: "Your library could not be backed up",
     restore: "Your library could not be restored",
@@ -104,6 +109,9 @@
       case "complete": {
         return succeeded[type];
       }
+      case "warned": {
+        return warned[type];
+      }
       default: {
         return `${phase} · ${Math.round(progress * 100)}%`;
       }
@@ -111,10 +119,20 @@
   });
 
   const titleColor = $derived(
-    backupState === "complete" ? "success" : backupState === "failed" ? "danger" : "primary",
+    backupState === "complete"
+      ? "success"
+      : backupState === "warned"
+        ? "warning"
+        : backupState === "failed"
+          ? "danger"
+          : "primary",
   );
 
-  const terminal = $derived(backupState === "complete" || backupState === "failed");
+  const terminal = $derived(
+    backupState === "complete" ||
+      backupState === "warned" ||
+      backupState === "failed",
+  );
 </script>
 
 <Stack gap={4}>
@@ -132,7 +150,7 @@
         <Text color="muted">Completed in {duration}</Text>
       {/if}
 
-      {#if backupState === "complete" && errors.length > 0}
+      {#if backupState === "warned" && errors.length > 0}
         <Text color="warning">
           Completed with {errors.length}
           {errors.length === 1 ? "warning" : "warnings"}.
@@ -151,38 +169,30 @@
   {/if}
 
   {#if terminal && (errors.length > 0 || (backupState === "failed" && onRetry))}
-    <HStack gap={4} class="items-center">
+    <Stack gap={4}>
       {#if backupState === "failed" && onRetry}
-        <Button shape="round" onclick={onRetry}>Try again</Button>
+        <HStack gap={4} class="items-center">
+          <Button shape="round" onclick={onRetry}>Try again</Button>
+        </HStack>
       {/if}
 
       {#if errors.length > 0}
-        <Button
-          variant="ghost"
-          shape="round"
-          onclick={() => (showErrors = !showErrors)}
-        >
-          {showErrors ? "Hide details" : "View details"}
-        </Button>
+        <Scrollable class="max-h-64">
+          <Stack gap={2}>
+            {#each errors as error, index (index)}
+              <Alert color={backupState === "failed" ? "danger" : "warning"}>
+                {error}
+              </Alert>
+            {/each}
+          </Stack>
+        </Scrollable>
       {/if}
-    </HStack>
-
-    {#if showErrors}
-      <Scrollable class="max-h-32">
-        <Stack gap={1}>
-          {#each errors as error, index (index)}
-            <Alert color={backupState === "failed" ? "danger" : "warning"}>
-              {error}
-            </Alert>
-          {/each}
-        </Stack>
-      </Scrollable>
-    {/if}
+    </Stack>
   {/if}
 
   {#if backupState === "running"}
     <Text color="muted">{running[type]}</Text>
-  {:else if backupState === "complete" && details}
+  {:else if (backupState === "complete" || backupState === "warned") && details}
     <Text color="muted">{@render details()}</Text>
   {/if}
 

package/dist/components/backups/BackupStatus.svelte.d.ts

@@ -1,5 +1,5 @@
 export type BackupStatusType = "backup" | "restore" | "forget";
-export type BackupStatusState = "connecting" | "running" | "complete" | "failed";
+export type BackupStatusState = "connecting" | "running" | "complete" | "warned" | "failed";
 import type { Snippet } from "svelte";
 type Props = {
     title: string;

package/dist/components/backups/dialogs/ConfigureRepositoryModal.svelte

@@ -1,12 +1,12 @@
 <script lang="ts">
   import BackendsList from "../../backends/BackendsList.svelte";
+  import PathListField from "../../ui/PathListField.svelte";
   import { type LocalRepositoryDto } from "../../../fetch-client";
   import { options } from "../../../options";
   import {
     useRemoveRepository,
     useUpdateRepository,
   } from "../../../services/repository.service";
-  import PathListField from "../../ui/PathListField.svelte";
   import {
     Button,
     Field,
@@ -89,10 +89,8 @@
       </PathListField>
     {/if}
 
-    <Button
-      color="danger"
-      loading={removeMutation.isPending}
-      onclick={onRemove}>Remove Repository</Button
+    <Button color="danger" loading={removeMutation.isPending} onclick={onRemove}
+      >Remove Repository from This Device</Button
     >
 
     {#if advanced}

package/dist/components/backups/dialogs/ViewStatusModal.svelte

@@ -57,11 +57,20 @@
       return "connecting";
     }
 
-    if (run.status === "incomplete") {
-      return "running";
+    switch (run.status) {
+      case "incomplete": {
+        return "running";
+      }
+      case "failed": {
+        return "failed";
+      }
+      case "warn": {
+        return "warned";
+      }
+      default: {
+        return "complete";
+      }
     }
-
-    return run.status === "failed" ? "failed" : "complete";
   });
 
   const duration = $derived(
@@ -94,6 +103,9 @@
       case "complete": {
         return `${titles[type].done} complete`;
       }
+      case "warned": {
+        return `${titles[type].done} completed with warnings`;
+      }
       case "failed": {
         return `${titles[type].done} failed`;
       }

package/dist/components/backups/run-history/RepositoryRunHistoryItem.svelte

@@ -38,6 +38,13 @@
           icon: mdiCloudOffOutline,
         } as const;
       }
+      case "warn": {
+        return {
+          title: `${noun.done} with warnings`,
+          color: "warning",
+          icon: mdiCloudCheckOutline,
+        } as const;
+      }
       case "incomplete": {
         return {
           title: `${noun.running} in progress`,

package/dist/components/backups/run-history/RepositoryRunHistoryPage.svelte

@@ -26,7 +26,9 @@
 
   let search = $state("");
   let newestFirst = $state(true);
-  let status = $state<"all" | "complete" | "failed" | "incomplete">("all");
+  let status = $state<"all" | "complete" | "warn" | "failed" | "incomplete">(
+    "all",
+  );
   let page = $state(1);
 
   const onSearch = (value: string) => {
@@ -47,6 +49,7 @@
   const statusOptions: { value: typeof status; title: string }[] = [
     { value: "all", title: "All attempts" },
     { value: "complete", title: "Successful only" },
+    { value: "warn", title: "With warnings only" },
     { value: "failed", title: "Failed only" },
     { value: "incomplete", title: "In progress only" },
   ];

package/dist/components/dashboard/DashboardBackupHealth.svelte

@@ -8,6 +8,7 @@
     CardTitle,
     HStack,
   } from "@immich/ui";
+  import { getBackupOutcome } from "../../utils/backup-status";
   import VisualisationSegmentedBar from "../ui/VisualisationSegmentedBar.svelte";
 
   type Props = {
@@ -25,18 +26,31 @@
       (tally, repo) => {
         if (local && !repo.backends?.primary.online) {
           tally.offline++;
-        } else if (!repo.metrics?.lastBackup) {
-          tally.neverRun++;
-        } else if (
-          repo.metrics.lastBackup === repo.metrics.lastSuccessfulBackup
-        ) {
-          tally.success++;
-        } else {
-          tally.failed++;
+          return tally;
         }
+
+        switch (getBackupOutcome(repo.metrics)) {
+          case "never": {
+            tally.neverRun++;
+            break;
+          }
+          case "failed": {
+            tally.failed++;
+            break;
+          }
+          case "warn": {
+            tally.warned++;
+            break;
+          }
+          default: {
+            tally.success++;
+            break;
+          }
+        }
+
         return tally;
       },
-      { success: 0, offline: 0, failed: 0, neverRun: 0 },
+      { success: 0, offline: 0, warned: 0, failed: 0, neverRun: 0 },
     ),
   );
 </script>
@@ -69,6 +83,12 @@
           color: "var(--immich-ui-warning-500)",
           badge: "warning",
         },
+        {
+          value: status.warned,
+          label: "With warnings",
+          color: "var(--immich-ui-warning-500)",
+          badge: "warning",
+        },
         {
           value: status.failed,
           label: "Failed",

package/dist/components/dashboard/DashboardRecentBackups.svelte

@@ -6,6 +6,7 @@
     mdiCloudOffOutline,
     mdiHistory,
   } from "@mdi/js";
+  import { getBackupOutcome } from "../../utils/backup-status";
   import MetricsHistoryModal from "../backups/metrics-history/MetricsHistoryModal.svelte";
   import StackList from "../ui/StackList.svelte";
   import StackListPlaceholder from "../ui/StackListPlaceholder.svelte";
@@ -54,19 +55,19 @@
   {/if}
 
   {#each recentAttempts as repository (repository.id)}
-    {@const successful =
-      repository.metrics.lastBackup === repository.metrics.lastSuccessfulBackup}
+    {@const outcome = getBackupOutcome(repository.metrics)}
+    {@const failed = outcome === "failed"}
 
     <StackListItem
       title={repository.name}
-      color={successful ? "success" : "danger"}
+      color={failed ? "danger" : outcome === "warn" ? "warning" : "success"}
       actions={getActions(repository)}
     >
       {#snippet icon()}
-        <Icon icon={successful ? mdiCloudCheckOutline : mdiCloudOffOutline} />
+        <Icon icon={failed ? mdiCloudOffOutline : mdiCloudCheckOutline} />
       {/snippet}
 
-      {successful ? "Backed up" : "Attempted"}
+      {failed ? "Attempted" : outcome === "warn" ? "Backed up with warnings" : "Backed up"}
       <RelativeTime time={repository.metrics.lastBackup!} />
     </StackListItem>
   {/each}

package/dist/components/integrations/immich/ImmichBackupsSidebarItem.svelte

@@ -17,6 +17,7 @@
     useScheduleEventHandler,
     useSchedules,
   } from "../../../services/schedule.service";
+  import { getBackupOutcome } from "../../../utils/backup-status";
   import { HStack, Icon, Text } from "@immich/ui";
   import {
     mdiChevronRight,
@@ -73,11 +74,7 @@
 
   const lastBackup = $derived(repository?.metrics.lastBackup ?? undefined);
 
-  const failed = $derived(
-    Boolean(
-      lastBackup && lastBackup !== repository?.metrics.lastSuccessfulBackup,
-    ),
-  );
+  const outcome = $derived(getBackupOutcome(repository?.metrics));
 
   const loading = $derived(
     integrations.isLoading || repositories.isLoading || schedules.isLoading,
@@ -91,10 +88,14 @@
       return { color: "primary", icon: mdiCloudUploadOutline } as const;
     }
 
-    if (failed) {
+    if (outcome === "failed") {
       return { color: "danger", icon: mdiCloudOffOutline } as const;
     }
 
+    if (outcome === "warn") {
+      return { color: "warning", icon: mdiCloudCheckVariantOutline } as const;
+    }
+
     if (paused) {
       return { color: "warning", icon: mdiCloudAlertOutline } as const;
     }
@@ -138,8 +139,10 @@
     <Text size="tiny" color={status.color} class="flex-1 truncate">
       {#if running}
         Backing up now
-      {:else if failed}
+      {:else if outcome === "failed"}
         Backup failed
+      {:else if outcome === "warn" && lastBackup}
+        Backed up with warnings <RelativeTime time={lastBackup} />
       {:else if paused}
         Backups paused
       {:else if !configured}

package/dist/components/integrations/immich/ImmichManageBackupOverview.svelte

@@ -4,6 +4,7 @@
   import RelativeTime from "../../util/RelativeTime.svelte";
   import type { LocalRepositoryDto, ScheduleDto } from "../../../fetch-client";
   import { handleCreateBackup } from "../../../services/repository.service";
+  import { getBackupOutcome } from "../../../utils/backup-status";
   import { Button, FormatBytes, Icon } from "@immich/ui";
   import {
     mdiAlert,
@@ -21,15 +22,23 @@
 
   const { repository, schedule }: Props = $props();
 
+  const outcome = $derived(getBackupOutcome(repository.metrics));
+
   const status = $derived.by(() => {
-    if (!repository.metrics.lastBackup) {
-      return { color: "warning", icon: mdiInformation } as const;
+    switch (outcome) {
+      case "never": {
+        return { color: "warning", icon: mdiInformation } as const;
+      }
+      case "failed": {
+        return { color: "danger", icon: mdiAlert } as const;
+      }
+      case "warn": {
+        return { color: "warning", icon: mdiAlert } as const;
+      }
+      default: {
+        return { color: "success", icon: mdiCheck } as const;
+      }
     }
-
-    return repository.metrics.lastBackup !==
-      repository.metrics.lastSuccessfulBackup
-      ? ({ color: "danger", icon: mdiAlert } as const)
-      : ({ color: "success", icon: mdiCheck } as const);
   });
 
 </script>
@@ -64,13 +73,17 @@
     {#snippet footer()}
       <Icon icon={status.icon} />
 
-      {#if !repository.metrics.lastBackup}
+      {#if outcome === "never"}
         Backup is yet to run.
-      {:else if status.color === "danger"}
-        Last backup failed <RelativeTime time={repository.metrics.lastBackup} />
+      {:else if outcome === "failed"}
+        Last backup failed <RelativeTime time={repository.metrics.lastBackup!} />
+      {:else if outcome === "warn"}
+        Last backup finished with warnings <RelativeTime
+          time={repository.metrics.lastBackup!}
+        />
       {:else}
         Last backup successful <RelativeTime
-          time={repository.metrics.lastBackup}
+          time={repository.metrics.lastBackup!}
         />
       {/if}
     {/snippet}

package/dist/components/integrations/immich/ImmichOnboardingSetupFlow.svelte

@@ -6,7 +6,7 @@
   import OnboardingStepConnectAccount from "../../onboarding/steps/OnboardingStep2ConnectAccount.svelte";
   import OnboardingStepSaveRecoveryKey from "../../onboarding/steps/OnboardingStep3SaveRecoveryKey.svelte";
   import OnboardingStepFirstBackup from "../../onboarding/steps/OnboardingStep4FirstBackup.svelte";
-  import type { OnboardingStatusResponseDto } from "../../../fetch-client";
+  import { type OnboardingStatusResponseDto } from "../../../fetch-client";
   import {
     handleSetupLocalStorage,
     handleStartYuccaLogin,
@@ -78,11 +78,11 @@
   const onCancel = () => (stage = "idle");
 
   const afterTelemetry = () =>
-    (stage = status?.hasOnboardedKey && status.hasBackup
-      ? "finished"
-      : "connect");
+    (stage =
+      status?.hasOnboardedKey && status.hasBackup ? "finished" : "connect");
 
-  const onBackendReady = () => (stage = status?.hasOnboardedKey ? "backup" : "key");
+  const onBackendReady = () =>
+    (stage = status?.hasOnboardedKey ? "backup" : "key");
 
   const onConnect = () => {
     storageLocation = "FUTO Backups";
@@ -105,6 +105,16 @@
     }
   };
 
+  const onImportedKey = async (key: string) => {
+    try {
+      await handleConfirmRecoveryKey();
+      code = key;
+      stage = "connect";
+    } catch {
+      // no-op
+    }
+  };
+
   const onStartBackup = () =>
     defaults.mutate(undefined, { onSuccess: () => (stage = "finished") });
 </script>
@@ -142,10 +152,7 @@
 {:else if stage === "key-import"}
   <OnboardingStageKeyImport
     onStart={() => (stage = "intro")}
-    onImported={(key) => {
-      code = key;
-      stage = "connect";
-    }}
+    onImported={onImportedKey}
     {onCancel}
   />
 {:else if stage === "key"}

package/dist/components/onboarding/OnboardingGate.svelte

@@ -1,10 +1,10 @@
 <script lang="ts">
+  import type { OnboardingStatusResponseDto } from "../../fetch-client";
+  import { handleOnboardingStatus } from "../../services/onboarding.service";
   import { LoadingSpinner } from "@immich/ui";
   import { onMount, type Snippet } from "svelte";
   import OnboardingBootstrapError from "./OnboardingBootstrapError.svelte";
   import SampleOnboarding from "./SampleOnboarding.svelte";
-  import type { OnboardingStatusResponseDto } from "../../fetch-client";
-  import { handleOnboardingStatus } from "../../services/onboarding.service";
 
   type Props = {
     onExit: () => void;
@@ -37,7 +37,7 @@
   <LoadingSpinner />
 {:else if onboarding.status === "error"}
   <OnboardingBootstrapError error={onboarding.error} onQuit={onExit} />
-{:else if onboarding.hasTelemetry === "none" || !(onboarding.hasBackend && onboarding.hasOnboardedKey && (onboarding.hasSkippedExtraConfig || (onboarding.hasBackup && onboarding.hasSchedule)))}
+{:else if onboarding.hasTelemetry === "none" || !(onboarding.hasBackend && onboarding.hasOnboardedKey)}
   <SampleOnboarding
     status={onboarding}
     onFinish={() => (onFinish ? onFinish() : onSkip())}

package/dist/components/onboarding/SampleOnboarding.svelte

@@ -7,12 +7,9 @@
   import {
     handleConfirmRecoveryKey,
     handleCurrentRecoveryKey,
-    handleSkipOnboardingExtraConfig,
   } from "../../services/onboarding.service";
   import { Modal, ModalBody } from "@immich/ui";
   import { onMount } from "svelte";
-  import CreateFirstBackup from "./stages/SampleCreateFirstBackup.svelte";
-  import CreateFirstSchedule from "./stages/SampleCreateFirstSchedule.svelte";
   import ImportKey from "./stages/OnboardingStageKeyImport.svelte";
   import Telemetry from "./stages/OnboardingStageTelemetry.svelte";
   import StepFinishSetup from "./steps/OnboardingStep1FinishSetup.svelte";
@@ -31,23 +28,12 @@
   let confirming = $state(false);
 
   // svelte-ignore state_referenced_locally
-  let stage:
-    | "intro"
-    | "telemetry"
-    | "key"
-    | "key-import"
-    | "connect"
-    | "backup-create"
-    | "schedule-create" = $state(
+  let stage: "intro" | "telemetry" | "key" | "key-import" | "connect" = $state(
     !status.hasOnboardedKey
       ? "intro"
       : status.hasTelemetry === "none"
         ? "telemetry"
-        : !status.hasBackend
-          ? "connect"
-          : !status.hasBackup
-            ? "backup-create"
-            : "schedule-create",
+        : "connect",
   );
 
   onMount(() => {
@@ -56,11 +42,6 @@
     }
   });
 
-  const onSkip = () => {
-    void handleSkipOnboardingExtraConfig();
-    onFinish();
-  };
-
   const onConfirmKey = async () => {
     confirming = true;
 
@@ -77,7 +58,15 @@
     }
   };
 
-  const onBackendReady = () => (stage = "backup-create");
+  const onTelemetryConfirmed = () => {
+    if (!status.hasOnboardedKey) {
+      stage = "key";
+    } else if (status.hasBackend) {
+      onFinish();
+    } else {
+      stage = "connect";
+    }
+  };
 </script>
 
 {#if stage === "intro"}
@@ -91,21 +80,15 @@
     </ModalBody>
   </Modal>
 {:else if stage === "telemetry"}
-  <Telemetry
-    onContinue={() =>
-      (stage = !status.hasOnboardedKey
-        ? "key"
-        : !status.hasBackend
-          ? "connect"
-          : !status.hasBackup
-            ? "backup-create"
-            : "schedule-create")}
-    {onCancel}
-  />
+  <Telemetry onContinue={onTelemetryConfirmed} {onCancel} />
 {:else if stage === "key"}
   <Modal size="small" title="FUTO Backups" onClose={onCancel}>
     <ModalBody>
-      <StepSaveRecoveryKey {code} onContinue={onConfirmKey} loading={confirming} />
+      <StepSaveRecoveryKey
+        {code}
+        onContinue={onConfirmKey}
+        loading={confirming}
+      />
     </ModalBody>
   </Modal>
 {:else if stage === "key-import"}
@@ -121,13 +104,9 @@
   <Modal size="small" title="FUTO Backups" onClose={onCancel}>
     <ModalBody>
       <StepConnectAccount
-        onConnect={() => handleStartYuccaLogin(onBackendReady)}
-        onLocalStorage={() => handleSetupLocalStorage(onBackendReady)}
+        onConnect={() => handleStartYuccaLogin(onFinish)}
+        onLocalStorage={() => handleSetupLocalStorage(onFinish)}
       />
     </ModalBody>
   </Modal>
-{:else if stage === "backup-create"}
-  <CreateFirstBackup onNext={() => (stage = "schedule-create")} {onSkip} />
-{:else if stage === "schedule-create"}
-  <CreateFirstSchedule {onFinish} {onSkip} />
 {/if}

package/dist/components/test/dashboard/ActiveJobs.svelte

@@ -88,12 +88,17 @@
   const hasFailedItems = (task: LiveTask) =>
     task.scheduleStatus?.some((item) => item.status === "failed") ?? false;
 
+  const hasWarnItems = (task: LiveTask) =>
+    task.scheduleStatus?.some((item) => item.status === "warn") ?? false;
+
   const statusColor = (task: LiveTask) =>
     !task.completedAt
       ? "var(--immich-ui-warning-500)"
       : hasFailedItems(task)
         ? "var(--immich-ui-danger-500)"
-        : "var(--immich-ui-success-500)";
+        : hasWarnItems(task)
+          ? "var(--immich-ui-warning-500)"
+          : "var(--immich-ui-success-500)";
 
   onMount(async () => {
     const taskData = await handleGetRunningTasks();
@@ -210,6 +215,12 @@
                   size="16"
                   class="text-danger-500"
                 />
+              {:else if item.status === "warn"}
+                <Icon
+                  icon={mdiCheckCircleOutline}
+                  size="16"
+                  class="text-warning-500"
+                />
               {:else if subLog && subLog.progress > 0}
                 <Icon
                   icon={mdiLoading}
@@ -232,6 +243,8 @@
                 <Badge size="tiny" color="success">Done</Badge>
               {:else if item.status === "failed"}
                 <Badge size="tiny" color="danger">Failed</Badge>
+              {:else if item.status === "warn"}
+                <Badge size="tiny" color="warning">Warnings</Badge>
               {:else if subLog && subLog.progress > 0}
                 <Badge size="tiny" color="warning"
                   >{Math.round(subLog.progress * 100)}%</Badge

package/dist/components/test/dashboard/BackupHealth.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
   import type { LocalRepositoryDto } from "../../../fetch-client";
+  import { getBackupOutcome } from "../../../utils/backup-status";
   import { Alert, Text } from "@immich/ui";
   import SegmentedBar from "../../ui/VisualisationSegmentedBar.svelte";
 
@@ -16,14 +17,12 @@
       (tally, repo) => {
         if (!repo.backends?.primary.online) {
           tally.offline++;
-        } else if (!repo.metrics?.lastBackup) {
+        } else if (getBackupOutcome(repo.metrics) === "never") {
           tally.neverRun++;
-        } else if (
-          repo.metrics.lastBackup === repo.metrics.lastSuccessfulBackup
-        ) {
-          tally.success++;
-        } else {
+        } else if (getBackupOutcome(repo.metrics) === "failed") {
           tally.failed++;
+        } else {
+          tally.success++;
         }
         return tally;
       },

package/dist/components/test/dashboard/RecentBackups.svelte

@@ -1,6 +1,7 @@
 <script lang="ts">
   import RelativeTime from "../../util/RelativeTime.svelte";
   import type { LocalRepositoryDto } from "../../../fetch-client";
+  import { getBackupOutcome } from "../../../utils/backup-status";
   import { formatDuration } from "../../../utils/format";
   import {
     Button,
@@ -62,7 +63,7 @@
             {/if}
             <HStack class="items-center justify-between py-2">
               <HStack class="items-center gap-2">
-                {#if repo.metrics.lastBackup === repo.metrics.lastSuccessfulBackup}
+                {#if getBackupOutcome(repo.metrics) !== "failed"}
                   <Icon
                     icon={mdiCheckCircleOutline}
                     size="16"

package/dist/components/ui/PathPickerModal.svelte

@@ -16,6 +16,7 @@
   } from "@immich/ui";
   import {
     mdiArrowUp,
+    mdiCheck,
     mdiClose,
     mdiFileOutline,
     mdiFolderOutline,
@@ -149,7 +150,12 @@
           Browse
         {/snippet}
 
-        <HStack gap={2} class="items-center px-4 py-3 bg-subtle">
+        <HStack
+          gap={2}
+          class="items-center px-4 py-3 {selected.has(listing.path)
+            ? 'bg-primary/10'
+            : 'bg-subtle'}"
+        >
           <Icon icon={mdiFolderOutline} color="primary" />
           <Text class="grow truncate" title={listing.path}>
             {listing.path}
@@ -167,7 +173,13 @@
 
         {#each sortedItems as item (item.path)}
           {#if item.isDirectory || !foldersOnly}
-            <HStack gap={2} class="items-center px-2 py-1">
+            {@const isSelected = selected.has(item.path)}
+            <HStack
+              gap={2}
+              class="items-center px-2 py-1 {isSelected
+                ? 'bg-primary/10'
+                : ''}"
+            >
               {#if item.isDirectory}
                 <ListButton
                   leadingIcon={mdiFolderOutline}
@@ -189,11 +201,16 @@
                 </HStack>
               {/if}
               <IconButton
-                icon={mdiPlus}
-                aria-label={single ? "Select" : "Add"}
+                icon={isSelected ? mdiCheck : mdiPlus}
+                aria-label={isSelected
+                  ? "Selected"
+                  : single
+                    ? "Select"
+                    : "Add"}
                 size="tiny"
                 variant="ghost"
-                disabled={!single && selected.has(item.path)}
+                color={isSelected ? "primary" : undefined}
+                disabled={!single && isSelected}
                 onclick={() => add(item.path)}
               />
             </HStack>

package/dist/fetch-client.d.ts

@@ -113,9 +113,10 @@ export type RepositoryCreateRequestDto = {
     site?: string;
     paths?: string[];
 };
+export type TaskStatus = "incomplete" | "complete" | "warn" | "failed";
 export type RepositoryMetricsDto = {
     lastBackup?: string;
-    lastSuccessfulBackup?: string;
+    lastBackupStatus?: TaskStatus;
     lastBackupDuration?: number;
     sizeBytes: number;
 };
@@ -202,7 +203,7 @@ export type RepositoryCheckImportResponseDto = {
 export type RepositoryPrimaryBackendReconfigureRequestDto = {
     backendId: string;
 };
-export type RunStatus = "incomplete" | "complete" | "failed";
+export type RunStatus = "incomplete" | "complete" | "warn" | "failed";
 export type RunType = "schedule" | "restore" | "backup" | "forget";
 export type RunDto = {
     id: string;
@@ -231,7 +232,6 @@ export type RunResponseDto = {
     run: RunDto;
 };
 export type TaskType = "schedule" | "restore" | "backup" | "forget";
-export type TaskStatus = "incomplete" | "complete" | "failed";
 export type ActiveScheduleItemDto = {
     repositoryId: string;
     status: TaskStatus;

package/dist/services/log.service.svelte.js

@@ -69,6 +69,12 @@ export function createLogObserver(logId) {
                 flush.flush();
                 break;
             }
+            case 'raw': {
+                state.errors.push(event.message);
+                flush();
+                flush.flush();
+                break;
+            }
             case 'yucca_prune_kept': {
                 state.pruned.kept++;
                 flush();

package/dist/utils/backup-status.d.ts

@@ -0,0 +1,3 @@
+import type { RepositoryMetricsDto } from '../fetch-client';
+export type BackupOutcome = 'never' | 'complete' | 'warn' | 'failed';
+export declare const getBackupOutcome: (metrics: RepositoryMetricsDto | undefined) => BackupOutcome;

package/dist/utils/backup-status.js

@@ -0,0 +1,16 @@
+export const getBackupOutcome = (metrics) => {
+    if (!metrics?.lastBackup) {
+        return 'never';
+    }
+    switch (metrics.lastBackupStatus) {
+        case 'failed': {
+            return 'failed';
+        }
+        case 'warn': {
+            return 'warn';
+        }
+        default: {
+            return 'complete';
+        }
+    }
+};

package/package.json

@@ -2,7 +2,7 @@
   "name": "@futo-org/backups-orchestrator-ui",
   "repository": "https://github.com/immich-app/yucca",
   "description": "Backups orchestrator (UI library)",
-  "version": "0.35.1",
+  "version": "0.37.0",
   "license": "Source First License 1.1",
   "files": [
     "dist",
@@ -64,7 +64,7 @@
     "lodash.debounce": "^4.0.8",
     "luxon": "^3.7.2",
     "socket.io-client": "^4.8.3",
-    "@futo-org/backups-api-client": "^0.35.1"
+    "@futo-org/backups-api-client": "^0.37.0"
   },
   "scripts": {
     "dev": "vite dev --port 5174",

package/dist/components/onboarding/stages/SampleCreateFirstBackup.svelte

@@ -1,43 +0,0 @@
-<script lang="ts">
-  import { Checkbox, Field, FormModal, Input, Stack } from "@immich/ui";
-  import { useCreateRepository } from "../../../services/repository.service";
-  import { SvelteSet } from "svelte/reactivity";
-
-  type Props = {
-    onNext: () => void;
-    onSkip: () => void;
-  };
-
-  let { onNext, onSkip }: Props = $props();
-
-  let name = $state("");
-  let worm = $state(false);
-  let paths = new SvelteSet([]);
-
-  const mutation = useCreateRepository();
-
-  const onSubmit = () =>
-    mutation.mutate(
-      { name, worm, paths: [...paths] },
-      { onSuccess: () => onSkip() },
-    );
-</script>
-
-<FormModal
-  title="Create Your First Backup"
-  disabled={name.length === 0 || mutation.isPending}
-  onClose={onSkip}
-  {onSubmit}
->
-  <Stack gap={4}>
-    <Field label="Name" description="A memorable name for this backup">
-      <Input bind:value={name} />
-    </Field>
-    <Field
-      label="Write once (WORM)"
-      description="Prevent anything being deleted"
-    >
-      <Checkbox bind:checked={worm} />
-    </Field>
-  </Stack>
-</FormModal>

package/dist/components/onboarding/stages/SampleCreateFirstBackup.svelte.d.ts

@@ -1,7 +0,0 @@
-type Props = {
-    onNext: () => void;
-    onSkip: () => void;
-};
-declare const SampleCreateFirstBackup: import("svelte").Component<Props, {}, "">;
-type SampleCreateFirstBackup = ReturnType<typeof SampleCreateFirstBackup>;
-export default SampleCreateFirstBackup;

package/dist/components/onboarding/stages/SampleCreateFirstSchedule.svelte

@@ -1,49 +0,0 @@
-<script lang="ts">
-  import { Field, FormModal, Input, Stack } from "@immich/ui";
-  import validate from "cron-validate";
-  import { useCreateSchedule } from "../../../services/schedule.service";
-  import { useRepositories } from "../../../services/repository.service";
-
-  type Props = {
-    onFinish: () => void;
-    onSkip: () => void;
-  };
-
-  const { onFinish, onSkip }: Props = $props();
-
-  const query = useRepositories();
-  const repositories = $derived(
-    (query.data ?? []).filter((repository) => repository.configuration),
-  );
-
-  let name = $state("");
-  let cron = $state("*/15 * * * *");
-
-  const mutation = useCreateSchedule();
-
-  const onSubmit = () =>
-    mutation.mutate(
-      {
-        name,
-        cron,
-        repositories: repositories.map((repository) => repository.id),
-      },
-      { onSuccess: () => onFinish() },
-    );
-</script>
-
-<FormModal
-  title="Create First Schedule"
-  disabled={name.length === 0 || validate(cron).isError() || mutation.isPending}
-  onClose={onSkip}
-  {onSubmit}
->
-  <Stack gap={4}>
-    <Field label="Name" description="Give this schedule a name">
-      <Input bind:value={name} />
-    </Field>
-    <Field label="Schedule" description="Uses cron syntax">
-      <Input bind:value={cron} />
-    </Field>
-  </Stack>
-</FormModal>

package/dist/components/onboarding/stages/SampleCreateFirstSchedule.svelte.d.ts

@@ -1,7 +0,0 @@
-type Props = {
-    onFinish: () => void;
-    onSkip: () => void;
-};
-declare const SampleCreateFirstSchedule: import("svelte").Component<Props, {}, "">;
-type SampleCreateFirstSchedule = ReturnType<typeof SampleCreateFirstSchedule>;
-export default SampleCreateFirstSchedule;