diff --git a/src/panels/config/backup/components/ha-backup-config-data.ts b/src/panels/config/backup/components/ha-backup-config-data.ts index 4d35627bda..699421d4b6 100644 --- a/src/panels/config/backup/components/ha-backup-config-data.ts +++ b/src/panels/config/backup/components/ha-backup-config-data.ts @@ -30,7 +30,7 @@ export type FormData = { database: boolean; media: boolean; share: boolean; - addons_mode: "all" | "custom"; + addons_mode: "all" | "custom" | "none"; addons: string[]; }; @@ -65,13 +65,25 @@ class HaBackupConfigData extends LitElement { @state() private _addons: BackupAddonItem[] = []; - protected firstUpdated(_changedProperties: PropertyValues): void { - super.firstUpdated(_changedProperties); + @state() private _showAddons = false; + + protected firstUpdated(changedProperties: PropertyValues): void { + super.firstUpdated(changedProperties); if (isComponentLoaded(this.hass, "hassio")) { this._fetchAddons(); } } + protected updated(changedProperties: PropertyValues): void { + if (changedProperties.has("value")) { + if (isComponentLoaded(this.hass, "hassio")) { + if (this.value?.include_addons?.length) { + this._showAddons = true; + } + } + } + } + private async _fetchAddons() { const { addons } = await fetchHassioAddonsInfo(this.hass); this._addons = [ @@ -84,32 +96,38 @@ class HaBackupConfigData extends LitElement { ]; } - private _getData = memoizeOne((value?: BackupConfigData): FormData => { - if (!value) { - return INITIAL_FORM_DATA; + private _getData = memoizeOne( + (value: BackupConfigData | undefined, showAddon: boolean): FormData => { + if (!value) { + return INITIAL_FORM_DATA; + } + + const config = value; + + const hasLocalAddonFolder = config.include_folders?.includes( + SELF_CREATED_ADDONS_FOLDER + ); + + const addons = config.include_addons?.slice() ?? []; + + if (hasLocalAddonFolder && !value.include_all_addons) { + addons.push(SELF_CREATED_ADDONS_NAME); + } + + return { + homeassistant: config.include_homeassistant || this.forceHomeAssistant, + database: config.include_database, + media: config.include_folders?.includes("media") || false, + share: config.include_folders?.includes("share") || false, + addons_mode: config.include_all_addons + ? "all" + : addons.length > 0 || showAddon + ? "custom" + : "none", + addons: addons, + }; } - - const config = value; - - const hasLocalAddonFolder = config.include_folders?.includes( - SELF_CREATED_ADDONS_FOLDER - ); - - const addons = config.include_addons?.slice() ?? []; - - if (hasLocalAddonFolder && !value.include_all_addons) { - addons.push(SELF_CREATED_ADDONS_NAME); - } - - return { - homeassistant: config.include_homeassistant || this.forceHomeAssistant, - database: config.include_database, - media: config.include_folders?.includes("media") || false, - share: config.include_folders?.includes("share") || false, - addons_mode: config.include_all_addons ? "all" : "custom", - addons: addons, - }; - }); + ); private _setData(data: FormData) { const hasSelfCreatedAddons = data.addons.includes(SELF_CREATED_ADDONS_NAME); @@ -140,7 +158,7 @@ class HaBackupConfigData extends LitElement { } protected render() { - const data = this._getData(this.value); + const data = this._getData(this.value, this._showAddons); const isHassio = isComponentLoaded(this.hass, "hassio"); @@ -234,7 +252,10 @@ class HaBackupConfigData extends LitElement { .value=${data.addons_mode} > -
All
+
All, including new
+
+ +
None
Custom
@@ -246,7 +267,7 @@ class HaBackupConfigData extends LitElement { ` : nothing} - ${isHassio && data.addons_mode === "custom" && this._addons.length + ${isHassio && this._showAddons && this._addons.length ? html`