Add snapshot contents as secondary info for partial snapshots (#9166)

hassio/src/snapshots/hassio-snapshots.ts

@@ -24,6 +24,7 @@ import "../../../src/components/ha-button-menu";
 import "../../../src/components/ha-fab";
 import {
   fetchHassioSnapshots,
+  friendlyFolderName,
   HassioSnapshot,
   reloadHassioSnapshots,
 } from "../../../src/data/hassio/snapshot";
@@ -66,6 +67,33 @@ export class HassioSnapshots extends LitElement {
     await this.fetchSnapshots();
   }
 
+  private _computeSnapshotContent = (snapshot: HassioSnapshot): string => {
+    if (snapshot.type === "full") {
+      return this.supervisor.localize("snapshot.full_snapshot");
+    }
+    const content: string[] = [];
+    if (snapshot.content.homeassistant) {
+      content.push("Home Assistant");
+    }
+    if (snapshot.content.folders.length !== 0) {
+      for (const folder of snapshot.content.folders) {
+        content.push(friendlyFolderName[folder] || folder);
+      }
+    }
+
+    if (snapshot.content.addons.length !== 0) {
+      for (const addon of snapshot.content.addons) {
+        content.push(
+          this.supervisor.supervisor.addons.find(
+            (entry) => entry.slug === addon
+          )?.name || addon
+        );
+      }
+    }
+
+    return content.join(", ");
+  };
+
   protected firstUpdated(changedProperties: PropertyValues): void {
     super.firstUpdated(changedProperties);
     if (this.hass && this.isConnected) {
@@ -81,7 +109,9 @@ export class HassioSnapshots extends LitElement {
         sortable: true,
         filterable: true,
         grows: true,
-        template: (entry: string, snapshot: any) => entry || snapshot.slug,
+        template: (entry: string, snapshot: any) =>
+          html`${entry || snapshot.slug}
+            <div class="secondary">${snapshot.secondary}</div>`,
       },
       date: {
         title: this.supervisor?.localize("snapshot.created") || "",
@@ -93,17 +123,21 @@ export class HassioSnapshots extends LitElement {
         template: (entry: string) =>
           relativeTime(new Date(entry), this.hass.localize),
       },
-      type: {
+      secondary: {
-        title: this.supervisor?.localize("snapshot.type") || "",
+        title: "",
-        width: "15%",
+        hidden: true,
-        hidden: narrow,
         filterable: true,
-        sortable: true,
-        template: (entry: string) => (entry === "partial" ? "Partial" : "Full"),
       },
     })
   );
 
+  private _snapshotData = memoizeOne((snapshots: HassioSnapshot[]) =>
+    snapshots.map((snapshot) => ({
+      ...snapshot,
+      secondary: this._computeSnapshotContent(snapshot),
+    }))
+  );
+
   protected render(): TemplateResult {
     if (!this.supervisor) {
       return html``;
@@ -118,7 +152,7 @@ export class HassioSnapshots extends LitElement {
         .narrow=${this.narrow}
         .route=${this.route}
         .columns=${this._columns(this.narrow)}
-        .data=${this._snapshots}
+        .data=${this._snapshotData(this._snapshots || [])}
         id="slug"
         @row-click=${this._handleRowClicked}
         clickable

src/data/hassio/snapshot.ts

@@ -2,12 +2,27 @@ import { atLeastVersion } from "../../common/config/version";
 import { HomeAssistant } from "../../types";
 import { hassioApiResultExtractor, HassioResponse } from "./common";
 
+export const friendlyFolderName = {
+  ssl: "SSL",
+  homeassistant: "Configuration",
+  "addons/local": "Local add-ons",
+  media: "Media",
+  share: "Share",
+};
+
+interface SnapshotContent {
+  homeassistant: boolean;
+  folders: string[];
+  addons: string[];
+}
+
 export interface HassioSnapshot {
   slug: string;
   date: string;
   name: string;
   type: "full" | "partial";
   protected: boolean;
+  content: SnapshotContent;
 }
 
 export interface HassioSnapshotDetail extends HassioSnapshot {