@ieeesa-npm/tenants 0.4.2 → 0.4.4

package/src/lib/components/create-tenant-application/create-tenant-application.component.spec.ts

@@ -0,0 +1,775 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
+import { validColorValidator } from 'ngx-colors';
+import {
+  CheckboxOption,
+  FormModel,
+  RadioOption,
+  FormControlType,
+  FileUploadService,
+} from '@ieeesa-npm/presentation';
+import { Observable } from 'rxjs';
+import { HttpErrorResponse } from '@angular/common/http';
+import { AlertsService, GlobalErrorHandlerService } from '@ieeesa-npm/utility';
+import {
+  MAT_DIALOG_DATA,
+  MatDialog,
+  MatDialogModule,
+} from '@angular/material/dialog';
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { FormBuilder, ReactiveFormsModule, Validators } from '@angular/forms';
+import { CreateTenantApplicationComponent } from './create-tenant-application.component';
+import { TenantApplicationsService } from '../../services/tenant-applications.service';
+import { TenantsValidationPatterns } from '../../assets/tenant-validations';
+import { TenantsMocks } from '../../assets/tenants-mock';
+import { TenantFunctionType } from '../../models/tenant-function-type.model';
+
+describe('CreateTenantApplicationComponent', () => {
+  let component: CreateTenantApplicationComponent;
+  let fixture: ComponentFixture<CreateTenantApplicationComponent>;
+  let tenantAppService: TenantApplicationsService;
+  let globalErrorHandlerService: GlobalErrorHandlerService;
+  let fileUploadService: FileUploadService;
+  const formBuilder: FormBuilder = new FormBuilder();
+  const mockFormGroup = formBuilder.group({
+    appTitle: [
+      'SAAPS1',
+      [
+        Validators.required,
+        Validators.maxLength(TenantsValidationPatterns.appTitleMaxLength),
+      ],
+    ],
+    appId: [
+      'T001',
+      [
+        Validators.required,
+        Validators.maxLength(TenantsValidationPatterns.appIdMaxLength),
+        Validators.pattern(TenantsValidationPatterns.alphaNumeric),
+      ],
+    ],
+    appLogo: ['logo.svg', [Validators.required]],
+    appHeading: [
+      'SAAPS1 Heading',
+      [
+        Validators.required,
+        Validators.maxLength(TenantsValidationPatterns.appHeadingMaxLength),
+      ],
+    ],
+    appDescription: [
+      'SAAPS1 Description',
+      [
+        Validators.required,
+        Validators.maxLength(TenantsValidationPatterns.appDescriptionMaxLength),
+      ],
+    ],
+    backgroundColor: ['#ffffff', [Validators.required, validColorValidator()]],
+    appHelpLink: [
+      'https://localhost:4200',
+      [Validators.required, Validators.pattern(TenantsValidationPatterns.url)],
+    ],
+    features: [[{ id: '1', name: 'test' }], [Validators.required]],
+    appDomainUrl: [
+      'https://localhost:4200',
+      [Validators.required, Validators.pattern(TenantsValidationPatterns.url)],
+    ],
+    appType: [
+      'AT_SAAPPS_25634ef4-07d7-4d98-ba8b-ad33ed330789',
+      [Validators.required],
+    ],
+  });
+  const dialogOptions = {
+    heading: 'New Application',
+    isCloseNeeded: true,
+    componentReference: CreateTenantApplicationComponent,
+    modalType: 1,
+  };
+  const mockFormModel: FormModel = {
+    formGroup: [
+      {
+        legend: '',
+        controls: [
+          {
+            type: FormControlType.INPUT,
+            controlName: 'appTitle',
+          },
+          {
+            type: FormControlType.INPUT,
+            controlName: 'appId',
+          },
+          {
+            type: FormControlType.INPUT,
+            controlName: 'appHeading',
+          },
+          {
+            type: FormControlType.TEXT_AREA,
+            controlName: 'appDescription',
+          },
+          {
+            type: FormControlType.COLOR_PICKER,
+            controlName: 'backgroundColor',
+          },
+          {
+            type: FormControlType.INPUT,
+            controlName: 'appHelpLink',
+          },
+          {
+            type: FormControlType.CHECKBOX,
+            controlName: 'features',
+          },
+          {
+            type: FormControlType.INPUT,
+            controlName: 'appDomainUrl',
+          },
+          {
+            type: FormControlType.RADIO,
+            controlName: 'appType',
+          },
+        ],
+      },
+    ],
+  };
+  const fileData = new Uint8Array(200);
+  const mockFile = new File([fileData], 'testFile.jpg', {
+    type: 'image/jpg',
+  });
+  const mockServerErrorResponse = new HttpErrorResponse({
+    error: 'test',
+  });
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        CreateTenantApplicationComponent,
+        BrowserAnimationsModule,
+        ReactiveFormsModule,
+        HttpClientTestingModule,
+        MatDialogModule,
+      ],
+      providers: [
+        TenantApplicationsService,
+        AlertsService,
+        { provide: MAT_DIALOG_DATA, useValue: dialogOptions },
+        MatDialog,
+        FileUploadService,
+      ],
+    });
+    fixture = TestBed.createComponent(CreateTenantApplicationComponent);
+    tenantAppService = TestBed.inject(TenantApplicationsService);
+    globalErrorHandlerService = TestBed.inject(GlobalErrorHandlerService);
+    fileUploadService = TestBed.inject(FileUploadService);
+    component = fixture.componentInstance;
+    component.createTenantFormGroup = mockFormModel;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    const componentInstance = fixture.componentInstance;
+    expect(componentInstance).toBeTruthy();
+  });
+
+  describe('#ngOnInit', () => {
+    it('should initialize the create tenant form group', () => {
+      component.createTenantFormGroup = mockFormModel;
+      component.ngOnInit();
+      expect(
+        component.createTenantFormGroup?.formGroup?.[0]?.controls?.length
+      ).toBe(9);
+    });
+    it('should return groupFunctionType as EDIT', () => {
+      tenantAppService.setTenantFunctionType(TenantFunctionType.EDIT);
+      component.ngOnInit();
+      expect(component.tenantFunctionType).toEqual(TenantFunctionType.EDIT);
+    });
+    it('should setSelectedTenantInformation  when groupFunctionType is EDIT', () => {
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      tenantAppService.setSelectedTenantInformation(
+        TenantsMocks?.tenantInfoMock
+      );
+      component.ngOnInit();
+      expect(component.selectedTenantInfo).toEqual(
+        TenantsMocks?.tenantInfoMock
+      );
+    });
+  });
+
+  describe('#getFeatures', () => {
+    it('should call getFeatures and set features', () => {
+      const mockFeatures: CheckboxOption[] =
+        TenantsMocks.mockFeaturesFormattedDefaultResponse;
+      spyOn(tenantAppService, 'getFeatures').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockFeatureResponse);
+        })
+      );
+      component.getFeatures();
+      expect(component.featuresOptions).toEqual(mockFeatures);
+    });
+    it('should call getFeatures and set selected features as checked for EDIT functionType', () => {
+      const mockFeatures: CheckboxOption[] = [
+        {
+          id: 'FEATURE_c000425e-b716-4593-9b3f-74280741a4ee',
+          name: 'Groups & Rosters',
+          checked: true,
+          disabled: true,
+        },
+        {
+          id: 'FEATURE_049753e8-ea5c-4fad-adb0-e1456e69c7a5',
+          name: 'Meetings & Events',
+          checked: true,
+          disabled: false,
+        },
+        {
+          id: 'FEATURE_a0ad3616-20dc-43da-813f-9b76d33f227a',
+          name: 'Ballots',
+          checked: false,
+          disabled: false,
+        },
+      ];
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      component.selectedTenantInfo =
+        TenantsMocks?.viewTenantDetailsMockResponse?.body;
+      spyOn(tenantAppService, 'getFeatures').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockFeatureResponse);
+        })
+      );
+      component.getFeatures();
+      expect(component.featuresOptions).toEqual(mockFeatures);
+    });
+    it('should throw error in retrieving getFeatures', () => {
+      spyOn(tenantAppService, 'getFeatures').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.getFeatures();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+
+  describe('#getApplicationTypes', () => {
+    it('should call getApplicationTypes and set radio options', () => {
+      const mockAppTypes: RadioOption[] =
+        TenantsMocks.mockAppTypesFormattedResponse;
+      spyOn(tenantAppService, 'getApplicationTypes').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockAppTypesResponse);
+        })
+      );
+      component.getApplicationTypes();
+      expect(component.appTypeOptions).toEqual(mockAppTypes);
+    });
+    it('should call getApplicationTypes and set selected radio option as checked for EDIT functionType', () => {
+      const mockAppTypes: RadioOption[] = [
+        {
+          id: 'AT_SAAPPS_25634ef4-07d7-4d98-ba8b-ad33ed330789',
+          label: 'Generic',
+          checked: true,
+        },
+        {
+          id: 'AT_SAAPPS_ab655442-fe69-4aee-96cb-a661e6ea1e24',
+          label: 'Standalone',
+          checked: false,
+        },
+      ];
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      component.selectedTenantInfo =
+        TenantsMocks?.viewTenantDetailsMockResponse?.body;
+      spyOn(tenantAppService, 'getApplicationTypes').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockAppTypesResponse);
+        })
+      );
+      component.getApplicationTypes();
+      expect(component.appTypeOptions).toEqual(mockAppTypes);
+    });
+    it('should throw error in retrieving getApplicationTypes', () => {
+      spyOn(tenantAppService, 'getApplicationTypes').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.getApplicationTypes();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+  describe('#getCreateTenantPayload', () => {
+    it('should prepare the create tenant payload on form submit', () => {
+      const featureOptions = TenantsMocks.mockFeaturesFormattedResponse;
+      const mockFormGroup = formBuilder.group({
+        appTitle: [
+          'SA Collaboration portal',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appTitleMaxLength),
+          ],
+        ],
+        appId: [
+          'SAAPPS1',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appIdMaxLength),
+            Validators.pattern(TenantsValidationPatterns.alphaNumeric),
+          ],
+        ],
+        appLogo: ['logo.svg', [Validators.required]],
+        appHeading: [
+          'SAAPPS Heading',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appHeadingMaxLength),
+          ],
+        ],
+        appDescription: [
+          'SAAPPS Desc',
+          [
+            Validators.required,
+            Validators.maxLength(
+              TenantsValidationPatterns.appDescriptionMaxLength
+            ),
+          ],
+        ],
+        backgroundColor: [
+          '#000000',
+          [Validators.required, validColorValidator()],
+        ],
+        appHelpLink: [
+          'https://localhost:4200',
+          [
+            Validators.required,
+            Validators.pattern(TenantsValidationPatterns.url),
+          ],
+        ],
+        features: formBuilder.array([
+          [
+            {
+              id: 'FEATURE_c000425e-b716-4593-9b3f-74280741a4ee',
+              name: 'Groups & Rosters',
+              checked: true,
+              disabled: true,
+            },
+            {
+              id: 'FEATURE_049753e8-ea5c-4fad-adb0-e1456e69c7a5',
+              name: 'Meetings & Events',
+              checked: true,
+              disable: false,
+            },
+            {
+              id: 'FEATURE_a0ad3616-20dc-43da-813f-9b76d33f227a',
+              name: 'Ballots',
+              checked: true,
+              disable: false,
+            },
+          ],
+          [Validators.required],
+        ]),
+        appDomainUrl: [
+          'https://localhost:4200',
+          [
+            Validators.required,
+            Validators.pattern(TenantsValidationPatterns.url),
+          ],
+        ],
+        appType: [
+          'AT_SAAPPS_25634ef4-07d7-4d98-ba8b-ad33ed330789',
+          [Validators.required],
+        ],
+      });
+      component.createTenantFormGroup = mockFormModel;
+      component.featuresOptions = featureOptions;
+      component.appTypeOptions = TenantsMocks.mockAppTypesFormattedResponse;
+      component.selectedAppTypeOption =
+        TenantsMocks.mockAppTypesFormattedResponse[0];
+      const payload = component.getCreateTenantPayload(
+        mockFormGroup?.getRawValue()
+      );
+      expect(payload).toEqual(TenantsMocks.createTenantMockPayload);
+    });
+  });
+  describe('#getCreateTenantFormGroupRef', () => {
+    it('should initialize getCreateTenantFormGroupRef', () => {
+      component.featuresOptions = TenantsMocks.mockFeaturesFormattedResponse;
+      const mockFormGroup = formBuilder.group({
+        appTitle: [
+          'SAAPS1',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appTitleMaxLength),
+          ],
+        ],
+        appId: [
+          'T001',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appIdMaxLength),
+            Validators.pattern(TenantsValidationPatterns.alphaNumeric),
+          ],
+        ],
+        appLogo: ['logo.svg', [Validators.required]],
+        appHeading: [
+          'SAAPS1 Heading',
+          [
+            Validators.required,
+            Validators.maxLength(TenantsValidationPatterns.appHeadingMaxLength),
+          ],
+        ],
+        appDescription: [
+          'SAAPS1 Description',
+          [
+            Validators.required,
+            Validators.maxLength(
+              TenantsValidationPatterns.appDescriptionMaxLength
+            ),
+          ],
+        ],
+        backgroundColor: [
+          '#ffffff',
+          [Validators.required, validColorValidator()],
+        ],
+        appHelpLink: [
+          'https://localhost:4200',
+          [
+            Validators.required,
+            Validators.pattern(TenantsValidationPatterns.url),
+          ],
+        ],
+        features: formBuilder.array([
+          [{ id: '1', name: 'test' }],
+          [Validators.required],
+        ]),
+        appDomainUrl: [
+          'https://localhost:4200',
+          [
+            Validators.required,
+            Validators.pattern(TenantsValidationPatterns.url),
+          ],
+        ],
+        appType: [
+          'AT_SAAPPS_25634ef4-07d7-4d98-ba8b-ad33ed330789',
+          [Validators.required],
+        ],
+      });
+      component.createTenantFormGroup = mockFormModel;
+      fixture.detectChanges();
+      component.getCreateTenantFormGroupRef([mockFormGroup]);
+      expect(component.createTenantFormGroupRef).toEqual(mockFormGroup);
+    });
+  });
+  describe('#onCreateTenantFormChange', () => {
+    it('should call onCreateTenantFormChange whenever the form control value changes ', () => {
+      component.onCreateTenantFormChange([mockFormGroup]);
+      expect(component.createTenantFormGroupRef).toBe(mockFormGroup);
+    });
+    it('should set isAppLogoModified to true whenever the appLogo form control value changes and tenantFunctionType is EDIT', () => {
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      component.createTenantFormGroupRef = mockFormGroup;
+      component.createTenantFormGroupRef?.controls['appLogo']?.markAsDirty();
+      component.onCreateTenantFormChange([mockFormGroup]);
+      expect(component.isAppLogoModified).toBeTrue();
+    });
+  });
+  describe('#onFormCancel', () => {
+    it('should emit formCancel event', () => {
+      const formCancelEmitSpy = spyOn(
+        component.formCancel,
+        'emit'
+      ).and.callThrough();
+      component.onFormCancel();
+      expect(formCancelEmitSpy).toHaveBeenCalled();
+    });
+  });
+  describe('#onFormFileUpload', () => {
+    it('should call onFormFileUpload method while browsing the file', () => {
+      component.onFormFileUpload(mockFile);
+      expect(component.file).toBe(mockFile);
+    });
+  });
+  describe('#onFormColorPickerChange', () => {
+    it('should call onColorPickerChange method while changing the color', () => {
+      component.onColorPickerChange('#000000');
+      expect(component.selectedColor).toBe('#000000');
+    });
+  });
+  describe('#onRadioOptionSelected', () => {
+    it('should call onRadioOptionSelected method while selecting the application type', () => {
+      const selectedAppType: RadioOption = { id: 1, label: 'Generic' };
+      component.onRadioOptionSelected(selectedAppType);
+      expect(component.selectedAppTypeOption).toBe(selectedAppType);
+    });
+  });
+  describe('#onCreateTenantFormSubmit and #getFileUploadPresignedUrl', () => {
+    it('should get the presigned url to upload the file', () => {
+      const mockPresignedUrlResponse = TenantsMocks.mockPreSignedUrlResponse;
+      component.file = mockFile;
+      const getPreseignedUrlSpy = spyOn(
+        fileUploadService,
+        'getFileUploadPresignedUrl'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockPresignedUrlResponse);
+        })
+      );
+      component.onCreateTenantFormSubmit([mockFormGroup]);
+      expect(component.fileUploadPresignedUrl).toBe(
+        mockPresignedUrlResponse?.body
+      );
+      expect(getPreseignedUrlSpy).toHaveBeenCalled();
+    });
+    it('should throw error while getting the presigned url', () => {
+      component.file = mockFile;
+      spyOn(fileUploadService, 'getFileUploadPresignedUrl').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.onCreateTenantFormSubmit([mockFormGroup]);
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+    it('should not call the presigned url if there is no file', () => {
+      const getPresignedUrlSpy = spyOn(
+        fileUploadService,
+        'getFileUploadPresignedUrl'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockPreSignedUrlResponse);
+        })
+      );
+      component.onCreateTenantFormSubmit([mockFormGroup]);
+      expect(getPresignedUrlSpy).not.toHaveBeenCalled();
+    });
+    it('should call editTenant method directly when tenantFunctionType is EDIT and isAppLogoModified is false', () => {
+      component.createTenantPayload = TenantsMocks.editTenantMockPayload;
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      component.isAppLogoModified = false;
+      const editTenantSpy = spyOn(component, 'editTenant').and.callThrough();
+      const getPresignedUrlSpy = spyOn(
+        fileUploadService,
+        'getFileUploadPresignedUrl'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.mockPreSignedUrlResponse);
+        })
+      );
+      component.onCreateTenantFormSubmit([mockFormGroup]);
+      expect(editTenantSpy).toHaveBeenCalled();
+      expect(getPresignedUrlSpy).not.toHaveBeenCalled();
+    });
+  });
+  describe('#createTenant', () => {
+    it('should submit the create tenant form', () => {
+      component.createTenantPayload = TenantsMocks.createTenantMockPayload;
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      const createTenantSpy = spyOn(
+        tenantAppService,
+        'createTenant'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.createTenantMockResponse);
+        })
+      );
+      component.createTenant();
+      expect(createTenantSpy).toHaveBeenCalled();
+      expect(submitResponseSpy).toHaveBeenCalled();
+    });
+    it('should throw error while creating the tenant', () => {
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      spyOn(tenantAppService, 'createTenant').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.createTenant();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+      expect(submitResponseSpy).not.toHaveBeenCalled();
+    });
+  });
+  describe('#editTenant', () => {
+    it('should submit the edit tenant form', () => {
+      component.createTenantPayload = TenantsMocks.editTenantMockPayload;
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      const editTenantSpy = spyOn(
+        tenantAppService,
+        'editTenant'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.editTenantMockResponse);
+        })
+      );
+      component.editTenant();
+      expect(editTenantSpy).toHaveBeenCalled();
+      expect(submitResponseSpy).toHaveBeenCalled();
+    });
+    it('should throw error while editing the tenant', () => {
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      spyOn(tenantAppService, 'editTenant').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.editTenant();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+      expect(submitResponseSpy).not.toHaveBeenCalled();
+    });
+  });
+  describe('#uploadFileToS3', () => {
+    it('should upload the file with presigned url and creates tenant ', () => {
+      const mockFileUploadedResponse = TenantsMocks.mockFileUploadedResponse;
+      const uploadFileToS3Spy = spyOn(
+        fileUploadService,
+        'uploadFileToS3'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockFileUploadedResponse);
+        })
+      );
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      const createTenantSpy = spyOn(
+        tenantAppService,
+        'createTenant'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.createTenantMockResponse);
+        })
+      );
+      component.uploadFileToS3(mockFile);
+      expect(uploadFileToS3Spy).toHaveBeenCalled();
+      expect(createTenantSpy).toHaveBeenCalled();
+      expect(submitResponseSpy).toHaveBeenCalled();
+    });
+    it('should upload the file with presigned url and fail to create tenant', () => {
+      const mockFileUploadedResponse = TenantsMocks.mockFileUploadedResponse;
+      const uploadFileToS3Spy = spyOn(
+        fileUploadService,
+        'uploadFileToS3'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockFileUploadedResponse);
+        })
+      );
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      spyOn(tenantAppService, 'createTenant').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.uploadFileToS3(mockFile);
+      expect(uploadFileToS3Spy).toHaveBeenCalled();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+      expect(submitResponseSpy).not.toHaveBeenCalled();
+    });
+    it('should upload the file with presigned url and edits tenant ', () => {
+      const mockFileUploadedResponse = TenantsMocks.mockFileUploadedResponse;
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      component.createTenantPayload = TenantsMocks.editTenantMockPayload;
+      const uploadFileToS3Spy = spyOn(
+        fileUploadService,
+        'uploadFileToS3'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockFileUploadedResponse);
+        })
+      );
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      const editTenantSpy = spyOn(
+        tenantAppService,
+        'editTenant'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(TenantsMocks.editTenantMockResponse);
+        })
+      );
+      component.uploadFileToS3(mockFile);
+      expect(uploadFileToS3Spy).toHaveBeenCalled();
+      expect(editTenantSpy).toHaveBeenCalled();
+      expect(submitResponseSpy).toHaveBeenCalled();
+    });
+    it('should upload the file with presigned url and fail to edit tenant', () => {
+      const mockFileUploadedResponse = TenantsMocks.mockFileUploadedResponse;
+      component.tenantFunctionType = TenantFunctionType.EDIT;
+      const uploadFileToS3Spy = spyOn(
+        fileUploadService,
+        'uploadFileToS3'
+      ).and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.next(mockFileUploadedResponse);
+        })
+      );
+      const submitResponseSpy = spyOn(
+        component.submitFormResponse,
+        'emit'
+      ).and.callThrough();
+      spyOn(tenantAppService, 'editTenant').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.uploadFileToS3(mockFile);
+      expect(uploadFileToS3Spy).toHaveBeenCalled();
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+      expect(submitResponseSpy).not.toHaveBeenCalled();
+    });
+    it('should throw error while uploading the file into s3 bucket', () => {
+      spyOn(fileUploadService, 'uploadFileToS3').and.returnValue(
+        new Observable((subscriber) => {
+          subscriber.error(mockServerErrorResponse);
+        })
+      );
+      spyOn(globalErrorHandlerService, 'handleError');
+      component.uploadFileToS3(mockFile);
+      expect(globalErrorHandlerService.handleError).toHaveBeenCalledWith(
+        mockServerErrorResponse
+      );
+    });
+  });
+  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();
+    });
+  });
+});