${serviceData?.description}
${this._manifest ? html` { - const placeholders = flow.context.title_placeholders || {}; - const placeholderKeys = Object.keys(placeholders); - if (placeholderKeys.length === 0) { + if ( + !flow.context.title_placeholders || + Object.keys(flow.context.title_placeholders).length === 0 + ) { return domainToName(localize, flow.handler); } - const args: string[] = []; - placeholderKeys.forEach((key) => { - args.push(key); - args.push(placeholders[key]); - }); - return localize(`component.${flow.handler}.config.flow_title`, ...args) || - "name" in placeholders - ? placeholders.name - : domainToName(localize, flow.handler); + return ( + localize( + `component.${flow.handler}.config.flow_title`, + flow.context.title_placeholders + ) || + ("name" in flow.context.title_placeholders + ? flow.context.title_placeholders.name + : domainToName(localize, flow.handler)) + ); }; diff --git a/src/dialogs/quick-bar/ha-quick-bar.ts b/src/dialogs/quick-bar/ha-quick-bar.ts index d95f5743c1..161a32403c 100644 --- a/src/dialogs/quick-bar/ha-quick-bar.ts +++ b/src/dialogs/quick-bar/ha-quick-bar.ts @@ -108,7 +108,9 @@ export class QuickBar extends LitElement { public async showDialog(params: QuickBarParams) { this._commandMode = params.commandMode || this._toggleIfAlreadyOpened(); this._hint = params.hint; - this._narrow = matchMedia("(max-width: 600px)").matches; + this._narrow = matchMedia( + "all and (max-width: 450px), all and (max-height: 500px)" + ).matches; this._initializeItemsIfNeeded(); this._opened = true; } @@ -154,7 +156,7 @@ export class QuickBar extends LitElement { )} .value=${this._commandMode ? `>${this._search}` : this._search} .icon=${true} - .iconTrailing=${this._search !== undefined} + .iconTrailing=${this._search !== undefined || this._narrow} @input=${this._handleSearchChange} @keydown=${this._handleInputKeyDown} @focus=${this._setFocusFirstListItem} @@ -174,24 +176,26 @@ export class QuickBar extends LitElement { .path=${mdiMagnify} > `} - ${this._search && - html` -