From e767b807b0979a5b4fa94b081ee7052b7ae9fe1c Mon Sep 17 00:00:00 2001 From: Paul Bottein Date: Tue, 3 Oct 2023 10:34:14 +0200 Subject: [PATCH] Rename responsive to screen --- .../lovelace/common/validate-condition.ts | 20 ++++++------ .../components/hui-conditional-base.ts | 6 ++-- ...ponsive.ts => ha-card-condition-screen.ts} | 32 +++++++++---------- .../hui-conditional-card-editor.ts | 6 ++-- src/translations/en.json | 4 +-- 5 files changed, 34 insertions(+), 34 deletions(-) rename src/panels/lovelace/editor/conditions/types/{ha-card-condition-responsive.ts => ha-card-condition-screen.ts} (84%) diff --git a/src/panels/lovelace/common/validate-condition.ts b/src/panels/lovelace/common/validate-condition.ts index 57d4317662..c689505090 100644 --- a/src/panels/lovelace/common/validate-condition.ts +++ b/src/panels/lovelace/common/validate-condition.ts @@ -1,7 +1,7 @@ import { UNAVAILABLE } from "../../../data/entity"; import { HomeAssistant } from "../../../types"; -export type Condition = StateCondition | ResponsiveCondition; +export type Condition = StateCondition | ScreenCondition; export type LegacyCondition = { entity?: string; @@ -16,8 +16,8 @@ export type StateCondition = { state_not?: string; }; -export type ResponsiveCondition = { - condition: "responsive"; +export type ScreenCondition = { + condition: "screen"; media_query?: string; }; @@ -32,8 +32,8 @@ function checkStateCondition(condition: StateCondition, hass: HomeAssistant) { : state !== condition.state_not; } -function checkResponsiveCondition( - condition: ResponsiveCondition, +function checkScreenCondition( + condition: ScreenCondition, _hass: HomeAssistant ) { return condition.media_query @@ -46,8 +46,8 @@ export function checkConditionsMet( hass: HomeAssistant ): boolean { return conditions.every((c) => { - if (c.condition === "responsive") { - return checkResponsiveCondition(c, hass); + if (c.condition === "screen") { + return checkScreenCondition(c, hass); } return checkStateCondition(c, hass); @@ -61,14 +61,14 @@ function valideStateCondition(condition: StateCondition) { ); } -function valideResponsiveCondition(condition: ResponsiveCondition) { +function validateScreenCondition(condition: ScreenCondition) { return condition.media_query != null; } export function validateConditionalConfig(conditions: Condition[]): boolean { return conditions.every((c) => { - if (c.condition === "responsive") { - return valideResponsiveCondition(c); + if (c.condition === "screen") { + return validateScreenCondition(c); } return valideStateCondition(c); }); diff --git a/src/panels/lovelace/components/hui-conditional-base.ts b/src/panels/lovelace/components/hui-conditional-base.ts index 3c489e37af..eaec714cd3 100644 --- a/src/panels/lovelace/components/hui-conditional-base.ts +++ b/src/panels/lovelace/components/hui-conditional-base.ts @@ -3,7 +3,7 @@ import { customElement, property } from "lit/decorators"; import { HomeAssistant } from "../../../types"; import { ConditionalCardConfig } from "../cards/types"; import { - ResponsiveCondition, + ScreenCondition, checkConditionsMet, validateConditionalConfig, } from "../common/validate-condition"; @@ -78,8 +78,8 @@ export class HuiConditionalBase extends ReactiveElement { } const conditions = this._config.conditions.filter( - (c) => c.condition === "responsive" - ) as ResponsiveCondition[]; + (c) => c.condition === "screen" + ) as ScreenCondition[]; const mediaQueries = conditions .filter((c) => c.media_query) diff --git a/src/panels/lovelace/editor/conditions/types/ha-card-condition-responsive.ts b/src/panels/lovelace/editor/conditions/types/ha-card-condition-screen.ts similarity index 84% rename from src/panels/lovelace/editor/conditions/types/ha-card-condition-responsive.ts rename to src/panels/lovelace/editor/conditions/types/ha-card-condition-screen.ts index 23caf07219..90d9ff583a 100644 --- a/src/panels/lovelace/editor/conditions/types/ha-card-condition-responsive.ts +++ b/src/panels/lovelace/editor/conditions/types/ha-card-condition-screen.ts @@ -8,7 +8,7 @@ import "../../../../../components/ha-form/ha-form"; import type { SchemaUnion } from "../../../../../components/ha-form/types"; import { HaFormSchema } from "../../../../../components/ha-form/types"; import type { HomeAssistant } from "../../../../../types"; -import { ResponsiveCondition } from "../../../common/validate-condition"; +import { ScreenCondition } from "../../../common/validate-condition"; const BREAKPOINT_VALUES = [0, 768, 1024, 1280, Infinity]; const BREAKPOINTS = ["mobile", "tablet", "desktop", "wide"] as const; @@ -87,23 +87,23 @@ const mediaQueryMap = new Map( ); const mediaQueryReverseMap = new Map(queries.map(([b, m]) => [m, b])); -type ResponsiveConditionData = { +type ScreenConditionData = { breakpoints: Breakpoint[]; }; -@customElement("ha-card-condition-responsive") -export class HaCardConditionResponsive extends LitElement { +@customElement("ha-card-condition-screen") +export class HaCardConditionScreen extends LitElement { @property({ attribute: false }) public hass!: HomeAssistant; - @property({ attribute: false }) public condition!: ResponsiveCondition; + @property({ attribute: false }) public condition!: ScreenCondition; @property({ type: Boolean }) public disabled = false; - public static get defaultConfig(): ResponsiveCondition { - return { condition: "responsive", media_query: "" }; + public static get defaultConfig(): ScreenCondition { + return { condition: "screen", media_query: "" }; } - protected static validateUIConfig(condition: ResponsiveCondition) { + protected static validateUIConfig(condition: ScreenCondition) { return ( !condition.media_query || mediaQueryReverseMap.get(condition.media_query) ); @@ -122,11 +122,11 @@ export class HaCardConditionResponsive extends LitElement { return { value: b, label: `${localize( - `ui.panel.lovelace.editor.card.conditional.condition.responsive.breakpoints_list.${b}` + `ui.panel.lovelace.editor.card.conditional.condition.screen.breakpoints_list.${b}` )}${ value ? ` (${localize( - `ui.panel.lovelace.editor.card.conditional.condition.responsive.min`, + `ui.panel.lovelace.editor.card.conditional.condition.screen.min`, { size: value } )})` : "" @@ -145,7 +145,7 @@ export class HaCardConditionResponsive extends LitElement { ? mediaQueryReverseMap.get(this.condition.media_query) : undefined; - const data: ResponsiveConditionData = { + const data: ScreenConditionData = { breakpoints: breakpoints ?? [], }; @@ -163,12 +163,12 @@ export class HaCardConditionResponsive extends LitElement { private _valueChanged(ev: CustomEvent): void { ev.stopPropagation(); - const data = ev.detail.value as ResponsiveConditionData; + const data = ev.detail.value as ScreenConditionData; const { breakpoints } = data; - const condition: ResponsiveCondition = { - condition: "responsive", + const condition: ScreenCondition = { + condition: "screen", media_query: mediaQueryMap.get(computeBreakpointsKey(breakpoints)) ?? "", }; @@ -181,7 +181,7 @@ export class HaCardConditionResponsive extends LitElement { switch (schema.name) { case "breakpoints": return this.hass.localize( - `ui.panel.lovelace.editor.card.conditional.condition.responsive.${schema.name}` + `ui.panel.lovelace.editor.card.conditional.condition.screen.${schema.name}` ); default: return ""; @@ -191,6 +191,6 @@ export class HaCardConditionResponsive extends LitElement { declare global { interface HTMLElementTagNameMap { - "ha-card-condition-responsive": HaCardConditionResponsive; + "ha-card-condition-screen": HaCardConditionScreen; } } diff --git a/src/panels/lovelace/editor/config-elements/hui-conditional-card-editor.ts b/src/panels/lovelace/editor/config-elements/hui-conditional-card-editor.ts index bb0cea378a..b122367be7 100644 --- a/src/panels/lovelace/editor/config-elements/hui-conditional-card-editor.ts +++ b/src/panels/lovelace/editor/config-elements/hui-conditional-card-editor.ts @@ -34,7 +34,7 @@ import type { HuiCardElementEditor } from "../card-editor/hui-card-element-edito import "../card-editor/hui-card-picker"; import "../conditions/ha-card-condition-editor"; import { LovelaceConditionEditorConstructor } from "../conditions/types"; -import "../conditions/types/ha-card-condition-responsive"; +import "../conditions/types/ha-card-condition-screen"; import "../conditions/types/ha-card-condition-state"; import "../hui-element-editor"; import type { ConfigChangedEvent } from "../hui-element-editor"; @@ -44,7 +44,7 @@ import { configElementStyle } from "./config-elements-style"; const UI_CONDITION = [ "state", - "responsive", + "screen", ] as const satisfies readonly Condition["condition"][]; type UiCondition = (typeof UI_CONDITION)[number]; @@ -59,7 +59,7 @@ const cardConfigStruct = assign( const ICONS: Record = { state: mdiStateMachine, - responsive: mdiResponsive, + screen: mdiResponsive, }; @customElement("hui-conditional-card-editor") export class HuiConditionalCardEditor diff --git a/src/translations/en.json b/src/translations/en.json index b8bfd3f096..29b3075de8 100644 --- a/src/translations/en.json +++ b/src/translations/en.json @@ -4771,8 +4771,8 @@ "change_type": "Change type", "add_condition": "Add condition", "condition": { - "responsive": { - "label": "Responsive", + "screen": { + "label": "Screen", "breakpoints": "Screen sizes", "breakpoints_list": { "mobile": "Mobile",