From 8d4b47a9cc75a5ea74830660c32644ffb9a237b2 Mon Sep 17 00:00:00 2001 From: dylan Date: Fri, 31 Jan 2025 08:27:13 +0100 Subject: [PATCH] Implement createSession and store it in localStorage --- src/app/app-routing.module.ts | 4 +- src/app/app.component.html | 4 -- src/app/app.module.ts | 12 +++-- src/app/{ => components}/app.component.css | 0 src/app/components/app.component.html | 1 + .../{ => components}/app.component.spec.ts | 0 src/app/{ => components}/app.component.ts | 0 .../hello/hello.component.css | 0 .../hello/hello.component.html | 0 .../hello/hello.component.spec.ts | 0 .../{ => components}/hello/hello.component.ts | 2 +- .../login/login.component.css} | 0 src/app/components/login/login.component.html | 23 ++++++++ .../login/login.component.spec.ts} | 12 ++--- src/app/components/login/login.component.ts | 31 +++++++++++ src/app/navbar/navbar.component.html | 54 ------------------- src/app/navbar/navbar.component.ts | 21 -------- src/app/services/auth.service.spec.ts | 16 ++++++ src/app/services/auth.service.ts | 20 +++++++ 19 files changed, 108 insertions(+), 92 deletions(-) delete mode 100644 src/app/app.component.html rename src/app/{ => components}/app.component.css (100%) create mode 100644 src/app/components/app.component.html rename src/app/{ => components}/app.component.spec.ts (100%) rename src/app/{ => components}/app.component.ts (100%) rename src/app/{ => components}/hello/hello.component.css (100%) rename src/app/{ => components}/hello/hello.component.html (100%) rename src/app/{ => components}/hello/hello.component.spec.ts (100%) rename src/app/{ => components}/hello/hello.component.ts (91%) rename src/app/{navbar/navbar.component.css => components/login/login.component.css} (100%) create mode 100644 src/app/components/login/login.component.html rename src/app/{navbar/navbar.component.spec.ts => components/login/login.component.spec.ts} (55%) create mode 100644 src/app/components/login/login.component.ts delete mode 100644 src/app/navbar/navbar.component.html delete mode 100644 src/app/navbar/navbar.component.ts create mode 100644 src/app/services/auth.service.spec.ts create mode 100644 src/app/services/auth.service.ts diff --git a/src/app/app-routing.module.ts b/src/app/app-routing.module.ts index be316c0..4c0f726 100644 --- a/src/app/app-routing.module.ts +++ b/src/app/app-routing.module.ts @@ -1,8 +1,10 @@ import {NgModule} from '@angular/core'; import {RouterModule, Routes} from '@angular/router'; -import {HelloComponent} from './hello/hello.component'; +import {HelloComponent} from './components/hello/hello.component'; +import {LoginComponent} from './components/login/login.component'; const routes: Routes = [ + {path: "login", component: LoginComponent}, {path: "", component: HelloComponent} ]; diff --git a/src/app/app.component.html b/src/app/app.component.html deleted file mode 100644 index 2420cb6..0000000 --- a/src/app/app.component.html +++ /dev/null @@ -1,4 +0,0 @@ - -
- -
diff --git a/src/app/app.module.ts b/src/app/app.module.ts index 38999c1..2673df8 100644 --- a/src/app/app.module.ts +++ b/src/app/app.module.ts @@ -2,22 +2,24 @@ import {NgModule} from '@angular/core'; import {BrowserModule} from '@angular/platform-browser'; import {AppRoutingModule} from './app-routing.module'; -import {AppComponent} from './app.component'; -import {HelloComponent} from './hello/hello.component'; -import {NavbarComponent} from './navbar/navbar.component'; +import {AppComponent} from './components/app.component'; +import {HelloComponent} from './components/hello/hello.component'; import {BASE_PATH} from '../gen'; import {environment} from '../environments/environment'; import {provideHttpClient, withInterceptorsFromDi} from '@angular/common/http'; +import { LoginComponent } from './components/login/login.component'; +import {FormsModule} from '@angular/forms'; @NgModule({ declarations: [ AppComponent, - HelloComponent + HelloComponent, + LoginComponent ], imports: [ BrowserModule, AppRoutingModule, - NavbarComponent + FormsModule ], providers: [ {provide: BASE_PATH, useValue: environment.apiBasePath}, diff --git a/src/app/app.component.css b/src/app/components/app.component.css similarity index 100% rename from src/app/app.component.css rename to src/app/components/app.component.css diff --git a/src/app/components/app.component.html b/src/app/components/app.component.html new file mode 100644 index 0000000..67e7bd4 --- /dev/null +++ b/src/app/components/app.component.html @@ -0,0 +1 @@ + diff --git a/src/app/app.component.spec.ts b/src/app/components/app.component.spec.ts similarity index 100% rename from src/app/app.component.spec.ts rename to src/app/components/app.component.spec.ts diff --git a/src/app/app.component.ts b/src/app/components/app.component.ts similarity index 100% rename from src/app/app.component.ts rename to src/app/components/app.component.ts diff --git a/src/app/hello/hello.component.css b/src/app/components/hello/hello.component.css similarity index 100% rename from src/app/hello/hello.component.css rename to src/app/components/hello/hello.component.css diff --git a/src/app/hello/hello.component.html b/src/app/components/hello/hello.component.html similarity index 100% rename from src/app/hello/hello.component.html rename to src/app/components/hello/hello.component.html diff --git a/src/app/hello/hello.component.spec.ts b/src/app/components/hello/hello.component.spec.ts similarity index 100% rename from src/app/hello/hello.component.spec.ts rename to src/app/components/hello/hello.component.spec.ts diff --git a/src/app/hello/hello.component.ts b/src/app/components/hello/hello.component.ts similarity index 91% rename from src/app/hello/hello.component.ts rename to src/app/components/hello/hello.component.ts index 50b122a..f42b428 100644 --- a/src/app/hello/hello.component.ts +++ b/src/app/components/hello/hello.component.ts @@ -1,5 +1,5 @@ import {Component, OnInit} from '@angular/core'; -import {HelloResponse, HelloService} from '../../gen'; +import {HelloResponse, HelloService} from '../../../gen'; @Component({ selector: 'app-hello', diff --git a/src/app/navbar/navbar.component.css b/src/app/components/login/login.component.css similarity index 100% rename from src/app/navbar/navbar.component.css rename to src/app/components/login/login.component.css diff --git a/src/app/components/login/login.component.html b/src/app/components/login/login.component.html new file mode 100644 index 0000000..267d573 --- /dev/null +++ b/src/app/components/login/login.component.html @@ -0,0 +1,23 @@ +
+
+
+

Log in to Swiss Post

+
+
+
+ + +
+
+ + +
+ +
+
+
diff --git a/src/app/navbar/navbar.component.spec.ts b/src/app/components/login/login.component.spec.ts similarity index 55% rename from src/app/navbar/navbar.component.spec.ts rename to src/app/components/login/login.component.spec.ts index e680ee6..4adbc3d 100644 --- a/src/app/navbar/navbar.component.spec.ts +++ b/src/app/components/login/login.component.spec.ts @@ -1,18 +1,18 @@ import { ComponentFixture, TestBed } from '@angular/core/testing'; -import { NavbarComponent } from './navbar.component'; +import { LoginComponent } from './login.component'; -describe('NavbarComponent', () => { - let component: NavbarComponent; - let fixture: ComponentFixture; +describe('LoginComponent', () => { + let component: LoginComponent; + let fixture: ComponentFixture; beforeEach(async () => { await TestBed.configureTestingModule({ - declarations: [NavbarComponent] + declarations: [LoginComponent] }) .compileComponents(); - fixture = TestBed.createComponent(NavbarComponent); + fixture = TestBed.createComponent(LoginComponent); component = fixture.componentInstance; fixture.detectChanges(); }); diff --git a/src/app/components/login/login.component.ts b/src/app/components/login/login.component.ts new file mode 100644 index 0000000..4d5d472 --- /dev/null +++ b/src/app/components/login/login.component.ts @@ -0,0 +1,31 @@ +import {Component} from '@angular/core'; +import {CreateSessionRequest, CreateSessionResponse, SessionService} from '../../../gen'; +import {AuthService} from '../../services/auth.service'; + +@Component({ + selector: 'app-login', + standalone: false, + + templateUrl: './login.component.html', + styleUrl: './login.component.css' +}) +export class LoginComponent { + createSessionRequest: CreateSessionRequest = { + username: "", + password: "" + } + + constructor(private sessionService: SessionService, private authService: AuthService) { + } + + onSubmit(): void { + this.sessionService.createToken(this.createSessionRequest).subscribe({ + next: (response: CreateSessionResponse): void => { + this.authService.setToken(response.token); + }, + error: (err: Error): void => { + console.log(err); + } + }); + } +} diff --git a/src/app/navbar/navbar.component.html b/src/app/navbar/navbar.component.html deleted file mode 100644 index 0d331d3..0000000 --- a/src/app/navbar/navbar.component.html +++ /dev/null @@ -1,54 +0,0 @@ - diff --git a/src/app/navbar/navbar.component.ts b/src/app/navbar/navbar.component.ts deleted file mode 100644 index efb7f73..0000000 --- a/src/app/navbar/navbar.component.ts +++ /dev/null @@ -1,21 +0,0 @@ -import { Component } from '@angular/core'; -import {NgIf} from '@angular/common'; -import {RouterLink, RouterLinkActive} from '@angular/router'; - -@Component({ - selector: 'app-navbar', - templateUrl: './navbar.component.html', - imports: [ - NgIf, - RouterLink, - RouterLinkActive - ], - styleUrls: ['./navbar.component.css'] -}) -export class NavbarComponent { - mobileMenuOpen = false; - - toggleMobileMenu() { - this.mobileMenuOpen = !this.mobileMenuOpen; - } -} diff --git a/src/app/services/auth.service.spec.ts b/src/app/services/auth.service.spec.ts new file mode 100644 index 0000000..f1251ca --- /dev/null +++ b/src/app/services/auth.service.spec.ts @@ -0,0 +1,16 @@ +import { TestBed } from '@angular/core/testing'; + +import { AuthService } from './auth.service'; + +describe('AuthService', () => { + let service: AuthService; + + beforeEach(() => { + TestBed.configureTestingModule({}); + service = TestBed.inject(AuthService); + }); + + it('should be created', () => { + expect(service).toBeTruthy(); + }); +}); diff --git a/src/app/services/auth.service.ts b/src/app/services/auth.service.ts new file mode 100644 index 0000000..f0b6efa --- /dev/null +++ b/src/app/services/auth.service.ts @@ -0,0 +1,20 @@ +import { Injectable } from '@angular/core'; + +@Injectable({ + providedIn: 'root' +}) +export class AuthService { + private tokenKey = 'authToken'; + + setToken(token: string): void { + localStorage.setItem(this.tokenKey, token); + } + + getToken(): string | null { + return localStorage.getItem(this.tokenKey); + } + + clearToken(): void { + localStorage.removeItem(this.tokenKey); + } +}