import { Component } from '@angular/core';
import { MatLegacySnackBar as MatSnackBar } from '@angular/material/legacy-snack-bar';
import { TranslateService } from '@aztrix/helpers';
import { ErrorType } from '@aztrix/models';
import { SessionsService } from '@aztrix/sdk';
import { first } from 'rxjs';
import { ModeService } from '../../services/mode.service';
import { AbstractOtpLogin } from '../abstract-otp-login-form';
import * as i0 from "@angular/core";
import * as i1 from "@aztrix/sdk";
import * as i2 from "../../services/mode.service";
import * as i3 from "@angular/material/legacy-snack-bar";
import * as i4 from "@aztrix/helpers";
import * as i5 from "@angular/common";
import * as i6 from "@aztrix/components/value-edit";
import * as i7 from "@aztrix/components/button";
import * as i8 from "@aztrix/components/login-value-form-error";
import * as i9 from "@aztrix/components/login-errors";
export class OtpLoginEmailStepComponent extends AbstractOtpLogin {
    constructor(_sessions, _modeService, _snackbar, _translate) {
        super();
        this._sessions = _sessions;
        this._modeService = _modeService;
        this._snackbar = _snackbar;
        this._translate = _translate;
        this.errorType = ErrorType.NONE;
    }
    continueClicked() {
        this.form.markAllAsTouched();
        if (this.form.valid) {
            this.errorType = ErrorType.NONE;
            this._sessions
                .requestOtpLogin({ loginValue: this.form.value })
                .pipe(first())
                .subscribe({
                next: () => {
                    this._continue();
                },
                error: (response) => {
                    if (response.error === ErrorType.LOGIN_NOT_VERIFIED) {
                        this._snackbar.open(this._translate.instant('error.login.not-verified'), null, {
                            duration: 5000,
                        });
                        this._modeService.setMode('verification', {
                            verificationValue: this.form.value,
                        });
                    }
                    else {
                        this.errorType = response.error;
                    }
                },
            });
        }
    }
}
OtpLoginEmailStepComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: OtpLoginEmailStepComponent, deps: [{ token: i1.SessionsService }, { token: i2.ModeService }, { token: i3.MatLegacySnackBar }, { token: i4.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
OtpLoginEmailStepComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.5", type: OtpLoginEmailStepComponent, selector: "ax-otp-login-email-step", usesInheritance: true, ngImport: i0, template: "<ax-login-errors [errorType]=\"errorType\"></ax-login-errors>\n\n<ax-value-edit\n  class=\"input\"\n  [label]=\"'EMAIL' | propertyTypeLabel\"\n  [form]=\"form\"\n  type=\"EMAIL\"\n  name=\"login\"\n  [errorsTemplate]=\"errorsTemplate\"\n  [autofocus]=\"true\"\n></ax-value-edit>\n\n<ax-button filled fullWidth class=\"action\" type=\"button\" color=\"accent\" (click)=\"continueClicked()\">\n  {{ 'label.continue' | translate }}\n</ax-button>\n\n<ng-template #errorsTemplate>\n  <ax-login-value-form-error\n    *ngIf=\"form.touched\"\n    [form]=\"form\"\n    [propertyType]=\"'EMAIL'\"\n  ></ax-login-value-form-error>\n</ng-template>\n", styles: ["", ":host{display:flex;flex-direction:column;gap:.5rem}.form{margin-bottom:20px;background-color:#fff;border-radius:15px;padding:1.5rem 1.5rem 0}.value{display:flex;flex-direction:column;align-items:flex-end;margin-bottom:.5rem}.input{width:100%}.action{margin:1rem 1rem -20px}.action ::ng-deep .ax-button{font-size:1.2rem;text-transform:none;height:2.5rem}.back{margin:1rem auto -.5rem;width:auto}.back ::ng-deep .ax-button{font-size:small;height:2rem;width:auto;margin:0 auto}.back ::ng-deep .ax-button .icon{width:1rem;height:1rem}.verification ::ng-deep .verify{width:100%;display:block;position:relative;bottom:-20px}.verification ::ng-deep .verify .ax-button{font-size:1.2rem;text-transform:none;height:2.5rem;width:100%}.verification ::ng-deep .resend{height:0;position:relative;bottom:-30px}.verification ::ng-deep .error-message{height:0;position:relative;bottom:-30px;display:flex;text-align:center;flex-direction:column;gap:1rem}\n"], dependencies: [{ kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i6.ValueEditComponent, selector: "ax-value-edit", inputs: ["type", "numberConfig"] }, { kind: "component", type: i7.ButtonComponent, selector: "ax-button", inputs: ["routerUrl", "ariaLabel"] }, { kind: "component", type: i8.LoginValueFormErrorComponent, selector: "ax-login-value-form-error", inputs: ["form", "propertyType"] }, { kind: "component", type: i9.LoginErrorsComponent, selector: "ax-login-errors", inputs: ["errorType"] }, { kind: "pipe", type: i4.PropertyTypeLabelPipe, name: "propertyTypeLabel" }, { kind: "pipe", type: i4.TranslatePipe, name: "translate" }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.5", ngImport: i0, type: OtpLoginEmailStepComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ax-otp-login-email-step', template: "<ax-login-errors [errorType]=\"errorType\"></ax-login-errors>\n\n<ax-value-edit\n  class=\"input\"\n  [label]=\"'EMAIL' | propertyTypeLabel\"\n  [form]=\"form\"\n  type=\"EMAIL\"\n  name=\"login\"\n  [errorsTemplate]=\"errorsTemplate\"\n  [autofocus]=\"true\"\n></ax-value-edit>\n\n<ax-button filled fullWidth class=\"action\" type=\"button\" color=\"accent\" (click)=\"continueClicked()\">\n  {{ 'label.continue' | translate }}\n</ax-button>\n\n<ng-template #errorsTemplate>\n  <ax-login-value-form-error\n    *ngIf=\"form.touched\"\n    [form]=\"form\"\n    [propertyType]=\"'EMAIL'\"\n  ></ax-login-value-form-error>\n</ng-template>\n", styles: [":host{display:flex;flex-direction:column;gap:.5rem}.form{margin-bottom:20px;background-color:#fff;border-radius:15px;padding:1.5rem 1.5rem 0}.value{display:flex;flex-direction:column;align-items:flex-end;margin-bottom:.5rem}.input{width:100%}.action{margin:1rem 1rem -20px}.action ::ng-deep .ax-button{font-size:1.2rem;text-transform:none;height:2.5rem}.back{margin:1rem auto -.5rem;width:auto}.back ::ng-deep .ax-button{font-size:small;height:2rem;width:auto;margin:0 auto}.back ::ng-deep .ax-button .icon{width:1rem;height:1rem}.verification ::ng-deep .verify{width:100%;display:block;position:relative;bottom:-20px}.verification ::ng-deep .verify .ax-button{font-size:1.2rem;text-transform:none;height:2.5rem;width:100%}.verification ::ng-deep .resend{height:0;position:relative;bottom:-30px}.verification ::ng-deep .error-message{height:0;position:relative;bottom:-30px;display:flex;text-align:center;flex-direction:column;gap:1rem}\n"] }]
        }], ctorParameters: function () { return [{ type: i1.SessionsService }, { type: i2.ModeService }, { type: i3.MatLegacySnackBar }, { type: i4.TranslateService }]; } });
//# sourceMappingURL=data:application/json;base64, 