fix: #147 Display correct username

Author: DiegoTinitana

src/app/modules/shared/components/user/user.component.html

@@ -7,7 +7,8 @@
     aria-haspopup="true"
     aria-expanded="false"
   >
-    <i class="far fa-user-circle"></i> Dario Herrera
+    <i class="far fa-user-circle"></i>
+    {{name}}
   </a>
   <div class="dropdown-menu style-click" aria-labelledby="navbarDropdown">
     <a class="dropdown-item style-click" (click)="logout()">Sign Out</a>

src/app/modules/time-clock/pages/time-clock.component.spec.ts

@@ -9,13 +9,15 @@ import { ProjectState } from '../../project-management/store/project.reducer';
 import { ProjectListHoverComponent } from '../components';
 import { ProjectService } from '../../project-management/services/project.service';
 import { FilterProjectPipe } from '../../shared/pipes';
+import {AzureAdB2CService} from '../../login/services/azure.ad.b2c.service';
 
 describe('TimeClockComponent', () => {
   let component: TimeClockComponent;
   let fixture: ComponentFixture<TimeClockComponent>;
   let de: DebugElement;
   let store: MockStore<ProjectState>;
   let projectService: ProjectService;
+  let azureAdB2CService: AzureAdB2CService;
   const state = {
     projects: {
       projectList: [{ id: 'id', name: 'name', description: 'description' }],
@@ -32,7 +34,7 @@ describe('TimeClockComponent', () => {
     TestBed.configureTestingModule({
       imports: [HttpClientTestingModule],
       declarations: [TimeClockComponent, ProjectListHoverComponent, FilterProjectPipe],
-      providers: [ProjectService, provideMockStore({ initialState: state })],
+      providers: [ProjectService, AzureAdB2CService, provideMockStore({ initialState: state })],
     }).compileComponents();
     store = TestBed.inject(MockStore);
   }));
@@ -43,12 +45,29 @@ describe('TimeClockComponent', () => {
     de = fixture.debugElement;
     fixture.detectChanges();
     projectService = TestBed.inject(ProjectService);
+    azureAdB2CService = TestBed.inject(AzureAdB2CService);
   });
 
   it('should be created', () => {
     expect(component).toBeTruthy();
   });
 
+  it('onInit checks if isLogin and gets the userName', () => {
+    spyOn(azureAdB2CService, 'isLogin').and.returnValue(true);
+    spyOn(azureAdB2CService, 'getName').and.returnValue('Name');
+    component.ngOnInit();
+    expect(azureAdB2CService.isLogin).toHaveBeenCalled();
+    expect(azureAdB2CService.getName).toHaveBeenCalled();
+  });
+
+  it('onInit does not get the name if isLogin false', () => {
+    spyOn(azureAdB2CService, 'isLogin').and.returnValue(false);
+    spyOn(azureAdB2CService, 'getName').and.returnValue('Name');
+    component.ngOnInit();
+    expect(azureAdB2CService.isLogin).toHaveBeenCalled();
+    expect(azureAdB2CService.getName).toHaveBeenCalledTimes(0);
+  });
+
   it('Service injected via inject(...) and TestBed.get(...) should be the same instance', inject(
     [ProjectService],
     (injectService: ProjectService) => {

src/app/modules/time-clock/pages/time-clock.component.ts

@@ -1,4 +1,5 @@
 import { Component, OnInit } from '@angular/core';
+import { AzureAdB2CService } from '../../login/services/azure.ad.b2c.service';
 
 @Component({
   selector: 'app-time-clock',
@@ -7,7 +8,7 @@ import { Component, OnInit } from '@angular/core';
 })
 export class TimeClockComponent implements OnInit {
   currentDate: Date = new Date();
-  username = 'Dario';
+  username: string;
   isClockIn: boolean;
   isEnterTechnology: boolean;
   showAlertEnterTecnology: boolean;
@@ -25,7 +26,7 @@ export class TimeClockComponent implements OnInit {
   isClockInEnable = false;
   isHidenForm = true;
 
-  constructor() {
+  constructor(private azureAdB2CService: AzureAdB2CService) {
     this.isClockIn = true;
     this.isEnterTechnology = false;
     this.hourCounterRealTime = 0;
@@ -36,7 +37,9 @@ export class TimeClockComponent implements OnInit {
     this.seconds = 0;
   }
 
-  ngOnInit() {}
+  ngOnInit() {
+    this.username = this.azureAdB2CService.isLogin() ? this.azureAdB2CService.getName() : '';
+  }
 
   employeClockIn(): boolean {
     this.isClockInEnable = true;