Feature/328 django login-dot-gov django login dot gov

front-end/src/app/app-routing.module.ts

@@ -5,12 +5,14 @@ import { TwoFactorLoginComponent } from './login/two-factor-login/two-factor-log
 import { ConfirmTwoFactorComponent } from './login/confirm-two-factor/confirm-two-factor.component';
 import { LayoutComponent } from './layout/layout.component';
 import { DashboardComponent } from './dashboard/dashboard.component';
+import { LoginGuard } from './shared/guards/login-page.guard';
 
 const routes: Routes = [
   {
     path: '',
     component: LoginComponent,
     pathMatch: 'full',
+    canActivate:[LoginGuard],
   },
   { path: 'twoFactLogin', component: TwoFactorLoginComponent },
   { path: 'confirm-2f', component: ConfirmTwoFactorComponent },

front-end/src/app/dashboard/dashboard.component.spec.ts

@@ -1,19 +1,47 @@
-import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
 import { RouterTestingModule } from '@angular/router/testing';
+import { Store } from '@ngrx/store';
+import { provideMockStore } from '@ngrx/store/testing';
+import { UserLoginData } from 'app/shared/models/user.model';
+import { userLoggedInAction } from 'app/store/login.actions';
+import { selectUserLoginData } from 'app/store/login.selectors';
+import { environment } from 'environments/environment';
 import { CookieService } from 'ngx-cookie-service';
+import { PanelModule } from 'primeng/panel';
 import { DashboardComponent } from './dashboard.component';
 
-xdescribe('DashboardComponent', () => {
+describe('DashboardComponent', () => {
   let component: DashboardComponent;
   let fixture: ComponentFixture<DashboardComponent>;
+  let cookieService: CookieService;
+  let store: Store;
 
   beforeEach(
     waitForAsync(() => {
+      const userLoginData: UserLoginData = {
+        committee_id: 'C00000000',
+        email: '[email protected]',
+        is_allowed: true,
+        token: 'jwttokenstring',
+      };
+
       TestBed.configureTestingModule({
-        imports: [HttpClientTestingModule, RouterTestingModule],
+        imports: [
+          HttpClientTestingModule, 
+          RouterTestingModule,
+          PanelModule,
+          BrowserAnimationsModule,
+        ],
         declarations: [DashboardComponent],
-        providers: [CookieService],
+        providers: [
+          CookieService,
+          provideMockStore({
+            initialState: { fecfile_online_userLoginData: userLoginData },
+            selectors: [{ selector: selectUserLoginData, value: userLoginData }],
+          }),
+        ],
       }).compileComponents();
     })
   );
@@ -22,9 +50,41 @@ xdescribe('DashboardComponent', () => {
     fixture = TestBed.createComponent(DashboardComponent);
     component = fixture.componentInstance;
     fixture.detectChanges();
+    cookieService = TestBed.inject(CookieService);
+    store = TestBed.inject(Store);
   });
 
-  xit('should create', () => {
+  it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  it('#dispatchUserLoggedInFromCookies happy path', () => {
+    const testCommitteeId = "testCommitteeId";
+    const testEmail = "testEmail";
+    const testIsAllowed = true;
+    const testToken = null;
+
+    const expectedUserLoginData: UserLoginData = {
+      committee_id: testCommitteeId,
+      email: testEmail,
+      is_allowed: testIsAllowed,
+      token: testToken
+    }
+    spyOn(cookieService, 'check').and.returnValue(true);
+    spyOn(cookieService, 'get').and.callFake((name: string) => {
+      if (name === environment.ffapiCommitteeIdCookieName) {
+        return testCommitteeId;
+      }
+      if (name === environment.ffapiEmailCookieName) {
+        return testEmail;
+      }
+      throw Error("fail!");
+    });
+    spyOn(store, 'dispatch');
+
+    component.dispatchUserLoggedInFromCookies();
+    expect(store.dispatch).toHaveBeenCalledWith(
+      userLoggedInAction({ payload: expectedUserLoginData }));
+  });
+
 });

front-end/src/app/dashboard/dashboard.component.ts

@@ -1,8 +1,40 @@
-import { Component } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
+import { Store } from '@ngrx/store';
+import { UserLoginData } from 'app/shared/models/user.model';
+import { userLoggedInAction } from 'app/store/login.actions';
+import { environment } from 'environments/environment';
+import { CookieService } from 'ngx-cookie-service';
 
 @Component({
   selector: 'app-dashboard',
   templateUrl: './dashboard.component.html',
   // styleUrls: ['./dashboard.component.scss'],
 })
-export class DashboardComponent {}
+export class DashboardComponent implements OnInit {
+
+  constructor(
+    private store: Store,
+    private cookieService: CookieService
+  ) { }
+
+  ngOnInit(): void {
+    this.dispatchUserLoggedInFromCookies();
+  }
+
+  dispatchUserLoggedInFromCookies() {
+    if (this.cookieService.check(environment.ffapiCommitteeIdCookieName)) {
+      const userLoginData: UserLoginData = {
+        committee_id: this.cookieService.get(
+          environment.ffapiCommitteeIdCookieName),
+        email: this.cookieService.get(
+          environment.ffapiEmailCookieName),
+        is_allowed: true,
+        token: null
+      }
+      this.cookieService.delete(environment.ffapiCommitteeIdCookieName)
+      this.cookieService.delete(environment.ffapiEmailCookieName)
+      this.store.dispatch(userLoggedInAction({ payload: userLoginData }));
+    }
+  }
+
+}

front-end/src/app/login/login/login.component.html

@@ -125,6 +125,10 @@
           <button type="submit" class="login__btn" [disabled]="isBusy">
             <ng-template [ngIf]="true">Enter</ng-template>
           </button>
+          &nbsp; or &nbsp;
+          <button type="button" (click)="navigateToLoginDotGov()" class="login-dot-gov-button">
+            <ng-template [ngIf]="true">Login with login.gov</ng-template>
+          </button>
         </div>
       </div>
 

front-end/src/app/login/login/login.component.scss

@@ -175,6 +175,11 @@
         .login__btn:hover {
           background-color: #c80505;
         }
+        .login-dot-gov-button {
+          @extend .login__btn;
+          width: 240px;
+          margin-left: 0px;
+        }
         .logged-out-msg {
           font-size: 1em;
           font-weight: bold;

front-end/src/app/login/login/login.component.spec.ts

@@ -1,13 +1,40 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
 import { ComponentFixture, TestBed } from '@angular/core/testing';
-
+import { ReactiveFormsModule } from '@angular/forms';
+import { RouterTestingModule } from '@angular/router/testing';
+import { provideMockStore } from '@ngrx/store/testing';
+import { UserLoginData } from 'app/shared/models/user.model';
+import { selectUserLoginData } from 'app/store/login.selectors';
+import { environment } from '../../../environments/environment';
 import { LoginComponent } from './login.component';
 
+
 describe('LoginComponent', () => {
   let component: LoginComponent;
   let fixture: ComponentFixture<LoginComponent>;
 
+  const userLoginData: UserLoginData = {
+    committee_id: 'C00000000',
+    email: '[email protected]',
+    is_allowed: true,
+    token: 'jwttokenstring',
+  };
+
   beforeEach(async () => {
+    window.onbeforeunload = jasmine.createSpy();
     await TestBed.configureTestingModule({
+      imports: [
+        HttpClientTestingModule, 
+        RouterTestingModule, 
+        ReactiveFormsModule,
+      ],
+      providers: [
+        { provide: Window, useValue: window },
+        provideMockStore({
+          initialState: { fecfile_online_userLoginData: userLoginData },
+          selectors: [{ selector: selectUserLoginData, value: userLoginData }],
+        }),
+      ],
       declarations: [LoginComponent],
     }).compileComponents();
   });
@@ -18,7 +45,13 @@ describe('LoginComponent', () => {
     fixture.detectChanges();
   });
 
-  xit('should create', () => {
+  it('should create', () => {
     expect(component).toBeTruthy();
   });
+
+  xit('navigateToLoginDotGov should href environment location', () => {
+    component.navigateToLoginDotGov();
+    expect(window.location.href).toEqual(environment.loginDotGovAuthUrl);
+  });
+
 });

front-end/src/app/login/login/login.component.ts

@@ -1,11 +1,13 @@
 import { Component, OnInit } from '@angular/core';
 import { FormBuilder, FormGroup, Validators } from '@angular/forms';
 import { Router } from '@angular/router';
+import { Store } from '@ngrx/store';
+import { UserLoginData } from 'app/shared/models/user.model';
+import { userLoggedOutAction } from 'app/store/login.actions';
 import { environment } from '../../../environments/environment';
-import { LoginService } from '../../shared/services/login.service';
 import { AuthService } from '../../shared/services/AuthService/auth.service';
+import { LoginService } from '../../shared/services/login.service';
 import { SessionService } from '../../shared/services/SessionService/session.service';
-import { UserLoginData } from 'app/shared/models/user.model';
 
 @Component({
   selector: 'app-login',
@@ -23,13 +25,15 @@ export class LoginComponent implements OnInit {
   public titleF!: string;
   public titleR!: string;
   public show!: boolean;
+  public loginDotGovAuthUrl: string | null = null;
 
   constructor(
     private fb: FormBuilder,
     private loginService: LoginService,
     private authService: AuthService,
     private router: Router,
-    private sessionService: SessionService
+    private sessionService: SessionService,
+    private store: Store,
   ) {
     this.frm = this.fb.group({
       commiteeId: ['', Validators.required],
@@ -45,7 +49,9 @@ export class LoginComponent implements OnInit {
     this.appTitle = environment.appTitle;
     this.titleF = this.appTitle.substring(0, 3);
     this.titleR = this.appTitle.substring(3);
-    this.loginService.logOut();
+    this.loginService.clearUserLoggedInCookies();
+    this.store.dispatch(userLoggedOutAction());
+    this.loginDotGovAuthUrl = environment.loginDotGovAuthUrl;
   }
 
   /**
@@ -104,4 +110,8 @@ export class LoginComponent implements OnInit {
   showPassword() {
     this.show = !this.show;
   }
+
+  navigateToLoginDotGov() {
+    window.location.href = this.loginDotGovAuthUrl || "";
+  }
 }

front-end/src/app/shared/guards/login-page.guard.spec.ts

@@ -0,0 +1,60 @@
+import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { TestBed } from '@angular/core/testing';
+import { Router } from '@angular/router';
+import { RouterTestingModule } from '@angular/router/testing';
+import { provideMockStore } from '@ngrx/store/testing';
+import { UserLoginData } from 'app/shared/models/user.model';
+import { ApiService } from 'app/shared/services/api.service';
+import { selectUserLoginData } from 'app/store/login.selectors';
+import { LoginGuard } from './login-page.guard';
+
+
+describe('LoginGuard', () => {
+  let guard: LoginGuard;
+  let apiService: ApiService;
+  let router: Router;
+
+  const userLoginData: UserLoginData = {
+    committee_id: 'C00000000',
+    email: '[email protected]',
+    is_allowed: true,
+    token: 'jwttokenstring',
+  };
+
+  beforeEach(() => {
+    TestBed.configureTestingModule({
+      imports: [HttpClientTestingModule, RouterTestingModule],
+      providers: [
+        ApiService,
+        provideMockStore({
+          initialState: { fecfile_online_userLoginData: userLoginData },
+          selectors: [{ selector: selectUserLoginData, value: userLoginData }],
+        }),
+      ],
+    });
+    guard = TestBed.inject(LoginGuard);
+    apiService = TestBed.inject(ApiService);
+    router = TestBed.inject(Router);
+  });
+
+  it('should be created', () => {
+    expect(guard).toBeTruthy();
+  });
+
+  it('should reroute to dashboard if logged in', () => {
+    spyOn(apiService, 'isAuthenticated').and.returnValue(true);
+    const navigateSpy = spyOn(router, 'navigate');
+    const retval = guard.canActivate()
+    expect(navigateSpy).toHaveBeenCalledWith(['dashboard']);
+    expect(retval).toEqual(false);
+  });
+
+  it('should allow activate if not logged in', () => {
+    spyOn(apiService, 'isAuthenticated').and.returnValue(false);
+    const navigateSpy = spyOn(router, 'navigate');
+    const retval = guard.canActivate()
+    expect(navigateSpy).not.toHaveBeenCalled();
+    expect(retval).toEqual(true);
+  });
+
+});

front-end/src/app/shared/guards/login-page.guard.ts

@@ -0,0 +1,20 @@
+import { Injectable } from '@angular/core';
+import { CanActivate, Router, UrlTree } from '@angular/router';
+import { ApiService } from 'app/shared/services/api.service';
+import { Observable } from 'rxjs';
+
+@Injectable({
+  providedIn: 'root'
+})
+export class LoginGuard implements CanActivate {
+  constructor(private apiService: ApiService, private router: Router) { }
+  canActivate(): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
+    if (this.apiService.isAuthenticated()) {
+      this.router.navigate(['dashboard']);
+      return false;
+    } else {
+      return true;
+    }
+  }
+
+}

front-end/src/app/shared/services/api.service.spec.ts

@@ -1,5 +1,5 @@
-import { TestBed } from '@angular/core/testing';
 import { HttpClientTestingModule } from '@angular/common/http/testing';
+import { TestBed } from '@angular/core/testing';
 import { provideMockStore } from '@ngrx/store/testing';
 import { UserLoginData } from 'app/shared/models/user.model';
 import { selectUserLoginData } from 'app/store/login.selectors';
@@ -32,4 +32,10 @@ describe('ApiService', () => {
   it('should be created', () => {
     expect(service).toBeTruthy();
   });
+
+  it('isAuthenticated should return true with committee_id set', () => {
+    const retval = service.isAuthenticated();
+    expect(retval).toBeTrue();
+  });
+
 });