Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Adjust global error color and font weight #483

Merged
merged 3 commits into from
Oct 20, 2023
Merged

Adjust global error color and font weight #483

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
b2d2997
Adjust global error color and font weight
lkleisa Oct 20, 2023
ed36222
Remove white space infront of error message
lkleisa Oct 20, 2023
668833b
Use same error message in checkinbase dialog as in other dialogs
lkleisa Oct 20, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
10 changes: 5 additions & 5 deletions frontend/src/app/keyresult-type/keyresult-type.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -45,7 +45,7 @@
<input class="input-fields metric-fields" formControlName="baseline" [attr.data-testId]="'baseline'" />
<div *ngIf="isTouchedOrDirty('baseline')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('baseline')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand All @@ -58,7 +58,7 @@
/>
<div *ngIf="isTouchedOrDirty('stretchGoal')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('stretchGoal')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand All @@ -80,7 +80,7 @@
<textarea class="input-fields" formControlName="commitZone" [attr.data-testId]="'commitZone'"></textarea>
<div *ngIf="isTouchedOrDirty('commitZone')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('commitZone')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand All @@ -89,7 +89,7 @@
<textarea class="input-fields" formControlName="targetZone" [attr.data-testId]="'targetZone'"></textarea>
<div *ngIf="isTouchedOrDirty('targetZone')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('targetZone')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand All @@ -102,7 +102,7 @@
></textarea>
<div *ngIf="isTouchedOrDirty('stretchZone')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('stretchZone')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand Down
8 changes: 4 additions & 4 deletions ...hared/dialog/checkin/check-in-base-informations/check-in-base-informations.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -4,8 +4,8 @@
<mat-form-field appearance="outline">
<textarea matInput class="w-100" formControlName="changeInfo"></textarea>
<div *ngIf="isTouchedOrDirty('changeInfo')">
<mat-error class="fw-bold" *ngFor="let errorKey of getErrorKeysOfFormField('changeInfo')">
{{ getErrorMessage(errorKey) }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('changeInfo')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</mat-form-field>
Expand All @@ -15,8 +15,8 @@
<mat-form-field appearance="outline">
<textarea matInput formControlName="initiatives"></textarea>
<div *ngIf="isTouchedOrDirty('initiatives')">
<mat-error class="fw-bold" *ngFor="let errorKey of getErrorKeysOfFormField('initiatives')">
{{ getErrorMessage(errorKey) }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('initiatives')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</mat-form-field>
Expand Down
7 changes: 1 addition & 6 deletions .../shared/dialog/checkin/check-in-base-informations/check-in-base-informations.component.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,6 +10,7 @@ import errorMessages from '../../../../../assets/errors/error-messages.json';
export class CheckInBaseInformationsComponent {
@Input()
dialogForm!: FormGroup;
protected readonly errorMessages: any = errorMessages;

isTouchedOrDirty(name: string) {
return this.dialogForm.get(name)?.dirty || this.dialogForm.get(name)?.touched;
Expand All @@ -19,10 +20,4 @@ export class CheckInBaseInformationsComponent {
const errors = this.dialogForm.get(name)?.errors;
return errors == null ? [] : Object.keys(errors);
}

getErrorMessage(key: string) {
return errorMessages[key.toUpperCase() as keyof typeof errorMessages];
}

protected readonly errorMessages = errorMessages;
}
4 changes: 2 additions & 2 deletions ...nd/src/app/shared/dialog/checkin/check-in-form-metric/check-in-form-metric.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,8 +15,8 @@
(focusin)="resetValue()"
></app-custom-input>
<div *ngIf="isTouchedOrDirty('value')">
<mat-error class="fw-bold error-font" *ngFor="let errorKey of getErrorKeysOfFormField('value')">
{{ errorMessages[errorKey.toUpperCase()] }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('value')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand Down
4 changes: 0 additions & 4 deletions ...nd/src/app/shared/dialog/checkin/check-in-form-metric/check-in-form-metric.component.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,3 @@
.error-font {
font-size: 13px;
}

.custom-input {
margin-top: 3px;
}
Expand Down
12 changes: 6 additions & 6 deletions frontend/src/app/shared/dialog/example-dialog/example-dialog.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,8 +5,8 @@ <h1 mat-dialog-title class="d-flex justify-content-center">This is an example di
<mat-label>Name</mat-label>
<input matInput formControlName="name" placeholder="Ex. Tom" />
<div *ngIf="isTouchedOrDirty('name')">
<mat-error class="fw-bold" *ngFor="let errorKey of getErrorKeysOfFormField('name')">
{{ errorMessages[errorKey.toUpperCase()] }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('name')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</mat-form-field>
Expand All @@ -17,8 +17,8 @@ <h1 mat-dialog-title class="d-flex justify-content-center">This is an example di
<mat-radio-button value="other">Other</mat-radio-button>
</mat-radio-group>
<div *ngIf="isTouchedOrDirty('gender')">
<mat-error class="fw-bold" *ngFor="let errorKey of getErrorKeysOfFormField('gender')">
{{ errorMessages[errorKey.toUpperCase()] }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('gender')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>

Expand All @@ -29,8 +29,8 @@ <h1 mat-dialog-title class="d-flex justify-content-center">This is an example di
</mat-select>
</mat-form-field>
<div *ngIf="isTouchedOrDirty('hobby')">
<mat-error class="fw-bold" *ngFor="let errorKey of getErrorKeysOfFormField('hobby')">
{{ errorMessages[errorKey.toUpperCase()] }}
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('hobby')">
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>

Expand Down
4 changes: 2 additions & 2 deletions frontend/src/app/shared/dialog/key-result-dialog/key-result-dialog.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,7 +12,7 @@
<textarea [attr.data-testId]="'titleInput'" class="input-fields" formControlName="title" id="title"></textarea>
<div *ngIf="isTouchedOrDirty('title')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('title')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand Down Expand Up @@ -44,7 +44,7 @@
<textarea [attr.data-testId]="'descriptionInput'" class="input-fields" formControlName="description"></textarea>
<div *ngIf="isTouchedOrDirty('description')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('description')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</div>
</div>
Expand Down
4 changes: 2 additions & 2 deletions frontend/src/app/shared/dialog/objective-dialog/objective-form.component.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,7 @@
<textarea cdkFocusInitial formControlName="title" id="title" matInput placeholder="Objective Title"></textarea>
<span *ngIf="isTouchedOrDirty('title')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('title')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</span>
</mat-form-field>
Expand All @@ -28,7 +28,7 @@
<textarea formControlName="description" matInput placeholder="Objective Beschreibung"></textarea>
<span *ngIf="isTouchedOrDirty('description')">
<mat-error *ngFor="let errorKey of getErrorKeysOfFormField('description')">
{{ errorMessages[errorKey.toUpperCase()] }}
{{ errorMessages[errorKey.toUpperCase().trim()] }}
</mat-error>
</span>
</mat-form-field>
Expand Down
4 changes: 4 additions & 0 deletions frontend/src/style/styles.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -99,3 +99,7 @@ body pzsh-backdrop {
border: none;
padding: 0;
}

.mat-mdc-form-field-error {
color: #b3261b;
}
Loading