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

Fix issues with application credentials (#20495)

Browse Source
This commit is contained in:
Bram Kragten 2024-04-12 11:10:23 +02:00 committed by GitHub
parent 7ca8dabc44
commit 8dc2797b16
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 40 additions and 59 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

99
src/panels/config/application_credentials/ha-config-application-credentials.ts
View File

@ -1,14 +1,6 @@
import { mdiDelete, mdiPlus } from "@mdi/js"; import { mdiDelete, mdiPlus } from "@mdi/js";
import { import { css, CSSResultGroup, html, LitElement, PropertyValues } from "lit";
css,
CSSResultGroup,
html,
LitElement,
PropertyValues,
nothing,
} from "lit";
import { customElement, property, query, state } from "lit/decorators"; import { customElement, property, query, state } from "lit/decorators";
import { classMap } from "lit/directives/class-map";
import memoizeOne from "memoize-one"; import memoizeOne from "memoize-one";
import type { HASSDomEvent } from "../../../common/dom/fire_event"; import type { HASSDomEvent } from "../../../common/dom/fire_event";
import { LocalizeFunc } from "../../../common/translations/localize"; import { LocalizeFunc } from "../../../common/translations/localize";
@ -59,27 +51,24 @@ export class HaConfigApplicationCredentials extends LitElement {
title: localize( title: localize(
"ui.panel.config.application_credentials.picker.headers.name" "ui.panel.config.application_credentials.picker.headers.name"
), ),
sortable: true,
direction: "asc", direction: "asc",
grows: true, grows: true,
template: (entry) => html`${entry.name}`,
}, },
client_id: { client_id: {
title: localize( title: localize(
"ui.panel.config.application_credentials.picker.headers.client_id" "ui.panel.config.application_credentials.picker.headers.client_id"
), ),
width: "30%", width: "30%",
direction: "asc",
hidden: narrow, hidden: narrow,
template: (entry) => html`${entry.client_id}`,
}, },
application: { localizedDomain: {
title: localize( title: localize(
"ui.panel.config.application_credentials.picker.headers.application" "ui.panel.config.application_credentials.picker.headers.application"
), ),
sortable: true, sortable: true,
width: "30%", width: "30%",
direction: "asc", direction: "asc",
template: (entry) => html`${domainToName(localize, entry.domain)}`,
}, },
}; };
@ -87,6 +76,14 @@ export class HaConfigApplicationCredentials extends LitElement {
} }
); );
private _getApplicationCredentials = memoizeOne(
(applicationCredentials: ApplicationCredential[], localize: LocalizeFunc) =>
applicationCredentials.map((credential) => ({
...credential,
localizedDomain: domainToName(localize, credential.domain),
}))
);
protected firstUpdated(changedProperties: PropertyValues) { protected firstUpdated(changedProperties: PropertyValues) {
super.firstUpdated(changedProperties); super.firstUpdated(changedProperties);
this._loadTranslations(); this._loadTranslations();
@ -102,56 +99,40 @@ export class HaConfigApplicationCredentials extends LitElement {
backPath="/config" backPath="/config"
.tabs=${configSections.devices} .tabs=${configSections.devices}
.columns=${this._columns(this.narrow, this.hass.localize)} .columns=${this._columns(this.narrow, this.hass.localize)}
.data=${this._applicationCredentials} .data=${this._getApplicationCredentials(
this._applicationCredentials,
this.hass.localize
)}
hasFab hasFab
selectable selectable
.selected=${this._selected.length}
@selection-changed=${this._handleSelectionChanged} @selection-changed=${this._handleSelectionChanged}
> >
${this._selected.length <div class="header-btns" slot="selection-bar">
? html` ${!this.narrow
<div ? html`
class=${classMap({ <mwc-button @click=${this._removeSelected} class="warning"
"header-toolbar": this.narrow, >${this.hass.localize(
"table-header": !this.narrow, "ui.panel.config.application_credentials.picker.remove_selected.button"
})} )}</mwc-button
slot="header" >
> `
<p class="selected-txt"> : html`
${this.hass.localize( <ha-icon-button
"ui.panel.config.application_credentials.picker.selected", class="warning"
{ number: this._selected.length } id="remove-btn"
@click=${this._removeSelected}
.path=${mdiDelete}
.label=${this.hass.localize("ui.common.remove")}
></ha-icon-button>
<ha-help-tooltip
.label=${this.hass.localize(
"ui.panel.config.application_credentials.picker.remove_selected.button"
)} )}
</p> >
<div class="header-btns"> </ha-help-tooltip>
${!this.narrow `}
? html` </div>
<mwc-button
@click=${this._removeSelected}
class="warning"
>${this.hass.localize(
"ui.panel.config.application_credentials.picker.remove_selected.button"
)}</mwc-button
>
`
: html`
<ha-icon-button
class="warning"
id="remove-btn"
@click=${this._removeSelected}
.path=${mdiDelete}
.label=${this.hass.localize("ui.common.remove")}
></ha-icon-button>
<ha-help-tooltip
.label=${this.hass.localize(
"ui.panel.config.application_credentials.picker.remove_selected.button"
)}
>
</ha-help-tooltip>
`}
</div>
</div>
`
: nothing}
<ha-fab <ha-fab
slot="fab" slot="fab"
.label=${this.hass.localize( .label=${this.hass.localize(