Skip to content

Commit

Permalink
Merge pull request #1142 from exadel-inc/EFRS-1400_add_invalid_charac…
Browse files Browse the repository at this point in the history
…ters_check_for_dialogs

Added name validation in dialogs for forbidden chars
  • Loading branch information
oriasyk authored Aug 4, 2023
2 parents 939711c + 5b8572c commit b4fcb5f
Show file tree
Hide file tree
Showing 9 changed files with 46 additions and 15 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -34,9 +34,12 @@ <h1 mat-dialog-title class="dialog__header--title">{{ 'common.create' | translat
<ng-container *ngIf="alreadyExists">
{{ data.errorMsg }}
</ng-container>
<ng-container *ngIf="data.entityName?.length > maxInputLength">
<ng-container *ngIf="data.entityName?.length > maxInputLength && !isForbiddenChar">
{{ 'common.input_lengh_err' | translate }}
</ng-container>
<ng-container *ngIf="isForbiddenChar">
{{ 'common.forbiden_chars_err' | translate }}
</ng-container>
</div>
</div>
</div>
Expand All @@ -48,7 +51,7 @@ <h1 mat-dialog-title class="dialog__header--title">{{ 'common.create' | translat
type="submit"
[mat-dialog-close]="data.entityName"
class="save-btn"
[disabled]="!data.entityName || alreadyExists || data.entityName.length > maxInputLength"
[disabled]="!data.entityName || alreadyExists || data.entityName.length > maxInputLength || isForbiddenChar"
>
{{ 'common.capital.create' | translate | titlecase }}
</button>
Expand Down
9 changes: 8 additions & 1 deletion ui/src/app/features/create-dialog/create-dialog.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -25,10 +25,17 @@ import { MAX_INPUT_LENGTH } from 'src/app/core/constants';
export class CreateDialogComponent {
alreadyExists: boolean;
maxInputLength: number = MAX_INPUT_LENGTH;
isForbiddenChar: boolean;

constructor(public dialogRef: MatDialogRef<CreateDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {}

onChange(name): void {
onChange(name: string): void {
this.alreadyExists = !!this.data.nameList.find(appName => appName === name);
this.checkForForbiddenChars(name);
}

checkForForbiddenChars(name: string): void {
const forbidenChars = /[;\/\\]/;
this.isForbiddenChar = forbidenChars.test(name);
}
}
9 changes: 6 additions & 3 deletions ui/src/app/features/edit-dialog/edit-dialog.component.html
Original file line number Diff line number Diff line change
Expand Up @@ -29,9 +29,12 @@ <h1 class="container--title">{{ 'common.capital.edit' | translate }} {{ data.typ
<ng-container *ngIf="alreadyExists">
{{ data.errorMsg }}
</ng-container>
<ng-container *ngIf="initialName.length > maxInputLength">
<ng-container *ngIf="initialName.length > maxInputLength && !isForbiddenChar">
{{ 'common.input_lengh_err' | translate }}
</ng-container>
<ng-container *ngIf="isForbiddenChar">
{{ 'common.forbiden_chars_err' | translate }}
</ng-container>
</div>
</div>
<div class="content">
Expand All @@ -49,7 +52,7 @@ <h1 class="container--title">{{ 'common.capital.edit' | translate }} {{ data.typ
<button
type="submit"
class="save-btn"
[disabled]="isRenameDisabled || !initialName || alreadyExists || initialName.length > maxInputLength"
[disabled]="isRenameDisabled || !initialName || alreadyExists || initialName.length > maxInputLength || isForbiddenChar"
(click)="onSave()"
>
{{ 'common.capital.save' | translate }}
Expand All @@ -67,7 +70,7 @@ <h1 class="container--title">{{ 'common.capital.edit' | translate }} {{ data.typ

<div *ngIf="panelOpenState">
<span class="confirmation--question">
{{ 'models.delete_dialog.confirmation_question' | translate: { entityType: data.type | lowercase } }}
{{ 'models.delete_dialog.confirmation_question' | translate : { entityType: data.type | lowercase } }}
</span>
<div class="form-field">
<input [(ngModel)]="deleteInput" placeholder="{{ data.type }} {{ 'common.name' | translate }}" />
Expand Down
7 changes: 5 additions & 2 deletions ui/src/app/features/edit-dialog/edit-dialog.component.ts
Original file line number Diff line number Diff line change
Expand Up @@ -18,14 +18,15 @@ import { ChangeDetectionStrategy } from '@angular/core';
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MAX_INPUT_LENGTH } from 'src/app/core/constants';
import { CreateDialogComponent } from '../create-dialog/create-dialog.component';

@Component({
selector: 'app-edit-dialog',
templateUrl: './edit-dialog.component.html',
styleUrls: ['./edit-dialog.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class EditDialogComponent {
export class EditDialogComponent extends CreateDialogComponent {
initialName: string;
panelOpenState: boolean = false;
deleteInput: string = '';
Expand All @@ -37,11 +38,13 @@ export class EditDialogComponent {
}

constructor(public dialogRef: MatDialogRef<EditDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) {
super(dialogRef, data);
this.initialName = data.entityName;
}

onChange(name): void {
onChange(name: string): void {
this.alreadyExists = !!this.data.models.find(model => model.name === name);
this.checkForForbiddenChars(name);
}

onSave() {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,11 +22,15 @@ <h1 class="container--title">{{ 'common.capital.edit' | translate }} {{ data.typ
<input
[(ngModel)]="initialName"
[ngModelOptions]="{ standalone: true }"
(input)="onChange(initialName)"
placeholder="{{ data.type }} {{ 'common.name' | translate }}"
/>
<div class="err" *ngIf="initialName.length > maxInputLength">
<div class="err" *ngIf="initialName.length > maxInputLength && !isForbiddenChar">
{{ 'common.input_lengh_err' | translate }}
</div>
<div class="err" *ngIf="isForbiddenChar">
{{ 'common.forbiden_chars_err' | translate }}
</div>
</div>

<div class="actions" mat-dialog-actions>
Expand All @@ -37,7 +41,7 @@ <h1 class="container--title">{{ 'common.capital.edit' | translate }} {{ data.typ
class="save-btn"
type="submit"
class="save-btn"
[disabled]="isRenameDisabled || !initialName || initialName.length > maxInputLength"
[disabled]="isRenameDisabled || !initialName || initialName.length > maxInputLength || isForbiddenChar"
(click)="onSave()"
>
{{ 'common.capital.save' | translate }}
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,13 +17,14 @@
import { Component, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material/dialog';
import { MAX_INPUT_LENGTH } from 'src/app/core/constants';
import { CreateDialogComponent } from '../create-dialog/create-dialog.component';

@Component({
selector: 'edit-subject',
templateUrl: './edit-subject-dialog.component.html',
styleUrls: ['./edit-subject-dialog.component.scss'],
})
export class EditSubjectDialog {
export class EditSubjectDialog extends CreateDialogComponent {
initialName: string;
maxInputLength: number = MAX_INPUT_LENGTH;

Expand All @@ -32,10 +33,15 @@ export class EditSubjectDialog {
}

constructor(public dialogRef: MatDialogRef<EditSubjectDialog>, @Inject(MAT_DIALOG_DATA) public data: any) {
super(dialogRef, data);
this.initialName = data.entityName;
}

onSave() {
this.dialogRef.close(this.initialName);
}

onChange(name: string): void {
this.checkForForbiddenChars(name);
}
}
Original file line number Diff line number Diff line change
Expand Up @@ -35,9 +35,12 @@ <h1 mat-dialog-title class="dialog__header--title">{{ 'common.capital.add' | tra
<ng-container *ngIf="alreadyExists">
{{ data.errorMsg }}
</ng-container>
<ng-container *ngIf="data.entityName?.length > maxInputLength">
<ng-container *ngIf="data.entityName?.length > maxInputLength && !isForbiddenChar">
{{ 'common.input_lengh_err' | translate }}
</ng-container>
<ng-container *ngIf="isForbiddenChar">
{{ 'common.forbiden_chars_err' | translate }}
</ng-container>
</div>
</div>
<div class="form-field">
Expand All @@ -54,7 +57,7 @@ <h1 mat-dialog-title class="dialog__header--title">{{ 'common.capital.add' | tra
class="save-btn"
type="submit"
[mat-dialog-close]="data"
[disabled]="!data.entityName || !data.type || alreadyExists || data.entityName?.length > maxInputLength"
[disabled]="!data.entityName || !data.type || alreadyExists || data.entityName?.length > maxInputLength || isForbiddenChar"
>
{{ 'models.create_dialog.create' | translate }}
</button>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -32,8 +32,9 @@ export class ModelCreateDialogComponent extends CreateDialogComponent {
this.data.type = ServiceTypes.Recognition;
}

onChange(name): void {
onChange(name: string): void {
this.alreadyExists = !!this.data.models.find(model => model.name === name);
this.checkForForbiddenChars(name);
}

typeValues = ServiceTypes;
Expand Down
3 changes: 2 additions & 1 deletion ui/src/assets/i18n/en.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,8 @@
"type": "Type",
"create": "Create",
"unknown_error": "Sorry, something went wrong",
"input_lengh_err": "Max 50 symbols limit is reached"
"input_lengh_err": "Max 50 symbols limit is reached",
"forbiden_chars_err": "The name cannot contain the following special characters: ';', '/', '\\'"
},
"login": {
"email": "E-mail",
Expand Down

0 comments on commit b4fcb5f

Please sign in to comment.