Add link between trace and editor (#8750)

This commit is contained in:
Bram Kragten 2021-03-30 02:05:51 +02:00 committed by GitHub
parent b866166425
commit cd2404f26a
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 51 additions and 21 deletions

View File

@ -104,12 +104,21 @@ export class HaBlueprintAutomationEditor extends LitElement {
"ui.panel.config.automation.editor.enable_disable" "ui.panel.config.automation.editor.enable_disable"
)} )}
</div> </div>
<mwc-button <div>
@click=${this._runActions} <a href="/config/automation/trace/${this.config.id}">
.stateObj=${this.stateObj} <mwc-button>
> ${this.hass.localize(
${this.hass.localize("ui.card.automation.trigger")} "ui.panel.config.automation.editor.show_trace"
</mwc-button> )}
</mwc-button>
</a>
<mwc-button
@click=${this._runActions}
.stateObj=${this.stateObj}
>
${this.hass.localize("ui.card.automation.trigger")}
</mwc-button>
</div>
</div> </div>
` `
: ""} : ""}

View File

@ -15,7 +15,6 @@ import {
loadTrace, loadTrace,
loadTraces, loadTraces,
} from "../../../../data/trace"; } from "../../../../data/trace";
import "../../../../components/ha-icon-button";
import "../../../../components/trace/hat-script-graph"; import "../../../../components/trace/hat-script-graph";
import type { NodeInfo } from "../../../../components/trace/hat-graph"; import type { NodeInfo } from "../../../../components/trace/hat-graph";
import { haStyle } from "../../../../resources/styles"; import { haStyle } from "../../../../resources/styles";
@ -33,6 +32,13 @@ import "./ha-automation-trace-timeline";
import "./ha-automation-trace-config"; import "./ha-automation-trace-config";
import { classMap } from "lit-html/directives/class-map"; import { classMap } from "lit-html/directives/class-map";
import { traceTabStyles } from "./styles"; import { traceTabStyles } from "./styles";
import {
mdiRayEndArrow,
mdiRayStartArrow,
mdiPencil,
mdiRefresh,
mdiDownload,
} from "@mdi/js";
@customElement("ha-automation-trace") @customElement("ha-automation-trace")
export class HaAutomationTrace extends LitElement { export class HaAutomationTrace extends LitElement {
@ -74,17 +80,18 @@ export class HaAutomationTrace extends LitElement {
const title = stateObj?.attributes.friendly_name || this._entityId; const title = stateObj?.attributes.friendly_name || this._entityId;
const actionButtons = html`<ha-icon-button const actionButtons = html`
label="Refresh" <mwc-icon-button label="Refresh" @click=${() => this._loadTraces()}>
icon="hass:refresh" <ha-svg-icon .path=${mdiRefresh}></ha-svg-icon>
@click=${() => this._loadTraces()} </mwc-icon-button>
></ha-icon-button> <mwc-icon-button
<ha-icon-button
.disabled=${!this._runId} .disabled=${!this._runId}
label="Download Trace" label="Download Trace"
icon="hass:download"
@click=${this._downloadTrace} @click=${this._downloadTrace}
></ha-icon-button>`; >
<ha-svg-icon .path=${mdiDownload}></ha-svg-icon>
</mwc-icon-button>
`;
return html` return html`
<hass-tabs-subpage <hass-tabs-subpage
@ -106,18 +113,27 @@ export class HaAutomationTrace extends LitElement {
${!this.narrow ${!this.narrow
? html`<div> ? html`<div>
${title} ${title}
<a
class="linkButton"
href="/config/automation/edit/${this.automationId}"
>
<mwc-icon-button label="Edit Automation">
<ha-svg-icon .path=${mdiPencil}></ha-svg-icon>
</mwc-icon-button>
</a>
</div>` </div>`
: ""} : ""}
${this._traces && this._traces.length > 0 ${this._traces && this._traces.length > 0
? html` ? html`
<div> <div>
<ha-icon-button <mwc-icon-button
.disabled=${this._traces[this._traces.length - 1].run_id === .disabled=${this._traces[this._traces.length - 1].run_id ===
this._runId} this._runId}
label="Older trace" label="Older trace"
icon="hass:ray-end-arrow"
@click=${this._pickOlderTrace} @click=${this._pickOlderTrace}
></ha-icon-button> >
<ha-svg-icon .path=${mdiRayEndArrow}></ha-svg-icon>
</mwc-icon-button>
<select .value=${this._runId} @change=${this._pickTrace}> <select .value=${this._runId} @change=${this._pickTrace}>
${repeat( ${repeat(
this._traces, this._traces,
@ -131,12 +147,13 @@ export class HaAutomationTrace extends LitElement {
>` >`
)} )}
</select> </select>
<ha-icon-button <mwc-icon-button
.disabled=${this._traces[0].run_id === this._runId} .disabled=${this._traces[0].run_id === this._runId}
label="Newer trace" label="Newer trace"
icon="hass:ray-start-arrow"
@click=${this._pickNewerTrace} @click=${this._pickNewerTrace}
></ha-icon-button> >
<ha-svg-icon .path=${mdiRayStartArrow}></ha-svg-icon>
</mwc-icon-button>
</div> </div>
` `
: ""} : ""}
@ -417,6 +434,10 @@ export class HaAutomationTrace extends LitElement {
flex: 1; flex: 1;
background-color: var(--card-background-color); background-color: var(--card-background-color);
} }
.linkButton {
color: var(--primary-text-color);
}
`, `,
]; ];
} }