From 8c18d816b6b6bfea975cf027f1871811d5cdb36b Mon Sep 17 00:00:00 2001
From: Bram Kragten <mail@bramkragten.nl>
Date: Tue, 24 Dec 2024 14:45:43 +0100
Subject: [PATCH] Fix banner when first backup was unsuccessful (#23430)

* Fix banner when first backup was unsuccesful

* Update ha-backup-config-agents.ts

* remove fix widths
---
 .../config/ha-backup-config-agents.ts         |  2 +-
 .../config/ha-backup-config-schedule.ts       |  3 -
 .../overview/ha-backup-overview-summary.ts    | 58 ++++++++++---------
 3 files changed, 31 insertions(+), 32 deletions(-)

diff --git a/src/panels/config/backup/components/config/ha-backup-config-agents.ts b/src/panels/config/backup/components/config/ha-backup-config-agents.ts
index 2d0504a908..6a15f55c94 100644
--- a/src/panels/config/backup/components/config/ha-backup-config-agents.ts
+++ b/src/panels/config/backup/components/config/ha-backup-config-agents.ts
@@ -51,7 +51,7 @@ class HaBackupConfigAgents extends LitElement {
 
   private _description(agentId: string) {
     if (agentId === CLOUD_AGENT) {
-      return "Note: It stores only one backup, regardless of your settings.";
+      return "Note: It stores only one backup with a maximum size of 5 GB, regardless of your settings.";
     }
     if (isNetworkMountAgent(agentId)) {
       return "Network storage";
diff --git a/src/panels/config/backup/components/config/ha-backup-config-schedule.ts b/src/panels/config/backup/components/config/ha-backup-config-schedule.ts
index 2a8a01c9f8..ac062d4842 100644
--- a/src/panels/config/backup/components/config/ha-backup-config-schedule.ts
+++ b/src/panels/config/backup/components/config/ha-backup-config-schedule.ts
@@ -331,16 +331,13 @@ class HaBackupConfigSchedule extends LitElement {
     @media all and (max-width: 450px) {
       ha-md-select {
         min-width: 160px;
-        width: 160px;
       }
     }
     ha-md-textfield#value {
       min-width: 70px;
-      width: 70px;
     }
     ha-md-select#type {
       min-width: 100px;
-      width: 100px;
     }
   `;
 }
diff --git a/src/panels/config/backup/components/overview/ha-backup-overview-summary.ts b/src/panels/config/backup/components/overview/ha-backup-overview-summary.ts
index c20090f367..1d63ac875e 100644
--- a/src/panels/config/backup/components/overview/ha-backup-overview-summary.ts
+++ b/src/panels/config/backup/components/overview/ha-backup-overview-summary.ts
@@ -31,12 +31,9 @@ class HaBackupOverviewBackups extends LitElement {
 
   @property({ type: Boolean }) public fetching = false;
 
-  private _lastBackup = memoizeOne((backups: BackupContent[]) => {
+  private _lastSuccessfulBackup = memoizeOne((backups: BackupContent[]) => {
     const sortedBackups = backups
-      .filter(
-        (backup) =>
-          backup.with_automatic_settings && !backup.failed_agent_ids?.length
-      )
+      .filter((backup) => backup.with_automatic_settings)
       .sort((a, b) => new Date(b.date).getTime() - new Date(a.date).getTime());
 
     return sortedBackups[0] as BackupContent | undefined;
@@ -85,37 +82,27 @@ class HaBackupOverviewBackups extends LitElement {
       `;
     }
 
-    const lastBackup = this._lastBackup(this.backups);
+    const lastSuccessfulBackup = this._lastSuccessfulBackup(this.backups);
 
-    if (!lastBackup) {
-      return html`
-        <ha-backup-summary-card
-          heading="No automatic backup available"
-          description="You have no automatic backups yet."
-          status="warning"
-        >
-        </ha-backup-summary-card>
-      `;
-    }
-
-    const lastBackupDate = new Date(lastBackup.date);
-
-    const now = new Date();
-
-    const lastBackupDescription = `Last successful backup ${relativeTime(lastBackupDate, this.hass.locale, now, true)} and stored to ${lastBackup.agent_ids?.length} locations.`;
-    const nextBackupDescription = this._nextBackupDescription(
-      this.config.schedule.state
-    );
+    const lastSuccessfulBackupDate = lastSuccessfulBackup
+      ? new Date(lastSuccessfulBackup.date)
+      : new Date(0);
 
     const lastAttempt = this.config.last_attempted_automatic_backup
       ? new Date(this.config.last_attempted_automatic_backup)
       : undefined;
 
-    if (lastAttempt && lastAttempt > lastBackupDate) {
+    const now = new Date();
+
+    const lastBackupDescription = lastSuccessfulBackup
+      ? `Last successful backup ${relativeTime(lastSuccessfulBackupDate, this.hass.locale, now, true)} and stored to ${lastSuccessfulBackup.agent_ids?.length} locations.`
+      : "You have no successful backups.";
+
+    if (lastAttempt && lastAttempt > lastSuccessfulBackupDate) {
       const lastAttemptDescription = `The last automatic backup trigged ${relativeTime(lastAttempt, this.hass.locale, now, true)} wasn't successful.`;
       return html`
         <ha-backup-summary-card
-          heading=${`Last automatic backup failed`}
+          heading="Last automatic backup failed"
           status="error"
         >
           <ha-md-list>
@@ -132,10 +119,25 @@ class HaBackupOverviewBackups extends LitElement {
       `;
     }
 
+    if (!lastSuccessfulBackup) {
+      return html`
+        <ha-backup-summary-card
+          heading="No automatic backup available"
+          description="You have no automatic backups yet."
+          status="warning"
+        >
+        </ha-backup-summary-card>
+      `;
+    }
+
+    const nextBackupDescription = this._nextBackupDescription(
+      this.config.schedule.state
+    );
+
     const numberOfDays = differenceInDays(
       // Subtract a few hours to avoid showing as overdue if it's just a few hours (e.g. daylight saving)
       addHours(now, -OVERDUE_MARGIN_HOURS),
-      lastBackupDate
+      lastSuccessfulBackupDate
     );
 
     const isOverdue =