jeans/frontend
jeans/frontend
1
0
Fork 0
mirror of https://github.com/home-assistant/frontend.git synced 2025-07-25 18:26:35 +00:00
Code Issues Packages Projects Releases Wiki Activity

Allow custom localize function for datatable (#21270)

Browse Source
This commit is contained in:
Bram Kragten 2024-07-04 11:46:10 +02:00 committed by GitHub
parent 8b9fa9bc39
commit df7b5b08cf
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
2 changed files with 13 additions and 6 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/data-table/ha-data-table.ts
View File

@ -34,6 +34,7 @@ import type { HaCheckbox } from "../ha-checkbox";
import "../ha-svg-icon"; import "../ha-svg-icon";
import "../search-input"; import "../search-input";
import { filterData, sortData } from "./sort-filter"; import { filterData, sortData } from "./sort-filter";
import { LocalizeFunc } from "../../common/translations/localize";
export interface RowClickedEvent { export interface RowClickedEvent {
id: string; id: string;
@ -110,6 +111,8 @@ const UNDEFINED_GROUP_KEY = "zzzzz_undefined";
export class HaDataTable extends LitElement { export class HaDataTable extends LitElement {
@property({ attribute: false }) public hass!: HomeAssistant; @property({ attribute: false }) public hass!: HomeAssistant;
@property({ attribute: false }) public localizeFunc?: LocalizeFunc;
@property({ type: Boolean }) public narrow = false; @property({ type: Boolean }) public narrow = false;
@property({ type: Object }) public columns: DataTableColumnContainer = {}; @property({ type: Object }) public columns: DataTableColumnContainer = {};
@ -317,6 +320,8 @@ export class HaDataTable extends LitElement {
); );
protected render() { protected render() {
const localize = this.localizeFunc || this.hass.localize;
const columns = this._sortedColumns(this.columns, this.columnOrder); const columns = this._sortedColumns(this.columns, this.columnOrder);
const renderRow = (row: DataTableRowData, index: number) => const renderRow = (row: DataTableRowData, index: number) =>
@ -436,7 +441,7 @@ export class HaDataTable extends LitElement {
<div class="mdc-data-table__row" role="row"> <div class="mdc-data-table__row" role="row">
<div class="mdc-data-table__cell grows center" role="cell"> <div class="mdc-data-table__cell grows center" role="cell">
${this.noDataText || ${this.noDataText ||
this.hass.localize("ui.components.data-table.no-data")} localize("ui.components.data-table.no-data")}
</div> </div>
</div> </div>
</div> </div>
@ -619,6 +624,8 @@ export class HaDataTable extends LitElement {
return; return;
} }
const localize = this.localizeFunc || this.hass.localize;
if (this.appendRow || this.hasFab || this.groupColumn) { if (this.appendRow || this.hasFab || this.groupColumn) {
let items = [...data]; let items = [...data];
@ -672,7 +679,7 @@ export class HaDataTable extends LitElement {
> >
</ha-icon-button> </ha-icon-button>
${groupName === UNDEFINED_GROUP_KEY ${groupName === UNDEFINED_GROUP_KEY
? this.hass.localize("ui.components.data-table.ungrouped") ? localize("ui.components.data-table.ungrouped")
: groupName || ""} : groupName || ""}
</div>`, </div>`,
}); });

8
src/layouts/hass-tabs-subpage-data-table.ts
View File

@ -430,6 +430,7 @@ export class HaTabsSubpageDataTable extends LitElement {
: ""} : ""}
<ha-data-table <ha-data-table
.hass=${this.hass} .hass=${this.hass}
.localize=${localize}
.narrow=${this.narrow} .narrow=${this.narrow}
.columns=${this.columns} .columns=${this.columns}
.data=${this.data} .data=${this.data}
@ -575,10 +576,9 @@ export class HaTabsSubpageDataTable extends LitElement {
</div> </div>
<div slot="primaryAction"> <div slot="primaryAction">
<ha-button @click=${this._toggleFilters}> <ha-button @click=${this._toggleFilters}>
${this.hass.localize( ${localize("ui.components.subpage-data-table.show_results", {
"ui.components.subpage-data-table.show_results", number: this.data.length,
{ number: this.data.length } })}
)}
</ha-button> </ha-button>
</div> </div>
</ha-dialog>` </ha-dialog>`