Scaffold backend/frontend services, OIDC auth, and compose.yml

frontend/src/app/app.ts

@@ -0,0 +1,53 @@
+import { Component, signal } from '@angular/core';
+import { OAuthService } from 'angular-oauth2-oidc';
+import { HttpClient, HttpHeaders } from '@angular/common/http';
+
+@Component({
+  selector: 'app-root',
+  imports: [],
+  templateUrl: './app.html',
+  styleUrl: './app.css'
+})
+export class App {
+  protected readonly title = signal('LMNP Organizer');
+  readonly helloMessage = signal<string>('');
+
+  constructor(private oauthService: OAuthService, private http: HttpClient) {}
+
+  get isLoggedIn(): boolean {
+    return this.oauthService.hasValidAccessToken();
+  }
+
+  get username(): string {
+    const claims: any = this.oauthService.getIdentityClaims();
+    if (!claims) return '';
+    return claims.preferred_username || claims.given_name || claims.name || 'User';
+  }
+
+  get email(): string {
+    const claims: any = this.oauthService.getIdentityClaims();
+    return claims?.email || '';
+  }
+
+  login() {
+    this.oauthService.initCodeFlow();
+  }
+
+  logout() {
+    this.oauthService.logOut();
+  }
+
+  callHelloApi() {
+    const headers = new HttpHeaders({
+      'Authorization': 'Bearer ' + this.oauthService.getAccessToken()
+    });
+
+    this.http.get('/api/hello', { headers, responseType: 'text' }).subscribe({
+      next: (msg) => this.helloMessage.set(msg),
+      error: (err) => {
+        console.error(err);
+        this.helloMessage.set('Failed to connect to backend: ' + err.statusText);
+      }
+    });
+  }
+}