diff --git a/demo/src/ha-demo.ts b/demo/src/ha-demo.ts index c1b059ebb5..8d2fe2b0e4 100644 --- a/demo/src/ha-demo.ts +++ b/demo/src/ha-demo.ts @@ -82,6 +82,8 @@ export class HaDemo extends HomeAssistantAppEl { has_entity_name: false, unique_id: "co2_intensity", options: null, + created_at: 0, + modified_at: 0, }, { config_entry_id: "co2signal", @@ -100,6 +102,8 @@ export class HaDemo extends HomeAssistantAppEl { has_entity_name: false, unique_id: "grid_fossil_fuel_percentage", options: null, + created_at: 0, + modified_at: 0, }, ]); diff --git a/gallery/src/pages/components/ha-form.ts b/gallery/src/pages/components/ha-form.ts index 722bfefe8e..ccc287fd85 100644 --- a/gallery/src/pages/components/ha-form.ts +++ b/gallery/src/pages/components/ha-form.ts @@ -15,6 +15,7 @@ import { getEntity } from "../../../../src/fake_data/entity"; import { provideHass } from "../../../../src/fake_data/provide_hass"; import { HomeAssistant } from "../../../../src/types"; import "../../components/demo-black-white-row"; +import { DeviceRegistryEntry } from "../../../../src/data/device_registry"; const ENTITIES = [ getEntity("alarm_control_panel", "alarm", "disarmed", { @@ -41,7 +42,7 @@ const ENTITIES = [ }), ]; -const DEVICES = [ +const DEVICES: DeviceRegistryEntry[] = [ { area_id: "bedroom", configuration_url: null, @@ -61,6 +62,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "backyard", @@ -81,6 +84,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, { area_id: null, @@ -101,6 +106,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, ]; @@ -113,6 +120,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "bedroom", @@ -122,6 +131,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "livingroom", @@ -131,6 +142,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, ]; diff --git a/gallery/src/pages/components/ha-selector.ts b/gallery/src/pages/components/ha-selector.ts index 8657bc4e7b..cb3a1f2f49 100644 --- a/gallery/src/pages/components/ha-selector.ts +++ b/gallery/src/pages/components/ha-selector.ts @@ -21,6 +21,7 @@ import { FloorRegistryEntry } from "../../../../src/data/floor_registry"; import { LabelRegistryEntry } from "../../../../src/data/label_registry"; import { mockFloorRegistry } from "../../../../demo/src/stubs/floor_registry"; import { mockLabelRegistry } from "../../../../demo/src/stubs/label_registry"; +import { DeviceRegistryEntry } from "../../../../src/data/device_registry"; const ENTITIES = [ getEntity("alarm_control_panel", "alarm", "disarmed", { @@ -41,7 +42,7 @@ const ENTITIES = [ }), ]; -const DEVICES = [ +const DEVICES: DeviceRegistryEntry[] = [ { area_id: "bedroom", configuration_url: null, @@ -61,6 +62,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "backyard", @@ -81,6 +84,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, { area_id: null, @@ -101,6 +106,8 @@ const DEVICES = [ via_device_id: null, serial_number: null, labels: [], + created_at: 0, + modified_at: 0, }, ]; @@ -113,6 +120,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "bedroom", @@ -122,6 +131,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, { area_id: "livingroom", @@ -131,6 +142,8 @@ const AREAS: AreaRegistryEntry[] = [ picture: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, ]; @@ -141,6 +154,8 @@ const FLOORS: FloorRegistryEntry[] = [ level: 0, icon: null, aliases: [], + created_at: 0, + modified_at: 0, }, { floor_id: "first", @@ -148,6 +163,8 @@ const FLOORS: FloorRegistryEntry[] = [ level: 1, icon: "mdi:numeric-1", aliases: [], + created_at: 0, + modified_at: 0, }, { floor_id: "second", @@ -155,6 +172,8 @@ const FLOORS: FloorRegistryEntry[] = [ level: 2, icon: "mdi:numeric-2", aliases: [], + created_at: 0, + modified_at: 0, }, ]; @@ -165,6 +184,8 @@ const LABELS: LabelRegistryEntry[] = [ icon: null, color: "yellow", description: null, + created_at: 0, + modified_at: 0, }, { label_id: "entertainment", @@ -172,6 +193,8 @@ const LABELS: LabelRegistryEntry[] = [ icon: "mdi:popcorn", color: "blue", description: null, + created_at: 0, + modified_at: 0, }, ]; diff --git a/gallery/src/pages/misc/entity-state.ts b/gallery/src/pages/misc/entity-state.ts index 8d38fe9413..68375c60d8 100644 --- a/gallery/src/pages/misc/entity-state.ts +++ b/gallery/src/pages/misc/entity-state.ts @@ -358,13 +358,11 @@ export class DemoEntityState extends LitElement { }, entity_id: { title: "Entity ID", - width: "30%", filterable: true, sortable: true, }, state: { title: "State", - width: "20%", sortable: true, template: (entry) => html`${computeStateDisplay( @@ -379,14 +377,12 @@ export class DemoEntityState extends LitElement { device_class: { title: "Device class", template: (entry) => html`${entry.device_class ?? "-"}`, - width: "20%", filterable: true, sortable: true, }, domain: { title: "Domain", template: (entry) => html`${computeDomain(entry.entity_id)}`, - width: "20%", filterable: true, sortable: true, }, diff --git a/gallery/src/pages/misc/integration-card.ts b/gallery/src/pages/misc/integration-card.ts index 3144d99aa6..cab686e210 100644 --- a/gallery/src/pages/misc/integration-card.ts +++ b/gallery/src/pages/misc/integration-card.ts @@ -203,6 +203,8 @@ const createEntityRegistryEntries = ( options: null, labels: [], categories: {}, + created_at: 0, + modified_at: 0, }, ]; @@ -228,6 +230,8 @@ const createDeviceRegistryEntries = ( disabled_by: null, configuration_url: null, labels: [], + created_at: 0, + modified_at: 0, }, ]; diff --git a/hassio/src/backups/hassio-backups.ts b/hassio/src/backups/hassio-backups.ts index 64c735d977..095bd922f4 100644 --- a/hassio/src/backups/hassio-backups.ts +++ b/hassio/src/backups/hassio-backups.ts @@ -127,14 +127,13 @@ export class HassioBackups extends LitElement { main: true, sortable: true, filterable: true, - grows: true, + flex: 2, template: (backup) => html`${backup.name || backup.slug}
${backup.secondary}
`, }, size: { title: this.supervisor.localize("backup.size"), - width: "15%", hidden: narrow, filterable: true, sortable: true, @@ -142,7 +141,6 @@ export class HassioBackups extends LitElement { }, location: { title: this.supervisor.localize("backup.location"), - width: "15%", hidden: narrow, filterable: true, sortable: true, @@ -151,7 +149,6 @@ export class HassioBackups extends LitElement { }, date: { title: this.supervisor.localize("backup.created"), - width: "15%", direction: "desc", hidden: narrow, filterable: true, diff --git a/src/components/data-table/ha-data-table.ts b/src/components/data-table/ha-data-table.ts index 9deadd898a..5dcd3c8983 100644 --- a/src/components/data-table/ha-data-table.ts +++ b/src/components/data-table/ha-data-table.ts @@ -85,9 +85,9 @@ export interface DataTableColumnData extends DataTableSortColumnData { | "flex"; template?: (row: T) => TemplateResult | string | typeof nothing; extraTemplate?: (row: T) => TemplateResult | string | typeof nothing; - width?: string; + minWidth?: string; maxWidth?: string; - grows?: boolean; + flex?: number; forceLTR?: boolean; hidden?: boolean; } @@ -216,6 +216,18 @@ export class HaDataTable extends LitElement { this.updateComplete.then(() => this._calcTableHeight()); } + protected updated() { + const header = this.renderRoot.querySelector(".mdc-data-table__header-row"); + if (!header) { + return; + } + if (header.scrollWidth > header.clientWidth) { + this.style.setProperty("--table-row-width", `${header.scrollWidth}px`); + } else { + this.style.removeProperty("--table-row-width"); + } + } + public willUpdate(properties: PropertyValues) { super.willUpdate(properties); @@ -355,7 +367,12 @@ export class HaDataTable extends LitElement { : `calc(100% - ${this._headerHeight}px)`, })} > -
+
${this.selectable ? html` @@ -398,18 +415,16 @@ export class HaDataTable extends LitElement { column.type === "overflow", sortable: Boolean(column.sortable), "not-sorted": Boolean(column.sortable && !sorted), - grows: Boolean(column.grows), }; return html`
${column.template ? column.template(row) @@ -815,6 +828,17 @@ export class HaDataTable extends LitElement { @eventOptions({ passive: true }) private _saveScrollPos(e: Event) { this._savedScrollPos = (e.target as HTMLDivElement).scrollTop; + + this.renderRoot.querySelector(".mdc-data-table__header-row")!.scrollLeft = ( + e.target as HTMLDivElement + ).scrollLeft; + } + + @eventOptions({ passive: true }) + private _scrollContent(e: Event) { + this.renderRoot.querySelector("lit-virtualizer")!.scrollLeft = ( + e.target as HTMLDivElement + ).scrollLeft; } private _collapseGroup = (ev: Event) => { @@ -889,8 +913,8 @@ export class HaDataTable extends LitElement { .mdc-data-table__row { display: flex; - width: 100%; height: var(--data-table-row-height, 52px); + width: var(--table-row-width, 100%); } .mdc-data-table__row ~ .mdc-data-table__row { @@ -914,18 +938,26 @@ export class HaDataTable extends LitElement { .mdc-data-table__header-row { height: 56px; display: flex; - width: 100%; border-bottom: 1px solid var(--divider-color); + overflow: auto; } + /* Hide scrollbar for Chrome, Safari and Opera */ .mdc-data-table__header-row::-webkit-scrollbar { display: none; } + /* Hide scrollbar for IE, Edge and Firefox */ + .mdc-data-table__header-row { + -ms-overflow-style: none; /* IE and Edge */ + scrollbar-width: none; /* Firefox */ + } + .mdc-data-table__cell, .mdc-data-table__header-cell { padding-right: 16px; padding-left: 16px; + min-width: 150px; align-self: center; overflow: hidden; text-overflow: ellipsis; @@ -973,6 +1005,8 @@ export class HaDataTable extends LitElement { letter-spacing: 0.0178571429em; text-decoration: inherit; text-transform: inherit; + flex-grow: 0; + flex-shrink: 0; } .mdc-data-table__cell a { @@ -991,7 +1025,8 @@ export class HaDataTable extends LitElement { .mdc-data-table__header-cell--icon, .mdc-data-table__cell--icon { - width: 54px; + min-width: 64px; + flex: 0 0 64px !important; } .mdc-data-table__cell--icon img { @@ -1031,11 +1066,14 @@ export class HaDataTable extends LitElement { .mdc-data-table__header-cell--overflow-menu, .mdc-data-table__header-cell--icon-button, .mdc-data-table__cell--icon-button { + min-width: 64px; + flex: 0 0 64px !important; padding: 8px; } .mdc-data-table__header-cell--icon-button, .mdc-data-table__cell--icon-button { + min-width: 56px; width: 56px; } diff --git a/src/components/ha-area-picker.ts b/src/components/ha-area-picker.ts index 5fe9b63d5e..9001e71eb2 100644 --- a/src/components/ha-area-picker.ts +++ b/src/components/ha-area-picker.ts @@ -279,6 +279,8 @@ export class HaAreaPicker extends LitElement { icon: null, aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, ]; } @@ -295,6 +297,8 @@ export class HaAreaPicker extends LitElement { icon: "mdi:plus", aliases: [], labels: [], + created_at: 0, + modified_at: 0, }, ]; } @@ -377,6 +381,8 @@ export class HaAreaPicker extends LitElement { picture: null, labels: [], aliases: [], + created_at: 0, + modified_at: 0, }, ] as AreaRegistryEntry[]; } else { @@ -393,6 +399,8 @@ export class HaAreaPicker extends LitElement { picture: null, labels: [], aliases: [], + created_at: 0, + modified_at: 0, }, ] as AreaRegistryEntry[]; } diff --git a/src/components/ha-floor-picker.ts b/src/components/ha-floor-picker.ts index c810292677..d790ec1a46 100644 --- a/src/components/ha-floor-picker.ts +++ b/src/components/ha-floor-picker.ts @@ -295,6 +295,8 @@ export class HaFloorPicker extends SubscribeMixin(LitElement) { icon: null, level: null, aliases: [], + created_at: 0, + modified_at: 0, }, ]; } @@ -309,6 +311,8 @@ export class HaFloorPicker extends SubscribeMixin(LitElement) { icon: "mdi:plus", level: null, aliases: [], + created_at: 0, + modified_at: 0, }, ]; } @@ -391,6 +395,8 @@ export class HaFloorPicker extends SubscribeMixin(LitElement) { icon: null, level: null, aliases: [], + created_at: 0, + modified_at: 0, }, ] as FloorRegistryEntry[]; } else { @@ -405,6 +411,8 @@ export class HaFloorPicker extends SubscribeMixin(LitElement) { icon: "mdi:plus", level: null, aliases: [], + created_at: 0, + modified_at: 0, }, ] as FloorRegistryEntry[]; } diff --git a/src/components/ha-label-picker.ts b/src/components/ha-label-picker.ts index fd0239d176..dba720d94b 100644 --- a/src/components/ha-label-picker.ts +++ b/src/components/ha-label-picker.ts @@ -303,6 +303,8 @@ export class HaLabelPicker extends SubscribeMixin(LitElement) { icon: null, color: null, description: null, + created_at: 0, + modified_at: 0, }, ]; } @@ -317,6 +319,8 @@ export class HaLabelPicker extends SubscribeMixin(LitElement) { icon: "mdi:plus", color: null, description: null, + created_at: 0, + modified_at: 0, }, ]; } diff --git a/src/data/area_registry.ts b/src/data/area_registry.ts index 46e16b50cc..6220d60d62 100644 --- a/src/data/area_registry.ts +++ b/src/data/area_registry.ts @@ -2,10 +2,11 @@ import { stringCompare } from "../common/string/compare"; import { HomeAssistant } from "../types"; import { DeviceRegistryEntry } from "./device_registry"; import { EntityRegistryEntry } from "./entity_registry"; +import { RegistryEntry } from "./registry"; export { subscribeAreaRegistry } from "./ws-area_registry"; -export interface AreaRegistryEntry { +export interface AreaRegistryEntry extends RegistryEntry { area_id: string; floor_id: string | null; name: string; diff --git a/src/data/device_registry.ts b/src/data/device_registry.ts index 7772febaf2..f758f19b8d 100644 --- a/src/data/device_registry.ts +++ b/src/data/device_registry.ts @@ -1,19 +1,20 @@ import { computeStateName } from "../common/entity/compute_state_name"; import { caseInsensitiveStringCompare } from "../common/string/compare"; import type { HomeAssistant } from "../types"; +import { ConfigEntry } from "./config_entries"; import type { EntityRegistryDisplayEntry, EntityRegistryEntry, } from "./entity_registry"; -import { ConfigEntry } from "./config_entries"; import type { EntitySources } from "./entity_sources"; +import { RegistryEntry } from "./registry"; export { fetchDeviceRegistry, subscribeDeviceRegistry, } from "./ws-device_registry"; -export interface DeviceRegistryEntry { +export interface DeviceRegistryEntry extends RegistryEntry { id: string; config_entries: string[]; connections: Array<[string, string]>; diff --git a/src/data/entity_registry.ts b/src/data/entity_registry.ts index 02b72bf477..ae370892f1 100644 --- a/src/data/entity_registry.ts +++ b/src/data/entity_registry.ts @@ -7,6 +7,7 @@ import { debounce } from "../common/util/debounce"; import { HomeAssistant } from "../types"; import { LightColor } from "./light"; import { computeDomain } from "../common/entity/compute_domain"; +import { RegistryEntry } from "./registry"; export { subscribeEntityRegistryDisplay } from "./ws-entity_registry_display"; @@ -43,7 +44,7 @@ export interface EntityRegistryDisplayEntryResponse { entity_categories: Record; } -export interface EntityRegistryEntry { +export interface EntityRegistryEntry extends RegistryEntry { id: string; entity_id: string; name: string | null; diff --git a/src/data/floor_registry.ts b/src/data/floor_registry.ts index c69e31cc51..1a31cbf09b 100644 --- a/src/data/floor_registry.ts +++ b/src/data/floor_registry.ts @@ -4,10 +4,11 @@ import { stringCompare } from "../common/string/compare"; import { debounce } from "../common/util/debounce"; import { HomeAssistant } from "../types"; import { AreaRegistryEntry } from "./area_registry"; +import { RegistryEntry } from "./registry"; export { subscribeAreaRegistry } from "./ws-area_registry"; -export interface FloorRegistryEntry { +export interface FloorRegistryEntry extends RegistryEntry { floor_id: string; name: string; level: number | null; diff --git a/src/data/label_registry.ts b/src/data/label_registry.ts index cc6b318354..8c8f481e57 100644 --- a/src/data/label_registry.ts +++ b/src/data/label_registry.ts @@ -1,10 +1,11 @@ import { Connection, createCollection } from "home-assistant-js-websocket"; import { Store } from "home-assistant-js-websocket/dist/store"; import { stringCompare } from "../common/string/compare"; -import { HomeAssistant } from "../types"; import { debounce } from "../common/util/debounce"; +import { HomeAssistant } from "../types"; +import { RegistryEntry } from "./registry"; -export interface LabelRegistryEntry { +export interface LabelRegistryEntry extends RegistryEntry { label_id: string; name: string; icon: string | null; diff --git a/src/data/registry.ts b/src/data/registry.ts new file mode 100644 index 0000000000..985d66a0ec --- /dev/null +++ b/src/data/registry.ts @@ -0,0 +1,4 @@ +export interface RegistryEntry { + created_at: number; + modified_at: number; +} diff --git a/src/panels/config/application_credentials/ha-config-application-credentials.ts b/src/panels/config/application_credentials/ha-config-application-credentials.ts index d31c8b274d..f18966c6f8 100644 --- a/src/panels/config/application_credentials/ha-config-application-credentials.ts +++ b/src/panels/config/application_credentials/ha-config-application-credentials.ts @@ -87,14 +87,13 @@ export class HaConfigApplicationCredentials extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, client_id: { title: localize( "ui.panel.config.application_credentials.picker.headers.client_id" ), filterable: true, - width: "30%", }, localizedDomain: { title: localize( @@ -102,12 +101,10 @@ export class HaConfigApplicationCredentials extends LitElement { ), sortable: true, filterable: true, - width: "30%", direction: "asc", }, actions: { title: "", - width: "64px", type: "overflow-menu", showNarrow: true, hideable: false, diff --git a/src/panels/config/automation/ha-automation-picker.ts b/src/panels/config/automation/ha-automation-picker.ts index 7bef54309e..a5523eb3f4 100644 --- a/src/panels/config/automation/ha-automation-picker.ts +++ b/src/panels/config/automation/ha-automation-picker.ts @@ -288,7 +288,7 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, extraTemplate: (automation) => automation.labels.length ? html` { if (!automation.last_triggered) { @@ -337,7 +336,8 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) { }, }, formatted_state: { - width: "82px", + minWidth: "82px", + maxWidth: "82px", sortable: true, groupable: true, hidden: narrow, @@ -353,7 +353,6 @@ class HaAutomationPicker extends SubscribeMixin(LitElement) { }, actions: { title: "", - width: "64px", type: "icon-button", showNarrow: true, moveable: false, diff --git a/src/panels/config/backup/ha-config-backup.ts b/src/panels/config/backup/ha-config-backup.ts index bc4bf616cf..eb3ffdec56 100644 --- a/src/panels/config/backup/ha-config-backup.ts +++ b/src/panels/config/backup/ha-config-backup.ts @@ -59,7 +59,7 @@ class HaConfigBackup extends LitElement { main: true, sortable: true, filterable: true, - grows: true, + flex: 2, template: narrow ? undefined : (backup) => @@ -72,14 +72,12 @@ class HaConfigBackup extends LitElement { }, size: { title: localize("ui.panel.config.backup.size"), - width: "15%", filterable: true, sortable: true, template: (backup) => Math.ceil(backup.size * 10) / 10 + " MB", }, date: { title: localize("ui.panel.config.backup.created"), - width: "15%", direction: "desc", filterable: true, sortable: true, @@ -89,7 +87,6 @@ class HaConfigBackup extends LitElement { actions: { title: "", - width: "15%", type: "overflow-menu", showNarrow: true, hideable: false, diff --git a/src/panels/config/blueprint/ha-blueprint-overview.ts b/src/panels/config/blueprint/ha-blueprint-overview.ts index 292a267bd7..a7b32ea051 100644 --- a/src/panels/config/blueprint/ha-blueprint-overview.ts +++ b/src/panels/config/blueprint/ha-blueprint-overview.ts @@ -176,7 +176,7 @@ class HaBlueprintOverview extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, translated_type: { title: localize("ui.panel.config.blueprint.overview.headers.type"), @@ -184,14 +184,13 @@ class HaBlueprintOverview extends LitElement { filterable: true, groupable: true, direction: "asc", - width: "10%", }, path: { title: localize("ui.panel.config.blueprint.overview.headers.file_name"), sortable: true, filterable: true, direction: "asc", - width: "25%", + flex: 2, }, fullpath: { title: "fullpath", @@ -199,7 +198,6 @@ class HaBlueprintOverview extends LitElement { }, actions: { title: "", - width: this.narrow ? undefined : "10%", type: "overflow-menu", showNarrow: true, moveable: false, diff --git a/src/panels/config/devices/ha-config-devices-dashboard.ts b/src/panels/config/devices/ha-config-devices-dashboard.ts index 6a5b857530..d7cfd5498b 100644 --- a/src/panels/config/devices/ha-config-devices-dashboard.ts +++ b/src/panels/config/devices/ha-config-devices-dashboard.ts @@ -22,6 +22,7 @@ import { UnsubscribeFunc } from "home-assistant-js-websocket"; import { customElement, property, state } from "lit/decorators"; import memoizeOne from "memoize-one"; import { computeCssColor } from "../../../common/color/compute-color"; +import { formatShortDateTime } from "../../../common/datetime/format_date_time"; import { storage } from "../../../common/decorators/storage"; import { HASSDomEvent } from "../../../common/dom/fire_event"; import { computeStateDomain } from "../../../common/entity/compute_state_domain"; @@ -58,6 +59,11 @@ import "../../../components/ha-sub-menu"; import { createAreaRegistryEntry } from "../../../data/area_registry"; import { ConfigEntry, sortConfigEntries } from "../../../data/config_entries"; import { fullEntitiesContext } from "../../../data/context"; +import { + DataTableFilters, + deserializeFilters, + serializeFilters, +} from "../../../data/data_table_filters"; import { DeviceEntityLookup, DeviceRegistryEntry, @@ -75,6 +81,7 @@ import { createLabelRegistryEntry, subscribeLabelRegistry, } from "../../../data/label_registry"; +import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box"; import "../../../layouts/hass-tabs-subpage-data-table"; import { SubscribeMixin } from "../../../mixins/subscribe-mixin"; import { haStyle } from "../../../resources/styles"; @@ -85,12 +92,6 @@ import { configSections } from "../ha-panel-config"; import "../integrations/ha-integration-overflow-menu"; import { showAddIntegrationDialog } from "../integrations/show-add-integration-dialog"; import { showLabelDetailDialog } from "../labels/show-dialog-label-detail"; -import { showAlertDialog } from "../../../dialogs/generic/show-dialog-box"; -import { - serializeFilters, - deserializeFilters, - DataTableFilters, -} from "../../../data/data_table_filters"; interface DeviceRowData extends DeviceRegistryEntry { device?: DeviceRowData; @@ -443,7 +444,7 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { } ); - private _columns = memoizeOne((localize: LocalizeFunc, narrow: boolean) => { + private _columns = memoizeOne((localize: LocalizeFunc) => { type DeviceItem = ReturnType< typeof this._devicesAndFilterDomains >["devicesOutput"][number]; @@ -476,6 +477,8 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { filterable: true, direction: "asc", grows: true, + flex: 2, + minWidth: "150px", extraTemplate: (device) => html` ${device.label_entries.length ? html` @@ -491,27 +494,27 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { sortable: true, filterable: true, groupable: true, - width: "15%", + minWidth: "120px", }, model: { title: localize("ui.panel.config.devices.data_table.model"), sortable: true, filterable: true, - width: "15%", + minWidth: "120px", }, area: { title: localize("ui.panel.config.devices.data_table.area"), sortable: true, filterable: true, groupable: true, - width: "15%", + minWidth: "120px", }, integration: { title: localize("ui.panel.config.devices.data_table.integration"), sortable: true, filterable: true, groupable: true, - width: "15%", + minWidth: "120px", }, battery_entity: { title: localize("ui.panel.config.devices.data_table.battery"), @@ -519,8 +522,8 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { sortable: true, filterable: true, type: "numeric", - width: narrow ? "105px" : "15%", - maxWidth: "105px", + maxWidth: "101px", + minWidth: "101px", valueColumn: "battery_level", template: (device) => { const batteryEntityPair = device.battery_entity; @@ -548,9 +551,39 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { .batteryChargingStateObj=${batteryCharging} > ` - : html`—`; + : "—"; }, }, + created_at: { + title: localize("ui.panel.config.generic.headers.created_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (entry) => + entry.created_at + ? formatShortDateTime( + new Date(entry.created_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", + }, + modified_at: { + title: localize("ui.panel.config.generic.headers.modified_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (entry) => + entry.modified_at + ? formatShortDateTime( + new Date(entry.modified_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", + }, disabled_by: { title: "", label: localize("ui.panel.config.devices.data_table.disabled_by"), @@ -675,7 +708,7 @@ export class HaConfigDeviceDashboard extends SubscribeMixin(LitElement) { "ui.panel.config.devices.picker.search", { number: devicesOutput.length } )} - .columns=${this._columns(this.hass.localize, this.narrow)} + .columns=${this._columns(this.hass.localize)} .data=${devicesOutput} selectable .selected=${this._selected.length} diff --git a/src/panels/config/entities/ha-config-entities.ts b/src/panels/config/entities/ha-config-entities.ts index 7c48cd1605..13745e6d22 100644 --- a/src/panels/config/entities/ha-config-entities.ts +++ b/src/panels/config/entities/ha-config-entities.ts @@ -103,6 +103,7 @@ import { deserializeFilters, DataTableFilters, } from "../../../data/data_table_filters"; +import { formatShortDateTime } from "../../../common/datetime/format_date_time"; export interface StateEntity extends Omit { @@ -294,7 +295,7 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, extraTemplate: (entry) => entry.label_entries.length ? html` @@ -308,14 +309,12 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { title: localize("ui.panel.config.entities.picker.headers.entity_id"), sortable: true, filterable: true, - width: "25%", }, localized_platform: { title: localize("ui.panel.config.entities.picker.headers.integration"), sortable: true, groupable: true, filterable: true, - width: "20%", }, domain: { title: localize("ui.panel.config.entities.picker.headers.domain"), @@ -329,7 +328,6 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { sortable: true, filterable: true, groupable: true, - width: "15%", }, disabled_by: { title: localize("ui.panel.config.entities.picker.headers.disabled_by"), @@ -348,7 +346,6 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { showNarrow: true, sortable: true, filterable: true, - width: "68px", template: (entry) => entry.unavailable || entry.disabled_by || @@ -398,6 +395,36 @@ export class HaConfigEntities extends SubscribeMixin(LitElement) { ` : "—", }, + created_at: { + title: localize("ui.panel.config.generic.headers.created_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (entry) => + entry.created_at + ? formatShortDateTime( + new Date(entry.created_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", + }, + modified_at: { + title: localize("ui.panel.config.generic.headers.modified_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (entry) => + entry.modified_at + ? formatShortDateTime( + new Date(entry.modified_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", + }, available: { title: localize("ui.panel.config.entities.picker.headers.availability"), sortable: true, @@ -1081,6 +1108,8 @@ ${ options: null, labels: [], categories: {}, + created_at: 0, + modified_at: 0, }); } if (changed) { diff --git a/src/panels/config/helpers/ha-config-helpers.ts b/src/panels/config/helpers/ha-config-helpers.ts index 1046866244..5a5d07d957 100644 --- a/src/panels/config/helpers/ha-config-helpers.ts +++ b/src/panels/config/helpers/ha-config-helpers.ts @@ -280,7 +280,7 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) { main: true, sortable: true, filterable: true, - grows: true, + flex: 2, direction: "asc", extraTemplate: (helper) => helper.label_entries.length @@ -295,7 +295,6 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) { title: localize("ui.panel.config.helpers.picker.headers.entity_id"), sortable: true, filterable: true, - width: "25%", }, category: { title: localize("ui.panel.config.helpers.picker.headers.category"), @@ -314,7 +313,6 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) { localized_type: { title: localize("ui.panel.config.helpers.picker.headers.type"), sortable: true, - width: "25%", filterable: true, groupable: true, }, @@ -344,7 +342,6 @@ export class HaConfigHelpers extends SubscribeMixin(LitElement) { actions: { title: "", label: "Actions", - width: "64px", type: "overflow-menu", hideable: false, moveable: false, diff --git a/src/panels/config/integrations/integration-panels/zha/zha-clusters-data-table.ts b/src/panels/config/integrations/integration-panels/zha/zha-clusters-data-table.ts index 1b14b676a8..2d97719771 100644 --- a/src/panels/config/integrations/integration-panels/zha/zha-clusters-data-table.ts +++ b/src/panels/config/integrations/integration-panels/zha/zha-clusters-data-table.ts @@ -44,7 +44,7 @@ export class ZHAClustersDataTable extends LitElement { title: "Name", sortable: true, direction: "asc", - grows: true, + flex: 2, }, } : { @@ -52,18 +52,16 @@ export class ZHAClustersDataTable extends LitElement { title: "Name", sortable: true, direction: "asc", - grows: true, + flex: 2, }, id: { title: "ID", template: (cluster) => html` ${formatAsPaddedHex(cluster.id)} `, sortable: true, - width: "25%", }, endpoint_id: { title: "Endpoint ID", sortable: true, - width: "15%", }, } ); diff --git a/src/panels/config/integrations/integration-panels/zha/zha-device-endpoint-data-table.ts b/src/panels/config/integrations/integration-panels/zha/zha-device-endpoint-data-table.ts index d68fdb0b1e..18a265c16c 100644 --- a/src/panels/config/integrations/integration-panels/zha/zha-device-endpoint-data-table.ts +++ b/src/panels/config/integrations/integration-panels/zha/zha-device-endpoint-data-table.ts @@ -65,7 +65,7 @@ export class ZHADeviceEndpointDataTable extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, template: (device) => html` ${device.name} @@ -84,7 +84,7 @@ export class ZHADeviceEndpointDataTable extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, template: (device) => html` ${device.name} @@ -100,7 +100,7 @@ export class ZHADeviceEndpointDataTable extends LitElement { title: "Associated Entities", sortable: false, filterable: false, - width: "50%", + flex: 2, template: (device) => html` ${device.entities.length ? device.entities.length > 3 diff --git a/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts b/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts index 0774f8b343..98435bae27 100644 --- a/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts +++ b/src/panels/config/integrations/integration-panels/zha/zha-device-neighbors.ts @@ -69,14 +69,13 @@ class ZHADeviceNeighbors extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, lqi: { title: this.hass.localize("ui.panel.config.zha.neighbors.lqi"), sortable: true, filterable: true, type: "numeric", - width: "75px", }, } : { @@ -85,14 +84,13 @@ class ZHADeviceNeighbors extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, lqi: { title: this.hass.localize("ui.panel.config.zha.neighbors.lqi"), sortable: true, filterable: true, type: "numeric", - width: "75px", }, relationship: { title: this.hass.localize( @@ -100,14 +98,12 @@ class ZHADeviceNeighbors extends LitElement { ), sortable: true, filterable: true, - width: "150px", }, depth: { title: this.hass.localize("ui.panel.config.zha.neighbors.depth"), sortable: true, filterable: true, type: "numeric", - width: "75px", }, } ); diff --git a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts index d21ae02aea..e6559f63b0 100644 --- a/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts +++ b/src/panels/config/integrations/integration-panels/zha/zha-groups-dashboard.ts @@ -79,7 +79,7 @@ export class ZHAGroupsDashboard extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, } : { @@ -88,19 +88,17 @@ export class ZHAGroupsDashboard extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, }, group_id: { title: this.hass.localize("ui.panel.config.zha.groups.group_id"), type: "numeric", - width: "15%", template: (group) => html` ${formatAsPaddedHex(group.group_id)} `, sortable: true, }, members: { title: this.hass.localize("ui.panel.config.zha.groups.members"), type: "numeric", - width: "15%", template: (group) => html` ${group.members.length} `, sortable: true, }, diff --git a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-provisioned.ts b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-provisioned.ts index 93539a507e..df0600d788 100644 --- a/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-provisioned.ts +++ b/src/panels/config/integrations/integration-panels/zwave_js/zwave_js-provisioned.ts @@ -47,7 +47,6 @@ class ZWaveJSProvisioned extends LitElement { "ui.panel.config.zwave_js.provisioned.included" ), type: "icon", - width: "100px", template: (entry) => entry.nodeId ? html` @@ -71,13 +70,12 @@ class ZWaveJSProvisioned extends LitElement { title: this.hass.localize("ui.panel.config.zwave_js.provisioned.dsk"), sortable: true, filterable: true, - grows: true, + flex: 2, }, security_classes: { title: this.hass.localize( "ui.panel.config.zwave_js.provisioned.security_classes" ), - width: "30%", hidden: narrow, filterable: true, sortable: true, @@ -97,7 +95,6 @@ class ZWaveJSProvisioned extends LitElement { "ui.panel.config.zwave_js.provisioned.unprovison" ), type: "icon-button", - width: "100px", template: (entry) => html` { + private _columns = memoizeOne((localize: LocalizeFunc, narrow: boolean) => { const columns: DataTableColumnContainer = { icon: { title: "", @@ -110,22 +111,60 @@ export class HaConfigLabels extends LitElement { name: { title: localize("ui.panel.config.labels.headers.name"), main: true, + flex: 2, sortable: true, filterable: true, - grows: true, - template: (label) => html` -
${label.name}
- ${label.description - ? html`
${label.description}
` - : nothing} - `, + template: narrow + ? undefined + : (label) => html` +
${label.name}
+ ${label.description + ? html`
${label.description}
` + : nothing} + `, + }, + description: { + title: localize("ui.panel.config.labels.headers.description"), + hidden: !narrow, + filterable: true, + hideable: true, + }, + created_at: { + title: localize("ui.panel.config.generic.headers.created_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (label) => + label.created_at + ? formatShortDateTime( + new Date(label.created_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", + }, + modified_at: { + title: localize("ui.panel.config.generic.headers.modified_at"), + defaultHidden: true, + sortable: true, + filterable: true, + minWidth: "128px", + template: (label) => + label.modified_at + ? formatShortDateTime( + new Date(label.modified_at * 1000), + this.hass.locale, + this.hass.config + ) + : "—", }, actions: { title: "", + label: localize("ui.panel.config.generic.headers.actions"), showNarrow: true, moveable: false, hideable: false, - width: "64px", type: "overflow-menu", template: (label) => html` html` @@ -171,7 +171,6 @@ export class HaConfigLovelaceDashboards extends LitElement { ), sortable: true, filterable: true, - width: "20%", template: (dashboard) => html` ${this.hass.localize( `ui.panel.config.lovelace.dashboards.conf_mode.${dashboard.mode}` @@ -183,7 +182,6 @@ export class HaConfigLovelaceDashboards extends LitElement { title: localize( "ui.panel.config.lovelace.dashboards.picker.headers.filename" ), - width: "15%", sortable: true, filterable: true, }; @@ -195,7 +193,6 @@ export class HaConfigLovelaceDashboards extends LitElement { sortable: true, type: "icon", hidden: narrow, - width: "100px", template: (dashboard) => dashboard.require_admin ? html`` @@ -207,7 +204,6 @@ export class HaConfigLovelaceDashboards extends LitElement { ), type: "icon", hidden: narrow, - width: "121px", template: (dashboard) => dashboard.show_in_sidebar ? html`` @@ -221,7 +217,6 @@ export class HaConfigLovelaceDashboards extends LitElement { ), filterable: true, showNarrow: true, - width: "100px", template: (dashboard) => narrow ? html` diff --git a/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts b/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts index 2c91a30a88..d43d572cfd 100644 --- a/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts +++ b/src/panels/config/lovelace/resources/ha-config-lovelace-resources.ts @@ -94,7 +94,7 @@ export class HaConfigLovelaceRescources extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, forceLTR: true, }, type: { @@ -103,7 +103,6 @@ export class HaConfigLovelaceRescources extends LitElement { ), sortable: true, filterable: true, - width: "30%", template: (resource) => html` ${this.hass.localize( `ui.panel.config.lovelace.resources.types.${resource.type}` diff --git a/src/panels/config/scene/ha-scene-dashboard.ts b/src/panels/config/scene/ha-scene-dashboard.ts index b889dc1094..179ee15fac 100644 --- a/src/panels/config/scene/ha-scene-dashboard.ts +++ b/src/panels/config/scene/ha-scene-dashboard.ts @@ -260,7 +260,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, extraTemplate: (scene) => scene.labels.length ? html` { const lastActivated = scene.state; if (!lastActivated || isUnavailableState(lastActivated)) { @@ -312,7 +311,7 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) { }, only_editable: { title: "", - width: "56px", + type: "icon", showNarrow: true, template: (scene) => !scene.attributes.id @@ -331,7 +330,6 @@ class HaSceneDashboard extends SubscribeMixin(LitElement) { }, actions: { title: "", - width: "64px", type: "overflow-menu", showNarrow: true, moveable: false, diff --git a/src/panels/config/script/ha-script-picker.ts b/src/panels/config/script/ha-script-picker.ts index d35aed5f90..8e1767a2c9 100644 --- a/src/panels/config/script/ha-script-picker.ts +++ b/src/panels/config/script/ha-script-picker.ts @@ -270,7 +270,7 @@ class HaScriptPicker extends SubscribeMixin(LitElement) { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, extraTemplate: (script) => script.labels.length ? html` { const date = new Date(script.last_triggered); @@ -322,7 +321,6 @@ class HaScriptPicker extends SubscribeMixin(LitElement) { }, actions: { title: "", - width: "64px", type: "overflow-menu", showNarrow: true, moveable: false, diff --git a/src/panels/config/tags/ha-config-tags.ts b/src/panels/config/tags/ha-config-tags.ts index 933490adfe..66eded944c 100644 --- a/src/panels/config/tags/ha-config-tags.ts +++ b/src/panels/config/tags/ha-config-tags.ts @@ -81,13 +81,12 @@ export class HaConfigTags extends SubscribeMixin(LitElement) { main: true, sortable: true, filterable: true, - grows: true, + flex: 2, }, last_scanned_datetime: { title: localize("ui.panel.config.tag.headers.last_scanned"), sortable: true, direction: "desc", - width: "20%", template: (tag) => html` ${tag.last_scanned_datetime ? html` html`${user.username || "—"}`, }, @@ -100,7 +98,6 @@ export class HaConfigUsers extends LitElement { sortable: true, filterable: true, groupable: true, - width: "20%", direction: "asc", }, is_active: { @@ -110,7 +107,6 @@ export class HaConfigUsers extends LitElement { type: "icon", sortable: true, filterable: true, - width: "80px", hidden: narrow, template: (user) => user.is_active @@ -124,7 +120,6 @@ export class HaConfigUsers extends LitElement { type: "icon", sortable: true, filterable: true, - width: "80px", hidden: narrow, template: (user) => user.system_generated @@ -138,7 +133,6 @@ export class HaConfigUsers extends LitElement { type: "icon", sortable: true, filterable: true, - width: "80px", hidden: narrow, template: (user) => user.local_only @@ -153,7 +147,7 @@ export class HaConfigUsers extends LitElement { type: "icon", sortable: false, filterable: false, - width: "104px", + minWidth: "104px", hidden: !narrow, showNarrow: true, template: (user) => { diff --git a/src/panels/config/voice-assistants/assist/ha-config-voice-assistants-assist-devices.ts b/src/panels/config/voice-assistants/assist/ha-config-voice-assistants-assist-devices.ts index 9c9e32d2e0..5e3f250d90 100644 --- a/src/panels/config/voice-assistants/assist/ha-config-voice-assistants-assist-devices.ts +++ b/src/panels/config/voice-assistants/assist/ha-config-voice-assistants-assist-devices.ts @@ -42,13 +42,12 @@ class AssistDevicesPage extends LitElement { ), filterable: true, sortable: true, - grows: true, + flex: 2, }, pipeline: { title: localize( "ui.panel.config.voice_assistants.assistants.pipeline.devices.pipeline" ), - width: "30%", filterable: true, sortable: true, }, @@ -58,7 +57,6 @@ class AssistDevicesPage extends LitElement { ), filterable: true, sortable: true, - width: "30%", }, }; diff --git a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts index 7a2b5e9c49..dfa40a6f83 100644 --- a/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts +++ b/src/panels/config/voice-assistants/ha-config-voice-assistants-expose.ts @@ -167,7 +167,7 @@ export class VoiceAssistantsExpose extends LitElement { sortable: true, filterable: true, direction: "asc", - grows: true, + flex: 2, template: narrow ? undefined : (entry) => html` @@ -197,7 +197,6 @@ export class VoiceAssistantsExpose extends LitElement { sortable: true, groupable: true, filterable: true, - width: "15%", }, assistants: { title: localize( @@ -206,7 +205,8 @@ export class VoiceAssistantsExpose extends LitElement { showNarrow: true, sortable: true, filterable: true, - width: "160px", + minWidth: "160px", + maxWidth: "160px", type: "flex", template: (entry) => html`${availableAssistants.map((key) => { @@ -233,7 +233,6 @@ export class VoiceAssistantsExpose extends LitElement { ), sortable: true, filterable: true, - width: "15%", template: (entry) => entry.aliases.length === 0 ? "-" diff --git a/src/panels/developer-tools/statistics/developer-tools-statistics.ts b/src/panels/developer-tools/statistics/developer-tools-statistics.ts index 518dce24b9..8d40dc0b42 100644 --- a/src/panels/developer-tools/statistics/developer-tools-statistics.ts +++ b/src/panels/developer-tools/statistics/developer-tools-statistics.ts @@ -89,9 +89,10 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { title: localize( "ui.panel.developer-tools.tabs.statistics.data_table.name" ), + main: true, sortable: true, filterable: true, - grows: true, + flex: 2, }, statistic_id: { title: localize( @@ -100,7 +101,6 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { sortable: true, filterable: true, hidden: this.narrow, - width: "20%", }, statistics_unit_of_measurement: { title: localize( @@ -108,7 +108,6 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { ), sortable: true, filterable: true, - width: "10%", forceLTR: true, }, source: { @@ -117,7 +116,6 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { ), sortable: true, filterable: true, - width: "10%", }, issues_string: { title: localize( @@ -126,7 +124,7 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { sortable: true, filterable: true, direction: "asc", - width: "30%", + flex: 2, template: (statistic) => html`${statistic.issues_string ?? localize("ui.panel.developer-tools.tabs.statistics.no_issue")}`, @@ -147,12 +145,15 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { )} ` : "—"}`, - width: "113px", + minWidth: "113px", + maxWidth: "113px", + showNarrow: true, }, actions: { title: "", label: localize("ui.panel.developer-tools.tabs.statistics.adjust_sum"), type: "icon-button", + showNarrow: true, template: (statistic) => statistic.has_sum ? html` @@ -179,6 +180,7 @@ class HaPanelDevStatistics extends SubscribeMixin(LitElement) { .noDataText=${this.hass.localize( "ui.panel.developer-tools.tabs.statistics.data_table.no_statistics" )} + .narrow=${this.narrow} id="statistic_id" clickable @row-click=${this._rowClicked} diff --git a/src/panels/lovelace/editor/card-editor/hui-entity-picker-table.ts b/src/panels/lovelace/editor/card-editor/hui-entity-picker-table.ts index 51f42252c1..8caff95723 100644 --- a/src/panels/lovelace/editor/card-editor/hui-entity-picker-table.ts +++ b/src/panels/lovelace/editor/card-editor/hui-entity-picker-table.ts @@ -64,7 +64,8 @@ export class HuiEntityPickerTable extends LitElement { title: this.hass!.localize("ui.panel.lovelace.unused_entities.entity"), sortable: true, filterable: true, - grows: true, + flex: 2, + main: true, direction: "asc", template: (entity: any) => html`
@@ -81,7 +82,6 @@ export class HuiEntityPickerTable extends LitElement { title: this.hass!.localize("ui.panel.lovelace.unused_entities.entity_id"), sortable: true, filterable: true, - width: "30%", hidden: narrow, }; @@ -89,7 +89,6 @@ export class HuiEntityPickerTable extends LitElement { title: this.hass!.localize("ui.panel.lovelace.unused_entities.domain"), sortable: true, filterable: true, - width: "15%", hidden: narrow, }; @@ -99,7 +98,6 @@ export class HuiEntityPickerTable extends LitElement { ), type: "numeric", sortable: true, - width: "15%", hidden: narrow, template: (entity) => html`