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

Add hostname and metrics to Add-ons (#8253)

Browse Source
This commit is contained in:
Joakim Sørensen 2021-01-27 22:38:07 +01:00 committed by GitHub
parent 69d0a22091
commit 5ee0250ba5
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 324 additions and 238 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
hassio/src/addon-view/info/hassio-addon-info.ts
View File

@ -49,14 +49,20 @@ import {
uninstallHassioAddon,
validateHassioAddonOption,
} from "../../../../src/data/hassio/addon";
import { extractApiErrorMessage } from "../../../../src/data/hassio/common";
import {
extractApiErrorMessage,
fetchHassioStats,
HassioStats,
} from "../../../../src/data/hassio/common";
import {
showAlertDialog,
showConfirmationDialog,
} from "../../../../src/dialogs/generic/show-dialog-box";
import { haStyle } from "../../../../src/resources/styles";
import { HomeAssistant } from "../../../../src/types";
import { bytesToString } from "../../../../src/util/bytes-to-string";
import "../../components/hassio-card-content";
import "../../components/supervisor-metric";
import { showHassioMarkdownDialog } from "../../dialogs/markdown/show-dialog-hassio-markdown";
import { hassioStyle } from "../../resources/hassio-style";
@ -131,9 +137,24 @@ class HassioAddonInfo extends LitElement {
@property({ attribute: false }) public addon!: HassioAddonDetails;
@internalProperty() private _metrics?: HassioStats;
@internalProperty() private _error?: string;
protected render(): TemplateResult {
const metrics = [
{
description: "Add-on CPU Usage",
value: this._metrics?.cpu_percent,
},
{
description: "Add-on RAM Usage",
value: this._metrics?.memory_percent,
tooltip: `${bytesToString(this._metrics?.memory_usage)}/${bytesToString(
this._metrics?.memory_limit
)}`,
},
];
return html`
${this.addon.update_available
? html`
@ -237,6 +258,8 @@ class HassioAddonInfo extends LitElement {
>
for details.
</div>
<div class="addon-container">
<div>
${this.addon.logo
? html`
<img
@ -390,7 +413,12 @@ class HassioAddonInfo extends LitElement {
${this.addon.version
? html`
<div class="addon-options">
<div
class="${classMap({
"addon-options": true,
started: this.addon.state === "started",
})}"
>
<ha-settings-row ?three-line=${this.narrow}>
<span slot="heading">
Start on boot
@ -422,15 +450,16 @@ class HassioAddonInfo extends LitElement {
</ha-settings-row>
`
: ""}
${this.addon.auto_update || this.hass.userData?.showAdvanced
${this.addon.auto_update ||
this.hass.userData?.showAdvanced
? html`
<ha-settings-row ?three-line=${this.narrow}>
<span slot="heading">
Auto update
</span>
<span slot="description">
Auto update the add-on when there is a new version
available
Auto update the add-on when there is a new
version available
</span>
<ha-switch
@change=${this._autoUpdateToggled}
@ -480,6 +509,30 @@ class HassioAddonInfo extends LitElement {
</div>
`
: ""}
</div>
<div>
${this.addon.state === "started"
? html`<ha-settings-row ?three-line=${this.narrow}>
<span slot="heading">
Hostname
</span>
<code slot="description">
${this.addon.hostname}
</code>
</ha-settings-row>
${metrics.map(
(metric) =>
html`
<supervisor-metric
.description=${metric.description}
.value=${metric.value ?? 0}
.tooltip=${metric.tooltip}
></supervisor-metric>
`
)}`
: ""}
</div>
</div>
${this._error ? html` <div class="errors">${this._error}</div> ` : ""}
</div>
<div class="card-actions">
@ -579,6 +632,22 @@ class HassioAddonInfo extends LitElement {
`;
}
protected updated(changedProps) {
super.updated(changedProps);
if (changedProps.has("addon")) {
this._loadData();
}
}
private async _loadData(): Promise<void> {
if (this.addon.state === "started") {
this._metrics = await fetchHassioStats(
this.hass,
`addons/${this.addon.slug}`
);
}
}
private get _computeHassioApi(): boolean {
return (
this.addon.hassio_api &&
@ -988,10 +1057,26 @@ class HassioAddonInfo extends LitElement {
.addon-options {
max-width: 50%;
}
.addon-options.started {
max-width: 90%;
}
.addon-container {
display: grid;
grid-auto-flow: column;
grid-template-columns: 1fr auto;
}
.addon-container div:last-of-type {
align-self: end;
}
@media (max-width: 720px) {
.addon-options {
max-width: 100%;
}
.addon-container {
display: block;
}
}
`,
];

1
src/data/hassio/addon.ts
View File

@ -41,6 +41,7 @@ export interface HassioAddonDetails extends HassioAddonInfo {
gpio: boolean;
hassio_api: boolean;
hassio_role: "default" | "homeassistant" | "manager" | "admin";
hostname: string;
homeassistant_api: boolean;
homeassistant: string;
host_dbus: boolean;