refactor(value): remove old date value components (DEV-633) (#684)

* refactor(value): remove old date value components

* refactor(value): rename yet-another-date-value

* chore(ontology): default timestamp

* refactor(form): remove asterisk from required inputs

* refactor(ontology): remove console log

* refactor(ontology): bring back the previous setup

Author: kilchenmann

src/app/app.module.ts

@@ -45,6 +45,7 @@ import { KnoraDatePipe } from './main/pipes/formatting/knoradate.pipe';
 import { SplitPipe } from './main/pipes/split.pipe';
 import { LinkifyPipe } from './main/pipes/string-transformation/linkify.pipe';
 import { StringifyStringLiteralPipe } from './main/pipes/string-transformation/stringify-string-literal.pipe';
+import { TitleFromCamelCasePipe } from './main/pipes/string-transformation/title-from-camel-case.pipe';
 import { TruncatePipe } from './main/pipes/string-transformation/truncate.pipe';
 import { SelectLanguageComponent } from './main/select-language/select-language.component';
 import { DatadogRumService } from './main/services/datadog-rum.service';
@@ -111,10 +112,8 @@ import { ResourceComponent } from './workspace/resource/resource.component';
 import { BooleanValueComponent } from './workspace/resource/values/boolean-value/boolean-value.component';
 import { ColorPickerComponent } from './workspace/resource/values/color-value/color-picker/color-picker.component';
 import { ColorValueComponent } from './workspace/resource/values/color-value/color-value.component';
-import { CalendarHeaderComponent } from './workspace/resource/values/date-value/calendar-header/calendar-header.component';
-import { DateEditComponent } from './workspace/resource/values/date-value/date-input-text/date-edit/date-edit.component';
-import { DateInputTextComponent } from './workspace/resource/values/date-value/date-input-text/date-input-text.component';
-import { DateInputComponent } from './workspace/resource/values/date-value/date-input/date-input.component';
+import { DatePickerComponent } from './workspace/resource/values/date-value/date-picker/date-picker.component';
+import { DateValueHandlerComponent } from './workspace/resource/values/date-value/date-value-handler/date-value-handler.component';
 import { DateValueComponent } from './workspace/resource/values/date-value/date-value.component';
 import { DecimalValueComponent } from './workspace/resource/values/decimal-value/decimal-value.component';
 import { GeonameValueComponent } from './workspace/resource/values/geoname-value/geoname-value.component';
@@ -131,9 +130,6 @@ import { TextValueAsXMLComponent } from './workspace/resource/values/text-value/
 import { TimeInputComponent } from './workspace/resource/values/time-value/time-input/time-input.component';
 import { TimeValueComponent } from './workspace/resource/values/time-value/time-value.component';
 import { UriValueComponent } from './workspace/resource/values/uri-value/uri-value.component';
-import { DatePickerComponent } from './workspace/resource/values/yet-another-date-value/date-picker/date-picker.component';
-import { DateValueHandlerComponent } from './workspace/resource/values/yet-another-date-value/date-value-handler/date-value-handler.component';
-import { YetAnotherDateValueComponent } from './workspace/resource/values/yet-another-date-value/yet-another-date-value.component';
 import { ListViewComponent } from './workspace/results/list-view/list-view.component';
 import { ResourceGridComponent } from './workspace/results/list-view/resource-grid/resource-grid.component';
 import { ResourceListComponent } from './workspace/results/list-view/resource-list/resource-list.component';
@@ -157,7 +153,6 @@ import { SearchSelectOntologyComponent } from './workspace/search/advanced-searc
 import { ExpertSearchComponent } from './workspace/search/expert-search/expert-search.component';
 import { FulltextSearchComponent } from './workspace/search/fulltext-search/fulltext-search.component';
 import { SearchPanelComponent } from './workspace/search/search-panel/search-panel.component';
-import { TitleFromCamelCasePipe } from './main/pipes/string-transformation/title-from-camel-case.pipe';
 
 // translate: AoT requires an exported function for factories
 export function httpLoaderFactory(httpClient: HttpClient) {
@@ -178,7 +173,6 @@ export function httpLoaderFactory(httpClient: HttpClient) {
         AudioComponent,
         BoardComponent,
         BooleanValueComponent,
-        CalendarHeaderComponent,
         CollaborationComponent,
         CollectionListComponent,
         ColorPickerComponent,
@@ -189,9 +183,6 @@ export function httpLoaderFactory(httpClient: HttpClient) {
         CookiePolicyComponent,
         CreateLinkResourceComponent,
         DashboardComponent,
-        DateEditComponent,
-        DateInputComponent,
-        DateInputTextComponent,
         DatePickerComponent,
         DateValueComponent,
         DateValueHandlerComponent,
@@ -294,6 +285,7 @@ export function httpLoaderFactory(httpClient: HttpClient) {
         TextValueHtmlLinkDirective,
         TimeInputComponent,
         TimeValueComponent,
+        TitleFromCamelCasePipe,
         TruncatePipe,
         UploadComponent,
         UriValueComponent,
@@ -302,8 +294,6 @@ export function httpLoaderFactory(httpClient: HttpClient) {
         UserMenuComponent,
         UsersComponent,
         UsersListComponent,
-        YetAnotherDateValueComponent,
-        TitleFromCamelCasePipe
     ],
     imports: [
         AngularSplitModule.forRoot(),

src/app/project/ontology/default-data/default-properties.ts

@@ -121,7 +121,7 @@ export class DefaultProperties {
                 {
                     icon: 'access_time',
                     label: 'Timestamp',
-                    description: 'A single timestamp on a timeline',
+                    description: 'A single timestamp (date and time) on a timeline',
                     subPropOf: Constants.HasValue,
                     objectType: Constants.TimeValue,
                     guiEle: Constants.GuiTimeStamp,

src/app/project/ontology/ontology-form/ontology-form.component.html

@@ -3,7 +3,7 @@
     <div class="form-content">
         <mat-form-field class="large-field ontology-name">
             <input matInput class="ontology-name" autocomplete="off" [maxlength]="nameMaxLength" [formControl]="ontologyForm.controls['name']"
-                [placeholder]="'Set a unique name *'">
+                [placeholder]="'Set a unique name'">
             <mat-icon matSuffix [matTooltip]="ontologyNameInfo" matTooltipPosition="above" matTooltipClass="multi-line-tooltip">help</mat-icon>
             <mat-hint *ngIf="formErrors.name" class="medium-field">
                 {{ formErrors.name }}
@@ -13,7 +13,7 @@
 
         <mat-form-field class="large-field ontology-label">
             <span *ngIf="!iri" matPrefix>{{project.shortname}}:&nbsp;</span>
-            <input matInput [formControl]="ontologyForm.controls['label']" placeholder="Label *"
+            <input matInput [formControl]="ontologyForm.controls['label']" placeholder="Label"
                 [value]="ontologyLabel">
             <mat-hint *ngIf="formErrors.label">
                 {{ formErrors.label }}

src/app/project/ontology/ontology-form/ontology-form.component.ts

@@ -186,6 +186,7 @@ export class OntologyFormComponent implements OnInit {
             label: new FormControl({
                 value: this.ontologyLabel, disabled: false
             }, [
+                Validators.required,
                 Validators.minLength(this.nameMinLength)
             ]),
             comment: new FormControl({

src/app/project/ontology/property-form/property-form.component.html

@@ -41,7 +41,7 @@
             <span matPrefix class="ontology-prefix-icon">
                 <mat-icon>fingerprint</mat-icon>&nbsp;
             </span>
-            <mat-label>Property name *</mat-label>
+            <mat-label>Property name</mat-label>
             <input matInput formControlName="name" >
             <mat-hint class="ontology-error-with-prefix" *ngIf="formErrors.name">
                 {{formErrors.name}}

src/app/project/ontology/property-form/property-form.component.ts

@@ -424,6 +424,7 @@ export class PropertyFormComponent implements OnInit {
 
                         this._dspApiConnection.v2.onto.updateResourceProperty(onto4Comment).subscribe(
                             (classCommentResponse: ResourcePropertyDefinitionWithAllLanguages) => {
+                                console.log(classCommentResponse);
                                 this.lastModificationDate = classCommentResponse.lastModificationDate;
 
                                 if (!this.unsupportedPropertyType) {
@@ -491,7 +492,7 @@ export class PropertyFormComponent implements OnInit {
             const newResProp = new CreateResourceProperty();
             newResProp.name = this.propertyForm.controls['name'].value;
             newResProp.label = this.labels;
-            newResProp.comment = (this.comments.length ? this.comments : this.labels);
+            newResProp.comment = this.comments;
             const guiAttr = this.propertyForm.controls['guiAttr'].value;
             if (guiAttr) {
                 newResProp.guiAttributes = this.setGuiAttribute(guiAttr);

src/app/project/ontology/resource-class-form/resource-class-form.component.html

@@ -10,7 +10,7 @@
                 <span matPrefix class="ontology-prefix-icon">
                     <mat-icon>fingerprint</mat-icon>&nbsp;
                 </span>
-                <mat-label>Class name *</mat-label>
+                <mat-label>Class name</mat-label>
                 <input matInput formControlName="name" >
                 <mat-hint class="ontology-error-with-prefix" *ngIf="formErrors.name">
                     {{formErrors.name}}
@@ -34,15 +34,12 @@
             <!-- description -->
             <div class="large-field string-literal-container more-space-top">
                 <app-string-literal-input
-                    [placeholder]="'Comment *'"
+                    [placeholder]="'Comment'"
                     [value]="resourceClassComments"
                     [textarea]="true"
                     (touched)="resourceClassCommentsTouched = $event"
                     (dataChanged)="handleData($event, 'comment')">
                 </app-string-literal-input>
-                <mat-hint class="string-literal-error" *ngIf="formErrors.comment">
-                    {{ formErrors.comment }}
-                </mat-hint>
             </div>
         </div>
 
@@ -56,12 +53,12 @@
             <span class="fill-remaining-space"></span>
             <span>
                 <button *ngIf="!edit" mat-raised-button type="button" color="primary"
-                    [disabled]="!resourceClassLabels.length || !resourceClassComments.length"
+                    [disabled]="!resourceClassLabels.length || (resourceClassForm.enabled && !resourceClassForm.valid)"
                     (click)="submitData()">
                     Submit
                 </button>
                 <button *ngIf="edit" mat-raised-button type="button" color="primary"
-                    [disabled]="!resourceClassLabels.length || !resourceClassComments.length"
+                    [disabled]="!resourceClassLabels.length || (resourceClassForm.enabled && !resourceClassForm.valid)"
                     (click)="submitData()">
                     <app-progress-indicator [color]="'white'" [status]="0" *ngIf="loading" class="submit-progress">
                     </app-progress-indicator>

src/app/project/ontology/resource-class-form/resource-class-form.component.ts

@@ -103,8 +103,7 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
     // form errors on the following fields:
     formErrors = {
         'name': '',
-        'label': '',
-        'comment': ''
+        'label': ''
     };
 
     // in case of form error: show message
@@ -116,9 +115,6 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
         },
         'label': {
             'required': 'Label is required.'
-        },
-        'comment': {
-            'required': 'Comment is required.'
         }
     };
 
@@ -216,9 +212,7 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
             ]),
             comment: new FormControl({
                 value: this.resourceClassComments, disabled: false
-            }, [
-                Validators.required
-            ])
+            })
         });
 
         this.resourceClassForm.valueChanges.subscribe(data => this.onValueChanged(data));
@@ -253,6 +247,7 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
         switch (type) {
             case 'label':
                 this.resourceClassLabels = data;
+                this.resourceClassForm.controls['label'].setValue(data);
                 this.handleError(this.resourceClassLabelsTouched, type);
                 break;
 
@@ -307,7 +302,7 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
 
             const updateComment = new UpdateResourceClassComment();
             updateComment.id = this.iri;
-            updateComment.comments = this.resourceClassComments;
+            updateComment.comments = (this.resourceClassComments.length ? this.resourceClassComments : this.resourceClassLabels);
             onto4Comment.entity = updateComment;
 
             this._dspApiConnection.v2.onto.updateResourceClass(onto4Label).subscribe(
@@ -351,6 +346,7 @@ export class ResourceClassFormComponent implements OnInit, AfterViewChecked {
             newResClass.subClassOf = [this.iri];
 
             onto.entity = newResClass;
+
             this._dspApiConnection.v2.onto.createResourceClass(onto).subscribe(
                 (classResponse: ResourceClassDefinitionWithAllLanguages) => {
                     // need lmd from classResponse

src/app/project/project-form/project-form.component.html

@@ -6,7 +6,7 @@
 
         <!-- short and long name -->
         <mat-form-field class="small-field">
-            <input matInput placeholder="{{'appLabels.form.project.general.shortcode' | translate}} * "
+            <input matInput placeholder="{{'appLabels.form.project.general.shortcode' | translate}}"
                 [maxlength]="shortcodeMaxLength" [formControl]="form.controls['shortcode']">
             <mat-hint *ngIf="formErrors.shortcode">
                 {{ formErrors.shortcode }}
@@ -16,7 +16,7 @@
         <!-- short name -->
         <mat-form-field class="medium-field">
             <input matInput [maxlength]="shortnameMaxLength"
-                placeholder="{{'appLabels.form.project.general.shortname' | translate}} * "
+                placeholder="{{'appLabels.form.project.general.shortname' | translate}}"
                 [formControl]="form.controls['shortname']">
             <mat-hint *ngIf="formErrors.shortname">
                 {{ formErrors.shortname }}
@@ -25,7 +25,7 @@
 
         <!-- long name -->
         <mat-form-field class="large-field">
-            <input matInput placeholder="{{'appLabels.form.project.general.longname' | translate}} *"
+            <input matInput placeholder="{{'appLabels.form.project.general.longname' | translate}}"
                 [formControl]="form.controls['longname']">
             <mat-hint *ngIf="formErrors.longname">
                 {{ formErrors.longname }}

src/app/user/user-form/password-form/password-form.component.html

@@ -17,7 +17,7 @@ <h4 class="mat-subheading-1">As system admin, please enter your password before
             <mat-form-field class="large-field">
                 <input matInput [type]="showRequesterPassword ? 'text' : 'password'"
                     [formControl]="confirmForm.controls['requesterPassword']" autocomplete="old-password"
-                    placeholder="{{ 'appLabels.form.user.general.requesterPassword' | translate}} *">
+                    placeholder="{{ 'appLabels.form.user.general.requesterPassword' | translate}}">
 
                 <button mat-button type="button" matSuffix mat-icon-button class="input-icon"
                     attr.aria-label="{{showRequesterPassword ? 'Hide password' : 'Show password'}}"
@@ -57,7 +57,7 @@ <h4 class="mat-subheading-1">As system admin, please enter your password before
 
                 <input matInput [type]="showRequesterPassword ? 'text' : 'password'"
                     [formControl]="form.controls['requesterPassword']" autocomplete="current-password"
-                    placeholder="{{ 'appLabels.form.user.general.oldPassword' | translate}} *">
+                    placeholder="{{ 'appLabels.form.user.general.oldPassword' | translate}}">
 
                 <button mat-button type="button" matSuffix mat-icon-button class="input-icon"
                     attr.aria-label="{{showRequesterPassword ? 'Hide password' : 'Show password'}}"
@@ -76,7 +76,7 @@ <h4 class="mat-subheading-1">As system admin, please enter your password before
             <!-- password -->
             <mat-form-field class="large-field">
                 <input matInput [type]="showPassword ? 'text' : 'password'" [formControl]="form.controls['password']"
-                    autocomplete="new-password" placeholder="{{ 'appLabels.form.user.general.password' | translate}} *">
+                    autocomplete="new-password" placeholder="{{ 'appLabels.form.user.general.password' | translate}}">
 
                 <button mat-button type="button" matSuffix mat-icon-button class="input-icon"
                     attr.aria-label="{{showPassword ? 'Hide password' : 'Show password'}}"
@@ -97,7 +97,7 @@ <h4 class="mat-subheading-1">As system admin, please enter your password before
                 <input matInput [type]="showConfirmPassword ? 'text' : 'password'"
                     [class.error]="formErrors.confirmPassword  || (!matchingPasswords)"
                     [formControl]="form.controls['confirmPassword']" autocomplete="confirm-password"
-                    placeholder="{{ 'appLabels.form.user.general.confirmPassword' | translate}} *">
+                    placeholder="{{ 'appLabels.form.user.general.confirmPassword' | translate}}">
 
                 <button mat-button type="button" matSuffix mat-icon-button class="input-icon"
                     attr.aria-label="{{showConfirmPassword ? 'Hide password' : 'Show password'}}"