diff --git a/CHANGELOG.md b/CHANGELOG.md
index e601bccc0..cde73f9a8 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -15,6 +15,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
- 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
- GraphQL code generator tuned to produce string type by default for scalars
+- Fixed bug with disabled state for "Run" button after error.
## [0.8.0] - 2023-08-04
### Added
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..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"
+ [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.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/additional-components/data-component/data-component.ts b/src/app/dataset-view/additional-components/data-component/data-component.ts
index 6f00d587b..e3f252ca2 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.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", () => {
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..bb5d37fe9 100644
--- a/src/assets/styles/var.sass
+++ b/src/assets/styles/var.sass
@@ -144,8 +144,10 @@ $app-color-action-list-item-inline-divider: #d0d7de7a
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