diff --git a/package.json b/package.json index 0f174938..05b71db6 100644 --- a/package.json +++ b/package.json @@ -91,5 +91,6 @@ "ts-node": "~8.3.0", "typescript": "~4.9.5" }, - "description": "Practera CUTIE project" + "description": "Practera CUTIE project", + "packageManager": "yarn@1.22.19+sha1.4ba7fc5c6e704fce2066ecbfb0b0d8976fe62447" } diff --git a/src/app/metrics/update-metric/update-metric.component.html b/src/app/metrics/update-metric/update-metric.component.html index d9dd156b..cdf83569 100644 --- a/src/app/metrics/update-metric/update-metric.component.html +++ b/src/app/metrics/update-metric/update-metric.component.html @@ -20,7 +20,12 @@ -
Title*
+
+ Title* + + (Title must be less than 64 characters) + +
@@ -108,7 +113,7 @@ - Save Changes + Save Changes \ No newline at end of file diff --git a/src/app/metrics/update-metric/update-metric.component.ts b/src/app/metrics/update-metric/update-metric.component.ts index 5bb3bedf..6db86f8e 100644 --- a/src/app/metrics/update-metric/update-metric.component.ts +++ b/src/app/metrics/update-metric/update-metric.component.ts @@ -1,5 +1,5 @@ import { AfterViewInit, Component, OnDestroy } from '@angular/core'; -import { FormBuilder, FormGroup, Validators } from '@angular/forms'; +import { AbstractControl, FormBuilder, FormGroup, Validators } from '@angular/forms'; import { Metric, MetricsService } from '../metrics.service'; import { ModalController, ToastController } from '@ionic/angular'; import { Subject, takeUntil } from 'rxjs'; @@ -36,7 +36,10 @@ export class UpdateMetricComponent implements AfterViewInit, OnDestroy { this.metricForm = this.formBuilder.group({ id: [''], uuid: [''], - name: ['', Validators.required], + name: ['', [ + Validators.required, + Validators.maxLength(64), + ]], description: [''], dataSource: [''], aggregation: ['', Validators.required], @@ -117,9 +120,15 @@ export class UpdateMetricComponent implements AfterViewInit, OnDestroy { }); } + let errorMessage = 'Please fill out all required fields'; + const titleInput: AbstractControl = this.metricForm.get('name'); + if (titleInput.hasError('maxlength')) { + errorMessage = `Title must be less than ${titleInput.errors.maxlength.requiredLength} characters. You have entered ${titleInput.errors.maxlength.actualLength} characters.`; + } + return this.notificationService.alert({ header: 'Invalid Form', - message: 'Please fill out all required fields', + message: errorMessage, buttons: ['OK'] }); }