Merge pull request #17 from crupest/15-user

Remember me and log out feature.

3 files changed, 26 insertions, 2 deletions

diff --git a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.css b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.css
index 6486142b..b1101e2a 100644
--- a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.css
+++ b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.css
@@ -5,3 +5,18 @@
 .username {
   color: blue;
 }
+
+:host {
+  display: flex;
+  flex-wrap: wrap;
+}
+
+:host p {
+  margin-top: 0.3em;
+  margin-bottom: 0.3em;
+  width: 100%;
+}
+
+.logout-button {
+  margin-left: auto;
+}
diff --git a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.html b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.html
index e156f0f8..685f6299 100644
--- a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.html
+++ b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.html
@@ -3,3 +3,4 @@
 </p>
 <p class="mat-body">You have been login as <span class="username">{{ userInfo.username }}</span>.</p>
 <p class="mat-body">Your roles are <span class="roles">{{ userInfo.roles.join(', ') }}</span>.</p>
+<a mat-flat-button class="logout-button" [routerLink]="['..','logout']">Logout</a>
diff --git a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.spec.ts b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.spec.ts
index ff253add..3eba2696 100644
--- a/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.spec.ts
+++ b/Timeline/ClientApp/src/app/user/user-login-success/user-login-success.component.spec.ts
@@ -2,7 +2,8 @@ import { async, ComponentFixture, TestBed } from '@angular/core/testing';
 import { By } from '@angular/platform-browser';
 import { ActivatedRoute } from '@angular/router';
 
-import { MockActivatedRoute } from 'src/app/test-utilities/activated-route.mock';
+import { RouterLinkStubDirective } from '../../test-utilities/router-link.mock';
+import { MockActivatedRoute } from '../../test-utilities/activated-route.mock';
 import { createMockInternalUserService } from '../internal-user-service/internal-user.service.mock';
 
 import { UserLoginSuccessComponent } from './user-login-success.component';
@@ -29,7 +30,7 @@ describe('UserLoginSuccessComponent', () => {
     (<any>mockInternalUserService).currentUserInfo = mockUserInfo;
 
     TestBed.configureTestingModule({
-      declarations: [UserLoginSuccessComponent],
+      declarations: [UserLoginSuccessComponent, RouterLinkStubDirective],
       providers: [
         { provide: InternalUserService, useValue: mockInternalUserService },
         { provide: ActivatedRoute, useValue: mockActivatedRoute }
@@ -64,4 +65,11 @@ describe('UserLoginSuccessComponent', () => {
     fixture.detectChanges();
     expect((fixture.debugElement.query(By.css('p.login-success-message')))).toBeTruthy();
   });
+
+  it('logout button should be set well', () => {
+    fixture.detectChanges();
+    const routerLinkDirective: RouterLinkStubDirective =
+      fixture.debugElement.query(By.css('a')).injector.get(RouterLinkStubDirective);
+      expect(routerLinkDirective.linkParams).toEqual(['..', 'logout']);
+  });
 });