mirror of
https://github.com/home-assistant/frontend.git
synced 2025-07-17 06:16:33 +00:00
Add support for exact % progress reports in options flow (#25082)
Co-authored-by: Bram Kragten <mail@bramkragten.nl>
This commit is contained in:
parent
38c11e738e
commit
c73a9fccb8
@ -17,6 +17,15 @@ export interface DataEntryFlowProgressedEvent {
|
||||
};
|
||||
}
|
||||
|
||||
export interface DataEntryFlowProgressEvent {
|
||||
type: "data_entry_flow_progress_update";
|
||||
data: {
|
||||
handler: string;
|
||||
flow_id: string;
|
||||
progress: number;
|
||||
};
|
||||
}
|
||||
|
||||
export interface DataEntryFlowProgress {
|
||||
flow_id: string;
|
||||
handler: string;
|
||||
@ -108,3 +117,12 @@ export const subscribeDataEntryFlowProgressed = (
|
||||
callback,
|
||||
"data_entry_flow_progressed"
|
||||
);
|
||||
|
||||
export const subscribeDataEntryFlowProgress = (
|
||||
conn: Connection,
|
||||
callback: (ev: DataEntryFlowProgressEvent) => void
|
||||
) =>
|
||||
conn.subscribeEvents<DataEntryFlowProgressEvent>(
|
||||
callback,
|
||||
"data_entry_flow_progress_update"
|
||||
);
|
||||
|
@ -9,7 +9,10 @@ import { fireEvent } from "../../common/dom/fire_event";
|
||||
import "../../components/ha-dialog";
|
||||
import "../../components/ha-icon-button";
|
||||
import type { DataEntryFlowStep } from "../../data/data_entry_flow";
|
||||
import { subscribeDataEntryFlowProgressed } from "../../data/data_entry_flow";
|
||||
import {
|
||||
subscribeDataEntryFlowProgress,
|
||||
subscribeDataEntryFlowProgressed,
|
||||
} from "../../data/data_entry_flow";
|
||||
import { haStyleDialog } from "../../resources/styles";
|
||||
import type { HomeAssistant } from "../../types";
|
||||
import { documentationUrl } from "../../util/documentation-url";
|
||||
@ -52,6 +55,8 @@ class DataEntryFlowDialog extends LitElement {
|
||||
|
||||
@state() private _loading?: LoadingReason;
|
||||
|
||||
@state() private _progress?: number;
|
||||
|
||||
private _instance = instance;
|
||||
|
||||
@state() private _step:
|
||||
@ -62,7 +67,7 @@ class DataEntryFlowDialog extends LitElement {
|
||||
|
||||
@state() private _handler?: string;
|
||||
|
||||
private _unsubDataEntryFlowProgressed?: Promise<UnsubscribeFunc>;
|
||||
private _unsubDataEntryFlowProgress?: UnsubscribeFunc;
|
||||
|
||||
public async showDialog(params: DataEntryFlowDialogParams): Promise<void> {
|
||||
this._params = params;
|
||||
@ -160,11 +165,9 @@ class DataEntryFlowDialog extends LitElement {
|
||||
this._step = undefined;
|
||||
this._params = undefined;
|
||||
this._handler = undefined;
|
||||
if (this._unsubDataEntryFlowProgressed) {
|
||||
this._unsubDataEntryFlowProgressed.then((unsub) => {
|
||||
unsub();
|
||||
});
|
||||
this._unsubDataEntryFlowProgressed = undefined;
|
||||
if (this._unsubDataEntryFlowProgress) {
|
||||
this._unsubDataEntryFlowProgress();
|
||||
this._unsubDataEntryFlowProgress = undefined;
|
||||
}
|
||||
fireEvent(this, "dialog-closed", { dialog: this.localName });
|
||||
}
|
||||
@ -255,7 +258,9 @@ class DataEntryFlowDialog extends LitElement {
|
||||
.params=${this._params}
|
||||
.step=${this._step}
|
||||
.hass=${this.hass}
|
||||
.domain=${this._step.handler}
|
||||
.handler=${this._step.handler}
|
||||
.domain=${this._params.domain ??
|
||||
this._step.handler}
|
||||
></step-flow-abort>
|
||||
`
|
||||
: this._step.type === "progress"
|
||||
@ -264,6 +269,7 @@ class DataEntryFlowDialog extends LitElement {
|
||||
.flowConfig=${this._params.flowConfig}
|
||||
.step=${this._step}
|
||||
.hass=${this.hass}
|
||||
.progress=${this._progress}
|
||||
></step-flow-progress>
|
||||
`
|
||||
: this._step.type === "menu"
|
||||
@ -339,20 +345,28 @@ class DataEntryFlowDialog extends LitElement {
|
||||
}
|
||||
|
||||
private async _subscribeDataEntryFlowProgressed() {
|
||||
if (this._unsubDataEntryFlowProgressed) {
|
||||
if (this._unsubDataEntryFlowProgress) {
|
||||
return;
|
||||
}
|
||||
this._unsubDataEntryFlowProgressed = subscribeDataEntryFlowProgressed(
|
||||
this.hass.connection,
|
||||
async (ev) => {
|
||||
this._progress = undefined;
|
||||
const unsubs = [
|
||||
subscribeDataEntryFlowProgressed(this.hass.connection, (ev) => {
|
||||
if (ev.data.flow_id !== this._step?.flow_id) {
|
||||
return;
|
||||
}
|
||||
this._processStep(
|
||||
this._params!.flowConfig.fetchFlow(this.hass, this._step.flow_id)
|
||||
);
|
||||
}
|
||||
);
|
||||
this._progress = undefined;
|
||||
}),
|
||||
subscribeDataEntryFlowProgress(this.hass.connection, (ev) => {
|
||||
// ha-progress-ring has an issue with 0 so we round up
|
||||
this._progress = Math.ceil(ev.data.progress * 100);
|
||||
}),
|
||||
];
|
||||
this._unsubDataEntryFlowProgress = async () => {
|
||||
(await Promise.all(unsubs)).map((unsub) => unsub());
|
||||
};
|
||||
}
|
||||
|
||||
static get styles(): CSSResultGroup {
|
||||
|
@ -20,6 +20,8 @@ class StepFlowAbort extends LitElement {
|
||||
|
||||
@property({ attribute: false }) public domain!: string;
|
||||
|
||||
@property({ attribute: false }) public handler!: string;
|
||||
|
||||
protected firstUpdated(changed: PropertyValues) {
|
||||
super.firstUpdated(changed);
|
||||
if (this.step.reason === "missing_credentials") {
|
||||
@ -58,7 +60,7 @@ class StepFlowAbort extends LitElement {
|
||||
applicationCredentialAddedCallback: () => {
|
||||
showConfigFlowDialog(this.params.dialogParentElement!, {
|
||||
dialogClosedCallback: this.params.dialogClosedCallback,
|
||||
startFlowHandler: this.domain,
|
||||
startFlowHandler: this.handler,
|
||||
showAdvanced: this.hass.userData?.showAdvanced,
|
||||
navigateToResult: this.params.navigateToResult,
|
||||
});
|
||||
|
@ -2,11 +2,13 @@ import "@material/mwc-button";
|
||||
import type { CSSResultGroup, TemplateResult } from "lit";
|
||||
import { css, html, LitElement } from "lit";
|
||||
import { customElement, property } from "lit/decorators";
|
||||
import "../../components/ha-progress-ring";
|
||||
import "../../components/ha-spinner";
|
||||
import type { DataEntryFlowStepProgress } from "../../data/data_entry_flow";
|
||||
import type { HomeAssistant } from "../../types";
|
||||
import type { FlowConfig } from "./show-dialog-data-entry-flow";
|
||||
import { configFlowContentStyles } from "./styles";
|
||||
import { blankBeforePercent } from "../../common/translations/blank_before_percent";
|
||||
|
||||
@customElement("step-flow-progress")
|
||||
class StepFlowProgress extends LitElement {
|
||||
@ -19,13 +21,24 @@ class StepFlowProgress extends LitElement {
|
||||
@property({ attribute: false })
|
||||
public step!: DataEntryFlowStepProgress;
|
||||
|
||||
@property({ type: Number })
|
||||
public progress?: number;
|
||||
|
||||
protected render(): TemplateResult {
|
||||
return html`
|
||||
<h2>
|
||||
${this.flowConfig.renderShowFormProgressHeader(this.hass, this.step)}
|
||||
</h2>
|
||||
<div class="content">
|
||||
<ha-spinner></ha-spinner>
|
||||
${this.progress
|
||||
? html`
|
||||
<ha-progress-ring .value=${this.progress} size="large"
|
||||
>${this.progress}${blankBeforePercent(
|
||||
this.hass.locale
|
||||
)}%</ha-progress-ring
|
||||
>
|
||||
`
|
||||
: html` <ha-spinner size="large"></ha-spinner> `}
|
||||
${this.flowConfig.renderShowFormProgressDescription(
|
||||
this.hass,
|
||||
this.step
|
||||
|
@ -5673,8 +5673,7 @@
|
||||
"backup_failed": "Failed to download backup",
|
||||
"restore_complete": "Backup restored",
|
||||
"restore_failed": "Failed to restore backup",
|
||||
"downloading": "Downloading backup",
|
||||
"restoring": "Restoring backup"
|
||||
"downloading": "Downloading backup"
|
||||
},
|
||||
"statistics": {
|
||||
"title": "Controller statistics",
|
||||
|
Loading…
x
Reference in New Issue
Block a user