Remove logs and fix dark theme during onboarding restore (#7579)

src/html/onboarding.html.template

@@ -17,6 +17,8 @@
           --primary-text-color: #e1e1e1;
           --secondary-text-color: #9b9b9b;
           --disabled-text-color: #6f6f6f;
+          --mdc-theme-surface: #1e1e1e;
+          --ha-card-background: #1e1e1e;
         }
       }
       .content {

src/onboarding/onboarding-restore-snapshot.ts

@@ -4,7 +4,6 @@ import {
   CSSResult,
   customElement,
   html,
-  internalProperty,
   LitElement,
   property,
   TemplateResult,
@@ -15,10 +14,6 @@ import { showSnapshotUploadDialog } from "../../hassio/src/dialogs/snapshot/show
 import { navigate } from "../common/navigate";
 import type { LocalizeFunc } from "../common/translations/localize";
 import "../components/ha-card";
-import {
-  extractApiErrorMessage,
-  ignoredStatusCodes,
-} from "../data/hassio/common";
 import { makeDialogManager } from "../dialogs/make-dialog-manager";
 import { ProvideHassLitMixin } from "../mixins/provide-hass-lit-mixin";
 import { haStyle } from "../resources/styles";
@@ -38,10 +33,6 @@ class OnboardingRestoreSnapshot extends ProvideHassLitMixin(LitElement) {
 
   @property({ type: Boolean }) public restoring = false;
 
-  @internalProperty() private _log = "";
-
-  @internalProperty() private _showFullLog = false;
-
   protected render(): TemplateResult {
     return this.restoring
       ? html`<ha-card
@@ -49,22 +40,7 @@ class OnboardingRestoreSnapshot extends ProvideHassLitMixin(LitElement) {
             "ui.panel.page-onboarding.restore.in_progress"
           )}
         >
-          ${this._showFullLog
+          <onboarding-loading></onboarding-loading>
-            ? html`<hassio-ansi-to-html .content=${this._log}>
-              </hassio-ansi-to-html>`
-            : html`<onboarding-loading></onboarding-loading>
-                <hassio-ansi-to-html
-                  class="logentry"
-                  .content=${this._lastLogEntry(this._log)}
-                >
-                </hassio-ansi-to-html>`}
-          <div class="card-actions">
-            <mwc-button @click=${this._toggeFullLog}>
-              ${this._showFullLog
-                ? this.localize("ui.panel.page-onboarding.restore.hide_log")
-                : this.localize("ui.panel.page-onboarding.restore.show_log")}
-            </mwc-button>
-          </div>
         </ha-card>`
       : html`
           <button class="link" @click=${this._uploadSnapshot}>
@@ -73,33 +49,6 @@ class OnboardingRestoreSnapshot extends ProvideHassLitMixin(LitElement) {
         `;
   }
 
-  private _toggeFullLog(): void {
-    this._showFullLog = !this._showFullLog;
-  }
-
-  private _filterLogs(logs: string): string {
-    // Filter out logs that is not relevant to show during the restore
-    return logs
-      .split("\n")
-      .filter(
-        (entry) =>
-          !entry.includes("/supervisor/logs") &&
-          !entry.includes("/supervisor/ping") &&
-          !entry.includes("DEBUG") &&
-          !entry.includes("TypeError: Failed to fetch")
-      )
-      .join("\n")
-      .replace(/\s[A-Z]+\s\(\w+\)\s\[[\w.]+\]/gi, "")
-      .replace(/\d{2}-\d{2}-\d{2}\s/gi, "");
-  }
-
-  private _lastLogEntry(logs: string): string {
-    return logs
-      .split("\n")
-      .slice(-2)[0]
-      .replace(/\d{2}:\d{2}:\d{2}\s/gi, "");
-  }
-
   private _uploadSnapshot(): void {
     showSnapshotUploadDialog(this, {
       showSnapshot: (slug: string) => this._showSnapshotDialog(slug),
@@ -110,42 +59,26 @@ class OnboardingRestoreSnapshot extends ProvideHassLitMixin(LitElement) {
   protected firstUpdated(changedProps) {
     super.firstUpdated(changedProps);
     makeDialogManager(this, this.shadowRoot!);
-    setInterval(() => this._getLogs(), 1000);
+    setInterval(() => this._checkRestoreStatus(), 1000);
   }
 
-  private async _getLogs(): Promise<void> {
+  private async _checkRestoreStatus(): Promise<void> {
     if (this.restoring) {
       try {
-        const response = await fetch("/api/hassio/supervisor/logs", {
+        const response = await fetch("/api/hassio/supervisor/info", {
           method: "GET",
         });
         if (response.status === 401) {
           // If we get a unauthorized response, the restore is done
-          this._restoreDone();
+          navigate(this, "/", true);
-        } else if (
+          location.reload();
-          response.status &&
-          !ignoredStatusCodes.has(response.status)
-        ) {
-          // Handle error responses
-          this._log += this._filterLogs(extractApiErrorMessage(response));
-        }
-        const logs = await response.text();
-        this._log = this._filterLogs(logs);
-        if (this._log.match(/\d{2}:\d{2}:\d{2}\s.*Restore\s\w+\sdone/)) {
-          // The log indicates that the restore done, navigate the user back to base
-          this._restoreDone();
         }
       } catch (err) {
-        this._log += this._filterLogs(err.toString());
+        // We fully expected issues with fetching info untill restore is complete.
       }
     }
   }
 
-  private _restoreDone(): void {
-    navigate(this, "/", true);
-    location.reload();
-  }
-
   private _showSnapshotDialog(slug: string): void {
     showHassioSnapshotDialog(this, {
       slug,