verben-authentication-ui 1.0.12 → 1.0.13

package/src/lib/components/two-factor-auth-otp/two-factor-auth-otp.component.ts

@@ -1,155 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { FormGroup, FormBuilder, Validators } from '@angular/forms';
-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 { OtpData } from '../../models/otpValue';
-import { User } from '../../models/user';
-import { ObjectState } from '../../models/object-state';
-import { MainUser } from '../../models/mainUser';
-import { ResendOtpData } from '../../models/resend-otp-data';
-import { MechanismType } from '../../models/auth-mechanism';
-
-@Component({
-  selector: 'verben-auth-otp',
-  templateUrl: './two-factor-auth-otp.component.html',
-  styleUrl: './two-factor-auth-otp.component.css',
-})
-export class TwoFactorAuthOtpComponent {
-  @Input() customClass: string = '';
-  @Input() headlingClass: string = '';
-  @Input() headlingText: string = 'Two Factor Authentication';
-  @Input() paragraphClass: string = '';
-  @Input() resendClass: string = '';
-  @Input() width: string = '';
-  @Input() maxWidth: string = '';
-  @Input() margin: string = '';
-  @Input() pd: 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() length: number = 6;
-  @Input() otpClass: string = '';
-  @Input() resendOtpData: ResendOtpData = {
-    MailAddress: '',
-    Password: '',
-    LoginType: 'InApp',
-    Tenant: 'PDLTC6',
-    Secrete: '$White360$',
-    RedirectUri: '/auth/otp',
-  };
-
-  @Input() User:any={}
-
-  @Input() OtpData: OtpData = {
-    User: this.User,
-    Token: '',
-    ValidateUrl: '',
-    Secret: '',
-    OTP: '',
-    Info: '',
-    Provider:MechanismType.InApp
-  };
-
-  @Input() btnClass: string = '';
-  @Input() btnBgColor: string = '#FFE681';
-  @Input() btnColor: string = '';
-  @Input() btnBorder: string = '';
-  @Input() btnBorderRadius: string = '24px';
-  @Input() btnPd: string = '';
-  @Input() btnText: string = 'Submit';
-
-  otpValue: string = '';
-  otpForm!: FormGroup;
-
-  @Output() buttonClick = new EventEmitter<string>();
-  @Output() otpChange = new EventEmitter<string>();
-  @Output() clearStore = new EventEmitter<any>();
-  @Output() onSubmitEnd: EventEmitter<ResponseKeyValue | ErrorResponse> =
-    new EventEmitter();
-  @Output() resend: EventEmitter<ResponseKeyValue | ErrorResponse> =
-    new EventEmitter();
-
-  constructor(
-    private fb: FormBuilder,
-    private server: HttpWebRequestService,
-    private utilService: UtilService
-  ) {}
-
-  ngOnInit() {
-    this.otpForm = this.fb.group({
-      otpValue: ['', [Validators.required, Validators.minLength(6)]],
-    });
-  }
-
-  onOtpChange(value: string) {
-    this.otpValue = value;
-    this.otpForm.get('otpValue')?.setValue(value);
-    this.otpChange.emit(this.otpValue);
-  }
-
-  async submitData() {
-    const data: OtpData = {
-      User:this.User,
-      Token: this.OtpData.Token,
-      ValidateUrl: this.OtpData.ValidateUrl,
-      Secret: this.OtpData.Secret,
-      OTP: this.OtpData.OTP,
-      Info: this.OtpData.Info,
-      Provider:this.OtpData.Provider
-    };
-   this.clearStore.emit()
-    if (this.otpForm.valid) {
-      this.utilService.sendBI(true);
-      const res = await this.server.post(`Authentication/Validate`, data);
-      this.utilService.sendBI(false);
-      if (res instanceof ErrorResponse) {
-        this.onSubmitEnd.emit(res);
-      } else {
-        var result = res as ResponseKeyValue;
-        this.onSubmitEnd.emit(result);
-      }
-    }
-  }
-
-  async resendOtp() {
-    const data: ResendOtpData = {
-      MailAddress: this.resendOtpData?.MailAddress,
-      Password: this.resendOtpData?.Password,
-      LoginType: this.resendOtpData?.LoginType,
-      Tenant: this.resendOtpData?.Tenant,
-      Secrete: this.resendOtpData?.Secrete,
-
-      RedirectUri: this.resendOtpData?.RedirectUri,
-    };
-
-    this.utilService.sendBI(true);
-    const res = await this.server.post(`Authentication/ResendOTP`, data);
-    this.utilService.sendBI(false);
-    if (res instanceof ErrorResponse) {
-      this.resend.emit(res);
-    } else {
-      var result = res as ResponseKeyValue;
-      this.resend.emit(result);
-    }
-  }
-
-  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/two-factor-auth-otp/two-factor-auth-otp.module.ts

@@ -1,15 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { TwoFactorAuthOtpComponent } from './two-factor-auth-otp.component';
-import { ButtonModule } from '../button/button.module';
-import { OtpInputModule } from '../otp-input/otp-input.module';
-import { RouterLink } from '@angular/router';
-import { ReactiveFormsModule } from '@angular/forms';
-
-
-@NgModule({
-  declarations: [TwoFactorAuthOtpComponent],
-  imports: [CommonModule,ButtonModule,OtpInputModule,RouterLink,ReactiveFormsModule],
-  exports: [TwoFactorAuthOtpComponent]
-})
-export class TwoFactorAuthOtpModule {}

package/src/lib/components/two-factor-auth-setup/two-factor-auth-setup.component.css

@@ -1,17 +0,0 @@
-.setUpBtnWrapper{ 
-    display: flex;
-    flex-direction: column;
-    gap: 12px;
-    margin-top: 40px;
-}
-.iconWrapper{ 
-    display: flex;
-    cursor: pointer;
-    align-items:center;
-    justify-content:end;
-    gap: 12px;
-    margin-bottom:50px;
-}
-.custom-button{
-    font-weight: 500;
-}

package/src/lib/components/two-factor-auth-setup/two-factor-auth-setup.component.html

@@ -1,45 +0,0 @@
-<section
-[ngStyle]="styles"
-class="{{ customClass }}"
->
-  <h3 class="{{headlingClass}}">{{headlingText}}</h3>
-  <div class="setUpBtnWrapper">
-    <verbena-button
-    svg="2fa-mail"
-    [svgHeight]="16"
-    [svgWidth]="20"
-    text="Continue with Mail"
-    bgColor="white"
-    textColor="#333333"
-    border="1px solid #333"
-    borderRadius="40px"
-    pd="10px 20px"
-    width="100%"
-    svgPosition="left"
-    buttonClass="font-normal text-[24px] leading-[29.05px] text-[#333] mb-2"
-    (click)="continueWithMail()"
-    ></verbena-button>
-    <verbena-button
-    svg="2fa-sms"
-    [svgHeight]="24"
-    [svgWidth]="24"
-    text="Continue with SMS"
-    bgColor="white"
-    textColor="#333333"
-    border="1px solid #333"
-    borderRadius="40px"
-    pd="10px 20px"
-    width="100%"
-    svgPosition="left"
-    (click)="continueWithSMS()"
-    ></verbena-button>
-    <!-- <div class="iconWrapper" (click)="handleSkip()"> 
-        <p class="{{paragraphClass}}">Skip for now</p>
-        <verben-svg 
-        icon="skip-forward"
-        [height]="24"
-        [width]="24"
-        />
-    </div> -->
-</div>
-</section>

package/src/lib/components/two-factor-auth-setup/two-factor-auth-setup.component.spec.ts

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

package/src/lib/components/two-factor-auth-setup/two-factor-auth-setup.component.ts

@@ -1,57 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-
-@Component({
-  selector: 'verben-two-factor-auth-setup',
-  templateUrl: './two-factor-auth-setup.component.html',
-  styleUrl: './two-factor-auth-setup.component.css'
-})
-
-export class TwoFactorAuthSetupComponent {
-  @Input() customClass: string = ''
-  @Input() headlingClass: string = ''
-  @Input() headlingText: string = 'Set Up Two Factor Authentication'
-  @Input() paragraphClass: string = ''
-  @Input() buttonClass: string = ''
-  @Input() width: string = '';
-  @Input() maxWidth: string = '';
-  @Input() margin: string = '';
-  @Input() pd: 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 = '';
-
-  @Output() smsClick = new EventEmitter();
-  @Output() mailClick = new EventEmitter();
-  @Output() skipClick = new EventEmitter();
-
- 
-  continueWithSMS(){ 
-   this.smsClick.emit()
-  }
-  continueWithMail(){ 
-   this.mailClick.emit()
-  }
-  handleSkip(){ 
-   this.skipClick.emit()
-  }
-
-
-  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/two-factor-auth-setup/two-factor-auth-setup.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { TwoFactorAuthSetupComponent } from './two-factor-auth-setup.component';
-import { SvgModule, VerbenaButtonModule } from 'verben-ng-ui';
-
-@NgModule({
-  declarations: [TwoFactorAuthSetupComponent],
-  imports: [CommonModule,VerbenaButtonModule,SvgModule],
-  exports: [TwoFactorAuthSetupComponent]
-})
-export class TwoFactorAuthSetupModule {}

package/src/lib/components/user-management/base-table-style.ts

@@ -1,52 +0,0 @@
-export const baseStyle: any = {
-  width:"100%",
-  fontFamily: '"Fraunces", serif',
-  fontSize: '125%',
-  whiteSpace: 'nowrap',
-  margin: '0',
-  border: '1px solid #D4A007',
-  borderRadius: '16px',
-  borderCollapse: 'separate',
-  borderSpacing: '0',
-  // tableLayout: 'fixed',
-  overflow: 'hidden',
-  rows: {
-    even: {
-      backgroundColor: '#FDFDFD',
-    },
-    odd: {
-      backgroundColor: '#F1F4FB',
-    },
-    height: '68px',
-  },
-  cells: {
-    padding: '0.5rem 1rem',
-  },
-  header: {
-    stickyTop: true,
-    zIndex: 2,
-    backgroundColor: '#EFF2FB',
-    fontWeight: 'bold',
-    textAlign: 'left',
-    padding: '12px 16px',
-    height: '30px',
-  },
-  footer: {
-    // stickyBottom: true,
-    // zIndex: 2,
-    padding: '3px',
-  },
-  //   body: {
-  //     background: '#fff',
-  //     padding: '4px 5px',
-  //     textAlign: 'center',
-  //   },
-  // firstColumn: {
-  //   stickyLeft: true,
-  //   zIndex: 1,
-  // },
-  lastColumn: {
-    // stickyRight: true,
-    // zIndex: 1,
-  },
-};

package/src/lib/components/user-management/facades/user-management.facades.ts

@@ -1,133 +0,0 @@
-import { Injectable } from '@angular/core';
-import { Observable, catchError, from, tap, throwError } from 'rxjs';
-import { UserManagementState } from '../states/user-management.state';
-import { User } from '../../../models/user';
-import { QueryParams } from '../../../models/query-params';
-import { UserManagementService } from '../services/user-management.service';
-import { UtilService } from '../../../services/util.service';
-
-@Injectable({
-  providedIn: 'root',
-})
-export class UserManagementFacade {
-  constructor(
-    private userManagementService: UserManagementService,
-    private userManagementState: UserManagementState,
-    private utilService: UtilService
-  ) {
-    this.isUpdating$().subscribe((loading) => {
-      this.utilService.sendBI(loading);
-    });
-  }
-
-  isUpdating$(): Observable<boolean> {
-    return this.userManagementState.isUpdating$();
-  }
-
-  getUsers$(): Observable<User[]> {
-    return this.userManagementState.getUsers$();
-  }
-
-  getQueryParams$(): Observable<QueryParams<User>> {
-    return this.userManagementState.getQueryParams$();
-  }
-
-  async loadUsers(): Promise<void> {
-    try {
-      this.userManagementState.setUpdating(true);
-      const params = this.userManagementState.getQueryParamsValue() as QueryParams<User>;
-
-      const users = await this.userManagementService.getUsers(
-        params.skip,
-        params.limit,
-        params.sortParam || 'createdDate',
-        params.sortOrder
-      );
-
-      if (Array.isArray(users)) {
-        this.userManagementState.setUsers(users); // Safe to use
-      } else {
-        console.error('Error Response:', users);
-        throw new Error(users.ErrorMsg); // Assuming ErrorResponse has a `message` property
-      }
-    } catch (error) {
-      console.error('Failed to load users:', error);
-      throw error;
-    } finally {
-      this.userManagementState.setUpdating(false);
-    }
-  }
-
-  async loadUsersWithParam(param: string): Promise<void> {
-    try {
-      this.userManagementState.setUpdating(true);
-      const params = this.userManagementState.getQueryParamsValue();
-
-      const users = await this.userManagementService.getUsersWithParam(
-        param,
-        params.skip,
-        params.limit,
-        params.sortParam || 'createdDate',
-        params.sortOrder
-      );
-
-      this.userManagementState.setUsers(users);
-    } catch (error) {
-      console.error('Failed to load users with param:', error);
-      throw error;
-    } finally {
-      this.userManagementState.setUpdating(false);
-    }
-  }
-
-  updateQueryParams(params: Partial<QueryParams<User>>): void {
-    this.userManagementState.updateQueryParams(params);
-    this.loadUsers();
-  }
-
-  async addUser(user: Partial<User>): Promise<void> {
-    try {
-      this.userManagementState.setUpdating(true);
-      const newUser = { ...user } as User;
-      this.userManagementState.addUser(newUser);
-
-      await this.userManagementService.saveUsers([newUser]);
-      await this.loadUsers(); // Reload to reflect server-side changes
-    } catch (error) {
-      console.error('Failed to add user:', error);
-      this.userManagementState.removeUser(user.Id!);
-      throw error;
-    } finally {
-      this.userManagementState.setUpdating(false);
-    }
-  }
-
-  async updateUser(user: User): Promise<void> {
-    try {
-      this.userManagementState.setUpdating(true);
-      await this.userManagementService.saveUsers([user]);
-      this.userManagementState.updateUser(user);
-      this.utilService.showSuccess("User updated successfully");
-    } catch (error) {
-      console.error('Failed to update user:', error);
-      throw error;
-    } finally {
-      this.userManagementState.setUpdating(false);
-    }
-  }
-
-  async deleteUser(userId: string): Promise<void> {
-    try {
-      this.userManagementState.setUpdating(true);
-      await from(
-        this.userManagementService.deleteUsers([userId])
-      ).toPromise();
-      this.userManagementState.removeUser(userId);
-    } catch (error) {
-      console.error('Failed to delete user:', error);
-      throw error;
-    } finally {
-      this.userManagementState.setUpdating(false);
-    }
-  }
-}

package/src/lib/components/user-management/helper.ts

@@ -1,38 +0,0 @@
-import { ObjectState } from '../../models/object-state';
-import { UserManagementService } from './services/user-management.service';
-
-import { UserAccessRequestStatus } from '../../models/user-access-request-status';
-import { OAuthType } from '../../models/OAuthType';
-import { User } from '../../models/user';
-
-// export const mockData: User[] = new Array(10)
-//   .fill(1)
-//   .map((id, i) => ({
-//     FirstName: `First ${id + i}`,
-//     LastName: `Last ${id + i}`,
-//     OtherName: `Other ${id + i}`,
-//     Id: id + i,
-//     id: (id + i).toString(),
-//     MailAddress: `user${id + i}@mail.com`,
-//     PhoneNumber: `+23480000000${id + i}`,
-//     Status: randomEnum(UserAccessRequestStatus),
-//     Address: `AAA Bloc2`,
-//     SignupType: OAuthType.InApp,
-//     Password: '1234567',
-//     ExpireOn: new Date(),
-//     IsSeeded: false,
-//     OTPExpireOn: new Date(),
-//     Tenants: [],
-
-//     CreatedAt: new Date(),
-//     UpdatedAt: new Date(),
-//     DataState: ObjectState.New,
-//     TenantId: `Tenant${id + i}`,
-//     Code: '',
-//     ServiceName: '',
-//   }));
-function randomEnum<T extends object>(anEnum: T): T[keyof T] {
-  const enumValues = Object.values(anEnum) as unknown as T[keyof T][];
-  const randomIndex = Math.floor(Math.random() * enumValues.length);
-  return enumValues[randomIndex];
-}

package/src/lib/components/user-management/index.ts

@@ -1,4 +0,0 @@
-export * from './base-table-style';
-export * from './user-management.columns';
-export * from './services/user-management.service';
-export * from './user-management.component';

package/src/lib/components/user-management/services/user-management.service.spec.ts

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

package/src/lib/components/user-management/services/user-management.service.ts

@@ -1,111 +0,0 @@
-  import { Injectable } from '@angular/core';
-  import { Observable } from 'rxjs';
-  import { HttpWebRequestService } from '../../../services/http-web-request.service';
-  import { ErrorResponse } from '../../../models/ErrorResponse';
-  import { PagedResult } from '../../../models/PagedResult';
-  import { User } from '../../../models/user';
-
-  @Injectable({
-    providedIn: 'root',
-  })
-  export class UserManagementService {
-    // private readonly BASE_URL = 'https://auth.white360.net/User';
-
-    constructor(private httpService: HttpWebRequestService) {}
-
-    /**
-     * Get users with pagination and sorting
-     * @param skip Number of records to skip
-     * @param limit Number of records to take
-     * @param sortParam Sort parameter
-     * @param sortOrder Sort order ('asc' or 'desc')
-     * @returns Promise containing the list of users
-     */
-    async getUsers(
-      skip: number,
-      limit: number,
-      sortParam: string,
-      sortOrder: string
-    ): Promise<User[] | ErrorResponse> {
-      // var response : User[] | ErrorResponse;
-      const url = `User/GetUsers/${skip}/${limit}/${sortParam}/${sortOrder}`;
-      const res = await this.httpService.get(url)
-
-      if (res instanceof ErrorResponse) {
-        return res;
-      } else {
-        return (res as PagedResult<User>).Result;
-      }
-
-
-    }
-
-
-
-    /**
-     * Get users with an additional search parameter, pagination, and sorting
-     * @param param Search parameter
-     * @param skip Number of records to skip
-     * @param limit Number of records to take
-     * @param sortParam Sort parameter
-     * @param sortOrder Sort order ('asc' or 'desc')
-     * @returns Promise containing the filtered list of users
-     */
-    async getUsersWithParam(
-      param: string,
-      skip: number,
-      limit: number,
-      sortParam: string,
-      sortOrder: string
-    ): Promise<User[]> {
-      const url = `User/GetUserWithParam/${param}/${skip}/${limit}/${sortParam}/${sortOrder}`;
-      return await this.httpService.get(url) as User[];
-    }
-
-    async getRealUsers(
-      role: string | null,
-      skip: number,
-      limit: number,
-      sortParam: string,
-      sortOrder: string
-    ){
-      let url: string;
-    
-      if (role) {
-        // Role is provided, use the "GetUserWithParam" endpoint
-        url = `User/GetUserWithParam/${role}/${skip}/${limit}/${sortParam}/${sortOrder}`;
-      } else {
-        // Role is null, use the "GetUsers" endpoint
-        url = `User/GetUsers/${skip}/${limit}/${sortParam}/${sortOrder}`;
-      }
-    
-      const res = await this.httpService.get(url);
-    
-      if (res instanceof ErrorResponse) {
-        return res;
-      } else {
-        return (res as PagedResult<User>)
-      }
-    }
-    
-
-    /**
-     * Save multiple users
-     * @param users Array of users to save
-     * @returns Promise containing the save operation result
-     */
-    saveUsers(users: User[]): Promise<any> {
-      const url = `User/SaveUsers`;
-      return this.httpService.post(url, users);
-    }
-
-    /**
-     * Delete multiple users
-     * @param userIds Array of user IDs to delete
-     * @returns Observable containing the delete operation result
-     */
-    deleteUsers(userIds: string[]): Observable<any> {
-      const url = `User/DeleteUsers`;
-      return this.httpService.delete(`${url}?data=${userIds.join(',')}`);
-    }
-  }