You are viewing a plain text version of this content. The canonical link for it is here.
Posted to commits@datalab.apache.org by hs...@apache.org on 2022/10/05 21:15:03 UTC
[incubator-datalab] branch feat/add-platform/validation created (now d03dea7b9)
This is an automated email from the ASF dual-hosted git repository.
hshpak pushed a change to branch feat/add-platform/validation
in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git
at d03dea7b9 added validation on add platform dialog
This branch includes the following new commits:
new d03dea7b9 added validation on add platform dialog
The 1 revisions listed above as "new" are entirely new to this
repository and will be described in separate emails. The revisions
listed as "add" were already present in the repository and have only
been added to this reference.
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@datalab.apache.org
For additional commands, e-mail: commits-help@datalab.apache.org
[incubator-datalab] 01/01: added validation on add platform dialog
Posted by hs...@apache.org.
This is an automated email from the ASF dual-hosted git repository.
hshpak pushed a commit to branch feat/add-platform/validation
in repository https://gitbox.apache.org/repos/asf/incubator-datalab.git
commit d03dea7b9207ec8333a70caab4b5ad63fc0f70c1
Author: Hennadii_Shpak <bo...@gmail.com>
AuthorDate: Thu Oct 6 00:14:44 2022 +0300
added validation on add platform dialog
---
.../connected-platform-dialog.component.html | 21 ++++++++++++++++++++-
.../connected-platform-dialog.component.scss | 11 ++++++++---
.../connected-platform-dialog.component.ts | 13 +++++++++----
.../connected-platforms.component.html | 11 +++++++++--
.../connected-platforms.component.ts | 1 +
.../connected-platforms.module.ts | 8 +++++---
.../modal-parts/modal-btn/modal-btn.component.html | 2 +-
7 files changed, 53 insertions(+), 14 deletions(-)
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.html
index 3ca47cf20..ef0ae70ef 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.html
@@ -46,6 +46,13 @@
<label>Platform url</label>
<div class="input__wrapper">
<input placeholder="Platform url" type="text" formControlName="url">
+ <span
+ class="error"
+ *ngIf="!connectedPlatformForm?.controls.url.valid
+ && connectedPlatformForm.controls.url.touched"
+ >
+ Please provide a valid endpoint url with slash in the end.
+ </span>
</div>
</div>
@@ -53,9 +60,21 @@
<label>Name</label>
<div class="input__wrapper">
<input placeholder="Enter name" type="text" formControlName="name">
+ <span
+ class="error"
+ *ngIf="!connectedPlatformForm?.controls.name.valid && connectedPlatformForm.controls.name.touched"
+ >
+ Can only contain letters, numbers. Minimum 2 symbols.
+ </span>
</div>
</div>
- <datalab-modal-btn [confirmBtnName]="confirmButtonName.add" (closeEvent)="onBtnClick($event)"></datalab-modal-btn>
+ <div class="button__wrapper">
+ <datalab-modal-btn
+ [isConfirmBtnDisabled]="isFormValid"
+ [confirmBtnName]="confirmButtonName.add"
+ (closeEvent)="onBtnClick($event)"
+ ></datalab-modal-btn>
+ </div>
</form>
</div>
</div>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.scss b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.scss
index f012798cf..0becd0d19 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.scss
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.scss
@@ -25,12 +25,12 @@
display: flex;
justify-content: space-between;
align-items: baseline;
- margin-bottom: 20px;
+ height: 56px;
}
.select__wrapper {
position: relative;
- width: 285px;
+ width: 320px;
height: 36px;
& ::ng-deep .mat-form-field-wrapper {
@@ -89,5 +89,10 @@
}
.input__wrapper {
- width: 285px;
+ width: 320px;
+ height: 56px;
+}
+
+.button__wrapper {
+ padding-top: 20px;
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.ts
index 9e0f5c458..058834ccd 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platform-dialog/connected-platform-dialog.component.ts
@@ -19,10 +19,11 @@
import { Component, Inject, OnInit } from '@angular/core';
import { MAT_DIALOG_DATA, MatDialogRef } from '@angular/material/dialog';
-import { FormBuilder, FormGroup } from '@angular/forms';
+import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { ModalTitle } from '../../images';
import { AddModalData, AddPlatformFromValue } from '../connected-platforms.models';
import { ConfirmButtonNames } from '../connected-platforms.config';
+import { PATTERNS } from '../../../core/util';
@Component({
selector: 'datalab-connected-platform-dialog',
@@ -55,9 +56,13 @@ export class ConnectedPlatformDialogComponent implements OnInit {
private initForm(): void {
this.connectedPlatformForm = this.fb.group({
- type: '',
- url: '',
- name: ''
+ type: ['', Validators.required],
+ url: ['', [ Validators.required, Validators.pattern(PATTERNS.fullUrl)]],
+ name: ['', [ Validators.required, Validators.pattern(PATTERNS.projectName), Validators.minLength(2)]]
});
}
+
+ get isFormValid(): boolean {
+ return this.connectedPlatformForm.valid;
+ }
}
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.html b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.html
index 43042832c..08acd3619 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.html
@@ -41,8 +41,15 @@
<ng-container matColumnDef="linkToPlatform">
<th mat-header-cell *matHeaderCellDef>{{tableHeaderCellTitles.linkToPlatform}}</th>
<td class="column" mat-cell *matCellDef="let element">
- <a class="link" [href]="element.url | normalizeLink" target="_blank">
- {{element.url}}
+ <a
+ class="link"
+ [href]="element.url | normalizeLink"
+ target="_blank"
+ [matTooltip]="element.url"
+ matTooltipPosition="above"
+ [matTooltipDisabled]="element.url.length < maxUrlLength"
+ >
+ {{element.url | truncateTextPipe : maxUrlLength}}
</a>
</td>
</ng-container>
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.ts b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.ts
index 16b83a2a9..b49dbc545 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.component.ts
@@ -38,6 +38,7 @@ import { WarningDialogComponent } from './warning-dialog/warning-dialog.componen
})
export class ConnectedPlatformsComponent implements OnInit {
readonly tableHeaderCellTitles: typeof ConnectedPlatformsTableTitles = ConnectedPlatformsTableTitles;
+ readonly maxUrlLength: number = 30;
// tslint:disable-next-line:max-line-length
private readonly connectedPlatformsStatus$$: BehaviorSubject<ConnectedPlatformsStatus> = new BehaviorSubject<ConnectedPlatformsStatus>({} as ConnectedPlatformsStatus);
diff --git a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.module.ts b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.module.ts
index 17fb763b8..6d230e86d 100644
--- a/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.module.ts
+++ b/services/self-service/src/main/resources/webapp/src/app/resources/connected-platforms/connected-platforms.module.ts
@@ -25,10 +25,11 @@ import { ConnectedPlatformsComponent } from './connected-platforms.component';
import { MaterialModule } from '../../shared/material.module';
import { NormalizeLinkPipeModule } from '../../core/pipes';
import { BubbleModule } from '../../shared';
-import { WarningDialogComponent } from './warning-dialog/warning-dialog.component';
+import { ReactiveFormsModule } from '@angular/forms';
+import { TruncateTextPipeModule } from '../../core/pipes/truncate-text-pipe';
import { ModalPartsModule } from '../../shared/modal-parts/modal-parts.module';
+import { WarningDialogComponent } from './warning-dialog/warning-dialog.component';
import { ConnectedPlatformDialogComponent } from './connected-platform-dialog/connected-platform-dialog.component';
-import { ReactiveFormsModule } from '@angular/forms';
@NgModule({
@@ -44,7 +45,8 @@ import { ReactiveFormsModule } from '@angular/forms';
ConnectedPlatformsRoutingModule,
BubbleModule,
ModalPartsModule,
- ReactiveFormsModule
+ ReactiveFormsModule,
+ TruncateTextPipeModule
],
entryComponents: [ ConnectedPlatformDialogComponent, WarningDialogComponent ]
})
diff --git a/services/self-service/src/main/resources/webapp/src/app/shared/modal-parts/modal-btn/modal-btn.component.html b/services/self-service/src/main/resources/webapp/src/app/shared/modal-parts/modal-btn/modal-btn.component.html
index 0a5089c4b..0c31d2939 100644
--- a/services/self-service/src/main/resources/webapp/src/app/shared/modal-parts/modal-btn/modal-btn.component.html
+++ b/services/self-service/src/main/resources/webapp/src/app/shared/modal-parts/modal-btn/modal-btn.component.html
@@ -23,7 +23,7 @@
<div class="button__wrapper">
<button type="button" class="butt mat-raised-button" (click)="close()">No</button>
<button
- [disabled]="isConfirmBtnDisabled"
+ [disabled]="!isConfirmBtnDisabled"
type="button"
class="butt butt-success mat-raised-button"
(click)="close(true)">
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscribe@datalab.apache.org
For additional commands, e-mail: commits-help@datalab.apache.org