Add Profile Button

packages/frontend/src/app/app.config.ts

@@ -37,6 +37,7 @@ import { provideServiceWorker } from '@angular/service-worker';
 import { de } from 'date-fns/locale';
 import { routes } from './app.routes';
 import { initializeApi } from './util/api';
+import { keycloakConfig } from './util/keycloak-config';
 
 export const appConfig: ApplicationConfig = {
     providers: [
@@ -49,13 +50,7 @@ export const appConfig: ApplicationConfig = {
         provideBrowserGlobalErrorListeners(),
         provideZoneChangeDetection({ eventCoalescing: true }),
         provideKeycloak({
-            config: {
-                url: isDevMode()
-                    ? 'http://localhost:8080/'
-                    : 'https://keycloak.toni714.de:8443/',
-                realm: 'taekwondo',
-                clientId: 'angular-frontend',
-            },
+            config: keycloakConfig,
             initOptions: {
                 onLoad: 'check-sso',
                 silentCheckSsoRedirectUri:

packages/frontend/src/app/app.html

@@ -1,7 +1,14 @@
 @if(this.auth.loggedIn()){
 <div class="no-print">
-  <button mat-flat-button color="accent" (click)="this.auth.logout()">LogOut</button>
-  <button mat-stroked-button color="primary" [routerLink]="['/home']">Home</button>
+    <button mat-flat-button color="accent" (click)="this.auth.logout()">
+        Abmelden
+    </button>
+    <button mat-stroked-button color="primary" [routerLink]="['/home']">
+        Home
+    </button>
+    <button mat-stroked-button color="primary" [routerLink]="['/profile']">
+        Profil
+    </button>
 </div>
 }
 <router-outlet></router-outlet>

packages/frontend/src/app/app.routes.ts

@@ -11,6 +11,7 @@ import { AuthGuardData, createAuthGuard } from 'keycloak-angular';
 import { Login } from './components/login/login';
 import { MissingPage } from './components/missing-page/missing-page';
 import { Claim } from './generated-api/api';
+import { keycloakConfig } from './util/keycloak-config';
 
 export const roles = {
     UserAdmin: 'useradmin',
@@ -70,5 +71,9 @@ export const routes: Routes = [
             ),
         canActivate: [requireRoles([Claim.Memberadmin])],
     },
+    {
+        path: 'profile',
+        redirectTo: `${keycloakConfig.url}/realms/${keycloakConfig.realm}/account`,
+    },
     { path: '**', component: MissingPage },
 ];

packages/frontend/src/app/components/view-members/view-members.html

@@ -47,7 +47,7 @@
     </div>
 </div>
 
-<!--TODO Sorting doesnt work anymore-->
+<!--TODO implement row count, selecting and alternating colors-->
 <table mat-table matSort [dataSource]="dataSource" class="mat-elevation-z8">
     <ng-container matColumnDef="edit">
         <th mat-header-cell *matHeaderCellDef>Bearb.</th>

packages/frontend/src/app/util/keycloak-config.ts

@@ -0,0 +1,10 @@
+import { isDevMode } from '@angular/core';
+import { KeycloakServerConfig } from 'keycloak-js';
+
+export const keycloakConfig: KeycloakServerConfig = {
+    url: isDevMode()
+        ? 'http://localhost:8080'
+        : 'https://keycloak.toni714.de:8443',
+    realm: 'taekwondo',
+    clientId: 'angular-frontend',
+};