From 8619f30d76938cbbb8a64fd98ccebb273629010f Mon Sep 17 00:00:00 2001 From: Dmitriy Borzenko Date: Thu, 13 Jul 2023 17:38:03 +0300 Subject: [PATCH] Add functionality for preprocess step. --- .../add-polling-source-form.types.ts | 7 +- .../add-polling-source.component.html | 38 +------ .../add-polling-source.component.ts | 53 +++------ .../preprocess-step.component.html | 8 +- .../preprocess-step.component.ts | 107 ++++++++---------- .../engine-section.component.spec.ts | 20 ++-- .../engine-section.component.ts | 16 +-- .../queries-section.component.ts | 17 +-- .../services/templates-yaml-events.service.ts | 18 +++ 9 files changed, 111 insertions(+), 173 deletions(-) diff --git a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source-form.types.ts b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source-form.types.ts index 58a0ed31e..2b6e52726 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source-form.types.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source-form.types.ts @@ -1,4 +1,4 @@ -import { Transform } from "src/app/api/kamu.graphql.interface"; +import { SqlQueryStep, Transform } from "src/app/api/kamu.graphql.interface"; /* eslint-disable @typescript-eslint/no-explicit-any */ export interface JsonFormValidators { @@ -131,3 +131,8 @@ export interface NameValue { name: string; value: string; } + +export interface PreprocessStepValue { + engine: string; + queries: Omit[]; +} diff --git a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.html b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.html index 5a60160fb..a2ba6a5e8 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.html +++ b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.html @@ -1,39 +1,5 @@
-
@@ -81,6 +47,9 @@
- 
{{ pollingSourceForm.value | json }}
diff --git a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.ts b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.ts index 4c1ab5649..5317d7923 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source.component.ts @@ -6,6 +6,7 @@ import { MergeKind, PrepareKind, PreprocessKind, + PreprocessStepValue, } from "./add-polling-source-form.types"; import { FinalYamlModalComponent } from "../final-yaml-modal/final-yaml-modal.component"; import { @@ -51,12 +52,16 @@ import { SupportedEvents } from "src/app/dataset-block/metadata-block/components export class AddPollingSourceComponent extends BaseComponent implements OnInit { public currentStep: SetPollingSourceSection = SetPollingSourceSection.FETCH; public steps: typeof SetPollingSourceSection = SetPollingSourceSection; - public isAddPrepareStep = false; - public isAddPreprocessStep = false; + + public isShowPreprocessStep = false; public errorMessage = ""; public history: DatasetHistoryUpdate; public eventYamlByHash: MaybeNull; public datasetKind: DatasetKind; + public preprocessStepValue: PreprocessStepValue = { + engine: "", + queries: [], + }; // -------------------------------- private readonly DEFAULT_PREPARE_KIND = PrepareKind.PIPE; @@ -81,11 +86,6 @@ export class AddPollingSourceComponent extends BaseComponent implements OnInit { read: this.fb.group({ kind: [this.READ_DEFAULT_KIND], }), - preprocess: this.fb.group({ - kind: [this.DEFAULT_PREPROCESS_KIND], - engine: [], - queries: this.fb.array([]), - }), merge: this.fb.group({ kind: [this.MERGE_DEFAULT_KIND], }), @@ -109,38 +109,6 @@ export class AddPollingSourceComponent extends BaseComponent implements OnInit { ) as FormGroup; } - // public onCheckedPrepareStep(event: Event): void { - // const input = event.target as HTMLInputElement; - // if (input.checked) { - // this.pollingSourceForm.addControl( - // SetPollingSourceSection.PREPARE, - // this.fb.group({ - // kind: this.DEFAULT_PREPARE_KIND, - // }), - // ); - // } else { - // this.pollingSourceForm.removeControl( - // SetPollingSourceSection.PREPARE, - // ); - // } - // } - - // public onCheckedPreprocessStep(event: Event): void { - // const input = event.target as HTMLInputElement; - // if (input.checked) { - // this.pollingSourceForm.addControl( - // SetPollingSourceSection.PREPROCESS, - // this.fb.group({ - // kind: this.DEFAULT_PREPROCESS_KIND, - // }), - // ); - // } else { - // this.pollingSourceForm.removeControl( - // SetPollingSourceSection.PREPROCESS, - // ); - // } - // } - constructor( private fb: FormBuilder, private createDatasetService: AppDatasetCreateService, @@ -194,6 +162,9 @@ export class AddPollingSourceComponent extends BaseComponent implements OnInit { SetPollingSource, "__typename" >, + this.isShowPreprocessStep + ? this.preprocessStepValue + : null, ), ) .subscribe(), @@ -224,11 +195,15 @@ export class AddPollingSourceComponent extends BaseComponent implements OnInit { SetPollingSource, "__typename" >, + this.isShowPreprocessStep ? this.preprocessStepValue : null, ); (modalRef.componentInstance as FinalYamlModalComponent).datasetInfo = this.getDatasetInfoFromUrl(); } + public onShowPreprcessStep(showPreprocessStep: boolean): void { + this.isShowPreprocessStep = showPreprocessStep; + } private getDatasetKind(): void { this.trackSubscription( this.editService.onKindChanges.subscribe((kind: DatasetKind) => { diff --git a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.html b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.html index 952b567fa..8b3fd1be8 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.html +++ b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.html @@ -5,24 +5,24 @@

Preprocess

- +
diff --git a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.ts b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.ts index ac00d4bde..3c88ed631 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/add-polling-source/steps/preprocess-step/preprocess-step.component.ts @@ -1,24 +1,22 @@ import { ChangeDetectionStrategy, Component, + EventEmitter, Input, OnInit, + Output, } from "@angular/core"; -import { - ControlContainer, - FormArray, - FormBuilder, - FormGroup, - FormGroupDirective, -} from "@angular/forms"; -import { SetPollingSourceSection } from "src/app/shared/shared.types"; +import { FormGroup } from "@angular/forms"; import { EditFormType, - PreprocessKind, + PreprocessStepValue, } from "../../add-polling-source-form.types"; import { MaybeNull } from "src/app/common/app.types"; import { EditPollingSourceService } from "../../edit-polling-source.service"; -import { SqlQueryStep } from "src/app/api/kamu.graphql.interface"; +import { ActivatedRoute, ParamMap } from "@angular/router"; +import { requireValue } from "src/app/common/app.helpers"; +import { DatasetInfo } from "src/app/interface/navigation.interface"; +import ProjectLinks from "src/app/project-links"; @Component({ selector: "app-preprocess-step", @@ -27,17 +25,16 @@ import { SqlQueryStep } from "src/app/api/kamu.graphql.interface"; changeDetection: ChangeDetectionStrategy.OnPush, }) export class PreprocessStepComponent implements OnInit { - public isAddPreprocessStep = false; + @Input() public isShowPreprocessStep: boolean; @Input() public pollingSourceForm: FormGroup; @Input() public eventYamlByHash: MaybeNull = null; - public selectedEngine: string; + @Input() public preprocessValue: PreprocessStepValue; + @Output() public showPreprcessStepEmitter = new EventEmitter(); public setPollingSourceEvent: MaybeNull = null; - public queries: Omit[] = []; - private readonly DEFAULT_PREPROCESS_KIND = PreprocessKind.SQL; constructor( - private fb: FormBuilder, private editService: EditPollingSourceService, + private activatedRoute: ActivatedRoute, ) {} ngOnInit(): void { @@ -45,69 +42,59 @@ export class PreprocessStepComponent implements OnInit { this.setPollingSourceEvent = this.editService.parseEventFromYaml( this.eventYamlByHash, ); - if (this.setPollingSourceEvent.preprocess?.engine) { - this.isAddPreprocessStep = true; - this.initDefaultQueriesSection( - this.setPollingSourceEvent.preprocess.query, - ); - this.preprocessForm.patchValue({ - engine: this.setPollingSourceEvent.preprocess.engine, - }); - - if (this.preprocessQueries.length == 0) { - this.preprocessQueries.push( - this.fb.group({ - alias: "", - query: this.setPollingSourceEvent.preprocess.query, - }), - ); - } + if (this.setPollingSourceEvent.preprocess) { + this.showPreprcessStepEmitter.emit(true); + this.initExistingQueries(); } else { this.initDefaultQueriesSection(); } } } - public get preprocessForm(): FormGroup { - return this.pollingSourceForm.get( - SetPollingSourceSection.PREPROCESS, - ) as FormGroup; + public onSelectEngine(engine: string): void { + this.preprocessValue.engine = engine; } - public get preprocessQueries(): FormArray { - return this.pollingSourceForm.get("preprocess.queries") as FormArray; + public getDatasetInfoFromUrl(): DatasetInfo { + const paramMap: ParamMap = this.activatedRoute.snapshot.paramMap; + return { + accountName: requireValue( + paramMap.get(ProjectLinks.URL_PARAM_ACCOUNT_NAME), + ), + datasetName: requireValue( + paramMap.get(ProjectLinks.URL_PARAM_DATASET_NAME), + ), + }; } public onCheckedPreprocessStep(event: Event): void { const input = event.target as HTMLInputElement; if (input.checked) { - this.pollingSourceForm.addControl( - SetPollingSourceSection.PREPROCESS, - this.fb.group({ - kind: this.DEFAULT_PREPROCESS_KIND, - engine: "", - }), - ); - if (this.setPollingSourceEvent?.preprocess) { - this.preprocessForm.patchValue({ - engine: this.setPollingSourceEvent.preprocess.engine, - }); - } + this.showPreprcessStepEmitter.emit(true); } else { - this.pollingSourceForm.removeControl( - SetPollingSourceSection.PREPROCESS, - ); + this.showPreprcessStepEmitter.emit(false); } } - public onSelectEngine(engine: string): void { - this.selectedEngine = engine.toUpperCase(); - this.preprocessForm.patchValue({ - engine: engine.toLowerCase(), - }); + private initDefaultQueriesSection(query = ""): void { + if (!this.preprocessValue.queries.length) { + this.preprocessValue.queries.push({ + alias: this.getDatasetInfoFromUrl().datasetName, + query, + }); + } } - private initDefaultQueriesSection(query = ""): void { - this.queries = [...this.queries, { alias: "", query }]; + private initExistingQueries(): void { + if (this.preprocessValue.queries.length === 0) { + if (this.setPollingSourceEvent?.preprocess?.query) { + this.initDefaultQueriesSection( + this.setPollingSourceEvent.preprocess.query, + ); + } else if (this.setPollingSourceEvent?.preprocess?.queries.length) { + this.preprocessValue.queries = + this.setPollingSourceEvent.preprocess.queries; + } + } } } diff --git a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.spec.ts b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.spec.ts index cfbd8e158..429649a02 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.spec.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.spec.ts @@ -54,14 +54,14 @@ describe("EngineSectionComponent", () => { flush(); })); - // it("should check init engine and image when currentSetTransformEvent is not null", fakeAsync(() => { - // component.currentSetTransformEvent = mockCurrentSetTransform; - // fixture.detectChanges(); - // component.ngOnInit(); - // tick(); - // expect(component.selectedEngine).toBe( - // mockCurrentSetTransform.transform.engine.toUpperCase(), - // ); - // flush(); - // })); + it("should check init engine and image when currentSetTransformEvent is not null", fakeAsync(() => { + // component.currentSetTransformEvent = mockCurrentSetTransform; + fixture.detectChanges(); + component.ngOnInit(); + tick(); + expect(component.selectedEngine).toBe( + mockCurrentSetTransform.transform.engine.toUpperCase(), + ); + flush(); + })); }); diff --git a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.ts b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.ts index ebe107132..96ecbab75 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/engine-section/engine-section.component.ts @@ -7,11 +7,6 @@ import { OnInit, Output, } from "@angular/core"; -import { - ControlContainer, - FormGroup, - FormGroupDirective, -} from "@angular/forms"; import { EngineDesc, EnginesQuery, @@ -62,9 +57,14 @@ export class EngineSectionComponent extends BaseComponent implements OnInit { this.trackSubscription( this.engineService.engines().subscribe((result: EnginesQuery) => { this.knownEngines = result.data.knownEngines; - this.selectedEngine = this.knownEngines[0].name.toUpperCase(); - this.selectedImage = this.knownEngines[0].latestImage; - this.initCurrentEngine(); + if (!this.selectedEngine) { + this.selectedEngine = + this.knownEngines[0].name.toUpperCase(); + this.selectedImage = this.knownEngines[0].latestImage; + this.initCurrentEngine(); + } else { + this.onSelectType(); + } this.onEmitSelectedEngine.emit(this.selectedEngine); this.cdr.detectChanges(); }), diff --git a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/queries-section/queries-section.component.ts b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/queries-section/queries-section.component.ts index f6affe13c..2242d73bf 100644 --- a/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/queries-section/queries-section.component.ts +++ b/src/app/dataset-view/additional-components/metadata-component/components/set-transform/components/queries-section/queries-section.component.ts @@ -1,15 +1,8 @@ -import { - ChangeDetectionStrategy, - Component, - Input, - OnDestroy, -} from "@angular/core"; +import { ChangeDetectionStrategy, Component, Input } from "@angular/core"; import { SqlQueryStep } from "src/app/api/kamu.graphql.interface"; import * as monaco from "monaco-editor"; import { ViewportScroller } from "@angular/common"; import { sqlEditorOptions } from "src/app/dataset-block/metadata-block/components/event-details/config-editor.events"; -import { MaybeNull } from "src/app/common/app.types"; -import { FormArray, FormControl, FormGroup } from "@angular/forms"; @Component({ selector: "app-queries-section", @@ -19,7 +12,6 @@ import { FormArray, FormControl, FormGroup } from "@angular/forms"; }) export class QueriesSectionComponent { @Input() public queries: Omit[]; - @Input() public preprocessQueries?: MaybeNull; public readonly sqlEditorOptions: monaco.editor.IStandaloneEditorConstructionOptions = sqlEditorOptions; @@ -42,13 +34,6 @@ export class QueriesSectionComponent { alias: "", query: "", }); - this.preprocessQueries?.insert( - 0, - new FormGroup({ - alias: new FormControl(this.queries[0].alias), - query: new FormControl(this.queries[0].query), - }), - ); this.scroll.scrollToPosition([0, 0]); } diff --git a/src/app/services/templates-yaml-events.service.ts b/src/app/services/templates-yaml-events.service.ts index 653967a27..3f19f27e2 100644 --- a/src/app/services/templates-yaml-events.service.ts +++ b/src/app/services/templates-yaml-events.service.ts @@ -6,6 +6,10 @@ import { import { Injectable } from "@angular/core"; import { MaybeNull } from "../common/app.types"; import { stringify } from "yaml"; +import { + PreprocessKind, + PreprocessStepValue, +} from "../dataset-view/additional-components/metadata-component/components/add-polling-source/add-polling-source-form.types"; @Injectable({ providedIn: "root", @@ -52,11 +56,25 @@ export class TemplatesYamlEventsService { public buildYamlSetPollingSourceEvent( params: Omit, + preprocessStepValue: MaybeNull, ): string { this.initialTemplate.content = { kind: "setPollingSource", ...params, }; + if ( + preprocessStepValue?.queries.length && + preprocessStepValue.queries[0].query + ) { + this.initialTemplate.content = { + ...this.initialTemplate.content, + preprocess: { + kind: PreprocessKind.SQL, + engine: preprocessStepValue.engine.toLowerCase(), + queries: preprocessStepValue.queries, + }, + }; + } return stringify(this.initialTemplate); }