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

Show detailed config entry error inline (#20764)

Browse Source 
* Put config entry error inline

* Fixes (show configure button and don't make them interactive)
This commit is contained in:
Simon Lamon 2024-05-29 14:07:52 +02:00 committed by GitHub
parent 97206ee8fe
commit b3e14d449e
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 52 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

91
src/panels/config/integrations/ha-config-integration-page.ts
View File

@ -47,6 +47,9 @@ import { nextRender } from "../../../common/util/render-status";
import "../../../components/ha-button"; import "../../../components/ha-button";
import "../../../components/ha-card"; import "../../../components/ha-card";
import "../../../components/ha-list-item"; import "../../../components/ha-list-item";
import "../../../components/ha-list-new";
import "../../../components/ha-list-item-new";
import "../../../components/ha-button-menu-new";
import { import {
deleteApplicationCredential, deleteApplicationCredential,
fetchApplicationCredentialsConfigEntry, fetchApplicationCredentialsConfigEntry,
@ -419,17 +422,13 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
"ui.panel.config.integrations.discovered" "ui.panel.config.integrations.discovered"
)} )}
</h1> </h1>
<mwc-list> <ha-list-new>
${discoveryFlows.map( ${discoveryFlows.map(
(flow) => (flow) =>
html`<ha-list-item html`<ha-list-item-new class="discovered">
hasMeta
class="discovered"
noninteractive
>
${flow.localized_title} ${flow.localized_title}
<ha-button <ha-button
slot="meta" slot="end"
unelevated unelevated
.flow=${flow} .flow=${flow}
@click=${this._continueFlow} @click=${this._continueFlow}
@ -437,9 +436,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
"ui.panel.config.integrations.configure" "ui.panel.config.integrations.configure"
)} )}
></ha-button> ></ha-button>
</ha-list-item>` </ha-list-item-new>`
)} )}
</mwc-list> </ha-list-new>
</ha-card>` </ha-card>`
: ""} : ""}
${attentionFlows.length || attentionEntries.length ${attentionFlows.length || attentionEntries.length
@ -449,19 +448,16 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
`ui.panel.config.integrations.integration_page.attention_entries` `ui.panel.config.integrations.integration_page.attention_entries`
)} )}
</h1> </h1>
<mwc-list> <ha-list-new>
${attentionFlows.map((flow) => { ${attentionFlows.map((flow) => {
const attention = ATTENTION_SOURCES.includes( const attention = ATTENTION_SOURCES.includes(
flow.context.source flow.context.source
); );
return html`<ha-list-item return html`<ha-list-item-new
hasMeta
class="config_entry ${attention ? "attention" : ""}" class="config_entry ${attention ? "attention" : ""}"
twoLine
noninteractive
> >
${flow.localized_title} ${flow.localized_title}
<span slot="secondary" <span slot="supporting-text"
>${this.hass.localize( >${this.hass.localize(
`ui.panel.config.integrations.${ `ui.panel.config.integrations.${
attention ? "attention" : "discovered" attention ? "attention" : "discovered"
@ -469,7 +465,7 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
)}</span )}</span
> >
<ha-button <ha-button
slot="meta" slot="end"
unelevated unelevated
.flow=${flow} .flow=${flow}
@click=${this._continueFlow} @click=${this._continueFlow}
@ -479,12 +475,12 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
}` }`
)} )}
></ha-button> ></ha-button>
</ha-list-item>`; </ha-list-item-new>`;
})} })}
${attentionEntries.map((item) => ${attentionEntries.map((item) =>
this._renderConfigEntry(item) this._renderConfigEntry(item)
)} )}
</mwc-list> </ha-list-new>
</ha-card>` </ha-card>`
: ""} : ""}
@ -505,9 +501,9 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
)} )}
</div>` </div>`
: nothing} : nothing}
<mwc-list> <ha-list-new>
${normalEntries.map((item) => this._renderConfigEntry(item))} ${normalEntries.map((item) => this._renderConfigEntry(item))}
</mwc-list> </ha-list-new>
<div class="card-actions"> <div class="card-actions">
<ha-button @click=${this._addIntegration}> <ha-button @click=${this._addIntegration}>
${this._manifest?.integration_type ${this._manifest?.integration_type
@ -671,41 +667,42 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
const configPanel = this._configPanel(item.domain, this.hass.panels); const configPanel = this._configPanel(item.domain, this.hass.panels);
return html`<ha-list-item return html`<ha-list-item-new
hasMeta class=${classMap({
class="config_entry ${classMap({ config_entry: true,
"state-not-loaded": item!.state === "not_loaded", "state-not-loaded": item!.state === "not_loaded",
"state-failed-unload": item!.state === "failed_unload", "state-failed-unload": item!.state === "failed_unload",
"state-setup": item!.state === "setup_in_progress", "state-setup": item!.state === "setup_in_progress",
"state-error": ERROR_STATES.includes(item!.state), "state-error": ERROR_STATES.includes(item!.state),
})}" })}
data-entry-id=${item.entry_id} data-entry-id=${item.entry_id}
.disabled=${item.disabled_by} .disabled=${item.disabled_by}
.configEntry=${item} .configEntry=${item}
twoline
noninteractive
> >
${item.title || domainToName(this.hass.localize, item.domain)}
<div slot="supporting-text">
<div>${devicesLine}</div>
${stateText ${stateText
? html` ? html`
<div class="message" slot="meta"> <div class="message">
<ha-svg-icon .path=${icon}></ha-svg-icon> <ha-svg-icon .path=${icon}></ha-svg-icon>
<div>${this.hass.localize(...stateText)}</div> <div>
${stateTextExtra ${this.hass.localize(...stateText)}${stateTextExtra
? html`<simple-tooltip>${stateTextExtra}</simple-tooltip>` ? html`: ${stateTextExtra}`
: ""} : ""}
</div> </div>
</div>
` `
: ""} : ""}
${item.title || domainToName(this.hass.localize, item.domain)} </div>
<span slot="secondary">${devicesLine}</span>
${item.disabled_by === "user" ${item.disabled_by === "user"
? html`<mwc-button unelevated slot="meta" @click=${this._handleEnable}> ? html`<mwc-button unelevated slot="end" @click=${this._handleEnable}>
${this.hass.localize("ui.common.enable")} ${this.hass.localize("ui.common.enable")}
</mwc-button>` </mwc-button>`
: configPanel && : configPanel &&
(item.domain !== "matter" || isDevVersion(this.hass.config.version)) (item.domain !== "matter" || isDevVersion(this.hass.config.version))
? html`<a ? html`<a
slot="meta" slot="end"
href=${`/${configPanel}?config_entry=${item.entry_id}`} href=${`/${configPanel}?config_entry=${item.entry_id}`}
><mwc-button> ><mwc-button>
${this.hass.localize( ${this.hass.localize(
@ -715,14 +712,14 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
>` >`
: item.supports_options && !stateText : item.supports_options && !stateText
? html` ? html`
<mwc-button slot="meta" @click=${this._showOptions}> <mwc-button slot="end" @click=${this._showOptions}>
${this.hass.localize( ${this.hass.localize(
"ui.panel.config.integrations.config_entry.configure" "ui.panel.config.integrations.config_entry.configure"
)} )}
</mwc-button> </mwc-button>
` `
: ""} : ""}
<ha-button-menu slot="meta"> <ha-button-menu-new positioning="popover" slot="end">
<ha-icon-button <ha-icon-button
slot="trigger" slot="trigger"
.label=${this.hass.localize("ui.common.menu")} .label=${this.hass.localize("ui.common.menu")}
@ -893,8 +890,8 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
></ha-svg-icon> ></ha-svg-icon>
</ha-list-item>` </ha-list-item>`
: ""} : ""}
</ha-button-menu> </ha-button-menu-new>
</ha-list-item>`; </ha-list-item-new>`;
} }
private async _highlightEntry() { private async _highlightEntry() {
@ -1431,30 +1428,30 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
ha-alert:first-of-type { ha-alert:first-of-type {
margin-top: 16px; margin-top: 16px;
} }
ha-list-item.discovered { ha-list-item-new.discovered {
--mdc-list-item-meta-size: auto; --mdc-list-item-meta-size: auto;
--mdc-list-item-meta-display: flex; --mdc-list-item-meta-display: flex;
height: 72px; height: 72px;
} }
ha-list-item.config_entry { ha-list-item-new.config_entry {
overflow: visible; overflow: visible;
--mdc-list-item-meta-size: auto; --mdc-list-item-meta-size: auto;
--mdc-list-item-meta-display: flex; --mdc-list-item-meta-display: flex;
} }
ha-button-menu ha-list-item { ha-button-menu-new ha-list-item {
--mdc-list-item-meta-size: 24px; --mdc-list-item-meta-size: 24px;
} }
ha-list-item.config_entry::after { ha-list-item-new.config_entry::after {
position: absolute; position: absolute;
top: 0; top: 8px;
right: 0; right: 0;
bottom: 0; bottom: 8px;
left: 0; left: 0;
opacity: 0.12; opacity: 0.12;
pointer-events: none; pointer-events: none;
content: ""; content: "";
} }
ha-button-menu { ha-button-menu-new {
flex: 0; flex: 0;
} }
a { a {
@ -1513,6 +1510,10 @@ class HaConfigIntegrationPage extends SubscribeMixin(LitElement) {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
} }
ha-list-new {
margin-top: 8px;
margin-bottom: 8px;
}
`, `,
]; ];
} }