Skip to content

Commit

Permalink
Clean up local auth flow, preselect remember me (#19354)
Browse files Browse the repository at this point in the history
  • Loading branch information
@bramkragten
bramkragten authored Jan 11, 2024
1 parent 03751d2 commit 02a7d0e
Show file tree
Hide file tree
Showing 4 changed files with 34 additions and 558 deletions.
35 changes: 13 additions & 22 deletions src/auth/ha-auth-flow.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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";

Expand All @@ -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";

Expand All @@ -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;
}
Expand Down Expand Up @@ -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) {
Expand All @@ -168,12 +168,7 @@ export class HaAuthFlow extends LitElement {

return html`
${this._renderStep(this.step)}
<div class="action ${showBack ? "space-between" : ""}">
${showBack
? html`<mwc-button @click=${this._localFlow}>
${this.localize("ui.panel.page-authorize.form.previous")}
</mwc-button>`
: nothing}
<div class="action">
<mwc-button
raised
@click=${this._handleSubmit}
Expand Down Expand Up @@ -227,7 +222,7 @@ export class HaAuthFlow extends LitElement {
</h1>
${this._computeStepDescription(step)}
<ha-auth-form
.data=${this._stepData}
.data=${this._stepData!}
.schema=${autocompleteLoginFields(step.data_schema)}
.error=${step.errors}
.disabled=${this._submitting}
Expand All @@ -246,7 +241,7 @@ export class HaAuthFlow extends LitElement {
)}
>
<ha-checkbox
.checked=${this.storeToken}
.checked=${this._storeToken}
@change=${this._storeTokenChanged}
></ha-checkbox>
</ha-formfield>
Expand All @@ -269,7 +264,7 @@ export class HaAuthFlow extends LitElement {
}

private _storeTokenChanged(e: CustomEvent<HTMLInputElement>) {
this.storeToken = (e.currentTarget as HTMLInputElement).checked;
this._storeToken = (e.currentTarget as HTMLInputElement).checked;
}

private async _providerChanged(newProvider?: AuthProvider) {
Expand Down Expand Up @@ -303,7 +298,7 @@ export class HaAuthFlow extends LitElement {
this.redirectUri!,
data.result,
this.oauth2State,
this.storeToken
this._storeToken
);
return;
}
Expand Down Expand Up @@ -385,7 +380,7 @@ export class HaAuthFlow extends LitElement {
this.redirectUri!,
newStep.result,
this.oauth2State,
this.storeToken
this._storeToken
);
return;
}
Expand All @@ -400,10 +395,6 @@ export class HaAuthFlow extends LitElement {
this._submitting = false;
}
}

private _localFlow() {
fireEvent(this, "default-login-flow", { value: false });
}
}

declare global {
Expand Down
62 changes: 21 additions & 41 deletions src/auth/ha-authorize.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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");

Expand All @@ -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;
Expand Down Expand Up @@ -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;
Expand Down Expand Up @@ -176,44 +174,29 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
</ha-alert>`
: nothing}
<div
class="card-content"
@default-login-flow=${this._handleDefaultLoginFlow}
>
<div class="card-content">
${!this._authProvider
? html`<p>
${this.localize("ui.panel.page-authorize.initializing")}
</p> `
: !this._forceDefaultLogin &&
this._authProvider!.users &&
this.clientId != null &&
this.redirectUri != null
? html`<ha-local-auth-flow
: html`<ha-auth-flow
.clientId=${this.clientId}
.redirectUri=${this.redirectUri}
.oauth2State=${this.oauth2State}
.authProvider=${this._authProvider}
.authProviders=${this._authProviders}
.localize=${this.localize}
.ownInstance=${this._ownInstance}
></ha-local-auth-flow>`
: html`<ha-auth-flow
.clientId=${this.clientId}
.redirectUri=${this.redirectUri}
.oauth2State=${this.oauth2State}
.authProvider=${this._authProvider}
.localize=${this.localize}
></ha-auth-flow>
${inactiveProviders!.length > 0
? html`
<ha-pick-auth-provider
.localize=${this.localize}
.clientId=${this.clientId}
.authProviders=${inactiveProviders}
@pick-auth-provider=${this._handleAuthProviderPick}
></ha-pick-auth-provider>
`
: ""}`}
.initStoreToken=${this._preselectStoreToken}
></ha-auth-flow>
${inactiveProviders!.length > 0
? html`
<ha-pick-auth-provider
.localize=${this.localize}
.clientId=${this.clientId}
.authProviders=${inactiveProviders!}
@pick-auth-provider=${this._handleAuthProviderPick}
></ha-pick-auth-provider>
`
: ""}`}
</div>
<div class="footer">
<ha-language-picker
Expand Down Expand Up @@ -319,24 +302,21 @@ export class HaAuthorize extends litLocalizeLiteMixin(LitElement) {
return;
}

if (authProviders.length === 0) {
if (authProviders.providers.length === 0) {
this._error = "No auth providers returned. Unable to finish login.";
return;
}

this._authProviders = authProviders;
this._authProvider = authProviders[0];
this._authProviders = authProviders.providers;
this._authProvider = authProviders.providers[0];
this._preselectStoreToken = authProviders.preselect_remember_me;
} catch (err: any) {
this._error = "Unable to fetch auth providers.";
// eslint-disable-next-line
console.error("Error loading auth providers", err);
}
}

private _handleDefaultLoginFlow(ev) {
this._forceDefaultLogin = ev.detail.value;
}

private async _handleAuthProviderPick(ev) {
this._authProvider = ev.detail;
}
Expand Down
Loading

0 comments on commit 02a7d0e

Please sign in to comment.