@ieeesa-npm/tenants 0.4.2 → 0.4.4

package/src/lib/components/create-modify-group-type/create-modify-group-type.component.html

@@ -0,0 +1,15 @@
+<ieeesa-dynamic-form
+  *ngIf="createGroupTypeFormGroup"
+  class="ieeesa-create-group-type-form"
+  [leftButtonLabel]="leftButtonLabel"
+  [rightButtonLabel]="rightButtonLabel"
+  [isLegendVisible]="false"
+  [colWidth]="colWidth"
+  [actionButtonAlign]="actionButtonAlign"
+  [formGroups]="createGroupTypeFormGroup"
+  [isLeftButtonNeeded]="true"
+  (formSubmit)="onCreateModifyGroupTypeFormSubmit($event)"
+  (formLeftButtonClicked)="onFormCancel()"
+  (formGroupsReference)="getCreateModifyGroupTypeFormGroupRef($event)"
+  (formCheckboxSelection)="onCheckboxSelectionChange($event)"
+></ieeesa-dynamic-form>

package/src/lib/components/create-modify-group-type/create-modify-group-type.component.scss

@@ -0,0 +1,44 @@
+@import "styles.scss";
+
+$ieeesa-desktop-width90: 90%;
+$ieeesa-mobile-width: 100%;
+.ieeesa-modal-dialog.ieeesa-create-modify-group-type {
+  width: 60vw !important;
+  .mat-mdc-dialog-container {
+    box-shadow: none;
+  }
+  .ieeesa-modal {
+    .mat-mdc-dialog-content {
+      padding: 1em !important;
+    }
+    .ieeesa-dynamic-form {
+      &__actions {
+        flex-direction: row-reverse;
+        gap: 0.5em;
+      }
+      &__form-field {
+        margin-bottom: 1em;
+        padding-top: 0px !important;
+        .ieeesa-text-area-field {
+          &__resize {
+            resize: vertical;
+          }
+        }
+      }
+    }
+  }
+  .ieeesa-input-field {
+    width: 50%;
+  }
+  @media (max-width: $ieeesa-mobile-min-width) {
+    .ieeesa-dynamic-form {
+      &__form-field {
+        width: $ieeesa-mobile-width;
+      }
+      .ieeesa-input-field,
+      .mat-mdc-form-field-flex {
+        width: $ieeesa-mobile-width !important;
+      }
+    }
+  }
+}

package/src/lib/components/create-modify-group-type/create-modify-group-type.component.spec.ts

@@ -0,0 +1,574 @@
+import { CommonModule } from '@angular/common';
+import {
+  HttpClient,
+  HttpErrorResponse,
+  HttpHandler,
+} from '@angular/common/http';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import {
+  FormBuilder,
+  FormGroup,
+  ReactiveFormsModule,
+  Validators,
+} from '@angular/forms';
+import {
+  MAT_DIALOG_DATA,
+  MatDialog,
+  MatDialogModule,
+} from '@angular/material/dialog';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import {
+  CheckboxOption,
+  DynamicFormComponent,
+  FormControlType,
+  FormModel,
+} from '@ieeesa-npm/presentation';
+import { SharedService } from '@ieeesa-npm/shared';
+import {
+  GlobalErrorHandlerService,
+  AlertsService,
+  AlertType,
+} from '@ieeesa-npm/utility';
+import { GroupTypeValidation } from '@tenants/assets/tenant-validations';
+import { TenantsMocks } from '@tenants/assets/tenants-mock';
+import { TenantFunctionType } from '@tenants/models/tenant-function-type.model';
+import { TenantApplicationsService } from '@tenants/services/tenant-applications.service';
+import { CreateModifyGroupTypeComponent } from './create-modify-group-type.component';
+import { Observable } from 'rxjs';
+
+describe('CreateModifyGroupTypeComponent', () => {
+  let component: CreateModifyGroupTypeComponent;
+  let fixture: ComponentFixture<CreateModifyGroupTypeComponent>;
+  let tenantAppService: TenantApplicationsService;
+  let globalErrorHandlerService: GlobalErrorHandlerService;
+  const formBuilder: FormBuilder = new FormBuilder();
+  // eslint-disable-next-line no-unused-vars, @typescript-eslint/no-unused-vars
+  const mockFormGroup = formBuilder.group({
+    groupType: [
+      'Executive Subcommittee',
+      [
+        Validators.required,
+        Validators.maxLength(GroupTypeValidation.descriptionMaxLength),
+      ],
+    ],
+    description: [
+      'Executive Subcommittee description',
+      [
+        Validators.required,
+        Validators.maxLength(GroupTypeValidation.descriptionMaxLength),
+      ],
+    ],
+    rosterType: [
+      { id: 1, label: 'Individual', checked: true },
+      [Validators.required],
+    ],
+    settings: [
+      { id: 1, name: 'Allow Sub-Groups', checked: false, disabled: false },
+      [Validators.required],
+    ],
+    appOfficerRoles: [
+      { id: '1', name: 'Chair', checked: false, disabled: false },
+      [Validators.required],
+    ],
+    appMemberLevel: [
+      {
+        id: 1,
+        name: 'Voting Member (Principal)',
+        checked: false,
+        disabled: true,
+      },
+      [Validators.required],
+    ],
+    isRootGroup: [{ id: 2, label: 'No', checked: true }, [Validators.required]],
+  });
+  const dialogOptions = {
+    heading: 'New Role',
+    isCloseNeeded: true,
+    componentReference: CreateModifyGroupTypeComponent,
+    modalType: 1,
+  };
+  const mockFormModel: FormModel = {
+    formGroup: [
+      {
+        legend: '',
+        controls: [
+          {
+            type: FormControlType.INPUT,
+            controlName: 'groupType',
+          },
+          {
+            type: FormControlType.TEXT_AREA,
+            controlName: 'description',
+          },
+          {
+            type: FormControlType.RADIO,
+            controlName: 'rosterType',
+          },
+          {
+            type: FormControlType.CHECKBOX,
+            controlName: 'settings',
+          },
+          {
+            type: FormControlType.CHECKBOX,
+            controlName: 'appOfficerRoles',
+          },
+          {
+            type: FormControlType.CHECKBOX,
+            controlName: 'appMemberLevel',
+          },
+          {
+            type: FormControlType.RADIO,
+            controlName: 'isRootGroup',
+          },
+        ],
+      },
+    ],
+  };
+  const mockTenantInfo = {
+    appId: 'testAppId',
+    appTitle: '',
+    appLogo: '',
+    appHeading: '',
+    appDescription: '',
+    status: true,
+    features: [
+      {
+        featureId: '',
+        featureName: '',
+        isDefault: false,
+      },
+    ],
+  };
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        CreateModifyGroupTypeComponent,
+        CommonModule,
+        DynamicFormComponent,
+        BrowserAnimationsModule,
+        ReactiveFormsModule,
+        HttpClientTestingModule,
+        MatDialogModule,
+      ],
+      providers: [
+        TenantApplicationsService,
+        AlertsService,
+        { provide: MAT_DIALOG_DATA, useValue: dialogOptions },
+        MatDialog,
+        SharedService,
+        HttpClient,
+        HttpHandler,
+        GlobalErrorHandlerService,
+      ],
+    });
+    fixture = TestBed.createComponent(CreateModifyGroupTypeComponent);
+    component = fixture.componentInstance;
+    component.createGroupTypeFormGroup = mockFormModel;
+    component.ngOnInit();
+    tenantAppService = TestBed.inject(TenantApplicationsService);
+    globalErrorHandlerService = TestBed.inject(GlobalErrorHandlerService);
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+  describe('#ngOnInit', () => {
+    it('should call getSelectedTenantInformation and set appId', () => {
+      spyOn(tenantAppService, 'getSelectedTenantInformation').and.returnValue(
+        mockTenantInfo
+      );
+      component.ngOnInit();
+      expect(tenantAppService.getSelectedTenantInformation).toHaveBeenCalled();
+      expect(component.appId).toBe('testAppId');
+    });
+    it('should call getTenantFunctionType and set tenantFunctionType', () => {
+      spyOn(tenantAppService, 'getTenantFunctionType').and.returnValue(
+        TenantFunctionType.CREATE_GROUP_TYPE
+      );
+      component.ngOnInit();
+      expect(tenantAppService.getTenantFunctionType).toHaveBeenCalled();
+      expect(component.tenantFunctionType).toBe(
+        TenantFunctionType.CREATE_GROUP_TYPE
+      );
+    });
+    it('should call getGroupTypeDetails and set allowedSubGroupTypesOptions', () => {
+      spyOn(tenantAppService, 'getGroupTypeDetails').and.returnValue(
+        TenantsMocks.mockGroupTypeResponse
+      );
+      component.ngOnInit();
+      expect(tenantAppService.getGroupTypeDetails).toHaveBeenCalled();
+      expect(component.allowedSubGroupTypesOptions.length).toBe(2);
+    });
+  });
+  describe('#getRoles', () => {
+    it('should call getRoles to load the roles options.', () => {
+      const mockUserRoles = {
+        status: true,
+        message: 'SUCCESS',
+        body: [
+          {
+            roleId: 'ROLE_NESC_edaf1dcc-229f-4d4c-9635-7ac732b4dfd8',
+            roleName: 'Admin',
+            roleTypeName: 'System',
+            roleType: '11',
+            viewOrder: 1,
+          },
+          {
+            roleId: 'ROLE_NESC_cf32e87f-6d03-410f-8670-62fd11da1b44',
+            roleName: 'Chair',
+            roleTypeName: 'Officer',
+            roleType: '22',
+            viewOrder: 2,
+          },
+          {
+            roleId: 'ROLE_NESC_365dac5c-5558-4dad-9406-aa9063d0dbdf',
+            roleName: 'Past Chair',
+            roleTypeName: 'Officer',
+            roleType: '22',
+            viewOrder: 2,
+          },
+          {
+            roleId: 'ROLE_NESC_46ea2d1a-8004-485f-b0bc-9237a5ae1eb2',
+            roleName: 'Vice Chair',
+            roleTypeName: 'Officer',
+            roleType: '22',
+            viewOrder: 2,
+          },
+          {
+            roleId: 'ROLE_NESC_68041ee9-3035-4136-9091-db42700a6204',
+            roleName: 'Secretory',
+            roleTypeName: 'Officer',
+            roleType: '22',
+            viewOrder: 2,
+          },
+          {
+            roleId: 'ROLE_NESC_0d0fde04-7bce-429b-af7e-b6ed5f9a2254',
+            roleName: 'Voting Member (Principal)',
+            roleTypeName: 'Member Level',
+            roleType: '33',
+            viewOrder: 3,
+          },
+          {
+            roleId: 'ROLE_NESC_4a3b1ef9-1696-46a1-b9a5-0404e0ac7733',
+            roleName: 'Voting Member (Alternate)',
+            roleTypeName: 'Member Level',
+            roleType: '33',
+            viewOrder: 3,
+          },
+          {
+            roleId: 'ROLE_NESC_3a805b6b-963e-432f-96bf-7797ec7d6eb6',
+            roleName: 'Member',
+            roleTypeName: 'Member Level',
+            roleType: '33',
+            viewOrder: 3,
+          },
+        ],
+      };
+      spyOn(tenantAppService, 'getRoles').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockUserRoles);
+        })
+      );
+      spyOn(
+        component['formUtilityService'],
+        'updateFormControlOptions'
+      ).and.callThrough();
+      spyOn(component, 'initializeCreateGroupTypeFormGroup');
+      component.getRoles();
+      expect(tenantAppService.getRoles).toHaveBeenCalledWith(component.appId);
+      expect(component.initializeCreateGroupTypeFormGroup).toHaveBeenCalled();
+      expect(component.officerRolesOptions).toEqual(
+        TenantsMocks.mockOfficerRoles
+      );
+    });
+    it('should return 3007 error code when fail to load the roles options.', () => {
+      const errorResponse = TenantsMocks.mockRolesErrorResponse;
+      spyOn(tenantAppService, 'getRoles').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(errorResponse);
+        })
+      );
+      spyOn(
+        component['formUtilityService'],
+        'updateFormControlOptions'
+      ).and.callThrough();
+      spyOn(component['sharedService'], 'handleErrors').and.callThrough();
+      component.getRoles();
+      expect(component.officerRolesOptions).toEqual([]);
+      expect(
+        component['formUtilityService'].updateFormControlOptions
+      ).not.toHaveBeenCalled();
+      expect(component['sharedService'].handleErrors).toHaveBeenCalledWith(
+        errorResponse,
+        component?.createGroupTypeScreenTexts?.errors
+      );
+    });
+    it('should return 3019 error code when fail to load the roles options.', () => {
+      const mockUserRoles = {
+        status: true,
+        message: 'SUCCESS',
+        body: [
+          {
+            roleId: 'ROLE_NESC_edaf1dcc-229f-4d4c-9635-7ac732b4dfd8',
+            roleName: 'Admin',
+            roleTypeName: 'System',
+            roleType: '11',
+            viewOrder: 1,
+          },
+        ],
+      };
+      component.memberLevelOptions = [];
+      component.officerRolesOptions = [];
+      spyOn(tenantAppService, 'getRoles').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockUserRoles);
+        })
+      );
+      spyOn(component['sharedService'], 'showAlertMessage').and.callThrough();
+      component.getRoles();
+      expect(component.officerRolesOptions).toEqual([]);
+      expect(component.memberLevelOptions).toEqual([]);
+      expect(component['sharedService'].showAlertMessage).toHaveBeenCalledWith(
+        AlertType.ERROR,
+        component?.createGroupTypeScreenTexts?.errors['3019']
+      );
+    });
+    it('should throw error in retrieving roles', () => {
+      const mockServerErrorResponse = new HttpErrorResponse({
+        error: 'test',
+      });
+      spyOn(tenantAppService, 'getRoles').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.getRoles();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+  describe('#getRosterTypes', () => {
+    it('should call getRosterTypes to load the roster types options.', () => {
+      spyOn(tenantAppService, 'getRosterType').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockRosterTypeResponse);
+        })
+      );
+      const getSettingsSpyOn = spyOn(component, 'getSettings');
+      component.rosterTypeOptions = [];
+      component.getRosterTypes();
+      expect(getSettingsSpyOn).toHaveBeenCalled();
+      expect(tenantAppService.getRosterType).toHaveBeenCalled();
+      expect(component.rosterTypeOptions).toEqual(TenantsMocks.mockRosterType);
+    });
+    it('should return 2066 error code when fail to get the roster type options.', () => {
+      const errorResponse = TenantsMocks.mockRosterOrGroupTypeErrorResponse;
+      spyOn(tenantAppService, 'getRosterType').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(errorResponse);
+        })
+      );
+      spyOn(component['sharedService'], 'handleErrors').and.callThrough();
+      component.getRosterTypes();
+      expect(component['sharedService'].handleErrors).toHaveBeenCalledWith(
+        errorResponse,
+        component?.createGroupTypeScreenTexts?.errors
+      );
+    });
+    it('should throw error in retrieving roster type options', () => {
+      const mockServerErrorResponse = new HttpErrorResponse({
+        error: 'test',
+      });
+      spyOn(tenantAppService, 'getRosterType').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.getRosterTypes();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+  describe('#getSettings', () => {
+    it('should call getSettings to load the settings options.', () => {
+      spyOn(tenantAppService, 'getGroupTypeSettings').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockGroupTypeSettingResponse);
+        })
+      );
+      component.settingOptions = [];
+      component.getSettings();
+      expect(tenantAppService.getGroupTypeSettings).toHaveBeenCalled();
+      expect(component.settingOptions).toEqual(TenantsMocks.mockSettingOptions);
+    });
+    it('should return 2066 error code when fail to get the settings options.', () => {
+      const errorResponse = TenantsMocks.mockRosterOrGroupTypeErrorResponse;
+      spyOn(tenantAppService, 'getGroupTypeSettings').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(errorResponse);
+        })
+      );
+      spyOn(component['sharedService'], 'handleErrors').and.callThrough();
+      component.getSettings();
+      expect(component['sharedService'].handleErrors).toHaveBeenCalledWith(
+        errorResponse,
+        component?.createGroupTypeScreenTexts?.errors
+      );
+    });
+    it('should throw error in retrieving settings options', () => {
+      const mockServerErrorResponse = new HttpErrorResponse({
+        error: 'test',
+      });
+      spyOn(tenantAppService, 'getGroupTypeSettings').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.getSettings();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+  describe('#initializeCreateGroupTypeFormGroup', () => {
+    it('should initialize the form group by default values', () => {
+      component.rosterTypeOptions = TenantsMocks.mockRosterTypeOptions;
+      component.isRootGroupOptions = TenantsMocks.mockIsRootGroupOptions;
+      component.initializeCreateGroupTypeFormGroup();
+      expect(component.createGroupTypeFormGroup).toBeTruthy();
+    });
+  });
+  describe('#onCheckboxSelectionChange', () => {
+    it('should add new form control when ALLOW_SUB_GROUPS is selected', () => {
+      const selectedCheckbox: CheckboxOption = {
+        id: 1,
+        name: 'Allow Sub-Groups',
+        checked: true,
+        disabled: false,
+      };
+      const addNewControlDynamicallySpy = spyOn(
+        component['formUtilityService'],
+        'addFormControl'
+      );
+      component.onCheckboxSelectionChange(selectedCheckbox);
+      expect(addNewControlDynamicallySpy).toHaveBeenCalled();
+    });
+    it('should remove the allowSubGroup form control when ALLOW_SUB_GROUPS is unselected', () => {
+      const selectedCheckbox: CheckboxOption = {
+        id: 1,
+        name: 'Allow Sub-Groups',
+        checked: false,
+        disabled: false,
+      };
+      const removeControlDynamicallySpy = spyOn(
+        component['formUtilityService'],
+        'removeFormControl'
+      );
+      component.allowedSubGroupTypesOptions = TenantsMocks.mockSettingOptions;
+      component.onCheckboxSelectionChange(selectedCheckbox);
+      expect(removeControlDynamicallySpy).toHaveBeenCalled();
+      expect(component.allowedSubGroupTypesOptions).toEqual(
+        TenantsMocks.mockSettingOptions
+      );
+    });
+  });
+  describe('#isSettingSelectedByName', () => {
+    it('should find the setting option', () => {
+      component.settingOptions = JSON.parse(
+        JSON.stringify(TenantsMocks.mockSettingOptions)
+      );
+      component.settingOptions[3].checked = true;
+      expect(component.isSettingSelectedByName('Has Classification')).toEqual(
+        true
+      );
+      expect(component.isSettingSelectedByName('Enable Rosters')).toEqual(
+        false
+      );
+    });
+  });
+  describe('#getCreateModifyGroupTypeFormGroupRef', () => {
+    it('should set createModifyGroupTypeFormGroupRef to the first form in the array', () => {
+      const formGroup1 = new FormGroup({});
+      const formGroup2 = new FormGroup({});
+      const formsArray: FormGroup[] = [formGroup1, formGroup2];
+      component.getCreateModifyGroupTypeFormGroupRef(formsArray);
+      expect(component.createModifyGroupTypeFormGroupRef).toBe(formGroup1);
+    });
+  });
+  describe('#onCreateModifyGroupTypeFormSubmit', () => {
+    it('should call createGroupType API call if form is valid', () => {
+      const form = [component.createModifyGroupTypeFormGroupRef];
+      spyOn(form[0], 'markAllAsTouched');
+      component.allowedSubGroupTypesOptions = JSON.parse(
+        JSON.stringify(TenantsMocks.mockAllowedSubGroupTypes)
+      );
+      component.allowedSubGroupTypesOptions[0].checked = true;
+      component.memberLevelOptions = JSON.parse(
+        JSON.stringify(TenantsMocks.mockMemberLevel)
+      );
+      component.officerRolesOptions = JSON.parse(
+        JSON.stringify(TenantsMocks.mockOfficerRoles)
+      );
+      component.memberLevelOptions[0].checked = true;
+      component.officerRolesOptions[0].checked = true;
+      spyOn(tenantAppService, 'createGroupType').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockCreateGroupTypeSuccessResponse);
+        })
+      );
+      const submitFormResponseSpyOn = spyOn(
+        component.submitFormResponse,
+        'emit'
+      );
+      const setNewlyCreatedGroupTypeInfoSpyOn = spyOn(
+        component['tenantAppService'],
+        'setNewlyCreatedGroupTypeInfo'
+      );
+      component.onCreateModifyGroupTypeFormSubmit(form);
+      expect(submitFormResponseSpyOn).toHaveBeenCalled();
+      expect(form[0].markAllAsTouched).toHaveBeenCalled();
+      expect(setNewlyCreatedGroupTypeInfoSpyOn).toHaveBeenCalled();
+    });
+    it('should throw error when fail to create group type.', () => {
+      const mockServerErrorResponse = new HttpErrorResponse({
+        error: 'test',
+      });
+      spyOn(tenantAppService, 'createGroupType').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(component['sharedService'], 'handleErrors').and.callThrough();
+      component.onCreateModifyGroupTypeFormSubmit([
+        component.createModifyGroupTypeFormGroupRef,
+      ]);
+      expect(component['sharedService'].handleErrors).toHaveBeenCalled();
+    });
+  });
+  describe('#onFormCancel', () => {
+    it('should emit formCancel event', () => {
+      const formCancelEmitSpy = spyOn(
+        component.formCancel,
+        'emit'
+      ).and.callThrough();
+      component.onFormCancel();
+      expect(formCancelEmitSpy).toHaveBeenCalled();
+    });
+  });
+  describe('#ngOnDestroy', () => {
+    it('should unsubscribe on ngOnDestroy', () => {
+      spyOn(component.destroy$, 'next');
+      spyOn(component.destroy$, 'unsubscribe');
+      component.ngOnDestroy();
+      expect(component.destroy$.next).toHaveBeenCalledWith(true);
+      expect(component.destroy$.unsubscribe).toHaveBeenCalled();
+    });
+  });
+});