@annalib/anna-cognito-lib 0.2.1 → 0.2.4

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;
+  }
+}

package/src/lib/scss/_colors.scss

@@ -0,0 +1,107 @@
+$primary-color: #268bff;
+$background-white: #ffffff;
+$lightGray: #d3d3d3;
+$lightGray-1: #f1f1f1;
+$lightGray-2: #b3b3b3;
+$lightGray-3: #ededed;
+$lightGray-4: #d4d4d4;
+$lightGray-5: #e6e6e6;
+$lightGray-6: #c8c8c8;
+$lightGray-7: #9b9b9b;
+$lightGray-9: #d9e1e6;
+$lightGray-8: #b7b7b7;
+$dimGray: #747474;
+$lightDimGray: #666666;
+$coralRed: #ff4747;
+$greenCyan: #00c853;
+$bookedColor: #9b1b93;
+$orderedColor: #d780d1;
+$billableColor: #f2bdef;
+$nationalColor: #f5dd31;
+$localColor: #8db72e;
+$lavenderBlue: #c7e1ff;
+$aliceBlue: #e3f0ff;
+$dodgerBlue: #1582ff;
+$lightGrey: #d6d6d6;
+$coldTurkey: #ceb6b6;
+$lightSilver: #d8d8d8;
+$GraythirtySeven: #5e5e5e;
+$charcoal: #4a4a4a;
+$sellerReviewColor: #f3bd18;
+$buyerReviewColor: #1565c0;
+$reviewCompleteColor: #00c853;
+$recoveredPreemptionColor: #0071ce;
+$deepSkyBlue: #00b0ff;
+$licorice: #2e384d;
+$navyBlue: #0071ce;
+$nobelGray: #b7b6b6;
+$whiteSmoke: #f7f6f6;
+$gray: #979797;
+$paleBlue: #c2cfd6;
+$lightViolet: #9169fc;
+$dimViolet: #e5dbff;
+$darkViolet: #555099;
+$whisper: #e9e9e9;
+$lynxWhite: #f7f7f7;
+$lightAliceBlue: #e5f1ff;
+$veryLightGrey: #cfcfcf;
+$darkCharcoal: #333333;
+$noRevisionFound: #f47228;
+$redOrange: #f44336;
+$DRRBgColor: #edecec;
+$darkYellowWarning: #f3c639;
+$lightYellow: #fff8e3;
+$filterRadioContainer: #f4f4f4;
+$oliveGreen: #8bac2a;
+$calendarLabel: #222b45;
+$olivedrab: #6b8e23;
+$redOrange: #fe3824;
+$chineseSilver: #cccccc;
+$grey: #767676;
+$primary-success: #47d490;
+$secondary-success: #ebf6f1;
+$primary-warning: #f3c639;
+$secondary-warning: #fff8e3;
+$primary-dark: #90a4ae;
+$secondary-dark: #ebedee;
+$primary-danger: #fc8383;
+$secondary-danger: #ffeded;
+$Gray94: #f0f0f0;
+$whisper: #ededed;
+$whiteSmoke2: #f4f4f4;
+$pinkSwan: #b5b5b5;
+$matterhorn: #4f4f4f;
+$lightGrey: #d4d4d4;
+$gray74: #bdbdbd;
+$gray86: #dbdbdb;
+$darkBlueShade: #222b45;
+$green: #8bac2a;
+$darkPurpleShade: #555099;
+$pattensBlue: #d8eaff;
+$quartz: #dddceb;
+$darkGray: #a7a7a7;
+$darkGray1: #cbcbcb;
+$awaitingSellerReview: #f7f2d1;
+$awaitingSellerReviewBorder: #dec30b;
+$amber: #ffc107;
+$whiteSmoke3: #efefef;
+$greyChateau: #a2a8ad;
+$roseBud: #f9b3ae;
+$paleRed: #fde4e3;
+$redOrange3: #f44336;
+$redOrange4: #fe3824;
+$gray43: #6e6e6e;
+$dodgerBlue2: #4099ff;
+$fruitSalad: #43a047;
+$nero: #212121;
+$darkGray2: #a4a4a4;
+$pinkSwan: #b7b7b7;
+$blue: #d8eaff;
+$lightBlue: #eff6ff;
+$sunsetOrange: #ff5353;
+$redShade: #ff5252;
+$lightBlueShade: #d6dcff;
+$blueBerry: #536dfe;
+$darkPink: #be489d;
+$lightPinkShade: #f4e7f2;
+$sellerGroupChildRow: #F9F3F8;

package/src/lib/scss/_fonts.scss

@@ -0,0 +1,86 @@
+// body font should be 16px
+$fs-2: 0.125rem;
+$fs-3: 0.188rem;
+$fs-4: 0.25rem;
+$fs-5: 0.3125rem;
+$fs-6: 0.375rem;
+$fs-7: 0.4375rem;
+$fs-8: 0.5rem;
+$fs-9: 0.5625rem;
+$fs-10: 0.625rem;
+$fs-11: 0.6875rem;
+$fs-12: 0.75rem;
+$fs-13: 0.8125rem;
+$fs-14: 0.875rem;
+$fs-15: 0.9375rem;
+$fs-16: 1rem;
+$fs-17: 1.0625rem;
+$fs-18: 1.125rem;
+$fs-19: 1.1875rem;
+$fs-20: 1.25rem;
+$fs-21: 1.3125rem;
+$fs-22: 1.375rem;
+$fs-23: 1.4375rem;
+$fs-24: 1.5rem;
+$fs-25: 1.5625rem;
+$fs-26: 1.625rem;
+$fs-27: 1.6875rem;
+$fs-28: 1.75rem;
+$fs-29: 1.8125rem;
+$fs-30: 1.875rem;
+$fs-31: 1.938rem;
+$fs-32: 2rem;
+$fs-33: 2.063rem;
+$fs-34: 2.125rem;
+$fs-35: 2.188rem;
+$fs-36: 2.25rem;
+$fs-37: 2.313rem;
+$fs-38: 2.375rem;
+$fs-39: 2.438rem;
+$fs-40: 2.5rem;
+$fs-41: 2.563rem;
+$fs-42: 2.625rem;
+$fs-43: 2.688rem;
+$fs-44: 2.75rem;
+$fs-45: 2.813rem;
+$fs-46: 2.875rem;
+$fs-47: 2.938rem;
+$fs-48: 3rem;
+$fs-49: 3.063rem;
+$fs-50: 3.125rem;
+$fs-51: 3.188rem;
+$fs-52: 3.25rem;
+$fs-53: 3.313rem;
+$fs-54: 3.375rem;
+$fs-55: 3.438rem;
+$fs-56: 3.5rem;
+$fs-57: 3.563rem;
+$fs-58: 3.625rem;
+$fs-59: 3.688rem;
+$fs-60: 3.75rem;
+$fs-65: 4.063rem;
+$fs-68: 4.25rem;
+$fs-80: 5rem;
+$fs-70: 4.375rem;
+$fs-90: 5.6rem;
+$fs-115: 7.188rem;
+$fs-120: 7.5rem;
+$fs-128: 8rem;
+$fs-135: 8.438rem;
+$fs-144: 9rem;
+$fs-146: 9.125rem;
+$fs-164: 10.25rem;
+$fs-170: 10.625rem;
+$fs-200: 12.5rem;
+$fs-250: 15.625rem;
+$fs-600: 37.5rem;
+
+@mixin fonts($fontFamily, $fontSize, $fontStretch, $fontWeight, $fontStyle, $lineHeight, $letterSpacing) {
+  font-family: $fontFamily;
+  font-size: $fontSize;
+  font-weight: $fontWeight;
+  font-stretch: $fontStretch;
+  font-style: $fontStyle;
+  line-height: $lineHeight;
+  letter-spacing: $letterSpacing;
+}

package/src/lib/scss/_loginTemplate.scss

@@ -0,0 +1,164 @@
+@import "./colors", "./fonts";
+@keyframes show {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+@-moz-keyframes show {
+  0% {
+    opacity: 0;
+  }
+  50% {
+    opacity: 0.5;
+  }
+  100% {
+    opacity: 1;
+  }
+}
+
+html {
+  overflow-y: scroll;
+}
+
+@mixin disabled-btn-style() {
+  background-color: $chineseSilver;
+  color: $background-white;
+  cursor: not-allowed;
+}
+
+.main {
+  background-color: #ffffff;
+  background-size: cover;
+  font-family: Roboto;
+  height: 100vh;
+}
+
+section {
+  top: 45%;
+  left: 50%;
+  position: absolute;
+  transform: translate(-50%, -50%);
+  width: 20.875rem;
+  animation: show 0.5s 1;
+  -moz-animation: show 0.5s 1;
+}
+
+.container {
+  width: 100%;
+  height: 100%;
+  overflow: auto;
+}
+
+header {
+  height: auto;
+  width: 100%;
+  text-align: center;
+}
+
+article {
+  margin-top: 0.9375rem;
+  margin-bottom: 0.9375rem;
+  border: 1px solid $gray;
+  background-color: $whiteSmoke2;
+  padding: 2rem 1.375rem;
+  border-radius: 0.375rem;
+  box-shadow: 0 0.125rem 0.4375rem 0 rgba(0, 0, 0, 0.1);
+  & #heading {
+    color: $nero;
+    text-align: center;
+    margin-bottom: 1.5rem;
+    @include fonts(Roboto, 1.125rem, normal, normal, normal, normal, normal);
+  }
+}
+
+#alert-div {
+  padding: 0.25rem 0 0 0;
+  margin-bottom: 0.75rem;
+  border-radius: 0.25rem;
+  border: solid 1px $roseBud;
+  background-color: $paleRed;
+
+  & .material-icons {
+    color: $redOrange3;
+    font-size: 1rem;
+    margin-left: 0.5rem;
+  }
+
+  & p {
+    margin: -1.5625rem 0 0 1.8rem;
+    padding: 0.3125rem 0;
+    color: $charcoal;
+    @include fonts(Roboto, 0.75rem, normal, normal, normal, normal, normal);
+  }
+}
+
+footer {
+  align-items: baseline;
+  color: $gray43;
+  opacity: 0.9;
+  display: flex;
+  @include fonts(Ubuntu, 1rem, normal, normal, normal, normal, normal);
+  justify-content: center;
+  & span {
+    font-size: 1.3125rem;
+    font-weight: bold;
+    margin-left: 0.25rem;
+  }
+}
+
+input[type="password"],
+input[type="text"],
+input[type="number"] {
+  width: 100%;
+  height: 30px;
+  padding: 0.75rem 1rem;
+  border: 1px solid $gray;
+  margin-bottom: 0.625rem;
+  border-radius: 0.375rem;
+}
+
+.login-btn {
+  width: 100%;
+  height: 2.5rem;
+  border: 0;
+  color: #fff;
+  background-color: $primary-color;
+  border-radius: 0.375rem;
+  font-size: 1rem;
+  margin-top: 0.9375rem;
+  &:hover {
+    background-color: $dodgerBlue2;
+    cursor: pointer;
+  }
+  &:disabled {
+    @include disabled-btn-style;
+  }
+}
+
+.input-invalid {
+  border: 1px solid $redOrange4 !important;
+}
+
+input[type="password"].ng-dirty.ng-invalid,
+input[type="text"].ng-dirty.ng-invalid {
+  border: 1px solid $redOrange4;
+}
+
+input[type="submit"]:focus,
+input[type="password"]:focus,
+input[type="text"]:focus,
+input[type="checkbox"]:focus,
+button:focus {
+  outline: none;
+}
+
+input::placeholder {
+  color: $darkGray2;
+}

package/src/lib/services/acl.service.ts

@@ -0,0 +1,24 @@
+import { Inject, Injectable } from "@angular/core";
+import { IAclService, ACL_SERVICE_TOKEN } from '../config/acl-service.token';
+
+@Injectable({
+    providedIn: "root",
+})
+export class AnnaLibAclService {
+    constructor(@Inject(ACL_SERVICE_TOKEN) public consumingProjectAclService: IAclService) {}
+
+    userGroupsInCognitoJWT: string[];
+    isUserAuthorisedToAccessPage(url: string): boolean {
+        let privilegeName = this.consumingProjectAclService.urlToCognitoPrivilegeMap[url];
+        return this.userGroupsInCognitoJWT.includes(privilegeName);
+    }
+
+    isUserAuthorisedToAccessElement(privilege: string): boolean {
+        return this.userGroupsInCognitoJWT.includes(privilege);
+    }
+
+    isUserAuthoriseToAcessManageUser(): boolean {
+      return this.consumingProjectAclService.isUserAuthoriseToAcessManageUser();
+    }
+
+}

package/src/lib/services/auth.service.ts

@@ -0,0 +1,243 @@
+// Angular import statements
+import { Inject, Injectable } from "@angular/core";
+import { Router } from "@angular/router";
+
+// Third party import statements
+import { CognitoUserPool, CognitoUser, AuthenticationDetails, CognitoUserSession } from "amazon-cognito-identity-js";
+
+// User defined import statements
+import { LoginConstant } from "../constants/loginConstant";
+import { AuthenticationData, UserPoolInformation } from "../models/auth.model";
+import { AnnaLibAclService } from './acl.service';
+import { LibraryConfig } from '../config/library.config';
+import { IAuthService, AUTH_SERVICE_TOKEN } from '../config/auth-service.token';
+
+@Injectable({
+    providedIn: "root",
+})
+export class AnnaLibAuthService  {
+    poolData: UserPoolInformation;
+    userPool: CognitoUserPool;
+    cognitoUser: CognitoUser;
+    authenticationDetails: AuthenticationDetails;
+    tokenValid: boolean;
+    accessToken: string;
+    userAttribute: any;
+    loginErrorMessage: string | null;
+    setNewPasswordErrorMessage: string;
+    setNewPasswordButtonMessage: string;
+    verifyAndSetNewPasswordErrorMessage: string;
+    verifyAndSetNewPasswordMessage: string;
+    verifyAndSetNewPasswordButton: string;
+    noOfAttempts = 0;
+    sessionLocked = false;
+    userName: any;
+    accessTokenTimerId: any;
+    IdToken: any;
+
+    constructor(
+        private router: Router,
+        public aclService: AnnaLibAclService,
+        public libraryConfig: LibraryConfig,
+        @Inject(AUTH_SERVICE_TOKEN) public consumingProjectAuthService: IAuthService) {
+          if(!consumingProjectAuthService) {
+            throw new Error('You must provide a authService');
+          }
+        }
+
+    ngOnInit() {}
+
+    /***
+   1. takes user pool data (userPool ID and client ID)
+   2. if current user is null then it means user already logged out then simply return Promise<false>
+   3. if current user present check if token is valid for it.
+ */
+    isUserLoggedIn(): Promise<boolean> {
+        let currentUser = this.getCurrentUserDetails();
+        if (currentUser) {
+            return new Promise((resolve, reject) => {
+              currentUser && currentUser.getSession((error: Error, token: CognitoUserSession | null) => {
+                    if (token) {
+                        this.getAllCognitoTokenAndGroups(token);
+                        resolve(true);
+                    } else {
+                        this.sessionTimeout();
+                        resolve(false);
+                    }
+                });
+            });
+        } else {
+            return new Promise((resolve) => {
+                clearInterval(this.accessTokenTimerId);
+                resolve(false);
+            });
+        }
+    }
+
+    sessionTimeout() {
+        localStorage.clear();
+        clearInterval(this.accessTokenTimerId);
+        this.router.navigate([LoginConstant.loginPageUrl]);
+    }
+
+    refreshAccessToken() {
+        let currentUser = this.getCurrentUserDetails();
+        let accessTokenExpiration = localStorage.getItem("accessTokenExpiration");
+        let expTime = accessTokenExpiration ? parseInt(accessTokenExpiration) : 0;
+        this.accessTokenTimerId = setInterval(() => {
+            let counter = 1000;
+            let delayFunction = setTimeout(() => {
+              currentUser && currentUser.getSession((error: any, token: CognitoUserSession | null) => {
+                    if (token) {
+                        this.getAllCognitoTokenAndGroups(token);
+                        let newExpTime = this.computeTokenExpiration(this.IdToken);
+
+                        if (newExpTime <= 0) {
+                            newExpTime = 1000;
+                            counter = 0;
+                            if (delayFunction) {
+                                clearInterval(delayFunction);
+                            }
+                        }
+                        expTime = newExpTime;
+                        localStorage.setItem("accessTokenExpiration", newExpTime.toString());
+                        clearInterval(this.accessTokenTimerId);
+                        this.refreshAccessToken();
+                    } else if (error.code === "NotAuthorizedException") {
+                        this.sessionTimeout();
+                    }
+                });
+            }, counter);
+        }, expTime);
+    }
+
+    computeTokenExpiration(token: any) {
+        let currentTime = Math.floor(Date.now() / 1000);
+        let tokenTime = token.payload.exp;
+        let expTime = (tokenTime - currentTime) * 1000;
+        return expTime;
+    }
+
+
+    getCurrentUserDetails() {
+        let poolData = new UserPoolInformation(this.libraryConfig.cognito.userPoolId, this.libraryConfig.cognito.clientId);
+        let userPool = new CognitoUserPool(poolData);
+        return userPool.getCurrentUser();
+    }
+
+    getCognitoUserDetails(email: string): CognitoUser {
+        this.poolData = new UserPoolInformation(this.libraryConfig.cognito.userPoolId, this.libraryConfig.cognito.clientId);
+        this.userPool = new CognitoUserPool(this.poolData);
+
+        let userData = {
+            Username: email,
+            Pool: this.userPool,
+        };
+        let cognitoUser = new CognitoUser(userData);
+        return cognitoUser;
+    }
+
+    authenticate(email: string, password: string) {
+        this.loginErrorMessage = null;
+        let authData = new AuthenticationData(email, password);
+        this.authenticationDetails = new AuthenticationDetails(authData);
+
+        this.cognitoUser = this.getCognitoUserDetails(email);
+        this.CognitoAuthentication(this.authenticationDetails);
+    }
+
+    CognitoAuthentication(authenticationDetails: AuthenticationDetails) {
+        this.cognitoUser.authenticateUser(authenticationDetails, {
+            onSuccess: async (result) => {
+                this.getAllCognitoTokenAndGroups(result);
+                await this.consumingProjectAuthService.onSuccessfulAuthenticatingUser(result);
+            },
+            onFailure: (err) => {
+                this.consumingProjectAuthService.isLoggingIn = false;
+                if (err.message === "Password attempts exceeded") {
+                    this.loginErrorMessage = LoginConstant.attemptLimitExceeded;
+                } else {
+                    this.loginErrorMessage = LoginConstant.userNamePasswordIncorrect;
+                }
+            },
+            newPasswordRequired: (data) => {
+                this.consumingProjectAuthService.isLoggingIn = false;
+                this.userAttribute = data;
+                this.router.navigate([LoginConstant.setNewPasswordUrl]);
+            },
+        });
+    }
+
+    setNewPassword(newPassword: any) {
+        delete this.userAttribute.email;
+        delete this.userAttribute.email_verified;
+        delete this.userAttribute.phone_number_verified;
+        this.cognitoUser.completeNewPasswordChallenge(newPassword, this.userAttribute, {
+            onSuccess: (result) => {
+                this.router.navigate([LoginConstant.loginPageUrl]);
+            },
+            onFailure: (error) => {
+                this.setNewPasswordErrorMessage = LoginConstant.sessionExpired;
+                this.setNewPasswordButtonMessage = LoginConstant.loginAgain;
+            },
+        });
+    }
+
+    onForgotPasswordGenerateOTP(email: string) {
+        this.userName = email;
+        this.cognitoUser = this.getCognitoUserDetails(email);
+        this.cognitoUser.forgotPassword({
+            onSuccess: (result) => {
+                this.verifyAndSetNewPasswordMessage =
+                    LoginConstant.verifyAndSetNewPasswordMessage +
+                    result.CodeDeliveryDetails.Destination +
+                    LoginConstant.pleaseEnterItBelow;
+                this.router.navigate([LoginConstant.verifyAndSetNewPasswordUrl]);
+            },
+            onFailure: (err) => {},
+        });
+    }
+
+    verifyCode(verificationCode: string, newPassword: string) {
+        this.cognitoUser.confirmPassword(verificationCode, newPassword, {
+            onFailure: (error) => {
+                this.noOfAttempts = this.noOfAttempts + 1;
+                this.verifyAndSetNewPasswordErrorMessage = this.forgotPasswordError(error, this.noOfAttempts);
+            },
+            onSuccess: () => {
+                this.router.navigate([LoginConstant.loginPageUrl]);
+            },
+        });
+    }
+
+    forgotPasswordError(err: any, noOfAttempts: number) {
+        let errorMessage;
+        switch (err.code) {
+            case "LimitExceededException":
+                this.sessionLocked = true;
+                errorMessage = LoginConstant.attemptLimitExceeded;
+                break;
+            case "ExpiredCodeException":
+                errorMessage = LoginConstant.sessionExpired;
+                this.verifyAndSetNewPasswordButton = LoginConstant.regenerateOtp;
+                break;
+            default:
+                errorMessage = LoginConstant.attempt + " " + noOfAttempts + LoginConstant.attemptMessage;
+        }
+        return errorMessage;
+    }
+
+    getAllCognitoTokenAndGroups(token: CognitoUserSession) {
+      this.accessToken = token.getAccessToken().getJwtToken();
+      this.IdToken = token.getIdToken();
+      if ("cognito:groups" in token.getAccessToken().payload) {
+          this.aclService.userGroupsInCognitoJWT = token.getAccessToken().payload["cognito:groups"];
+      } else {
+          this.aclService.userGroupsInCognitoJWT = [];
+      }
+    }
+
+
+
+}
+