From 2dc9fd44d7e151f7e96bff16665edf0a09226249 Mon Sep 17 00:00:00 2001 From: Hugo Dominguez Date: Sat, 19 Aug 2023 14:40:28 -0600 Subject: [PATCH 1/3] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor=20chain=20of?= =?UTF-8?q?=20observables=20to=20avoid=20async=20issues?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../metadata-schema-form.component.ts | 179 ++++++++++-------- 1 file changed, 100 insertions(+), 79 deletions(-) diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts index 1992289ff77..f5fcdef78de 100644 --- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts +++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts @@ -1,4 +1,10 @@ -import { Component, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core'; +import { + Component, + EventEmitter, + OnDestroy, + OnInit, + Output, +} from '@angular/core'; import { DynamicFormControlModel, DynamicFormGroupModel, @@ -8,20 +14,19 @@ import { import { UntypedFormGroup } from '@angular/forms'; import { RegistryService } from '../../../../core/registry/registry.service'; import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service'; -import { take } from 'rxjs/operators'; +import { switchMap, take } from 'rxjs/operators'; import { TranslateService } from '@ngx-translate/core'; -import { combineLatest } from 'rxjs'; +import { Observable, combineLatest } from 'rxjs'; import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model'; @Component({ selector: 'ds-metadata-schema-form', - templateUrl: './metadata-schema-form.component.html' + templateUrl: './metadata-schema-form.component.html', }) /** * A form used for creating and editing metadata schemas */ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { - /** * A unique id used for ds-form */ @@ -53,14 +58,14 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { formLayout: DynamicFormLayout = { name: { grid: { - host: 'col col-sm-6 d-inline-block' - } + host: 'col col-sm-6 d-inline-block', + }, }, namespace: { grid: { - host: 'col col-sm-6 d-inline-block' - } - } + host: 'col col-sm-6 d-inline-block', + }, + }, }; /** @@ -73,63 +78,67 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { */ @Output() submitForm: EventEmitter = new EventEmitter(); - constructor(public registryService: RegistryService, private formBuilderService: FormBuilderService, private translateService: TranslateService) { - } + constructor( + public registryService: RegistryService, + private formBuilderService: FormBuilderService, + private translateService: TranslateService + ) {} ngOnInit() { combineLatest([ this.translateService.get(`${this.messagePrefix}.name`), - this.translateService.get(`${this.messagePrefix}.namespace`) + this.translateService.get(`${this.messagePrefix}.namespace`), ]).subscribe(([name, namespace]) => { this.name = new DynamicInputModel({ - id: 'name', - label: name, - name: 'name', - validators: { - required: null, - pattern: '^[^. ,]*$', - maxLength: 32, - }, - required: true, - errorMessages: { - pattern: 'error.validation.metadata.name.invalid-pattern', - maxLength: 'error.validation.metadata.name.max-length', - }, - }); + id: 'name', + label: name, + name: 'name', + validators: { + required: null, + pattern: '^[^. ,]*$', + maxLength: 32, + }, + required: true, + errorMessages: { + pattern: 'error.validation.metadata.name.invalid-pattern', + maxLength: 'error.validation.metadata.name.max-length', + }, + }); this.namespace = new DynamicInputModel({ - id: 'namespace', - label: namespace, - name: 'namespace', - validators: { - required: null, - maxLength: 256, - }, - required: true, - errorMessages: { - maxLength: 'error.validation.metadata.namespace.max-length', - }, - }); + id: 'namespace', + label: namespace, + name: 'namespace', + validators: { + required: null, + maxLength: 256, + }, + required: true, + errorMessages: { + maxLength: 'error.validation.metadata.namespace.max-length', + }, + }); this.formModel = [ - new DynamicFormGroupModel( - { - id: 'metadatadataschemagroup', - group:[this.namespace, this.name] - }) + new DynamicFormGroupModel({ + id: 'metadatadataschemagroup', + group: [this.namespace, this.name], + }), ]; this.formGroup = this.formBuilderService.createFormGroup(this.formModel); - this.registryService.getActiveMetadataSchema().subscribe((schema: MetadataSchema) => { - if (schema == null) { - this.clearFields(); - } else { - this.formGroup.patchValue({ - metadatadataschemagroup: { - name: schema.prefix, - namespace: schema.namespace, - }, - }); - this.name.disabled = true; - } - }); + this.registryService + .getActiveMetadataSchema() + .subscribe((schema: MetadataSchema) => { + if (schema == null) { + this.clearFields(); + } else { + this.formGroup.patchValue({ + metadatadataschemagroup: { + name: schema.prefix, + namespace: schema.namespace, + }, + }); + this.name.disabled = true; + } + }); }); } @@ -147,30 +156,42 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { * Emit the updated/created schema using the EventEmitter submitForm */ onSubmit(): void { - this.registryService.clearMetadataSchemaRequests().subscribe(); - this.registryService.getActiveMetadataSchema().pipe(take(1)).subscribe( - (schema: MetadataSchema) => { - const values = { - prefix: this.name.value, - namespace: this.namespace.value - }; - if (schema == null) { - this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), values)).subscribe((newSchema) => { - this.submitForm.emit(newSchema); - }); - } else { - this.registryService.createOrUpdateMetadataSchema(Object.assign(new MetadataSchema(), schema, { - id: schema.id, - prefix: schema.prefix, - namespace: values.namespace, - })).subscribe((updatedSchema: MetadataSchema) => { - this.submitForm.emit(updatedSchema); - }); - } + const clearMetadataSchemaRequests$ = + this.registryService.clearMetadataSchemaRequests(); + + clearMetadataSchemaRequests$ + .pipe( + switchMap(() => + this.registryService.getActiveMetadataSchema().pipe(take(1)) + ), + switchMap((schema: MetadataSchema) => { + const metadataValues = { + prefix: this.name.value, + namespace: this.namespace.value, + }; + + let createOrUpdate$: Observable; + + if (schema == null) { + createOrUpdate$ = this.registryService.createOrUpdateMetadataSchema( + Object.assign(new MetadataSchema(), metadataValues) + ); + } else { + const updatedSchema = Object.assign(new MetadataSchema(), schema, { + namespace: metadataValues.namespace, + }); + createOrUpdate$ = + this.registryService.createOrUpdateMetadataSchema(updatedSchema); + } + + return createOrUpdate$; + }) + ) + .subscribe((updatedOrCreatedSchema: MetadataSchema) => { + this.submitForm.emit(updatedOrCreatedSchema); this.clearFields(); this.registryService.cancelEditMetadataSchema(); - } - ); + }); } /** From 9fb9e5848c70274b7917bead52643e3611308174 Mon Sep 17 00:00:00 2001 From: Hugo Dominguez Date: Sat, 19 Aug 2023 15:59:33 -0600 Subject: [PATCH 2/3] =?UTF-8?q?=F0=9F=90=9B=20fix=20bug=20of=20caching=20w?= =?UTF-8?q?hen=20add=20new=20schema?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../metadata-schema-form.component.ts | 80 ++++++++++--------- 1 file changed, 43 insertions(+), 37 deletions(-) diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts index f5fcdef78de..61766a4a109 100644 --- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts +++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts @@ -14,7 +14,7 @@ import { import { UntypedFormGroup } from '@angular/forms'; import { RegistryService } from '../../../../core/registry/registry.service'; import { FormBuilderService } from '../../../../shared/form/builder/form-builder.service'; -import { switchMap, take } from 'rxjs/operators'; +import { switchMap, take, tap } from 'rxjs/operators'; import { TranslateService } from '@ngx-translate/core'; import { Observable, combineLatest } from 'rxjs'; import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model'; @@ -156,42 +156,48 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { * Emit the updated/created schema using the EventEmitter submitForm */ onSubmit(): void { - const clearMetadataSchemaRequests$ = - this.registryService.clearMetadataSchemaRequests(); - - clearMetadataSchemaRequests$ - .pipe( - switchMap(() => - this.registryService.getActiveMetadataSchema().pipe(take(1)) - ), - switchMap((schema: MetadataSchema) => { - const metadataValues = { - prefix: this.name.value, - namespace: this.namespace.value, - }; - - let createOrUpdate$: Observable; - - if (schema == null) { - createOrUpdate$ = this.registryService.createOrUpdateMetadataSchema( - Object.assign(new MetadataSchema(), metadataValues) - ); - } else { - const updatedSchema = Object.assign(new MetadataSchema(), schema, { - namespace: metadataValues.namespace, - }); - createOrUpdate$ = - this.registryService.createOrUpdateMetadataSchema(updatedSchema); - } - - return createOrUpdate$; - }) - ) - .subscribe((updatedOrCreatedSchema: MetadataSchema) => { - this.submitForm.emit(updatedOrCreatedSchema); - this.clearFields(); - this.registryService.cancelEditMetadataSchema(); - }); + this.registryService + .getActiveMetadataSchema() + .pipe( + take(1), + switchMap((schema: MetadataSchema) => { + const metadataValues = { + prefix: this.name.value, + namespace: this.namespace.value, + }; + + let createOrUpdate$: Observable; + + if (schema == null) { + createOrUpdate$ = + this.registryService.createOrUpdateMetadataSchema( + Object.assign(new MetadataSchema(), metadataValues) + ); + } else { + const updatedSchema = Object.assign( + new MetadataSchema(), + schema, + { + namespace: metadataValues.namespace, + } + ); + createOrUpdate$ = + this.registryService.createOrUpdateMetadataSchema( + updatedSchema + ); + } + + return createOrUpdate$; + }), + tap(() => { + this.registryService.clearMetadataSchemaRequests().subscribe(); + }) + ) + .subscribe((updatedOrCreatedSchema: MetadataSchema) => { + this.submitForm.emit(updatedOrCreatedSchema); + this.clearFields(); + this.registryService.cancelEditMetadataSchema(); + }); } /** From 3e5524de69fa09808e3a7d0ab4042e5e3ffc98e0 Mon Sep 17 00:00:00 2001 From: Hugo Dominguez Date: Fri, 8 Sep 2023 11:31:26 -0600 Subject: [PATCH 3/3] =?UTF-8?q?=F0=9F=8E=A8=20revert=20format?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../metadata-schema-form.component.ts | 119 ++++++++---------- 1 file changed, 55 insertions(+), 64 deletions(-) diff --git a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts index 61766a4a109..24bf4306619 100644 --- a/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts +++ b/src/app/admin/admin-registries/metadata-registry/metadata-schema-form/metadata-schema-form.component.ts @@ -1,10 +1,4 @@ -import { - Component, - EventEmitter, - OnDestroy, - OnInit, - Output, -} from '@angular/core'; +import { Component, EventEmitter, OnDestroy, OnInit, Output } from '@angular/core'; import { DynamicFormControlModel, DynamicFormGroupModel, @@ -21,12 +15,13 @@ import { MetadataSchema } from '../../../../core/metadata/metadata-schema.model' @Component({ selector: 'ds-metadata-schema-form', - templateUrl: './metadata-schema-form.component.html', + templateUrl: './metadata-schema-form.component.html' }) /** * A form used for creating and editing metadata schemas */ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { + /** * A unique id used for ds-form */ @@ -58,14 +53,14 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { formLayout: DynamicFormLayout = { name: { grid: { - host: 'col col-sm-6 d-inline-block', - }, + host: 'col col-sm-6 d-inline-block' + } }, namespace: { grid: { - host: 'col col-sm-6 d-inline-block', - }, - }, + host: 'col col-sm-6 d-inline-block' + } + } }; /** @@ -78,67 +73,63 @@ export class MetadataSchemaFormComponent implements OnInit, OnDestroy { */ @Output() submitForm: EventEmitter = new EventEmitter(); - constructor( - public registryService: RegistryService, - private formBuilderService: FormBuilderService, - private translateService: TranslateService - ) {} + constructor(public registryService: RegistryService, private formBuilderService: FormBuilderService, private translateService: TranslateService) { + } ngOnInit() { combineLatest([ this.translateService.get(`${this.messagePrefix}.name`), - this.translateService.get(`${this.messagePrefix}.namespace`), + this.translateService.get(`${this.messagePrefix}.namespace`) ]).subscribe(([name, namespace]) => { this.name = new DynamicInputModel({ - id: 'name', - label: name, - name: 'name', - validators: { - required: null, - pattern: '^[^. ,]*$', - maxLength: 32, - }, - required: true, - errorMessages: { - pattern: 'error.validation.metadata.name.invalid-pattern', - maxLength: 'error.validation.metadata.name.max-length', - }, - }); + id: 'name', + label: name, + name: 'name', + validators: { + required: null, + pattern: '^[^. ,]*$', + maxLength: 32, + }, + required: true, + errorMessages: { + pattern: 'error.validation.metadata.name.invalid-pattern', + maxLength: 'error.validation.metadata.name.max-length', + }, + }); this.namespace = new DynamicInputModel({ - id: 'namespace', - label: namespace, - name: 'namespace', - validators: { - required: null, - maxLength: 256, - }, - required: true, - errorMessages: { - maxLength: 'error.validation.metadata.namespace.max-length', - }, - }); + id: 'namespace', + label: namespace, + name: 'namespace', + validators: { + required: null, + maxLength: 256, + }, + required: true, + errorMessages: { + maxLength: 'error.validation.metadata.namespace.max-length', + }, + }); this.formModel = [ - new DynamicFormGroupModel({ - id: 'metadatadataschemagroup', - group: [this.namespace, this.name], - }), + new DynamicFormGroupModel( + { + id: 'metadatadataschemagroup', + group:[this.namespace, this.name] + }) ]; this.formGroup = this.formBuilderService.createFormGroup(this.formModel); - this.registryService - .getActiveMetadataSchema() - .subscribe((schema: MetadataSchema) => { - if (schema == null) { - this.clearFields(); - } else { - this.formGroup.patchValue({ - metadatadataschemagroup: { - name: schema.prefix, - namespace: schema.namespace, - }, - }); - this.name.disabled = true; - } - }); + this.registryService.getActiveMetadataSchema().subscribe((schema: MetadataSchema) => { + if (schema == null) { + this.clearFields(); + } else { + this.formGroup.patchValue({ + metadatadataschemagroup: { + name: schema.prefix, + namespace: schema.namespace, + }, + }); + this.name.disabled = true; + } + }); }); }