diff --git a/hassio/src/addon-view/config/hassio-addon-network.ts b/hassio/src/addon-view/config/hassio-addon-network.ts
index ea16c73a4a..07ce08f5a4 100644
--- a/hassio/src/addon-view/config/hassio-addon-network.ts
+++ b/hassio/src/addon-view/config/hassio-addon-network.ts
@@ -21,6 +21,7 @@ import { haStyle } from "../../../../src/resources/styles";
import { HomeAssistant } from "../../../../src/types";
import { suggestAddonRestart } from "../../dialogs/suggestAddonRestart";
import { hassioStyle } from "../../resources/hassio-style";
+import "../../../../src/components/buttons/ha-progress-button";
interface NetworkItem {
description: string;
@@ -85,38 +86,17 @@ class HassioAddonNetwork extends LitElement {
-
- Reset to defaults
-
- Save
+
+ Reset to defaults >
+
+ Save
+
`;
}
- static get styles(): CSSResult[] {
- return [
- haStyle,
- hassioStyle,
- css`
- :host {
- display: block;
- }
- ha-card {
- display: block;
- }
- .errors {
- color: var(--error-color);
- margin-bottom: 16px;
- }
- .card-actions {
- display: flex;
- justify-content: space-between;
- }
- `,
- ];
- }
-
protected update(changedProperties: PropertyValues): void {
super.update(changedProperties);
if (changedProperties.has("addon")) {
@@ -149,7 +129,10 @@ class HassioAddonNetwork extends LitElement {
});
}
- private async _resetTapped(): Promise {
+ private async _resetTapped(ev: CustomEvent): Promise {
+ const button = ev.target as any;
+ button.progress = true;
+
const data: HassioAddonSetOptionParams = {
network: null,
};
@@ -162,17 +145,22 @@ class HassioAddonNetwork extends LitElement {
path: "option",
};
fireEvent(this, "hass-api-called", eventdata);
+ if (this.addon?.state === "started") {
+ await suggestAddonRestart(this, this.hass, this.addon);
+ }
} catch (err) {
this._error = `Failed to set addon network configuration, ${
err.body?.message || err
}`;
}
- if (!this._error && this.addon?.state === "started") {
- await suggestAddonRestart(this, this.hass, this.addon);
- }
+
+ button.progress = false;
}
- private async _saveTapped(): Promise {
+ private async _saveTapped(ev: CustomEvent): Promise {
+ const button = ev.target as any;
+ button.progress = true;
+
this._error = undefined;
const networkconfiguration = {};
this._config!.forEach((item) => {
@@ -191,14 +179,38 @@ class HassioAddonNetwork extends LitElement {
path: "option",
};
fireEvent(this, "hass-api-called", eventdata);
+ if (this.addon?.state === "started") {
+ await suggestAddonRestart(this, this.hass, this.addon);
+ }
} catch (err) {
this._error = `Failed to set addon network configuration, ${
err.body?.message || err
}`;
}
- if (!this._error && this.addon?.state === "started") {
- await suggestAddonRestart(this, this.hass, this.addon);
- }
+ button.progress = false;
+ }
+
+ static get styles(): CSSResult[] {
+ return [
+ haStyle,
+ hassioStyle,
+ css`
+ :host {
+ display: block;
+ }
+ ha-card {
+ display: block;
+ }
+ .errors {
+ color: var(--error-color);
+ margin-bottom: 16px;
+ }
+ .card-actions {
+ display: flex;
+ justify-content: space-between;
+ }
+ `,
+ ];
}
}