New login screen

- Basic user page

frontend/src/app/user/user.component.html

@@ -0,0 +1,14 @@
+<div id="user">
+    <h1>{{this.api.user.name}}
+        <span class="adminState" *ngIf="this.api.user.type == 'admin'">Admin &#2B50;</span>
+    </h1>
+    <p class="lastLogin">Last login was {{lastLogin}}</p><br>
+
+    <h2>Devices</h2>
+    <ul class="phoneListing">
+        <li *ngFor="let phone of this.api.phones">
+            <h2>{{phone.displayName}}</h2>
+            <p>{{phone.modelName}}</p>
+        </li>
+    </ul>
+</div>

frontend/src/app/user/user.component.scss

@@ -0,0 +1,21 @@
+@import '../../styles.scss';
+
+#user {
+    margin-top: 3rem;
+    margin-left: 20rem;
+    margin-right: 20rem;
+}
+
+.adminState {
+    padding-left: 1rem;
+    font-weight: bolder;
+    color: gold;
+    font-size: 12pt;
+}
+
+.phoneListing {
+    list-style: none;
+    padding: 1.5rem;
+    border-radius: 10px;
+    background-color: $darker;
+}

frontend/src/app/user/user.component.spec.ts

@@ -0,0 +1,25 @@
+import { ComponentFixture, TestBed } from '@angular/core/testing';
+
+import { UserComponent } from './user.component';
+
+describe('UserComponent', () => {
+  let component: UserComponent;
+  let fixture: ComponentFixture<UserComponent>;
+
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      declarations: [ UserComponent ]
+    })
+    .compileComponents();
+  });
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(UserComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should create', () => {
+    expect(component).toBeTruthy();
+  });
+});

frontend/src/app/user/user.component.ts

@@ -0,0 +1,33 @@
+import { AfterContentInit, Component, OnDestroy, OnInit } from '@angular/core';
+import { APIService } from '../api.service';
+import * as moment from 'moment';
+
+@Component({
+  selector: 'app-user',
+  templateUrl: './user.component.html',
+  styleUrls: ['./user.component.scss']
+})
+export class UserComponent implements AfterContentInit, OnDestroy {
+
+  lastLogin: string;
+
+  constructor(public api: APIService) {
+    this.api.loginEvent.subscribe(status => {
+      if (status) {
+        this.lastLogin = moment(this.api.user.lastLogin).fromNow();
+
+        console.log(this.lastLogin);
+      }
+    });
+  }
+
+  ngAfterContentInit(): void {
+    this.api.showFilter = false;
+    console.log(this.api.showFilter);
+  }
+
+  ngOnDestroy(): void {
+    this.api.showFilter = true;
+  }
+
+}