From 28c4ac17f8a3d2572a6413119a987d8d7b850b78 Mon Sep 17 00:00:00 2001 From: Dmitriy Borzenko Date: Wed, 23 Aug 2023 12:45:39 +0300 Subject: [PATCH 1/4] Changed disabled state for 'Run' button. --- .../data-component/data-component.html | 4 ++-- .../data-component/data-component.ts | 14 ++++++-------- src/app/dataset-view/dataset.service.ts | 3 +++ src/assets/styles/var.sass | 4 ++-- 4 files changed, 13 insertions(+), 12 deletions(-) diff --git a/src/app/dataset-view/additional-components/data-component/data-component.html b/src/app/dataset-view/additional-components/data-component/data-component.html index 6a93c0022..fa432d3bc 100644 --- a/src/app/dataset-view/additional-components/data-component/data-component.html +++ b/src/app/dataset-view/additional-components/data-component/data-component.html @@ -91,7 +91,7 @@

Query:

data-test-id="runSqlQueryButton" name="run sql button" (click)="onRunSQLRequest()" - [disabled]="!currentData.length" + [disabled]="!currentData.length&&!sqlErrorMarker" class="sql-run-button rounded-left-2 border-right-0 btnGroup-item btn d-flex justify-content-center align-items-center" > Runplay_arrow @@ -151,7 +151,7 @@

Result:

[dataRows]="currentData || []" > - +

Need diff --git a/src/app/dataset-view/additional-components/data-component/data-component.ts b/src/app/dataset-view/additional-components/data-component/data-component.ts index 1658b7628..ced6945a1 100644 --- a/src/app/dataset-view/additional-components/data-component/data-component.ts +++ b/src/app/dataset-view/additional-components/data-component/data-component.ts @@ -51,6 +51,12 @@ export class DataComponent extends BaseComponent implements OnInit { public ngOnInit(): void { this.trackSubscriptions( + this.appDatasetSubsService.onDatasetDataSqlErrorOccured.subscribe( + (dataSqlErrorUpdate: DataSqlErrorUpdate) => { + this.sqlErrorMarker = dataSqlErrorUpdate.error; + this.cdr.markForCheck(); + }, + ), this.appDatasetSubsService.onDatasetDataChanges.subscribe((dataUpdate: DataUpdate) => { if (dataUpdate.currentVocab?.offsetColumn) { this.offsetColumnName = dataUpdate.currentVocab.offsetColumn; @@ -60,14 +66,6 @@ export class DataComponent extends BaseComponent implements OnInit { this.sqlErrorMarker = null; this.cdr.markForCheck(); }), - this.appDatasetSubsService.onDatasetDataSqlErrorOccured.subscribe( - (dataSqlErrorUpdate: DataSqlErrorUpdate) => { - this.currentData = []; - this.currentSchema = null; - this.sqlErrorMarker = dataSqlErrorUpdate.error; - this.cdr.markForCheck(); - }, - ), ); this.buildSqlRequestCode(); } diff --git a/src/app/dataset-view/dataset.service.ts b/src/app/dataset-view/dataset.service.ts index 01c2adc1b..5a211bdc1 100644 --- a/src/app/dataset-view/dataset.service.ts +++ b/src/app/dataset-view/dataset.service.ts @@ -145,6 +145,9 @@ export class DatasetService { currentVocab: this.currentSetVocab, }; this.appDatasetSubsService.changeDatasetData(dataUpdate); + this.appDatasetSubsService.observeSqlErrorOccurred({ + error: "", + }); } else if (queryResult.errorKind === DataQueryResultErrorKind.InvalidSql) { this.appDatasetSubsService.observeSqlErrorOccurred({ error: queryResult.errorMessage, diff --git a/src/assets/styles/var.sass b/src/assets/styles/var.sass index c2d585b69..71e184768 100644 --- a/src/assets/styles/var.sass +++ b/src/assets/styles/var.sass @@ -137,7 +137,7 @@ $app-color-action-list-item-inline-divider: #d0d7de7a border-radius: 1px position: relative float: left - border-color: $app-color-border-default + border-color: $app-color-border-default!important height: inherit background: $app-aliceBlue &:last-child @@ -245,7 +245,7 @@ $app-color-action-list-item-inline-divider: #d0d7de7a background-color: $app-color-btn-counter-bg .btn:hover, .btn.hover, [open]>.btn background-color: $app-color-btn-hover-bg - border-color: $app-color-btn-hover-border + border-color: $app-color-btn-hover-border !important transition-duration: .1s .SelectMenu-modal position: relative From 54e68fadb88df13bca26f5a100a75d7467bfea1f Mon Sep 17 00:00:00 2001 From: Dmitriy Borzenko Date: Wed, 23 Aug 2023 14:03:23 +0300 Subject: [PATCH 2/4] Fixed unit tests. --- .../data-component/data-component.html | 2 +- .../data-component/data-component.spec.ts | 7 ++++--- src/app/dataset-view/dataset.service.spec.ts | 8 ++------ 3 files changed, 7 insertions(+), 10 deletions(-) diff --git a/src/app/dataset-view/additional-components/data-component/data-component.html b/src/app/dataset-view/additional-components/data-component/data-component.html index fa432d3bc..27345ae22 100644 --- a/src/app/dataset-view/additional-components/data-component/data-component.html +++ b/src/app/dataset-view/additional-components/data-component/data-component.html @@ -91,7 +91,7 @@

Query:

data-test-id="runSqlQueryButton" name="run sql button" (click)="onRunSQLRequest()" - [disabled]="!currentData.length&&!sqlErrorMarker" + [disabled]="!currentData.length && !sqlErrorMarker" class="sql-run-button rounded-left-2 border-right-0 btnGroup-item btn d-flex justify-content-center align-items-center" > Runplay_arrow diff --git a/src/app/dataset-view/additional-components/data-component/data-component.spec.ts b/src/app/dataset-view/additional-components/data-component/data-component.spec.ts index eea157321..f4c316380 100644 --- a/src/app/dataset-view/additional-components/data-component/data-component.spec.ts +++ b/src/app/dataset-view/additional-components/data-component/data-component.spec.ts @@ -4,7 +4,7 @@ import { ComponentFixture, TestBed } from "@angular/core/testing"; import { MatIconModule } from "@angular/material/icon"; import { MatMenuModule } from "@angular/material/menu"; import { DataComponent } from "./data-component"; -import { emitClickOnElementByDataTestId } from "src/app/common/base-test.helpers.spec"; +import { emitClickOnElementByDataTestId, findElementByDataTestId } from "src/app/common/base-test.helpers.spec"; import { AppDatasetSubscriptionsService } from "../../dataset.subscriptions.service"; import { mockDataUpdate, mockSqlErrorUpdate } from "../data-tabs.mock"; import { first } from "rxjs/operators"; @@ -75,11 +75,12 @@ describe("DataComponent", () => { }); it("should check invalid SQL result update", () => { - fixture.detectChanges(); + const runSqlButton = findElementByDataTestId(fixture, "runSqlQueryButton") as HTMLButtonElement; appDatasetSubsService.observeSqlErrorOccurred(mockSqlErrorUpdate); - + fixture.detectChanges(); expect(component.currentData).toEqual([]); expect(component.currentSchema).toEqual(null); expect(component.sqlErrorMarker).toBe(mockSqlErrorUpdate.error); + expect(runSqlButton.disabled).toBe(false); }); }); diff --git a/src/app/dataset-view/dataset.service.spec.ts b/src/app/dataset-view/dataset.service.spec.ts index fcd1d3f46..79970b49c 100644 --- a/src/app/dataset-view/dataset.service.spec.ts +++ b/src/app/dataset-view/dataset.service.spec.ts @@ -203,16 +203,12 @@ describe("AppDatasetService", () => { /* Intentionally blank */ }); - const subscriptionErrorChanges$ = appDatasetSubsService.onDatasetDataSqlErrorOccured - .pipe(first()) - .subscribe(() => { - /* Intentionally blank */ - }); + const subscriptionErrorChangesSpy = spyOn(appDatasetSubsService, "observeSqlErrorOccurred"); service.requestDatasetDataSqlRun(query, limit).subscribe(); expect(subscriptionDataChanges$.closed).toBeTrue(); - expect(subscriptionErrorChanges$.closed).toBeFalse(); + expect(subscriptionErrorChangesSpy).toHaveBeenCalledWith({ error: "" }); }); it("should check get SQL query data from api with invalid SQL", () => { From 078d481744768276b0a5d87196a4c13b0746fb21 Mon Sep 17 00:00:00 2001 From: Dmitriy Borzenko Date: Wed, 23 Aug 2023 16:40:26 +0300 Subject: [PATCH 3/4] Fixed css rules. --- src/assets/styles/var.sass | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/assets/styles/var.sass b/src/assets/styles/var.sass index 71e184768..bb5d37fe9 100644 --- a/src/assets/styles/var.sass +++ b/src/assets/styles/var.sass @@ -137,15 +137,17 @@ $app-color-action-list-item-inline-divider: #d0d7de7a border-radius: 1px position: relative float: left - border-color: $app-color-border-default!important + border-color: $app-color-border-default height: inherit background: $app-aliceBlue &:last-child border-right-width: 1px border-top-right-radius: 6px border-bottom-right-radius: 6px - & span + span font-size: 12px + &:hover + border-color: $app-color-border-default .BtnGroup-item:first-child border-top-left-radius: 6px border-bottom-left-radius: 6px @@ -245,7 +247,7 @@ $app-color-action-list-item-inline-divider: #d0d7de7a background-color: $app-color-btn-counter-bg .btn:hover, .btn.hover, [open]>.btn background-color: $app-color-btn-hover-bg - border-color: $app-color-btn-hover-border !important + border-color: $app-color-btn-hover-border transition-duration: .1s .SelectMenu-modal position: relative From 53cd70e7bd283ffc9add3b0ec50be735ea124fa6 Mon Sep 17 00:00:00 2001 From: Dmitriy Borzenko Date: Wed, 23 Aug 2023 20:42:18 +0300 Subject: [PATCH 4/4] Changed CHANGLOG.md --- CHANGELOG.md | 2 ++ 1 file changed, 2 insertions(+) diff --git a/CHANGELOG.md b/CHANGELOG.md index 1c5374bd9..a7cb378b3 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -14,6 +14,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0 - Upgraded to Angular 14.3 - Switched to different Angular wrapper for Monaco editor (ngx-monaco-editor-v2) - Selected library updates/downgrades to align with Angular 14.3 and Node.JS 16.x +### Fixed +- Fixed bug with disabled state for "Run" button after error. ## [0.8.0] - 2023-08-04 ### Added