Enable sorting step flow menu options in user language (#26845)
* Enable sorting step flow menu options in user language * Remove menu_sort_values * Update src/dialogs/config-flow/step-flow-menu.ts Co-authored-by: Petar Petrov <MindFreeze@users.noreply.github.com> * prettier --------- Co-authored-by: Petar Petrov <MindFreeze@users.noreply.github.com>pull/26856/head
parent
f3f4bcfe45
commit
26b3212c7e
|
@ -97,6 +97,7 @@ export interface DataEntryFlowStepMenu {
|
|||
step_id: string;
|
||||
/** If array, use value to lookup translations in strings.json */
|
||||
menu_options: string[] | Record<string, string>;
|
||||
sort?: boolean;
|
||||
description_placeholders?: Record<string, string>;
|
||||
translation_domain?: string;
|
||||
}
|
||||
|
|
|
@ -1,4 +1,4 @@
|
|||
import type { TemplateResult } from "lit";
|
||||
import type { PropertyValues, TemplateResult } from "lit";
|
||||
import { css, html, LitElement, nothing } from "lit";
|
||||
import { customElement, property } from "lit/decorators";
|
||||
import { fireEvent } from "../../common/dom/fire_event";
|
||||
|
@ -8,6 +8,7 @@ import type { DataEntryFlowStepMenu } from "../../data/data_entry_flow";
|
|||
import type { HomeAssistant } from "../../types";
|
||||
import type { FlowConfig } from "./show-dialog-data-entry-flow";
|
||||
import { configFlowContentStyles } from "./styles";
|
||||
import { stringCompare } from "../../common/string/compare";
|
||||
|
||||
@customElement("step-flow-menu")
|
||||
class StepFlowMenu extends LitElement {
|
||||
|
@ -17,6 +18,14 @@ class StepFlowMenu extends LitElement {
|
|||
|
||||
@property({ attribute: false }) public step!: DataEntryFlowStepMenu;
|
||||
|
||||
protected shouldUpdate(changedProps: PropertyValues): boolean {
|
||||
return (
|
||||
changedProps.size > 1 ||
|
||||
!changedProps.has("hass") ||
|
||||
this.hass.localize !== changedProps.get("hass")?.localize
|
||||
);
|
||||
}
|
||||
|
||||
protected render(): TemplateResult {
|
||||
let options: string[];
|
||||
let translations: Record<string, string>;
|
||||
|
@ -53,6 +62,16 @@ class StepFlowMenu extends LitElement {
|
|||
);
|
||||
}
|
||||
|
||||
if (this.step.sort) {
|
||||
options = options.sort((a, b) =>
|
||||
stringCompare(
|
||||
translations[a]!,
|
||||
translations[b]!,
|
||||
this.hass.locale.language
|
||||
)
|
||||
);
|
||||
}
|
||||
|
||||
const description = this.flowConfig.renderMenuDescription(
|
||||
this.hass,
|
||||
this.step
|
||||
|
|
Loading…
Reference in New Issue