diff --git a/package.json b/package.json index 41d7fb7702..e661f615c1 100644 --- a/package.json +++ b/package.json @@ -93,7 +93,7 @@ "fuse.js": "^3.4.4", "google-timezones-json": "^1.0.2", "hls.js": "^0.12.4", - "home-assistant-js-websocket": "5.0.0", + "home-assistant-js-websocket": "^5.1.1", "idb-keyval": "^3.2.0", "intl-messageformat": "^8.3.9", "js-yaml": "^3.13.1", diff --git a/src/data/core.ts b/src/data/core.ts index f02105ac19..646b4b5098 100644 --- a/src/data/core.ts +++ b/src/data/core.ts @@ -8,6 +8,8 @@ export interface ConfigUpdateValues { elevation: number; unit_system: "metric" | "imperial"; time_zone: string; + external_url?: string | null; + internal_url?: string | null; } export const saveCoreConfig = ( diff --git a/src/fake_data/demo_config.ts b/src/fake_data/demo_config.ts index 63b0d49319..e1d342e45a 100644 --- a/src/fake_data/demo_config.ts +++ b/src/fake_data/demo_config.ts @@ -18,4 +18,6 @@ export const demoConfig: HassConfig = { whitelist_external_dirs: [], config_source: "storage", safe_mode: false, + internal_url: "http://homeassistant.local:8123", + external_url: null, }; diff --git a/src/panels/config/core/ha-config-section-core.js b/src/panels/config/core/ha-config-section-core.js index e33196a147..0ce4653489 100644 --- a/src/panels/config/core/ha-config-section-core.js +++ b/src/panels/config/core/ha-config-section-core.js @@ -11,6 +11,7 @@ import "../../../resources/ha-style"; import "../ha-config-section"; import "./ha-config-core-form"; import "./ha-config-name-form"; +import "./ha-config-url-form"; /* * @appliesMixin LocalizeMixin @@ -59,6 +60,7 @@ class HaConfigSectionCore extends LocalizeMixin(PolymerElement) { + `; } diff --git a/src/panels/config/core/ha-config-url-form.ts b/src/panels/config/core/ha-config-url-form.ts new file mode 100644 index 0000000000..216cd7b947 --- /dev/null +++ b/src/panels/config/core/ha-config-url-form.ts @@ -0,0 +1,168 @@ +import "@material/mwc-button/mwc-button"; +import "@polymer/paper-input/paper-input"; +import type { PaperInputElement } from "@polymer/paper-input/paper-input"; +import { + css, + CSSResult, + customElement, + html, + LitElement, + property, + TemplateResult, +} from "lit-element"; +import "../../../components/ha-card"; +import { saveCoreConfig } from "../../../data/core"; +import type { PolymerChangedEvent } from "../../../polymer-types"; +import type { HomeAssistant } from "../../../types"; + +@customElement("ha-config-url-form") +class ConfigUrlForm extends LitElement { + @property() public hass!: HomeAssistant; + + @property() private _error?: string; + + @property() private _working = false; + + @property() private _external_url?: string; + + @property() private _internal_url?: string; + + protected render(): TemplateResult { + const canEdit = ["storage", "default"].includes( + this.hass.config.config_source + ); + const disabled = this._working || !canEdit; + + if (!this.hass.userData?.showAdvanced) { + return html``; + } + + return html` + +
+ ${!canEdit + ? html` +

+ ${this.hass.localize( + "ui.panel.config.core.section.core.core_config.edit_requires_storage" + )} +

+ ` + : ""} + ${this._error ? html`
${this._error}
` : ""} +
+
+ ${this.hass.localize( + "ui.panel.config.core.section.core.core_config.external_url" + )} +
+ + + +
+ +
+
+ ${this.hass.localize( + "ui.panel.config.core.section.core.core_config.internal_url" + )} +
+ + +
+
+
+ + ${this.hass.localize( + "ui.panel.config.core.section.core.core_config.save_button" + )} + +
+ + `; + } + + private get _internalUrlValue() { + return this._internal_url !== undefined + ? this._internal_url + : this.hass.config.internal_url; + } + + private get _externalUrlValue() { + return this._external_url !== undefined + ? this._external_url + : this.hass.config.external_url; + } + + private _handleChange(ev: PolymerChangedEvent) { + const target = ev.currentTarget as PaperInputElement; + this[`_${target.name}`] = target.value; + } + + private async _save() { + this._working = true; + this._error = undefined; + try { + await saveCoreConfig(this.hass, { + external_url: this._external_url || null, + internal_url: this._internal_url || null, + }); + } catch (err) { + this._error = err.message || err; + } finally { + this._working = false; + } + } + + static get styles(): CSSResult { + return css` + .row { + display: flex; + flex-direction: row; + margin: 0 -8px; + align-items: center; + } + + .secondary { + color: var(--secondary-text-color); + } + + .flex { + flex: 1; + } + + .row > * { + margin: 0 8px; + } + .error { + color: var(--error-color); + } + `; + } +} + +declare global { + interface HTMLElementTagNameMap { + "ha-config-url-form": ConfigUrlForm; + } +} diff --git a/src/translations/en.json b/src/translations/en.json index e31c57bf5f..eb1dc2506d 100755 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -590,7 +590,9 @@ "unit_system_metric": "Metric", "imperial_example": "Fahrenheit, pounds", "metric_example": "Celsius, kilograms", - "save_button": "Save" + "save_button": "Save", + "external_url": "External URL", + "internal_url": "Internal URL" } } } diff --git a/yarn.lock b/yarn.lock index ac6307aeb6..b07a39fb08 100644 --- a/yarn.lock +++ b/yarn.lock @@ -8219,10 +8219,10 @@ hoek@6.x.x: resolved "https://registry.yarnpkg.com/hoek/-/hoek-6.1.3.tgz#73b7d33952e01fe27a38b0457294b79dd8da242c" integrity sha512-YXXAAhmF9zpQbC7LEcREFtXfGq5K1fmd+4PHkBq8NUqmzW3G+Dq10bI/i0KucLRwss3YYFQ0fSfoxBZYiGUqtQ== -home-assistant-js-websocket@5.0.0: - version "5.0.0" - resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-5.0.0.tgz#b8c28666e7a9f70a1feb02d138c7666f0ce49d23" - integrity sha512-Eji+QJMR04DAdKUpEn7WA1VjqopWgTuS1oN/aODLmPmxUtxhQ8jIaWMBdbAFUn0SQvmlIwaSYF0zBl8tbOM9+w== +home-assistant-js-websocket@^5.1.1: + version "5.1.1" + resolved "https://registry.yarnpkg.com/home-assistant-js-websocket/-/home-assistant-js-websocket-5.1.1.tgz#562c510b9784b34878fd974e36d28618f4fa301a" + integrity sha512-Zh8eFezcVYXxvZYneWecIlgSO1ulFqVKggWyZ9UcIkX0NK8uXxEqkIbggl+Zb1XXQ3fM7rNVANNBilBb5Rlepw== homedir-polyfill@^1.0.1: version "1.0.3"