diff --git a/src/auth/ha-auth-flow.ts b/src/auth/ha-auth-flow.ts index 00070a57b664..fb1d7d7c32f5 100644 --- a/src/auth/ha-auth-flow.ts +++ b/src/auth/ha-auth-flow.ts @@ -21,7 +21,6 @@ import { DataEntryFlowStepForm, } from "../data/data_entry_flow"; import "./ha-auth-form"; -import { fireEvent } from "../common/dom/fire_event"; type State = "loading" | "error" | "step"; @@ -39,7 +38,9 @@ export class HaAuthFlow extends LitElement { @property({ attribute: false }) public step?: DataEntryFlowStep; - @property({ type: Boolean }) private storeToken = false; + @property({ type: Boolean }) private initStoreToken = false; + + @state() private _storeToken = false; @state() private _state: State = "loading"; @@ -56,6 +57,10 @@ export class HaAuthFlow extends LitElement { willUpdate(changedProps: PropertyValues) { super.willUpdate(changedProps); + if (!this.hasUpdated) { + this._storeToken = this.initStoreToken; + } + if (!changedProps.has("step")) { return; } @@ -155,11 +160,6 @@ export class HaAuthFlow extends LitElement { } private _renderForm() { - const showBack = - this.step?.type === "form" && - this.authProvider?.users && - !["select_mfa_module", "mfa"].includes(this.step.step_id); - switch (this._state) { case "step": if (this.step == null) { @@ -168,12 +168,7 @@ export class HaAuthFlow extends LitElement { return html` ${this._renderStep(this.step)} -
- ${showBack - ? html` - ${this.localize("ui.panel.page-authorize.form.previous")} - ` - : nothing} +
${this._computeStepDescription(step)} @@ -269,7 +264,7 @@ export class HaAuthFlow extends LitElement { } private _storeTokenChanged(e: CustomEvent) { - this.storeToken = (e.currentTarget as HTMLInputElement).checked; + this._storeToken = (e.currentTarget as HTMLInputElement).checked; } private async _providerChanged(newProvider?: AuthProvider) { @@ -303,7 +298,7 @@ export class HaAuthFlow extends LitElement { this.redirectUri!, data.result, this.oauth2State, - this.storeToken + this._storeToken ); return; } @@ -385,7 +380,7 @@ export class HaAuthFlow extends LitElement { this.redirectUri!, newStep.result, this.oauth2State, - this.storeToken + this._storeToken ); return; } @@ -400,10 +395,6 @@ export class HaAuthFlow extends LitElement { this._submitting = false; } } - - private _localFlow() { - fireEvent(this, "default-login-flow", { value: false }); - } } declare global { diff --git a/src/auth/ha-authorize.ts b/src/auth/ha-authorize.ts index 97fc3ef4790d..74b1e649d179 100644 --- a/src/auth/ha-authorize.ts +++ b/src/auth/ha-authorize.ts @@ -13,7 +13,6 @@ import { import { litLocalizeLiteMixin } from "../mixins/lit-localize-lite-mixin"; import { registerServiceWorker } from "../util/register-service-worker"; import "./ha-auth-flow"; -import "./ha-local-auth-flow"; import("./ha-pick-auth-provider"); @@ -36,12 +35,12 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) { @state() private _authProviders?: AuthProvider[]; + @state() private _preselectStoreToken = false; + @state() private _ownInstance = false; @state() private _error?: string; - @state() private _forceDefaultLogin = false; - constructor() { super(); const query = extractSearchParamsObject() as AuthUrlSearchParams; @@ -84,8 +83,7 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) { display: block; margin-top: 24px; } - ha-auth-flow, - ha-local-auth-flow { + ha-auth-flow { display: flex; justify-content: center; flex-direction: column; @@ -176,44 +174,29 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) { ` : nothing} -
+
${!this._authProvider ? html`

${this.localize("ui.panel.page-authorize.initializing")}

` - : !this._forceDefaultLogin && - this._authProvider!.users && - this.clientId != null && - this.redirectUri != null - ? html`` - : html` - ${inactiveProviders!.length > 0 - ? html` - - ` - : ""}`} + .initStoreToken=${this._preselectStoreToken} + > + ${inactiveProviders!.length > 0 + ? html` + + ` + : ""}`}
; - - @state() private _selectedUser?: string; - - @state() private _unmaskedPassword = false; - - createRenderRoot() { - return this; - } - - willUpdate(changedProps: PropertyValues) { - super.willUpdate(changedProps); - - if (!this.hasUpdated) { - this._load(); - } - } - - protected render() { - if (!this.authProvider?.users || !this._persons) { - return nothing; - } - const userIds = Object.keys(this.authProvider.users).filter( - (userId) => userId in this._persons! - ); - return html` - - ${this._error - ? html`${this._error}` - : nothing} - ${this._step - ? html`` - : this._selectedUser - ? html`` - : html`

- ${this.localize("ui.panel.page-authorize.welcome_home")} -

- ${this.localize("ui.panel.page-authorize.who_is_logging_in")} -
- ${userIds.map((userId) => { - const person = this._persons![userId]; - - return html`
- -

${person.name}

-
`; - })} -
-
- -
`} - `; - } - - protected firstUpdated(changedProps: PropertyValues) { - super.firstUpdated(changedProps); - - this.addEventListener("keypress", (ev) => { - if (ev.key === "Enter") { - this._handleSubmit(ev); - } - }); - } - - protected updated(changedProps: PropertyValues) { - if (changedProps.has("_selectedUser") && this._selectedUser) { - const passwordElement = this.renderRoot.querySelector( - "#password" - ) as HaAuthTextField; - passwordElement.updateComplete.then(() => { - passwordElement.focus(); - }); - } - } - - private async _load() { - try { - this._persons = await listUserPersons(); - } catch { - this._persons = {}; - this._error = "Failed to fetch persons"; - } - } - - private _restart() { - this._selectedUser = undefined; - this._error = undefined; - } - - private _toggleUnmaskedPassword() { - this._unmaskedPassword = !this._unmaskedPassword; - } - - private _handleKeyUp(ev: KeyboardEvent) { - if (ev.key === "Enter" || ev.key === " ") { - this._personSelected(ev); - } - } - - private async _personSelected(ev) { - const userId = ev.currentTarget.userId; - if ( - this.ownInstance && - this.authProviders?.find((prv) => prv.type === "trusted_networks") - ) { - try { - const flowResponse = await createLoginFlow( - this.clientId, - this.redirectUri, - ["trusted_networks", null] - ); - - const data = await flowResponse.json(); - - if (data.type === "create_entry") { - redirectWithAuthCode( - this.redirectUri!, - data.result, - this.oauth2State, - true - ); - return; - } - - try { - if (!data.data_schema[0].options.find((opt) => opt[0] === userId)) { - throw new Error("User not available"); - } - - const postData = { user: userId, client_id: this.clientId }; - - const response = await submitLoginFlow(data.flow_id, postData); - - if (response.ok) { - const result = await response.json(); - - if (result.type === "create_entry") { - redirectWithAuthCode( - this.redirectUri!, - result.result, - this.oauth2State, - true - ); - return; - } - } else { - throw new Error("Invalid response"); - } - } catch { - deleteLoginFlow(data.flow_id).catch((err) => { - // eslint-disable-next-line no-console - console.error("Error delete obsoleted auth flow", err); - }); - } - } catch { - // Ignore - } - } - this._selectedUser = userId; - } - - private async _handleSubmit(ev: Event) { - ev.preventDefault(); - - if (!this.authProvider?.users || !this._selectedUser) { - return; - } - - this._error = undefined; - this._submitting = true; - - const flowResponse = await createLoginFlow( - this.clientId, - this.redirectUri, - ["homeassistant", null] - ); - - const data = await flowResponse.json(); - - const postData = { - username: this.authProvider.users[this._selectedUser], - password: (this.renderRoot.querySelector("#password") as HaAuthTextField) - .value, - client_id: this.clientId, - }; - - try { - const response = await submitLoginFlow(data.flow_id, postData); - - const newStep = await response.json(); - - if (response.status === 403) { - this._error = newStep.message; - return; - } - - if (newStep.type === "create_entry") { - redirectWithAuthCode( - this.redirectUri!, - newStep.result, - this.oauth2State, - true - ); - return; - } - - if (newStep.errors.base) { - this._error = this.localize( - `ui.panel.page-authorize.form.providers.homeassistant.error.${newStep.errors.base}` - ); - throw new Error(this._error); - } - - this._step = newStep; - } catch { - deleteLoginFlow(data.flow_id).catch((err) => { - // eslint-disable-next-line no-console - console.error("Error delete obsoleted auth flow", err); - }); - if (!this._error) { - this._error = this.localize( - "ui.panel.page-authorize.form.unknown_error" - ); - } - } finally { - this._submitting = false; - } - } - - private _otherLogin() { - fireEvent(this, "default-login-flow", { value: true }); - } -} - -declare global { - interface HTMLElementTagNameMap { - "ha-local-auth-flow": HaLocalAuthFlow; - } - interface HASSDomEvents { - "default-login-flow": { value: boolean }; - } -} diff --git a/src/data/person.ts b/src/data/person.ts index 122240aff998..d1a0cbdd6a45 100644 --- a/src/data/person.ts +++ b/src/data/person.ts @@ -24,16 +24,6 @@ export const fetchPersons = (hass: HomeAssistant) => config: Person[]; }>({ type: "person/list" }); -export const listUserPersons = (): Promise> => - fetch("/api/person/list", { - credentials: "same-origin", - }).then((resp) => { - if (resp.ok) { - return resp.json(); - } - throw new Error(resp.statusText); - }); - export const createPerson = ( hass: HomeAssistant, values: PersonMutableParams