Manual merge

.run/OkrApplication-E2E.run.xml

@@ -1,7 +1,7 @@
 <component name="ProjectRunConfigurationManager">
   <configuration default="false" name="OkrApplication-E2E" type="SpringBootApplicationConfigurationType" factoryName="Spring Boot">
     <option name="ACTIVE_PROFILES" value="integration-test" />
-    <option name="ALTERNATIVE_JRE_PATH" value="$USER_HOME$/.sdkman/candidates/java/current" />
+    <option name="ALTERNATIVE_JRE_PATH" value="$USER_HOME$/.jdks/corretto-17.0.9" />
     <option name="ALTERNATIVE_JRE_PATH_ENABLED" value="true" />
     <module name="backend" />
     <option name="SPRING_BOOT_MAIN_CLASS" value="ch.puzzle.okr.OkrApplication" />

frontend/cypress/e2e/checkIn.cy.ts

@@ -308,7 +308,7 @@ describe('OKR Check-in e2e tests', () => {
       cy.intercept('**/keyresults/*').as('getKeyResultsAfterSave');
       cy.getByTestId('add-check-in').first().click();
       cy.get('#old-value').should('not.exist');
-      cy.fillOutCheckInMetric(10, false, 'changeinfo', 'initiatives');
+      cy.fillOutCheckInMetric(10, 0, 'changeinfo', 'initiatives');
       cy.wait('@getKeyResultsAfterSave');
 
       cy.getByTestId('add-check-in').first().click();
@@ -352,8 +352,10 @@ function getCurrentDate() {
   let mm = today.getMonth() + 1; // Months start at 0!
   let dd = today.getDate();
 
-  if (dd < 10) dd = '0' + dd;
-  if (mm < 10) mm = '0' + mm;
+  let dd_str = '' + mm;
+  let mm_str = '' + dd;
+  if (dd < 10) dd_str = '0' + dd_str;
+  if (mm < 10) mm_str = '0' + mm_str;
 
-  return dd + '.' + mm + '.' + yyyy;
+  return dd_str + '.' + mm_str + '.' + yyyy;
 }

frontend/src/app/app.component.ts

@@ -1,9 +1,26 @@
 import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { MatIconRegistry } from '@angular/material/icon';
+import { DomSanitizer } from '@angular/platform-browser';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
   styleUrls: ['./app.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class AppComponent {}
+export class AppComponent {
+  readonly PATH_PREFIX = '../assets/icons/';
+  constructor(
+    private matIconRegistry: MatIconRegistry,
+    private domSanitizer: DomSanitizer,
+  ) {
+    this.matIconRegistry.addSvgIcon(
+      'pz-search',
+      this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + 'search-icon.svg'),
+    );
+    this.matIconRegistry.addSvgIcon(
+      'pz-menu-icon',
+      this.domSanitizer.bypassSecurityTrustResourceUrl(this.PATH_PREFIX + 'three-dot-menu-icon.svg'),
+    );
+  }
+}

frontend/src/app/app.module.ts

@@ -24,7 +24,7 @@ import { OAuthModule, OAuthService, OAuthStorage } from 'angular-oauth2-oidc';
 import { MatTooltipModule } from '@angular/material/tooltip';
 import { MatAutocompleteModule } from '@angular/material/autocomplete';
 import { MatRadioModule } from '@angular/material/radio';
-import { ConfigService } from './config.service';
+import { ConfigService } from './services/config.service';
 import { firstValueFrom } from 'rxjs';
 import { environment } from '../environments/environment';
 import { TeamComponent } from './components/team/team.component';
@@ -61,8 +61,7 @@ import { CheckInFormOrdinalComponent } from './components/checkin/check-in-form-
 import { CheckInFormComponent } from './components/checkin/check-in-form/check-in-form.component';
 import { ApplicationTopBarComponent } from './components/application-top-bar/application-top-bar.component';
 import { A11yModule } from '@angular/cdk/a11y';
-import { TeamManagementComponent } from './shared/dialog/team-management/team-management.component';
-import { CustomizationService } from './shared/services/customization.service';
+import { CustomizationService } from './services/customization.service';
 
 function initOauthFactory(configService: ConfigService, oauthService: OAuthService) {
   return async () => {
@@ -180,5 +179,5 @@ export const MY_FORMATS = {
   schemas: [CUSTOM_ELEMENTS_SCHEMA],
 })
 export class AppModule {
-  constructor(customizationService: CustomizationService) {}
+  constructor(private readonly customizationService: CustomizationService) {}
 }

frontend/src/app/application-top-bar/application-top-bar.component.ts

@@ -1,13 +1,13 @@
 import { ChangeDetectionStrategy, Component, Input, OnDestroy, OnInit } from '@angular/core';
 import { OAuthService } from 'angular-oauth2-oidc';
 import { BehaviorSubject, ReplaySubject, Subscription } from 'rxjs';
-import { ConfigService } from '../config.service';
+import { ConfigService } from '../services/config.service';
 import { MatDialog, MatDialogRef } from '@angular/material/dialog';
-import { TeamManagementComponent } from '../shared/dialog/team-management/team-management.component';
 
 import { Router } from '@angular/router';
-import { RefreshDataService } from '../shared/services/refresh-data.service';
 import { isMobileDevice } from '../shared/common';
+import { TeamManagementComponent } from '../team-management/team-management.component';
+import { RefreshDataService } from '../services/refresh-data.service';
 
 @Component({
   selector: 'app-application-top-bar',

frontend/src/app/components/application-top-bar/application-top-bar.component.scss

@@ -12,12 +12,7 @@
   z-index: 102;
   height: inherit;
   justify-content: space-between;
-  background-color: var(--okr-topbar-background-color);
-
-  img {
-    max-height: calc(100% - 16px);
-    width: auto;
-  }
+  background-color: $pz-dark-blue;
 }
 
 .topBarEntry {
@@ -34,7 +29,6 @@
   padding: 10px;
   border-radius: 8px;
   border: 1px solid transparent;
-  font-weight: normal;
 
   mat-icon {
     display: flex;

frontend/src/app/components/application-top-bar/application-top-bar.component.spec.ts

@@ -14,7 +14,7 @@ import { NavigationEnd, Router } from '@angular/router';
 import { of } from 'rxjs';
 import { testUser } from '../../shared/testData';
 import { UserService } from '../../services/user.service';
-import { ConfigService } from '../../config.service';
+import { ConfigService } from '../../services/config.service';
 
 const oAuthMock = {
   getIdentityClaims: jest.fn(),

frontend/src/app/components/application-top-bar/application-top-bar.component.ts

@@ -1,7 +1,7 @@
-import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnInit } from '@angular/core';
+import { ChangeDetectionStrategy, ChangeDetectorRef, Component, OnDestroy, OnInit } from '@angular/core';
 import { OAuthService } from 'angular-oauth2-oidc';
-import { filter, map, Observable, of, switchMap } from 'rxjs';
-import { ConfigService } from '../../config.service';
+import { BehaviorSubject, filter, Observable, of, Subscription, switchMap } from 'rxjs';
+import { ConfigService } from '../../services/config.service';
 import { NavigationEnd, Router } from '@angular/router';
 import { UserService } from '../../services/user.service';
 import { getFullNameFromUser } from '../../shared/types/model/User';
@@ -12,10 +12,12 @@ import { getFullNameFromUser } from '../../shared/types/model/User';
   styleUrls: ['./application-top-bar.component.scss'],
   changeDetection: ChangeDetectionStrategy.OnPush,
 })
-export class ApplicationTopBarComponent implements OnInit {
+export class ApplicationTopBarComponent implements OnInit, OnDestroy {
   userFullName: string = '';
   menuIsOpen = false;
   teamManagementVisible$: Observable<boolean> | undefined;
+  logoSrc$ = new BehaviorSubject<String>('assets/images/empty.svg');
+  private subscription?: Subscription;
 
   constructor(
     private oauthService: OAuthService,
@@ -26,20 +28,29 @@ export class ApplicationTopBarComponent implements OnInit {
   ) {}
 
   ngOnInit(): void {
-    this.configService.config$
-      .pipe(
-        map((config) => {
-          if (config.activeProfile === 'staging') {
-            document.getElementById('okrTopbar')!.style.backgroundColor = '#ab31ad';
-          }
-        }),
-      )
-      .subscribe();
+    this.subscription = this.configService.config$.subscribe({
+      next: (config) => {
+        if (config.logo) {
+          this.logoSrc$.next(config.logo);
+        }
+      },
+    });
 
     this.initUserFullName();
     this.initTeamManagementVisible();
   }
 
+  ngOnDestroy(): void {
+    this.subscription?.unsubscribe();
+  }
+
+  logOut() {
+    const currentUrlTree = this.router.createUrlTree([], { queryParams: {} });
+    this.router.navigateByUrl(currentUrlTree).then(() => {
+      this.oauthService.logOut();
+    });
+  }
+
   private initUserFullName() {
     // user is loaded on base route resolver. We have to wait until routing is done.
     this.router.events.subscribe((val) => {
@@ -50,13 +61,6 @@ export class ApplicationTopBarComponent implements OnInit {
     });
   }
 
-  logOut() {
-    const currentUrlTree = this.router.createUrlTree([], { queryParams: {} });
-    this.router.navigateByUrl(currentUrlTree).then(() => {
-      this.oauthService.logOut();
-    });
-  }
-
   private initTeamManagementVisible() {
     this.teamManagementVisible$ = this.router.events.pipe(
       filter((e): e is NavigationEnd => e instanceof NavigationEnd),

frontend/src/app/components/team/team.component.ts

@@ -5,7 +5,6 @@ import { ObjectiveFormComponent } from '../../shared/dialog/objective-dialog/obj
 import { RefreshDataService } from '../../services/refresh-data.service';
 import { Objective } from '../../shared/types/model/Objective';
 import { isMobileDevice } from '../../shared/common';
-// import { TeamManagementComponent } from '../shared/dialog/team-management/team-management.component';
 import { KeyresultDialogComponent } from '../keyresult-dialog/keyresult-dialog.component';
 import { ObjectiveMin } from '../../shared/types/model/ObjectiveMin';
 
@@ -19,13 +18,13 @@ export class TeamComponent implements OnInit {
   @Input({ required: true })
   public overviewEntity!: OverviewEntity;
 
-  trackByObjectiveId: TrackByFunction<ObjectiveMin> = (index, objective) => objective.id;
-
   constructor(
     private dialog: MatDialog,
     private refreshDataService: RefreshDataService,
   ) {}
 
+  trackByObjectiveId: TrackByFunction<ObjectiveMin> = (index, objective) => objective.id;
+
   ngOnInit(): void {}
 
   createObjective() {

frontend/src/app/config.service.ts → frontend/src/app/services/config.service.ts

@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { HttpClient } from '@angular/common/http';
 import { Observable, shareReplay } from 'rxjs';
-import { ClientConfig } from './shared/types/model/ClientConfig';
+import { ClientConfig } from '../shared/types/model/ClientConfig';
 
 @Injectable({
   providedIn: 'root',

frontend/src/app/services/customization.service.spec.ts

@@ -1,7 +1,7 @@
 import { CustomizationService } from './customization.service';
-import { ConfigService } from '../../config.service';
 import { BehaviorSubject } from 'rxjs';
-import { ClientConfig } from '../types/model/ClientConfig';
+import { ClientConfig } from '../shared/types/model/ClientConfig';
+import { ConfigService } from './config.service';
 
 class CallRecorder {
   private calls: { [key: string]: any[] } = {};

frontend/src/app/services/customization.service.ts

@@ -1,7 +1,7 @@
 import { Inject, Injectable } from '@angular/core';
-import { ConfigService } from '../../config.service';
-import { CustomizationConfig, CustomStyles } from '../types/model/ClientConfig';
 import { DOCUMENT } from '@angular/common';
+import { CustomizationConfig, CustomStyles } from '../shared/types/model/ClientConfig';
+import { ConfigService } from './config.service';
 
 @Injectable({
   providedIn: 'root',

frontend/src/app/team-management/member-list/member-list-table/member-list-table.component.html

@@ -55,7 +55,7 @@
           (click)="$event.stopPropagation()"
           [matMenuTriggerFor]="userMenu"
           [attr.data-testId]="'member-list-more'"
-          icon="threedot.svg"
+          icon="three-dot-menu-icon.svg"
           alt="More Icon"
         >
         </app-puzzle-icon-button>

frontend/src/app/team-management/member-list/member-list.component.html

@@ -34,7 +34,7 @@ <h2 *ngIf="!selectedTeam$.value">Alle Teams</h2>
     </div>
     <div class="menu mx-2" *ngIf="selectedTeam$.value?.writeable">
       <app-puzzle-icon-button
-        icon="threedot.svg"
+        icon="three-dot-menu-icon.svg"
         alt="Menu Icon"
         [matMenuTriggerFor]="menu"
         [attr.data-testId]="'teamMoreButton'"