puzzle · tuxmatta · Oct 4, 2023 · Sep 26, 2023 · Sep 26, 2023 · Sep 26, 2023
diff --git a/backend/src/main/java/ch/puzzle/okr/controller/CheckInController.java b/backend/src/main/java/ch/puzzle/okr/controller/CheckInController.java
@@ -67,4 +67,13 @@ public ResponseEntity<CheckInDto> updateCheckIn(
         CheckInDto updatedCheckIn = this.checkInMapper.toDto(this.checkInBusinessService.updateCheckIn(id, checkIn));
         return ResponseEntity.status(HttpStatus.OK).body(updatedCheckIn);
     }
+
+    @Operation(summary = "Delete Check-in by ID", description = "Delete Check-in by ID")
+    @ApiResponses(value = { @ApiResponse(responseCode = "200", description = "Deleted Check-in by ID"),
+            @ApiResponse(responseCode = "404", description = "Did not find the Check-in with requested ID") })
+    @DeleteMapping("/{id}")
+    public void deleteCheckIn(
+            @Parameter(description = "The ID of an Check-in to delete it.", required = true) @PathVariable long id) {
+        this.checkInBusinessService.deleteCheckIn(id);
+    }
 }
diff --git a/backend/src/main/java/ch/puzzle/okr/dto/keyresult/KeyResultLastCheckInOrdinalDto.java b/backend/src/main/java/ch/puzzle/okr/dto/keyresult/KeyResultLastCheckInOrdinalDto.java
@@ -1,7 +1,9 @@
 package ch.puzzle.okr.dto.keyresult;
 
+import ch.puzzle.okr.models.checkin.Zone;
+
 import java.time.LocalDateTime;
 
-public record KeyResultLastCheckInOrdinalDto(Long id, String zone, Integer confidence, LocalDateTime createdOn,
+public record KeyResultLastCheckInOrdinalDto(Long id, Zone value, Integer confidence, LocalDateTime createdOn,
         String changeInfo, String initiatives) implements KeyResultLastCheckIn {
 }
diff --git a/backend/src/main/java/ch/puzzle/okr/mapper/keyresult/KeyResultOrdinalMapper.java b/backend/src/main/java/ch/puzzle/okr/mapper/keyresult/KeyResultOrdinalMapper.java
@@ -57,8 +57,8 @@ public KeyResultLastCheckInOrdinalDto getLastCheckInDto(Long keyResultId) {
             lastCheckInDto = null;
         } else {
             lastCheckInDto = new KeyResultLastCheckInOrdinalDto(lastCheckIn.getId(),
-                    ((CheckInOrdinal) lastCheckIn).getZone().toString(), lastCheckIn.getConfidence(),
-                    lastCheckIn.getCreatedOn(), lastCheckIn.getChangeInfo(), lastCheckIn.getInitiatives());
+                    ((CheckInOrdinal) lastCheckIn).getZone(), lastCheckIn.getConfidence(), lastCheckIn.getCreatedOn(),
+                    lastCheckIn.getChangeInfo(), lastCheckIn.getInitiatives());
         }
         return lastCheckInDto;
     }

diff --git a/backend/src/main/java/ch/puzzle/okr/service/business/CheckInBusinessService.java b/backend/src/main/java/ch/puzzle/okr/service/business/CheckInBusinessService.java
@@ -31,6 +31,7 @@ public CheckIn getCheckInById(Long id) {
     @Transactional
     public CheckIn createCheckIn(CheckIn checkIn, Jwt token) {
         checkIn.setCreatedOn(LocalDateTime.now());
+        checkIn.setModifiedOn(LocalDateTime.now());
         checkIn.setCreatedBy(userBusinessService.getUserByAuthorisationToken(token));
         validator.validateOnCreate(checkIn);
         return checkInPersistenceService.save(checkIn);

diff --git a/backend/src/main/resources/db/data-migration/V2_1_2__newQuarterData.sql b/backend/src/main/resources/db/data-migration/V2_1_2__newQuarterData.sql
diff --git a/backend/src/test/java/ch/puzzle/okr/KeyResultTestHelpers.java b/backend/src/test/java/ch/puzzle/okr/KeyResultTestHelpers.java
@@ -7,6 +7,7 @@
 import ch.puzzle.okr.models.User;
 import ch.puzzle.okr.models.checkin.CheckIn;
 import ch.puzzle.okr.models.checkin.CheckInMetric;
+import ch.puzzle.okr.models.checkin.Zone;
 import ch.puzzle.okr.models.keyresult.KeyResult;
 import ch.puzzle.okr.models.keyresult.KeyResultMetric;
 import ch.puzzle.okr.models.keyresult.KeyResultOrdinal;
@@ -32,7 +33,7 @@ public class KeyResultTestHelpers {
     public static final String TARGET_ZONE = "Ein Baum";
     public static final String STRETCH_ZONE = "Ein Wald";
     public static final String QUARTER_LABEL = "GJ 22/23-Q4";
-    public static final String LAST_CHECK_IN_ZONE = "Baum";
+    public static final Zone LAST_CHECK_IN_ZONE = Zone.COMMIT;
     public static final String FIRSTNAME = "Johnny";
     public static final String LASTNAME = "Appleseed";
     public static final String START_DATE = "-999999999-01-01";
@@ -56,7 +57,7 @@ public class KeyResultTestHelpers {
     public static final String JSON_PATH_TARGET_ZONE = "$.targetZone";
     public static final String JSON_PATH_STRETCH_ZONE = "$.stretchZone";
     public static final String JSON_PATH_LAST_CHECK_IN_ID = "$.lastCheckIn.id";
-    public static final String JSON_PATH_LAST_CHECK_IN_ZONE = "$.lastCheckIn.zone";
+    public static final String JSON_PATH_LAST_CHECK_IN_ZONE = "$.lastCheckIn.value";
     public static final String JSON_PATH_QUARTER_LABEL = "$.objective.keyResultQuarterDto.label";
     public static final String JSON_PATH_QUARTER_START_DATE = "$.objective.keyResultQuarterDto.startDate";
     public static final String JSON = "{\"title\":  \"Keyresult 1\",\"keyResultType\":  \"metric\"}";

diff --git a/backend/src/test/java/ch/puzzle/okr/controller/KeyResultControllerIT.java b/backend/src/test/java/ch/puzzle/okr/controller/KeyResultControllerIT.java
@@ -92,7 +92,7 @@ void shouldGetOrdinalKeyResultWithId() throws Exception {
                 .andExpect(jsonPath(JSON_PATH_OBJECTIVE_ID, Is.is(OBJECTIVE_ID)))
                 .andExpect(jsonPath(JSON_PATH_OBJECTIVE_STATE, Is.is(OBJECTIVE_STATE_ONGOING)))
                 .andExpect(jsonPath(JSON_PATH_QUARTER_LABEL, Is.is(QUARTER_LABEL)))
-                .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_ZONE, Is.is(LAST_CHECK_IN_ZONE)))
+                .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_ZONE, Is.is(LAST_CHECK_IN_ZONE.toString())))
                 .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_CONFIDENCE, Is.is(CONFIDENCE)))
                 .andExpect(jsonPath(JSON_PATH_CREATED_ON, Is.is(KEY_RESULT_CREATED_ON)))
                 .andExpect(jsonPath(JSON_PATH_COMMIT_ZONE, Is.is(COMMIT_ZONE)))
@@ -214,7 +214,7 @@ void createKeyResultWithEnumKeys() throws Exception {
                 .andExpect(jsonPath(JSON_PATH_KEY_RESULT_TYPE, Is.is(KEY_RESULT_TYPE_ORDINAL)))
                 .andExpect(jsonPath(JSON_PATH_OWNER_FIRSTNAME, Is.is(FIRSTNAME)))
                 .andExpect(jsonPath(JSON_PATH_OBJECTIVE_STATE, Is.is(OBJECTIVE_STATE_ONGOING)))
-                .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_ZONE, Is.is(LAST_CHECK_IN_ZONE)))
+                .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_ZONE, Is.is(LAST_CHECK_IN_ZONE.toString())))
                 .andExpect(jsonPath(JSON_PATH_LAST_CHECK_IN_CONFIDENCE, Is.is(CONFIDENCE)))
                 .andExpect(jsonPath(JSON_PATH_CREATED_ON, Is.is(KEY_RESULT_CREATED_ON)))
                 .andExpect(jsonPath(JSON_PATH_COMMIT_ZONE, Is.is(COMMIT_ZONE)))

diff --git a/frontend/src/app/app.module.ts b/frontend/src/app/app.module.ts
@@ -47,8 +47,16 @@ import { DrawerInterceptor } from './shared/interceptors/drawer.interceptor';
 import { CheckInHistoryDialogComponent } from './shared/dialog/check-in-history-dialog/check-in-history-dialog.component';
 import { MatDividerModule } from '@angular/material/divider';
 import { ApplicationBannerComponent } from './application-banner/application-banner.component';
+import { CheckInFormMetricComponent } from './shared/dialog/checkin/check-in-form-metric/check-in-form-metric.component';
+import { UnitValueTransformationPipe } from './shared/pipes/unit-value-transformation/unit-value-transformation.pipe';
+import { CheckInFormOrdinalComponent } from './shared/dialog/checkin/check-in-form-ordinal/check-in-form-ordinal.component';
+import { CheckInBaseInformationsComponent } from './shared/dialog/checkin/check-in-base-informations/check-in-base-informations.component';
+import { CustomInputComponent } from './shared/custom/custom-input/custom-input.component';
 import { KeyResultDialogComponent } from './key-result-dialog/key-result-dialog.component';
 import { ConfirmDialogComponent } from './shared/dialog/confirm-dialog/confirm-dialog.component';
+import { CheckInFormComponent } from './shared/dialog/checkin/check-in-form/check-in-form.component';
+import { UnitLabelTransformationPipe } from './shared/pipes/unit-label-transformation/unit-label-transformation.pipe';
+import { ParseUnitValuePipe } from './shared/pipes/parse-unit-value/parse-unit-value.pipe';
 
 function initOauthFactory(configService: ConfigService, oauthService: OAuthService) {
   return async () => {
@@ -95,6 +103,16 @@ export const MY_FORMATS = {
     ApplicationBannerComponent,
     KeyResultDialogComponent,
     ConfirmDialogComponent,
+    CheckInFormComponent,
+    CheckInFormMetricComponent,
+    UnitValueTransformationPipe,
+    CheckInFormOrdinalComponent,
+    CheckInBaseInformationsComponent,
+    CustomInputComponent,
+    CheckInFormComponent,
+    UnitLabelTransformationPipe,
+    ConfirmDialogComponent,
+    ParseUnitValuePipe,
   ],
   imports: [
     CommonModule,
@@ -145,6 +163,8 @@ export const MY_FORMATS = {
     { provide: HTTP_INTERCEPTORS, useClass: DrawerInterceptor, multi: true },
     { provide: OAuthStorage, useFactory: storageFactory },
     { provide: APP_INITIALIZER, useFactory: initOauthFactory, deps: [ConfigService, OAuthService], multi: true },
+    UnitValueTransformationPipe,
+    ParseUnitValuePipe,
   ],
   bootstrap: [AppComponent],
   schemas: [CUSTOM_ELEMENTS_SCHEMA],

diff --git a/frontend/src/app/confidence/confidence.component.html b/frontend/src/app/confidence/confidence.component.html
@@ -1,14 +1,12 @@
-<div class="d-flex align-items-center gap-1 confidence-container" *ngIf="keyResult?.lastCheckIn?.confidence">
+<div class="d-flex align-items-center gap-1 confidence-container" *ngIf="checkIn.confidence">
   <div
     [ngClass]="edit ? 'keyResult-attribute-edit' : 'keyResult-attribute-show'"
     [ngStyle]="{ 'background-color': backgroundColor }"
   >
-    <p [ngClass]="edit ? 'fw-normal' : 'fw-bold'" data-testid="confidence">
-      {{ keyResult.lastCheckIn?.confidence }}/{{ max }}
-    </p>
+    <p [ngClass]="edit ? 'fw-normal' : 'fw-bold'" data-testid="confidence">{{ checkIn.confidence }}/{{ max }}</p>
   </div>
 
   <mat-slider *ngIf="edit" [max]="max" [min]="min" [step]="1" [showTickMarks]="true" color="accent">
-    <input matSliderThumb [(ngModel)]="keyResult.lastCheckIn!.confidence" />
+    <input matSliderThumb [(ngModel)]="checkIn.confidence" />
   </mat-slider>
 </div>
diff --git a/frontend/src/app/confidence/confidence.component.scss b/frontend/src/app/confidence/confidence.component.scss
@@ -6,3 +6,7 @@ p {
   width: 63px;
   height: 23px;
 }
+
+mat-slider {
+  min-width: 370px;
+}
diff --git a/frontend/src/app/confidence/confidence.component.spec.ts b/frontend/src/app/confidence/confidence.component.spec.ts
@@ -3,7 +3,7 @@ import { ComponentFixture, TestBed } from '@angular/core/testing';
 import { ConfidenceComponent } from './confidence.component';
 import { HarnessLoader } from '@angular/cdk/testing';
 import { TestbedHarnessEnvironment } from '@angular/cdk/testing/testbed';
-import { keyResultMetricMin } from '../shared/testData';
+import { checkInMetric } from '../shared/testData';
 import { MatSliderModule } from '@angular/material/slider';
 import { CheckInMin } from '../shared/types/model/CheckInMin';
 import { FormsModule } from '@angular/forms';
@@ -24,7 +24,7 @@ describe('ConfidenceComponent', () => {
     fixture = TestBed.createComponent(ConfidenceComponent);
     component = fixture.componentInstance;
     loader = TestbedHarnessEnvironment.loader(fixture);
-    component.keyResult = keyResultMetricMin;
+    component.checkIn = checkInMetric;
     component.edit = true;
   });
 
@@ -36,9 +36,9 @@ describe('ConfidenceComponent', () => {
     [{ confidence: 8 } as CheckInMin, '8'],
     [null, '5'],
   ])('should set confidence of component with right value', async (checkIn: CheckInMin | null, expected: string) => {
-    component.keyResult.lastCheckIn = checkIn;
+    component.checkIn = checkIn!;
     component.ngOnChanges({
-      keyResult: new SimpleChange(null, component.keyResult, true),
+      checkIn: new SimpleChange(null, component.checkIn, true),
     });
     fixture.detectChanges();
     await fixture.whenStable();

diff --git a/frontend/src/app/confidence/confidence.component.ts b/frontend/src/app/confidence/confidence.component.ts
@@ -1,7 +1,5 @@
 import { ChangeDetectionStrategy, Component, Input, OnChanges, SimpleChanges } from '@angular/core';
-import { KeyresultMin } from '../shared/types/model/KeyresultMin';
 import { CheckInMin } from '../shared/types/model/CheckInMin';
-import { KeyResult } from '../shared/types/model/KeyResult';
 
 @Component({
   selector: 'app-confidence',
@@ -13,12 +11,12 @@ export class ConfidenceComponent implements OnChanges {
   min: number = 1;
   max: number = 10;
   @Input() edit: boolean = true;
-  @Input() keyResult!: KeyresultMin | KeyResult;
+  @Input() checkIn!: CheckInMin;
   @Input() backgroundColor!: string;
 
   ngOnChanges(changes: SimpleChanges) {
-    if (changes['keyResult']?.currentValue?.lastCheckIn === null) {
-      this.keyResult.lastCheckIn = { confidence: 5 } as CheckInMin;
+    if (changes['checkIn']?.currentValue === undefined || changes['checkIn']?.currentValue === null) {
+      this.checkIn = { confidence: 5 } as CheckInMin;
     }
   }
 }
diff --git a/frontend/src/app/key-result-dialog/key-result-dialog.component.ts b/frontend/src/app/key-result-dialog/key-result-dialog.component.ts
@@ -90,15 +90,17 @@ export class KeyResultDialogComponent implements OnInit {
 
   deleteKeyResult() {
     if (this.data.keyResult.lastCheckIn?.id == undefined) {
-      //ToDo: Make ConfirmDialogComponent generic since its also used in other cases
       this.dialog
         .open(ConfirmDialogComponent, {
+          data: {
+            title: 'Key Result',
+          },
           width: '15em',
           height: 'auto',
         })
         .afterClosed()
         .subscribe((result) => {
-          if (result == 'deleteKeyResult') {
+          if (result) {
             this.keyResultService
               .deleteKeyResult(this.data.keyResult.id)
               .subscribe(() => this.dialogRef.close({ keyResult: this.data.keyResult, delete: true, openNew: false }));

diff --git a/frontend/src/app/keyresult-detail/keyresult-detail.component.html b/frontend/src/app/keyresult-detail/keyresult-detail.component.html
@@ -18,7 +18,12 @@ <h1 class="mb-2 title">{{ keyResult.title }}</h1>
   <div class="d-flex justify-content-between mb-2 align-items-center">
     <div>
       <p class="text-small">Confidence</p>
-      <app-confidence [keyResult]="keyResult" [edit]="false" [backgroundColor]="'#F5F5F5'"></app-confidence>
+      <app-confidence
+        *ngIf="keyResult.lastCheckIn"
+        [checkIn]="keyResult.lastCheckIn!"
+        [edit]="false"
+        [backgroundColor]="'#F5F5F5'"
+      ></app-confidence>
     </div>
   </div>
   <div class="d-flex gap-4 mb-5 flex-row jus">
@@ -49,14 +54,22 @@ <h1 class="mb-2 title">{{ keyResult.title }}</h1>
       </div>
     </ng-container>
   </div>
-  <div *ngIf="keyResult.lastCheckIn?.createdOn" class="mb-3">
+  <div *ngIf="keyResult.lastCheckIn?.modifiedOn" class="mb-3">
+    <h2 class="sub-title-keyresult fw-bold mb-2">
+      Letztes Check-in ({{ keyResult.lastCheckIn?.modifiedOn | date: "dd.MM.yyy" }})
+    </h2>
+    <p>{{ keyResult.lastCheckIn?.changeInfo }}</p>
+  </div>
+  <div *ngIf="!keyResult.lastCheckIn?.modifiedOn && keyResult.lastCheckIn?.createdOn" class="mb-3">
     <h2 class="sub-title-keyresult fw-bold mb-2">
       Letztes Check-in ({{ keyResult.lastCheckIn?.createdOn | date: "dd.MM.yyy" }})
     </h2>
     <p>{{ keyResult.lastCheckIn?.changeInfo }}</p>
   </div>
   <span class="d-flex justify-content-start mb-3">
-    <button class="add-button" mat-button (click)="checkInHistory()">Alle Check-ins anzeigen</button>
+    <button *ngIf="keyResult.lastCheckIn" class="add-button" mat-button (click)="checkInHistory()">
+      Alle Check-ins anzeigen
+    </button>
   </span>
 
   <div class="mb-3">
@@ -65,6 +78,6 @@ <h2 class="sub-title-keyresult fw-bold">Beschrieb</h2>
   </div>
   <div class="d-flex align-items-center flex-row-reverse justify-content-end gap-3">
     <button class="add-button" mat-button (click)="openEditKeyResultDialog()">Key Result bearbeiten</button>
-    <button mat-flat-button color="primary">Check-in erfassen</button>
+    <button mat-flat-button color="primary" (click)="openCheckInForm()">Check-in erfassen</button>
   </div>
 </div>
diff --git a/frontend/src/app/keyresult-detail/keyresult-detail.component.ts b/frontend/src/app/keyresult-detail/keyresult-detail.component.ts
@@ -5,8 +5,11 @@ import { KeyResultMetric } from '../shared/types/model/KeyResultMetric';
 import { KeyResultOrdinal } from '../shared/types/model/KeyResultOrdinal';
 import { CheckInHistoryDialogComponent } from '../shared/dialog/check-in-history-dialog/check-in-history-dialog.component';
 import { MatDialog } from '@angular/material/dialog';
+import { CheckInFormMetricComponent } from '../shared/dialog/checkin/check-in-form-metric/check-in-form-metric.component';
 import { KeyResultDialogComponent } from '../key-result-dialog/key-result-dialog.component';
 import { NotifierService } from '../shared/services/notifier.service';
+import { CheckInService } from '../shared/services/check-in.service';
+import { CheckInFormComponent } from '../shared/dialog/checkin/check-in-form/check-in-form.component';
 
 @Component({
   selector: 'app-keyresult-detail',
@@ -20,10 +23,33 @@ export class KeyresultDetailComponent implements OnChanges {
 
   constructor(
     private keyResultService: KeyresultService,
+    private checkInService: CheckInService,
+    private notifierService: NotifierService,
     private changeDetectorRef: ChangeDetectorRef,
     private dialog: MatDialog,
-    private notifierService: NotifierService,
-  ) {}
+  ) {
+    this.notifierService.reopenCheckInHistoryDialog.subscribe((result) => {
+      /* Update lastCheckIn if it was changed in history dialog */
+      if (this.keyResult.lastCheckIn?.id === result?.checkIn?.id) {
+        this.keyResult = { ...this.keyResult, lastCheckIn: result.checkIn };
+        this.changeDetectorRef.detectChanges();
+      }
+      /* Update lastCheckIn to null if it was deleted in history dialog */
+      if (result.deleted) {
+        if (result.checkIn?.id == this.keyResult.lastCheckIn?.id) {
+          this.keyResultService.getFullKeyResult(this.keyResultId).subscribe((fullKeyResult) => {
+            this.keyResult = fullKeyResult;
+            this.changeDetectorRef.markForCheck();
+            if (this.keyResult.lastCheckIn != null) {
+              this.checkInHistory();
+            }
+          });
+        }
+        return;
+      }
+      this.checkInHistory();
+    });
+  }
 
   ngOnChanges() {
     this.keyResultService.getFullKeyResult(this.keyResultId).subscribe((fullKeyResult) => {
@@ -35,16 +61,18 @@ export class KeyresultDetailComponent implements OnChanges {
   castToMetric(keyResult: KeyResult) {
     return keyResult as KeyResultMetric;
   }
+
   castToOrdinal(keyResult: KeyResult) {
     return keyResult as KeyResultOrdinal;
   }
+
   checkInHistory() {
     const dialogRef = this.dialog.open(CheckInHistoryDialogComponent, {
       data: {
         keyResultId: this.keyResult.id,
+        keyResult: this.keyResult,
       },
     });
-
     dialogRef.afterClosed().subscribe(() => {});
   }
 
@@ -79,4 +107,21 @@ export class KeyresultDetailComponent implements OnChanges {
         this.changeDetectorRef.markForCheck();
       });
   }
+
+  openCheckInForm() {
+    const dialogRef = this.dialog.open(CheckInFormComponent, {
+      data: {
+        keyResult: this.keyResult,
+      },
+      width: '719px',
+    });
+    dialogRef.afterClosed().subscribe((result) => {
+      if (result != undefined && result != '') {
+        this.checkInService.createCheckIn(result.data).subscribe((createdCheckIn) => {
+          this.keyResult = { ...this.keyResult, lastCheckIn: createdCheckIn };
+          this.changeDetectorRef.detectChanges();
+        });
+      }
+    });
+  }
 }
diff --git a/frontend/src/app/keyresult/keyresult.component.html b/frontend/src/app/keyresult/keyresult.component.html
@@ -12,7 +12,7 @@
 
     <div class="d-flex align-items-center flex-wrap justify-content-end">
       <p class="sub-title">Confidence</p>
-      <app-confidence [edit]="false" [keyResult]="keyResult" class="ms-2"></app-confidence>
+      <app-confidence [edit]="false" [checkIn]="keyResult.lastCheckIn!" class="ms-2"></app-confidence>
     </div>
   </div>
   <div *ngIf="keyResult.lastCheckIn == null" class="sub-title">Noch kein Check-in vorhanden</div>

diff --git a/frontend/src/app/keyresult/keyresult.component.ts b/frontend/src/app/keyresult/keyresult.component.ts
@@ -12,10 +12,12 @@ import { Router } from '@angular/router';
 })
 export class KeyresultComponent {
   @Input() keyResult!: KeyresultMin;
+
   constructor(
     public dialog: MatDialog,
     private router: Router,
   ) {}
+
   checkInHistory() {
     const dialogRef = this.dialog.open(CheckInHistoryDialogComponent, {
       data: {

diff --git a/frontend/src/app/shared/custom/custom-input/custom-input.component.html b/frontend/src/app/shared/custom/custom-input/custom-input.component.html
@@ -0,0 +1,3 @@
+<form [formGroup]="formGroup">
+  <input matInput formControlName="{{ formControlNameGiven }}" />
+</form>
diff --git a/frontend/src/app/shared/custom/custom-input/custom-input.component.scss b/frontend/src/app/shared/custom/custom-input/custom-input.component.scss
@@ -0,0 +1,3 @@
+input {
+  height: 32px;
+}