-
Notifications
You must be signed in to change notification settings - Fork 2.9k
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
* Add iframe strategy with editor * Unify sandbox parameters * Update translations * Remove title from editor * Add editor when creating iframe strategy * Update src/translations/en.json
- Loading branch information
Showing
13 changed files
with
320 additions
and
6 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
101 changes: 101 additions & 0 deletions
101
src/panels/config/lovelace/dashboards/dialog-lovelace-dashboard-configure-strategy.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,101 @@ | ||
| import { css, CSSResultGroup, html, LitElement, nothing } from "lit"; | ||
| import { customElement, property, state } from "lit/decorators"; | ||
| import { fireEvent } from "../../../../common/dom/fire_event"; | ||
| import "../../../../components/ha-button"; | ||
| import { createCloseHeading } from "../../../../components/ha-dialog"; | ||
| import "../../../../components/ha-form/ha-form"; | ||
| import { LovelaceStrategyConfig } from "../../../../data/lovelace/config/strategy"; | ||
| import { haStyleDialog } from "../../../../resources/styles"; | ||
| import { HomeAssistant } from "../../../../types"; | ||
| import "../../../lovelace/editor/dashboard-strategy-editor/hui-dashboard-strategy-element-editor"; | ||
| import { LovelaceDashboardConfigureStrategyDialogParams } from "./show-dialog-lovelace-dashboard-configure-strategy"; | ||
|
|
||
| @customElement("dialog-lovelace-dashboard-configure-strategy") | ||
| export class DialogLovelaceDashboardDetail extends LitElement { | ||
| @property({ attribute: false }) public hass!: HomeAssistant; | ||
|
|
||
| @state() private _params?: LovelaceDashboardConfigureStrategyDialogParams; | ||
|
|
||
| @state() private _submitting = false; | ||
|
|
||
| @state() private _data?: LovelaceStrategyConfig; | ||
|
|
||
| public showDialog( | ||
| params: LovelaceDashboardConfigureStrategyDialogParams | ||
| ): void { | ||
| this._params = params; | ||
| this._data = params.config.strategy; | ||
| } | ||
|
|
||
| public closeDialog(): void { | ||
| this._params = undefined; | ||
| this._data = undefined; | ||
| fireEvent(this, "dialog-closed", { dialog: this.localName }); | ||
| } | ||
|
|
||
| protected render() { | ||
| if (!this._params || !this._data) { | ||
| return nothing; | ||
| } | ||
|
|
||
| return html` | ||
| <ha-dialog | ||
| open | ||
| @closed=${this.closeDialog} | ||
| scrimClickAction | ||
| escapeKeyAction | ||
| .heading=${createCloseHeading( | ||
| this.hass, | ||
| this.hass.localize( | ||
| "ui.panel.config.lovelace.dashboards.detail.new_dashboard" | ||
| ) | ||
| )} | ||
| > | ||
| <div> | ||
| <hui-dashboard-strategy-element-editor | ||
| .hass=${this.hass} | ||
| .lovelace=${this._params.config} | ||
| .value=${this._data} | ||
| @config-changed=${this._handleConfigChanged} | ||
| dialogInitialFocus | ||
| ></hui-dashboard-strategy-element-editor> | ||
| </div> | ||
| <ha-button | ||
| slot="primaryAction" | ||
| @click=${this._save} | ||
| .disabled=${this._submitting} | ||
| > | ||
| ${this.hass.localize("ui.common.next")} | ||
| </ha-button> | ||
| </ha-dialog> | ||
| `; | ||
| } | ||
|
|
||
| private _handleConfigChanged(ev: CustomEvent): void { | ||
| this._data = ev.detail.config; | ||
| } | ||
|
|
||
| private async _save() { | ||
| if (!this._data) { | ||
| return; | ||
| } | ||
| this._submitting = true; | ||
| await this._params!.saveConfig({ | ||
| ...this._params!.config, | ||
| strategy: this._data, | ||
| }); | ||
| this._submitting = false; | ||
| this.closeDialog(); | ||
| } | ||
|
|
||
| static get styles(): CSSResultGroup { | ||
| return [haStyleDialog, css``]; | ||
| } | ||
| } | ||
|
|
||
| declare global { | ||
| interface HTMLElementTagNameMap { | ||
| "dialog-lovelace-dashboard-configure-strategy": DialogLovelaceDashboardDetail; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
21 changes: 21 additions & 0 deletions
21
src/panels/config/lovelace/dashboards/show-dialog-lovelace-dashboard-configure-strategy.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,21 @@ | ||
| import { fireEvent } from "../../../../common/dom/fire_event"; | ||
| import { LovelaceDashboardStrategyConfig } from "../../../../data/lovelace/config/types"; | ||
|
|
||
| export interface LovelaceDashboardConfigureStrategyDialogParams { | ||
| config: LovelaceDashboardStrategyConfig; | ||
| saveConfig: (values: LovelaceDashboardStrategyConfig) => Promise<unknown>; | ||
| } | ||
|
|
||
| export const loadDashboardConfigureStrategyDialog = () => | ||
| import("./dialog-lovelace-dashboard-configure-strategy"); | ||
|
|
||
| export const showDashboardConfigureStrategyDialog = ( | ||
| element: HTMLElement, | ||
| dialogParams: LovelaceDashboardConfigureStrategyDialogParams | ||
| ) => { | ||
| fireEvent(element, "show-dialog", { | ||
| dialogTag: "dialog-lovelace-dashboard-configure-strategy", | ||
| dialogImport: loadDashboardConfigureStrategyDialog, | ||
| dialogParams, | ||
| }); | ||
| }; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
75 changes: 75 additions & 0 deletions
75
src/panels/lovelace/editor/dashboard-strategy-editor/hui-iframe-dashboard-strategy-editor.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,75 @@ | ||
| import { html, LitElement, nothing } from "lit"; | ||
| import { customElement, property, state } from "lit/decorators"; | ||
| import { fireEvent } from "../../../../common/dom/fire_event"; | ||
| import "../../../../components/ha-form/ha-form"; | ||
| import type { | ||
| HaFormSchema, | ||
| SchemaUnion, | ||
| } from "../../../../components/ha-form/types"; | ||
| import type { HomeAssistant } from "../../../../types"; | ||
| import { IframeDashboardStrategyConfig } from "../../strategies/iframe/iframe-dashboard-strategy"; | ||
| import { LovelaceStrategyEditor } from "../../strategies/types"; | ||
|
|
||
| const SCHEMA = [ | ||
| { | ||
| name: "url", | ||
| selector: { | ||
| text: { | ||
| type: "url", | ||
| }, | ||
| }, | ||
| }, | ||
| ] as const satisfies readonly HaFormSchema[]; | ||
|
|
||
| @customElement("hui-iframe-dashboard-strategy-editor") | ||
| export class HuiIframeDashboarStrategyEditor | ||
| extends LitElement | ||
| implements LovelaceStrategyEditor | ||
| { | ||
| @property({ attribute: false }) public hass?: HomeAssistant; | ||
|
|
||
| @state() | ||
| private _config?: IframeDashboardStrategyConfig; | ||
|
|
||
| public setConfig(config: IframeDashboardStrategyConfig): void { | ||
| this._config = config; | ||
| } | ||
|
|
||
| protected render() { | ||
| if (!this.hass || !this._config) { | ||
| return nothing; | ||
| } | ||
|
|
||
| return html` | ||
| <ha-form | ||
| .hass=${this.hass} | ||
| .data=${this._config} | ||
| .schema=${SCHEMA} | ||
| .computeLabel=${this._computeLabelCallback} | ||
| @value-changed=${this._valueChanged} | ||
| ></ha-form> | ||
| `; | ||
| } | ||
|
|
||
| private _valueChanged(ev: CustomEvent): void { | ||
| const data = ev.detail.value; | ||
| fireEvent(this, "config-changed", { config: data }); | ||
| } | ||
|
|
||
| private _computeLabelCallback = (schema: SchemaUnion<typeof SCHEMA>) => { | ||
| switch (schema.name) { | ||
| case "url": | ||
| return this.hass?.localize( | ||
| `ui.panel.lovelace.editor.strategy.iframe.${schema.name}` | ||
| ); | ||
| default: | ||
| return ""; | ||
| } | ||
| }; | ||
| } | ||
|
|
||
| declare global { | ||
| interface HTMLElementTagNameMap { | ||
| "hui-iframe-dashboard-strategy-editor": HuiIframeDashboarStrategyEditor; | ||
| } | ||
| } |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
38 changes: 38 additions & 0 deletions
38
src/panels/lovelace/strategies/iframe/iframe-dashboard-strategy.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change |
|---|---|---|
| @@ -0,0 +1,38 @@ | ||
| import { ReactiveElement } from "lit"; | ||
| import { customElement } from "lit/decorators"; | ||
| import { LovelaceConfig } from "../../../../data/lovelace/config/types"; | ||
| import { LovelaceStrategyEditor } from "../types"; | ||
| import { IframeViewStrategyConfig } from "./iframe-view-strategy"; | ||
|
|
||
| export type IframeDashboardStrategyConfig = IframeViewStrategyConfig; | ||
|
|
||
| @customElement("iframe-dashboard-strategy") | ||
| export class IframeDashboardStrategy extends ReactiveElement { | ||
| static async generate( | ||
| config: IframeDashboardStrategyConfig | ||
| ): Promise<LovelaceConfig> { | ||
| return { | ||
| title: config.title, | ||
| views: [ | ||
| { | ||
| strategy: config, | ||
| }, | ||
| ], | ||
| }; | ||
| } | ||
|
|
||
| public static async getConfigElement(): Promise<LovelaceStrategyEditor> { | ||
| await import( | ||
| "../../editor/dashboard-strategy-editor/hui-iframe-dashboard-strategy-editor" | ||
| ); | ||
| return document.createElement("hui-iframe-dashboard-strategy-editor"); | ||
| } | ||
|
|
||
| static configRequired = true; | ||
| } | ||
|
|
||
| declare global { | ||
| interface HTMLElementTagNameMap { | ||
| "iframe-dashboard-strategy": IframeDashboardStrategy; | ||
| } | ||
| } |
Oops, something went wrong.