mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-23 17:26:42 +00:00
Add friendly_name to dev tools "Entity" column + fuzzy search (#7582)
This commit is contained in:
parent
eaccd22267
commit
5f56040c64
@ -92,7 +92,7 @@ function isUpperCaseAtPos(pos: number, word: string, wordLow: string): boolean {
|
|||||||
return word[pos] !== wordLow[pos];
|
return word[pos] !== wordLow[pos];
|
||||||
}
|
}
|
||||||
|
|
||||||
function isPatternInWord(
|
export function isPatternInWord(
|
||||||
patternLow: string,
|
patternLow: string,
|
||||||
patternPos: number,
|
patternPos: number,
|
||||||
patternLen: number,
|
patternLen: number,
|
||||||
@ -121,7 +121,7 @@ enum Arrow {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* An array representating a fuzzy match.
|
* An array representing a fuzzy match.
|
||||||
*
|
*
|
||||||
* 0. the score
|
* 0. the score
|
||||||
* 1. the offset at which matching started
|
* 1. the offset at which matching started
|
||||||
|
@ -5,7 +5,7 @@ import { fuzzyScore } from "./filter";
|
|||||||
* in that order, allowing for skipping. Ex: "chdr" exists in "chandelier")
|
* in that order, allowing for skipping. Ex: "chdr" exists in "chandelier")
|
||||||
*
|
*
|
||||||
* @param {string} filter - Sequence of letters to check for
|
* @param {string} filter - Sequence of letters to check for
|
||||||
* @param {string} word - Word to check for sequence
|
* @param {ScorableTextItem} item - Item against whose strings will be checked
|
||||||
*
|
*
|
||||||
* @return {number} Score representing how well the word matches the filter. Return of 0 means no match.
|
* @return {number} Score representing how well the word matches the filter. Return of 0 means no match.
|
||||||
*/
|
*/
|
||||||
|
@ -11,6 +11,7 @@ import { html } from "@polymer/polymer/lib/utils/html-tag";
|
|||||||
import { PolymerElement } from "@polymer/polymer/polymer-element";
|
import { PolymerElement } from "@polymer/polymer/polymer-element";
|
||||||
import { dump, load } from "js-yaml";
|
import { dump, load } from "js-yaml";
|
||||||
import { formatDateTimeWithSeconds } from "../../../common/datetime/format_date_time";
|
import { formatDateTimeWithSeconds } from "../../../common/datetime/format_date_time";
|
||||||
|
import { isPatternInWord } from "../../../common/string/filter/filter";
|
||||||
import { computeRTL } from "../../../common/util/compute_rtl";
|
import { computeRTL } from "../../../common/util/compute_rtl";
|
||||||
import { copyToClipboard } from "../../../common/util/copy-clipboard";
|
import { copyToClipboard } from "../../../common/util/copy-clipboard";
|
||||||
import "../../../components/entity/ha-entity-picker";
|
import "../../../components/entity/ha-entity-picker";
|
||||||
@ -91,6 +92,12 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
|||||||
--mdc-icon-size: 20px;
|
--mdc-icon-size: 20px;
|
||||||
padding: 4px;
|
padding: 4px;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
|
flex-shrink: 0;
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
||||||
|
.entities td:nth-child(1) {
|
||||||
|
min-width: 300px;
|
||||||
|
width: 30%;
|
||||||
}
|
}
|
||||||
.entities td:nth-child(3) {
|
.entities td:nth-child(3) {
|
||||||
white-space: pre-wrap;
|
white-space: pre-wrap;
|
||||||
@ -101,6 +108,15 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
|||||||
color: var(--primary-color);
|
color: var(--primary-color);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.entities .id-name-container {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
}
|
||||||
|
.entities .id-name-row {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
:host([narrow]) .state-wrapper {
|
:host([narrow]) .state-wrapper {
|
||||||
flex-direction: column;
|
flex-direction: column;
|
||||||
}
|
}
|
||||||
@ -219,19 +235,30 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
|||||||
<template is="dom-repeat" items="[[_entities]]" as="entity">
|
<template is="dom-repeat" items="[[_entities]]" as="entity">
|
||||||
<tr>
|
<tr>
|
||||||
<td>
|
<td>
|
||||||
<ha-svg-icon
|
<div class="id-name-container">
|
||||||
on-click="entityMoreInfo"
|
<div class="id-name-row">
|
||||||
alt="[[localize('ui.panel.developer-tools.tabs.states.more_info')]]"
|
<ha-svg-icon
|
||||||
title="[[localize('ui.panel.developer-tools.tabs.states.more_info')]]"
|
on-click="copyEntity"
|
||||||
path="[[informationOutlineIcon()]]"
|
alt="[[localize('ui.panel.developer-tools.tabs.states.copy_id')]]"
|
||||||
></ha-svg-icon>
|
title="[[localize('ui.panel.developer-tools.tabs.states.copy_id')]]"
|
||||||
<ha-svg-icon
|
path="[[clipboardOutlineIcon()]]"
|
||||||
on-click="copyEntity"
|
></ha-svg-icon>
|
||||||
alt="[[localize('ui.panel.developer-tools.tabs.states.copy_id')]]"
|
<a href="#" on-click="entitySelected"
|
||||||
title="[[localize('ui.panel.developer-tools.tabs.states.copy_id')]]"
|
>[[entity.entity_id]]</a
|
||||||
path="[[clipboardOutlineIcon()]]"
|
>
|
||||||
></ha-svg-icon>
|
</div>
|
||||||
<a href="#" on-click="entitySelected">[[entity.entity_id]]</a>
|
<div class="id-name-row">
|
||||||
|
<ha-svg-icon
|
||||||
|
on-click="entityMoreInfo"
|
||||||
|
alt="[[localize('ui.panel.developer-tools.tabs.states.more_info')]]"
|
||||||
|
title="[[localize('ui.panel.developer-tools.tabs.states.more_info')]]"
|
||||||
|
path="[[informationOutlineIcon()]]"
|
||||||
|
></ha-svg-icon>
|
||||||
|
<span class="secondary">
|
||||||
|
[[entity.attributes.friendly_name]]
|
||||||
|
</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</td>
|
</td>
|
||||||
<td>[[entity.state]]</td>
|
<td>[[entity.state]]</td>
|
||||||
<template
|
<template
|
||||||
@ -385,12 +412,34 @@ class HaPanelDevState extends EventsMixin(LocalizeMixin(PolymerElement)) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
computeEntities(hass, _entityFilter, _stateFilter, _attributeFilter) {
|
computeEntities(hass, _entityFilter, _stateFilter, _attributeFilter) {
|
||||||
|
const _entityFilterLength = _entityFilter.length;
|
||||||
|
const _entityFilterLow = _entityFilter.toLowerCase();
|
||||||
|
|
||||||
return Object.keys(hass.states)
|
return Object.keys(hass.states)
|
||||||
.map(function (key) {
|
.map((key) => hass.states[key])
|
||||||
return hass.states[key];
|
.filter((value) => {
|
||||||
})
|
if (
|
||||||
.filter(function (value) {
|
_entityFilter &&
|
||||||
if (!value.entity_id.includes(_entityFilter.toLowerCase())) {
|
!isPatternInWord(
|
||||||
|
_entityFilterLow,
|
||||||
|
0,
|
||||||
|
_entityFilterLength,
|
||||||
|
value.entity_id.toLowerCase(),
|
||||||
|
0,
|
||||||
|
value.entity_id.length,
|
||||||
|
true
|
||||||
|
) &&
|
||||||
|
value.attributes.friendly_name !== undefined &&
|
||||||
|
!isPatternInWord(
|
||||||
|
_entityFilterLow,
|
||||||
|
0,
|
||||||
|
_entityFilterLength,
|
||||||
|
value.attributes.friendly_name.toLowerCase(),
|
||||||
|
0,
|
||||||
|
value.attributes.friendly_name.length,
|
||||||
|
true
|
||||||
|
)
|
||||||
|
) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
Loading…
x
Reference in New Issue
Block a user