verben-authentication-ui 1.0.12 → 1.0.13

package/src/lib/components/role-control/role-control.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { RoleControlComponent } from './role-control.component';
-import { SharedModule } from '../../shared/shared.module';
-
-@NgModule({
-  declarations: [RoleControlComponent],
-  imports: [SharedModule],
-  exports: [RoleControlComponent],
-})
-export class RoleControlModule {}

package/src/lib/components/role-control/role-control.service.spec.ts

@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { RoleControlService } from './role-control.service';
-
-describe('RoleControlService', () => {
-  let service: RoleControlService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(RoleControlService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});

package/src/lib/components/role-control/role-control.service.ts

@@ -1,53 +0,0 @@
-import { Injectable } from '@angular/core';
-import { ColumnDefinition } from 'verben-ng-ui';
-import { Role } from '../../models/Role';
-import { AuthorizationService } from '../../services/authorization.service';
-import { MappedRole } from './MappedRole';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class RoleControlService {
-  constructor() {}
-
-  get roleColumns(): ColumnDefinition<MappedRole>[] {
-    return [
-      {
-        id: 'select',
-        header: '',
-      },
-      {
-        id: 'createdAt',
-        header: 'CREATED',
-        accessorKey: 'CreatedAt',
-      },
-      {
-        id: 'updatedAt',
-        header: 'UPDATED',
-        accessorKey: 'UpdatedAt',
-      },
-      {
-        id: 'name',
-        header: 'NAME',
-        accessorFn: (row: MappedRole) => {
-          return row;
-        },
-      },
-      {
-        id: 'permissions',
-        header: 'PERMISSIONS',
-        accessorFn: (row: MappedRole) => {
-          const sum = row.RoleContexts.filter((x) => x.Selected == true).length;
-          return `${sum} of ${row.RoleContexts.length} Permissions`;
-        },
-      },
-      {
-        id: 'actions',
-        header: 'ACTIONS',
-        accessorFn: (row: MappedRole) => {
-          return row;
-        },
-      },
-    ];
-  }
-}

package/src/lib/components/sign-in/sign-in.component.css

@@ -1,21 +0,0 @@
-a{ 
-    text-decoration: underline;
-}
-
-.flexWrapper{ 
- display: flex;
- flex-direction: column;
- gap:20px;
- margin-top: 12px;
-}
-.formWrapper{ 
- display: flex;
- flex-direction: column;
- gap:20px;
-}
-
-.pwdWrapper{ 
- display: flex;
- justify-content: flex-end;
- cursor: pointer;
-}

package/src/lib/components/sign-in/sign-in.component.html

@@ -1,83 +0,0 @@
-<section
-[ngStyle]="styles"
-class="{{ customClass }}"
->
-    <h2 class="{{headlingClass}}">{{headlingText}}</h2>
-    <form [formGroup]="loginForm" (ngSubmit)="submit('InApp')" class="flexWrapper"> 
-      <div class="formWrapper" *ngIf="showform"> 
-      <verbena-input
-        [label]="'Email'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'email'"
-        formControlName="Email"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        class="outline-none focus-none"
-      ></verbena-input>
-      <div> 
-        <verbena-input
-        [label]="'Password'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'password'"
-        formControlName="Password"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        [passwordToggle]="true"
-        [passLength]="5"
-        [customErrorMessages]="{
-          password:'Password is required'
-        }"
-        class="outline-none focus-none"
-      ></verbena-input>
-      <div class="pwdWrapper"> 
-          <p clas="mb-0"> <a [routerLink]="forgetPasswordLink" class="{{forgetPasswordClass}}">Forgot password</a></p>
-      </div>
-      </div>
-      <lib-button 
-      [buttonClass]="btnClass"
-      [color]="btnColor"
-      [border]="btnBorder"
-      [borderRadius]="btnBorderRadius"
-      [bgColor]="btnBgColor"
-      [pd]="btnPd"
-      [text]="btnText" 
-      type="submit" 
-      [disabled]="!this.checkForm()"
-      ></lib-button>
-    </div>
-    <div> 
-      <p *ngIf="requestAccessLink">
-        <a [routerLink]="requestAccessLink"  class="{{requestAccessClass}}">Click here to request user access</a>
-      </p>
-     
-    </div>
-  </form>
-  <div> 
-    <div *ngIf="AuthMechanisms !== null"> 
-      <verben-o-auth 
-        [authMechanisms]="AuthMechanisms"
-      ></verben-o-auth>
-    </div>
-      <p class="{{createAccountClass}}" *ngIf="createAccountLink">
-        Don't have an account?
-        <a [routerLink]="createAccountLink"  class="{{createAccountLinkClass}}">Create an account</a>
-      </p>
-  </div>
-  </section>
-  

package/src/lib/components/sign-in/sign-in.component.spec.ts

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

package/src/lib/components/sign-in/sign-in.component.ts

@@ -1,267 +0,0 @@
-import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';
-import {
-  AbstractControl,
-  FormBuilder,
-  FormControl,
-  FormGroup,
-  ValidationErrors,
-  Validators,
-} from '@angular/forms';
-import { LoginData } from '../../models/log-in';
-import { HttpWebRequestService } from '../../services/http-web-request.service';
-import { UtilService } from '../../services/util.service';
-import { ErrorResponse } from '../../models/ErrorResponse';
-import { ResponseKeyValue } from '../../models/ResponseKeyValue';
-import { EnvironmentService } from '../../services/environment.service';
-import { AuthMechanism, MechanismType } from '../../models/auth-mechanism';
-import { ActivatedRoute, Router } from '@angular/router';
-import { IOauthResp } from '../../models/oauth-resp';
-import {TenantConfig} from '../../models/TenantConfig'
-import { EncryptionService } from '../../services/encryption.service';
-import CryptoJS from 'crypto-js';
-@Component({
-  selector: 'verben-sign-in',
-  templateUrl: './sign-in.component.html',
-  styleUrl: './sign-in.component.css',
-})
-export class SignInComponent implements OnInit {
-  @Input() headlingText: string = 'Sign in';
-  @Input() width: string = '';
-  @Input() maxWidth: string = '';
-  @Input() margin: string = '';
-  @Input() pd: string = '';
-  @Input() customClass: string = '';
-  @Input() headlingClass: string = '';
-  @Input() bgColor: string = '#fff';
-  @Input() boxShadow: string = '4px 4px 4px rgba(0, 0, 0, 0.25)';
-  @Input() border: string = '1px solid #66666680';
-  @Input() borderRadius: string = '24px';
-  @Input() textColor: string = '#333';
-  @Input() height: string = 'auto';
-  @Input() forgetPasswordClass: string = '';
-  @Input() requestAccessClass: string = '';
-  @Input() createAccountClass: string = '';
-  @Input() createAccountLinkClass: string = '';
-
-  // links
-  @Input() forgetPasswordLink: string = '';
-  @Input() createAccountLink: string = '';
-  @Input() requestAccessLink: string = '';
-  // button styles
-  @Input() btnClass: string = '';
-  @Input() btnBgColor: string = '#FFE681';
-  @Input() btnColor: string = '';
-  @Input() btnBorder: string = '';
-  @Input() btnBorderRadius: string = '24px';
-  @Input() btnPd: string = '';
-  @Input() btnText: string = 'Log in';
-
-  //inputStyles
-  @Input() inputLabelColor: string = '';
-  @Input() inputBgColor: string = 'transparent';
-  @Input() inputBorder: string = '1px solid #66666659';
-  @Input() inputBorderRadius: string = '12px';
-  @Input() termsErrorText: string =
-    'Please agree to the terms of use and privacy policy.';
-
-  @Output() formSubmit = new EventEmitter<LoginData>();
-  @Output() onSubmitEnd: EventEmitter<ResponseKeyValue | ErrorResponse> =
-    new EventEmitter();
-  @Output() onGoogleAuthResponse: EventEmitter<
-    ResponseKeyValue | ErrorResponse
-  > = new EventEmitter();
-  @Output() onSubmitGoogleAuth: EventEmitter<ResponseKeyValue | ErrorResponse> = new EventEmitter();
-  @Output() tenantConfigLoaded = new EventEmitter<TenantConfig | null>();
-  @Output() googleClick = new EventEmitter();
-  @Output() microsoftClick = new EventEmitter();
-  @Output() appleClick = new EventEmitter();
-
-  tenantDetails: any | null = null;
-  AuthMechanisms: AuthMechanism[] | null = null;
-  showform: boolean = false;
-  loginForm: FormGroup;
-  apiKey: string;
-  secret: string;
-  isLoading: boolean = false;
-  code: string = '';
-  type: string = '';
-  mechanismType: string = '';
-  OauthData: IOauthResp = {
-    AccessToken: '',
-    Email: '',
-    FirstName: '',
-    LastName: '',
-  };
-  configData:TenantConfig | null = null
-
-  constructor(
-    private fb: FormBuilder,
-    private server: HttpWebRequestService,
-    private utilService: UtilService,
-    private envSvc: EnvironmentService,
-    private route: ActivatedRoute,
-    private router: Router,
-    private encryptionService: EncryptionService
-  ) {
-    this.loginForm = this.fb.group({
-      Email: new FormControl<string | null>(null, [
-        Validators.required,
-        Validators.email,
-      ]),
-      Password: new FormControl<string | null>(null, [
-        Validators.required,
-        Validators.minLength(5),
-      ]),
-    });
-    this.apiKey = this.envSvc.environment.Tenant;
-    this.secret = this.envSvc.environment.Secret;
-  }
-
-  async ngOnInit() {
-  
-    await this.getTenantConfig();
-    this.route.queryParams.subscribe((params) => {
-      this.code = params['code'];
-      this.type = params['type'];
-      if (this.code) {
-        this.verifyUserDetails();
-      }
-    });
-   
-    
-  }
-
-    
-  async getTenantConfig() {
-     const isLocalhost = window?.location?.hostname === 'localhost';
-     const payload = isLocalhost
-     ? {
-         Key: "UrlKey",
-         Value:'https://bovas.white360.net'
-       }
-     : undefined;
-    try{ 
-      const res = await this.server.post<TenantConfig>(
-        `Tenant/GetTenantConfigByUrlKey`,
-         payload
-        
-      );
-      this.tenantDetails = res;
-      this.configData = res;
-      this.AuthMechanisms = this.tenantDetails?.AuthMechanisms;
-      if (
-        !this.tenantDetails?.AuthMechanism &&
-        this.tenantDetails?.AuthMechanism !== MechanismType.InApp
-      ) {
-        this.showform = false;
-      } else {
-        this.showform = true;
-      }
-      this.tenantConfigLoaded.emit(this.configData);
-    }catch(err){ 
-     const msg = err;
-     this.tenantConfigLoaded.emit(null);
-    }
-  }
-
-  checkForm(): boolean {
-    return this.loginForm.valid;
-  }
-
-  async verifyUserDetails() {
-    if (this.AuthMechanisms !== null && this.apiKey) {
-      const data: any = this.AuthMechanisms.find((item) =>
-        item.AuthMechanism.includes(this.type)
-      );
-      const payload = {
-        AuthCode: this.code,
-        Tenant: this.apiKey,
-        AuthMechanism: data.AuthMechanism,
-      };
-
-      this.utilService.sendBI(true);
-      const res = await this.server.post(
-        `Authentication/GetUserDetails`,
-        payload
-      );
-      this.utilService.sendBI(false);
-      if (res instanceof ErrorResponse) {
-        return;
-      } else {
-        var result = res as IOauthResp;
-        this.OauthData = {
-          AccessToken: result?.AccessToken,
-          Email: result?.Email,
-          FirstName: result?.FirstName,
-          LastName: result?.LastName,
-        };
-
-        this.submit(data.AuthMechanism);
-      }
-    }
-  }
-
-  async submit(type: string) {
-    let data: LoginData = {
-      MailAddress: '',
-      Password: '',
-      LoginType: type,
-      Tenant: this.tenantDetails.TenantId,
-      Secrete: this.secret,
-      Token: '',
-    };
-  
-    if (type === MechanismType.InApp && this.checkForm()) {
-      data = {
-        ...data,
-        MailAddress: this.loginForm.controls['Email'].value,
-        Password:String(CryptoJS.MD5(this.loginForm.controls['Password'].value)),
-      };
-    } else if (type === MechanismType.Google || type === MechanismType.MicrosoftAD) {
-      data = {
-        ...data,
-        MailAddress: this.OauthData?.Email,
-        Token: this.OauthData?.AccessToken,
-      };
-    }
-      
-    this.formSubmit.emit(data);
-    this.utilService.sendBI(true); // Preserving your utilService call
-    this.isLoading = true;
-  
- 
-  
-    try {
-      const res = await this.server.post(`Authentication/Login`, data);
-      console.log('Response:', res);
-      this.utilService.sendBI(false); // Stop utilService tracking on success/failure
-      this.isLoading = false;
-  
-      if (res instanceof ErrorResponse) {
-        this.onSubmitEnd.emit(res);
-      } else {
-        const result = res as ResponseKeyValue;
-        this.onSubmitEnd.emit(result);
-      }
-    } catch (error) {
-      this.utilService.sendBI(false); // Stop utilService tracking on error
-      this.isLoading = false;
-      console.error('Error during login:', error);
-    }
-  }
-  
-  get styles() {
-    return {
-      'background-color': this.bgColor,
-      'box-shadow': this.boxShadow,
-      border: this.border,
-      'border-radius': this.borderRadius,
-      color: this.textColor,
-      width: this.width,
-      'max-width': this.maxWidth,
-      margin: this.margin,
-      height: this.height,
-      padding: this.pd,
-    };
-  }
-}

package/src/lib/components/sign-in/sign-in.module.ts

@@ -1,17 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { SignInComponent } from '../sign-in/sign-in.component';
-import { FormsModule } from '@angular/forms';
-import { RouterLink} from '@angular/router';
-import { VerbenaButtonModule, VerbenaInputModule } from 'verben-ng-ui';
-import { OAuthModule } from '../o-auth/o-auth.module';
-import { ButtonModule } from '../button/button.module';
-import { ReactiveFormsModule } from '@angular/forms';
-
-@NgModule({
-  declarations: [SignInComponent],
-  imports: [CommonModule,FormsModule,VerbenaInputModule,VerbenaButtonModule,RouterLink,OAuthModule,ButtonModule,ReactiveFormsModule],
-  exports: [SignInComponent]
-})
-export class SignInModule {}
-

package/src/lib/components/sign-up/sign-up.component.css

@@ -1,36 +0,0 @@
-a{ 
-    text-decoration: underline;
-    cursor: pointer;
-}
-  input[type="checkbox"]:checked {
-    accent-color: #111;
-  }
-
-  .flexWrapper{ 
-    display: flex;
-    flex-direction: column;
-    gap:10px;
-  }
-
-  .checkBoxWrapper{ 
-    display: flex;
-    align-items: start;
-    gap:2px;
-  }
-
-  .checBoxInput{ 
-    margin-top:6px
-  }
-
-  .bigcheckboxWrapper{ 
-    margin-top: 0.5rem;
-   margin-bottom: 1.5rem;
-  }
-
-  .error-text{ 
-    color:red
-  }
-
-  .disable-btn{
-    cursor: not-allowed;
-  }

package/src/lib/components/sign-up/sign-up.component.html

@@ -1,132 +0,0 @@
-<section [ngStyle]="styles" class="{{ customClass }}">
-    <h2 class="{{headlingClass}}">
-      {{headlingText}}
-    </h2>
-    <form [formGroup]="signUpForm" (ngSubmit)="submit()" class="flexWrapper">
-      <verbena-input
-        [label]="'First name'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'text'"
-        formControlName="Firstname"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        class="outline-none focus-none"
-        [customErrorMessages]="{required:'First name is required'}"
-      ></verbena-input>
-      <verbena-input
-        [label]="'Last name'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'text'"
-        formControlName="Lastname"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        class="outline-none focus-none"
-        [customErrorMessages]="{required:'Last name is required'}"
-      ></verbena-input>
-      <verbena-input
-        [label]="'Email'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'email'"
-        formControlName="Email"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        class="outline-none focus-none"
-      ></verbena-input>
-      <verbena-input
-        [label]="'Password'"
-        [labelColor]="inputLabelColor"
-        [placeHolder]="''"
-        [required]="true"
-        [type]="'password'"
-        formControlName="Password"
-        [showBorder]="true"
-        [bgColor]="inputBgColor"
-        [border]="inputBorder"
-        [borderRadius]="inputBorderRadius"
-        [showErrorMessage]="true"
-        [errorMessageColor]="'red'"
-        [errorBorderColor]="'red'"
-        [errorPosition]="'bottom'"
-        [passwordToggle]="true"
-        class="outline-none focus-none"
-      ></verbena-input>
-      <div>
-        <verbena-input
-          [label]="'Confirm Password'"
-          [labelColor]="inputLabelColor"
-          [placeHolder]="''"
-          [required]="true"
-          [type]="'password'"
-          formControlName="Confirmpassword"
-          [showBorder]="true"
-          [bgColor]="inputBgColor"
-          [border]="inputBorder"
-          [borderRadius]="inputBorderRadius"
-          [showErrorMessage]="false"
-          [errorBorderColor]="'red'"
-          class="outline-none focus-none"
-        ></verbena-input>
-      <span *ngIf="signUpForm.hasError('passwordMismatch') && signUpForm.get('Confirmpassword')?.dirty">
-        <small class="error-text">Passwords do not match.</small>
-      </span>
-      </div>
-      <div>
-        <div class="checkBoxWrapper">
-          <input type="checkbox" id="terms" formControlName="Terms"  class="checBoxInput" />
-          <label for="terms"
-          class="break-all font-normal leading-6"
-            >By creating an account, I agree to our <a  [attr.href]="termsLink">Terms of use</a> and
-            <a [attr.href]="privacyLink">Privacy Policy</a></label
-          >
-        </div>
-       <p *ngIf="signUpForm.controls['Terms'].invalid && signUpForm.controls['Terms'].touched">
-        <small class="error-text">Please agree to the terms of use and privacy policy.</small>
-       </p>
-      </div>
-      <lib-button
-      [buttonClass]="btnClass"
-      [color]="btnColor"
-      [border]="btnBorder"
-      [borderRadius]="btnBorderRadius"
-      [bgColor]="btnBgColor"
-      [pd]="btnPd"
-      [text]="btnText"
-      type="submit"
-      [disabled]="!this.checkForm()"
-      [ngStyle]="{'margin-top':'10px'}"
-      ></lib-button>
-      <verben-o-auth
-      (googleClick)="handleGoogleAuth()"
-      (appleClick)="handleAppleAuth()"
-      ></verben-o-auth>
-      <p>
-        Already have an account?
-        <a [routerLink]="routerLink"  class="">Log in</a>
-      </p>
-    </form>
-  </section>
-

package/src/lib/components/sign-up/sign-up.component.spec.ts

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