@annalib/anna-cognito-lib 0.2.3 → 0.2.4

package/src/lib/components/password-matching/password-matching.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { PasswordMatchingComponent } from './password-matching.component';
+
+describe('PasswordMatchingComponent', () => {
+  let component: PasswordMatchingComponent;
+  let fixture: ComponentFixture<PasswordMatchingComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ PasswordMatchingComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(PasswordMatchingComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/components/password-matching/password-matching.component.ts

@@ -0,0 +1,92 @@
+// Angular import statements
+import { EventEmitter, Inject, Input, Output } from "@angular/core";
+import { Component, OnInit } from "@angular/core";
+import { AbstractControl, FormBuilder, FormGroup, ValidationErrors, ValidatorFn, Validators } from "@angular/forms";
+
+// Third party import statements
+import { debounceTime } from "rxjs/operators";
+
+// User defined import statements
+import { LoginConstant } from "../../constants/loginConstant";
+
+@Component({
+  selector: 'anna-cognito-lib-password-matching',
+  templateUrl: './password-matching.component.html',
+  styleUrls: ['./password-matching.component.scss']
+})
+export class PasswordMatchingComponent implements OnInit {
+  @Output() passwordChange = new EventEmitter();
+  @Output() confirmPasswordChange = new EventEmitter();
+
+  @Input() passwordNotMatching: boolean;
+  passwordForm: FormGroup;
+  constants: typeof LoginConstant;
+  constructor(@Inject(FormBuilder) private fb: FormBuilder) {}
+
+  ngOnInit() {
+      this.constants = LoginConstant;
+      this.createGroup();
+      this.formValueChanged();
+  }
+
+  formValueChanged() {
+      const password = this.passwordForm.get("password");
+      const confirmPassword = this.passwordForm.get("confirmPassword");
+
+      password && password.valueChanges.subscribe(() => {
+        password && password.setValidators([
+              Validators.required,
+              this.regexValidator(new RegExp(".{8,}"), { minLength: true }),
+              this.regexValidator(new RegExp("[a-z]"), { lowercase: true }),
+              this.regexValidator(new RegExp("[A-Z]"), { uppercase: true }),
+              this.regexValidator(new RegExp("[0-9]"), { number: true }),
+              this.regexValidator(new RegExp("[^a-zA-Z0-9]"), { specialCharacter: true }),
+          ]);
+          password.updateValueAndValidity({ emitEvent: false });
+          this.onPasswordChange();
+      });
+
+      if(confirmPassword){
+        confirmPassword.valueChanges.pipe(debounceTime(300)).subscribe(() => {
+          confirmPassword.setValidators([Validators.required]);
+          confirmPassword.updateValueAndValidity({ emitEvent: false });
+          this.onConfirmPasswordChange();
+        });
+      }
+    
+  }
+
+  onPasswordChange() {
+      let result = {
+          value: this.passwordForm.value.password,
+          status: this.passwordForm.controls['password'].status,
+      };
+      this.passwordChange.emit(result);
+  }
+
+  onConfirmPasswordChange() {
+      let result = {
+          value: this.passwordForm.value.confirmPassword,
+          status: this.passwordForm.controls['confirmPassword'].status,
+      };
+      this.confirmPasswordChange.emit(result);
+  }
+
+  createGroup() {
+      this.passwordForm = this.fb.group({
+          password: [null],
+          confirmPassword: [null],
+      });
+      return this.passwordForm;
+  }
+
+  // TODO: check the return again
+  regexValidator(regex: RegExp, error: ValidationErrors): any
+ {
+      return (control: AbstractControl): { [key: string]: boolean } => {
+          const valid = regex.test(control.value);
+          return (valid ? null : error) as any;
+      };
+  }
+
+}

package/src/lib/components/set-new-password/set-new-password.component.html

@@ -0,0 +1,31 @@
+<div class="main">
+  <section>
+      <header>
+          <img src="assets/images/Anna-Logo-for-footer-min.png" alt="Anna Logo" />
+      </header>
+      <article>
+          <form>
+              <div id="heading">
+                  {{ constants.setNewPasswordHeading }}
+              </div>
+
+              <div id="alert-div" *ngIf="authService.setNewPasswordErrorMessage">
+                  <span class="material-icons">report</span>
+                  <p>{{ authService.setNewPasswordErrorMessage }}</p>
+              </div>
+              <anna-cognito-lib-password-matching
+                  (passwordChange)="onPasswordChange($event)"
+                  (confirmPasswordChange)="onConfirmPasswordChange($event)"
+                  [passwordNotMatching]="passwordNotMatching"
+              >
+              </anna-cognito-lib-password-matching>
+              <button tabindex="3" class="login-btn" [disabled]="!isFormValid()" (click)="onSettingNewPassword()">
+                  {{ authService.setNewPasswordButtonMessage }}
+              </button>
+          </form>
+      </article>
+      <footer>
+          Powered by <span> <strong> SureWaves</strong></span>
+      </footer>
+  </section>
+</div>

package/src/lib/components/set-new-password/set-new-password.component.scss

@@ -0,0 +1 @@
+@import "../../scss/loginTemplate";

package/src/lib/components/set-new-password/set-new-password.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { SetNewPasswordComponent } from './set-new-password.component';
+
+describe('SetNewPasswordComponent', () => {
+  let component: SetNewPasswordComponent;
+  let fixture: ComponentFixture<SetNewPasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ SetNewPasswordComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(SetNewPasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/components/set-new-password/set-new-password.component.ts

@@ -0,0 +1,54 @@
+
+// Angular import statements
+import { Component, OnInit } from "@angular/core";
+import { Router } from "@angular/router";
+
+// User defined import statements
+import { AnnaLibAuthService } from "../../services/auth.service";
+import { LoginConstant } from "../../constants/loginConstant";
+type passwordType = { value: string | null, status: string | null };
+
+@Component({
+  selector: 'anna-cognito-lib-set-new-password',
+  templateUrl: './set-new-password.component.html',
+  styleUrls: ['./set-new-password.component.scss']
+})
+export class SetNewPasswordComponent implements OnInit {
+  passwordNotMatching = false;
+  
+  password: passwordType = { value: null, status: null };
+  confirmPassword: passwordType = { value: null, status: null };
+  constants: typeof LoginConstant;
+
+  constructor(public authService: AnnaLibAuthService, 
+              private router: Router) {}
+
+  ngOnInit() {
+      this.constants = LoginConstant;
+      this.authService.setNewPasswordButtonMessage = LoginConstant.setNewPasswordButton;
+  }
+
+  isFormValid() {
+      return this.password.status === "VALID" && this.confirmPassword.status === "VALID";
+  }
+  onPasswordChange($event: passwordType) {
+      this.password = $event;
+  }
+
+  onConfirmPasswordChange($event: passwordType) {
+      this.confirmPassword = $event;
+  }
+
+  onSettingNewPassword() {
+      if (this.password.value != this.confirmPassword.value) {
+          this.passwordNotMatching = true;
+      } else {
+          this.passwordNotMatching = false;
+          if (this.authService.setNewPasswordButtonMessage === LoginConstant.loginAgain) {
+              this.router.navigate([LoginConstant.loginPageUrl]);
+          } else {
+              this.authService.setNewPassword(this.password.value);
+          }
+      }
+  }
+}

package/src/lib/components/verify-and-set-new-password/verify-and-set-new-password.component.html

@@ -0,0 +1,54 @@
+<div class="main" [ngClass]="{ 'main-height': authService.verifyAndSetNewPasswordErrorMessage }">
+  <section>
+      <header>
+          <img src="assets/images/Anna-Logo-for-footer-min.png" alt="Anna Logo" />
+      </header>
+      <article>
+          <span class="back-btn" [routerLink]="constants.forgortPasswordPageUrl">
+              <i class="mdi mdi-arrow-left"></i>
+          </span>
+
+          <form [formGroup]="verifyOtpForm">
+              <div class="pull-left" id="heading">
+                  {{ constants.verifyAndSetNewPasswordheading }}
+              </div>
+              <p>{{ authService.verifyAndSetNewPasswordMessage }}</p>
+
+              <div id="alert-div" *ngIf="authService.verifyAndSetNewPasswordErrorMessage">
+                  <div id="icon-div">
+                      <span class="material-icons">report</span>
+                  </div>
+                  <p id="display-block-msg">{{ authService.verifyAndSetNewPasswordErrorMessage }}</p>
+              </div>
+
+              <input
+                  type="text"
+                  tabindex="1"
+                  formControlName="otp"
+                  [placeholder]="constants.enterOtp"
+                  autocomplete="new-field-name"
+                  [ngClass]="{ 'input-invalid': authService.verifyAndSetNewPasswordErrorMessage }"
+              />
+
+              <anna-cognito-lib-password-matching
+                  (passwordChange)="onPasswordChange($event)"
+                  (confirmPasswordChange)="onConfirmPasswordChange($event)"
+                  [passwordNotMatching]="passwordNotMatching"
+              >
+              </anna-cognito-lib-password-matching>
+              <button
+                  tabindex="4"
+                  type="submit"
+                  class="login-btn"
+                  [disabled]="authService.sessionLocked || !isFormValid()"
+                  (click)="onVerifyOtpSettingNewPassword()"
+              >
+                  {{ authService.verifyAndSetNewPasswordButton }}
+              </button>
+          </form>
+      </article>
+      <footer>
+          Powered by <span> <strong>SureWaves</strong> </span>
+      </footer>
+  </section>
+</div>

package/src/lib/components/verify-and-set-new-password/verify-and-set-new-password.component.scss

@@ -0,0 +1,40 @@
+@import "../../scss/loginTemplate", "../../scss/fonts";
+
+.main-height {
+  height: 105vh;
+}
+
+section {
+  top: 52%;
+}
+
+p {
+  color: $charcoal;
+  @include fonts(Roboto, 1rem, normal, normal, normal, normal, normal);
+}
+
+input[type="text"] {
+  margin-bottom: 24px;
+  &:focus {
+    box-shadow: none;
+  }
+}
+
+.back-btn {
+  width: 27px;
+  height: 27px;
+  top: -27px;
+  left: -15px;
+  cursor: pointer;
+  position: relative;
+  color: #268bff;
+  float: left;
+  border-radius: 50%;
+  border: 1px solid #268bff;
+  background-color: #f4f4f4;
+  & i {
+    position: absolute;
+    top: 0.1875rem;
+    left: 0.25rem;
+  }
+}

package/src/lib/components/verify-and-set-new-password/verify-and-set-new-password.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { VerifyAndSetNewPasswordComponent } from './verify-and-set-new-password.component';
+
+describe('VerifyAndSetNewPasswordComponent', () => {
+  let component: VerifyAndSetNewPasswordComponent;
+  let fixture: ComponentFixture<VerifyAndSetNewPasswordComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ VerifyAndSetNewPasswordComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(VerifyAndSetNewPasswordComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

package/src/lib/components/verify-and-set-new-password/verify-and-set-new-password.component.ts

@@ -0,0 +1,70 @@
+import { Component, Inject, OnInit } from "@angular/core";
+import { FormBuilder, FormGroup, Validators } from "@angular/forms";
+import { Router } from "@angular/router";
+import { AnnaLibAuthService } from "../../services/auth.service";
+import { LoginConstant } from "../../constants/loginConstant";
+type passwordType = { value: string | null, status: string | null };
+
+@Component({
+  selector: 'anna-cognito-lib-verify-and-set-new-password',
+  templateUrl: './verify-and-set-new-password.component.html',
+  styleUrls: ['./verify-and-set-new-password.component.scss']
+})
+export class VerifyAndSetNewPasswordComponent implements OnInit {
+  verifyOtpForm: FormGroup;
+  passwordNotMatching = false;
+  constants: typeof LoginConstant;
+  password: passwordType = { value: null, status: null };
+  confirmPassword: passwordType = { value: null, status: null };
+
+  constructor(
+      public authService: AnnaLibAuthService,
+      private fb: FormBuilder,
+      private router: Router
+  ) {}
+
+  ngOnInit() {
+      this.constants = LoginConstant;
+      this.authService.verifyAndSetNewPasswordButton = LoginConstant.setNewPasswordButton;
+      this.onIntialiseForm();
+  }
+
+  onIntialiseForm() {
+      this.verifyOtpForm = this.fb.group({
+          otp: [null, [Validators.required]],
+      });
+  }
+
+  isFormValid() {
+      if (
+          this.password.status === "VALID" &&
+          this.confirmPassword.status === "VALID" &&
+          this.verifyOtpForm.controls['otp'].valid
+      ) {
+          return true;
+      }
+      return false;
+  }
+
+  onPasswordChange($event: passwordType) {
+      this.password = $event;
+  }
+
+  onConfirmPasswordChange($event: passwordType) {
+      this.confirmPassword = $event;
+  }
+
+  onVerifyOtpSettingNewPassword() {
+      if (this.password.value != this.confirmPassword.value) {
+          this.passwordNotMatching = true;
+      } else {
+          this.passwordNotMatching = false;
+          if (this.authService.verifyAndSetNewPasswordButton === LoginConstant.regenerateOtp) {
+              this.router.navigate([LoginConstant.forgortPasswordPageUrl]);
+          } else {
+              this.password.value && this.authService.verifyCode(this.verifyOtpForm.controls['otp'].value, this.password.value);
+          }
+      }
+  }
+
+}

package/src/lib/config/acl-service.token.ts

@@ -0,0 +1,22 @@
+import { InjectionToken } from '@angular/core';
+
+/** Token to inject the acl service */
+export const ACL_SERVICE_TOKEN:
+    InjectionToken<IAclService> =
+        new InjectionToken<IAclService>('ACL service token');
+
+export interface IAclService {
+   urlToCognitoPrivilegeMap: {[key: string]: string};
+   DAILY_REVISION_REPORT_WRITE: string;
+   LUR_SETTINGS_WRITE: string;
+   MANAGE_BUSINESS_RULES_WRITE: string;
+   MANAGE_USERS_WRITE: string;
+   ORDER_BIZ_RULES_WRITE: string;
+   ORDER_REVISIONS_WRITE: string;
+   ORDER_SPOTS_REPORT_WRITE: string;
+   RATE_CARD_WRITE: string;
+   STATION_SYSTEM_SETTINGS_WRITE: string;
+   POLITICAL_WINDOW_WRITE: string;
+   
+   isUserAuthoriseToAcessManageUser(): boolean;
+}

package/src/lib/config/auth-service.token.ts

@@ -0,0 +1,15 @@
+import { InjectionToken } from '@angular/core';
+import { Observable } from 'rxjs';
+
+/** Token to inject the auth service */
+export const AUTH_SERVICE_TOKEN:
+    InjectionToken<IAuthService> =
+        new InjectionToken<IAuthService>('Auth service token');
+
+export interface IAuthService {
+   isLoggingIn: boolean; 
+   onSuccessfulAuthenticatingUser(result: any): void;
+   isUsernameAvailable(username: string): Observable<any>;
+   navigateBasedOnUserRole(loginUserData: any): void;
+   getPublicIp(): string;
+}

package/src/lib/config/library.config.ts

@@ -0,0 +1,8 @@
+export class LibraryConfig { 
+  loginPageLogoImgUrl: string = '';
+  cognito : {
+    userPoolId: string;
+    clientId: string; 
+  }
+ 
+}

package/src/lib/constants/loginConstant.ts

@@ -0,0 +1,50 @@
+export class LoginConstant {
+  // Login page
+  static readonly enterEmail = "Enter your username";
+  static readonly password = "Password";
+  static readonly confirmPassword = "Confirm Password";
+  static readonly login = "Login";
+  static readonly otp = "OTP";
+  static readonly forgotPassword = "Forgot " + LoginConstant.password.toLowerCase() + "?";
+
+  // set new password
+  static readonly setNewPasswordHeading = "Set new " + LoginConstant.password.toLowerCase();
+  static readonly setNewPasswordButton = "Set and " + LoginConstant.login.toLowerCase() + " again";
+  static readonly passwordMustContain = "The password must contain:";
+  static readonly minimumCharacter = "Minimum 8 characters";
+  static readonly oneUppercase = "1 Uppercase";
+  static readonly oneLowercase = "1 Lowercase";
+  static readonly oneNumber = "1 Numerical";
+  static readonly specialCharacter = "1 Special character";
+  static readonly passwordNotMatching = "The passwords do not match. Please try again.";
+  static readonly userNamePasswordIncorrect = "Incorrect username or password";
+  static readonly userNotFound = "No registered user found";
+  static readonly loginAgain = LoginConstant.login + " again";
+
+  // verify OTP & set new password
+  static readonly verifyAndSetNewPasswordheading = "Enter " + LoginConstant.otp + " & set new password";
+  static readonly verifyAndSetNewPasswordMessage = "An " + LoginConstant.otp + " has been succesfully emailed to ";
+  static readonly pleaseEnterItBelow = ". Please enter it below.";
+  static readonly regenerateOtp = "Regenerate " + LoginConstant.otp;
+  static readonly enterOtp = "Enter " + LoginConstant.otp;
+  static readonly submit = "Submit";
+  static readonly attempt = "Attempt";
+  static readonly attemptLimitExceeded =
+      "You have exceeded the maximum number of allowed attempts. Please try again after 15 minutes.";
+  static readonly attemptMessage = " of 5. The OTP entered is incorrect. Please try again with the right one.";
+  static readonly sessionExpired = "The session has expired. Please try again.";
+
+  // forgot password
+  static readonly forgotPasswordHeading = "Forgot your password?";
+  static readonly forgotPasswordMessage = "Please enter your username.";
+  static readonly forgotPasswordButton = "Get " + LoginConstant.otp;
+  static readonly apiFailErrorMessage = "Unable to connect to server right now. Please try after some time.";
+
+  //url
+  static readonly setNewPasswordUrl = "/set-new-password";
+  static readonly forgortPasswordPageUrl = "/forgot-password";
+  static readonly verifyAndSetNewPasswordUrl = "/verify-and-set-new-password";
+  static readonly loginPageUrl = "/login";
+  static readonly homePageUrl = "/home";
+  static readonly stationSettingUrl = "/station-settings";
+}

package/src/lib/directives/spinner-button/spinner-button.directive.spec.ts

@@ -0,0 +1,40 @@
+import { Component } from "@angular/core";
+import { ComponentFixture, TestBed } from "@angular/core/testing";
+import { SpinnerButtonDirective } from "./spinner-button.directive";
+@Component({
+    template: `<button
+        class="my-btn"
+        [appSpinnerButton]="loading"
+        [spinnerButtonText]="'Button text'"
+        (click)="startLoading()"
+    ></button>`,
+})
+class DummyComponentForTestingSpinnerDirective {
+    loading = false;
+    startLoading() {
+        this.loading = true;
+        // to simulate async API call
+        setTimeout(() => {
+            this.loading = false;
+        }, 100);
+    }
+}
+
+fdescribe("SpinnerButtonDirective", () => {
+    let component: DummyComponentForTestingSpinnerDirective;
+    let fixture: ComponentFixture<DummyComponentForTestingSpinnerDirective>;
+
+    beforeEach(() => {
+        TestBed.configureTestingModule({
+            declarations: [SpinnerButtonDirective, DummyComponentForTestingSpinnerDirective],
+        });
+
+        fixture = TestBed.createComponent(DummyComponentForTestingSpinnerDirective);
+        component = fixture.componentInstance;
+        fixture.detectChanges();
+    });
+
+    it("0. [ Passed an component instance ] - should create component ", () => {
+        expect(component).toBeTruthy();
+    });
+});

package/src/lib/directives/spinner-button/spinner-button.directive.ts

@@ -0,0 +1,36 @@
+import { Directive, ElementRef, Input, Renderer2, SimpleChanges, OnChanges, OnInit } from "@angular/core";
+
+@Directive({
+    selector: "[anna-cognito-lib-SpinnerButton]",
+})
+export class SpinnerButtonDirective implements OnInit, OnChanges {
+    @Input("anna-cognito-lib-SpinnerButton") loading: boolean;
+    @Input("spinnerButtonText") spinnerButtonText: string;
+    child: HTMLDivElement;
+    button: any;
+
+    constructor(
+      private el: ElementRef, 
+      private renderer: Renderer2) {
+        this.button = this.el.nativeElement;
+        this.child = document.createElement("div");
+    }
+
+    ngOnInit() {}
+
+    ngOnChanges(changes: SimpleChanges) {
+        if (changes['spinnerButtonText'] && changes['spinnerButtonText'].currentValue) {
+            this.button.innerHTML = this.spinnerButtonText;
+        }
+        if (changes['loading'] && changes['loading'].currentValue) {
+            this.button.innerHTML = "";
+            this.button.setAttribute("disabled", "true");
+            this.child.classList.add("spinner-for-button-directive");
+            this.renderer.appendChild(this.button, this.child);
+        } else {
+            this.child.classList.remove("spinner-for-button-directive");
+            this.button.removeAttribute("disabled");
+            this.button.innerHTML = this.spinnerButtonText;
+        }
+    }
+}

package/src/lib/models/auth.model.ts

@@ -0,0 +1,24 @@
+export class AuthenticationData {
+  Username: string;
+  Password: string;
+  constructor(Username: string, Password: string) {
+      this.Username = Username;
+      this.Password = Password;
+  }
+}
+
+export class UserPoolInformation {
+  UserPoolId: string;
+  ClientId: string;
+  constructor(UserPoolId: string, ClientId: string) {
+      this.UserPoolId = UserPoolId;
+      this.ClientId = ClientId;
+  }
+}
+
+export class UsernameInfo {
+  isUsernameAvailable: boolean;
+  constructor(object: { isUsernameAvailable: boolean }) {
+      this.isUsernameAvailable = object.isUsernameAvailable;
+  }
+}