enable new query button in query create flow (finos#3179)

MauricioUyaguari · May 29, 2024 · 1ab1893 · 1ab1893
1 parent 4221e10
commit 1ab1893
Show file tree

Hide file tree

Showing 3 changed files with 51 additions and 20 deletions.
diff --git a/.changeset/tasty-llamas-care.md b/.changeset/tasty-llamas-care.md
@@ -0,0 +1,5 @@
+---
+'@finos/legend-application-query': patch
+---
+
+enable new query button in query create flow
diff --git a/packages/legend-application-query/src/components/Core_LegendQueryApplicationPlugin.tsx b/packages/legend-application-query/src/components/Core_LegendQueryApplicationPlugin.tsx
@@ -50,6 +50,8 @@ import {
   LEGEND_QUERY_ROUTE_PATTERN,
 } from '../__lib__/LegendQueryNavigation.js';
 import {
+  ActionAlertActionType,
+  ActionAlertType,
   type ApplicationPageEntry,
   type LegendApplicationSetup,
 } from '@finos/legend-application';
@@ -65,9 +67,9 @@ import {
   generateDataSpaceQueryCreatorRoute,
   generateDataSpaceQuerySetupRoute,
 } from '../__lib__/DSL_DataSpace_LegendQueryNavigation.js';
-import type {
-  QueryBuilderHeaderActionConfiguration,
-  QueryBuilderMenuActionConfiguration,
+import {
+  type QueryBuilderHeaderActionConfiguration,
+  type QueryBuilderMenuActionConfiguration,
 } from '@finos/legend-query-builder';
 import {
   ExistingQueryEditorStore,
@@ -426,8 +428,6 @@ export class Core_LegendQueryApplicationPlugin extends LegendQueryApplicationPlu
           ) {
             const editorStore =
               queryBuilderState.workflowState.actionConfig.editorStore;
-            const isExistingQuery =
-              editorStore instanceof ExistingQueryEditorStore;
             const handleNewQuery = (): void => {
               if (editorStore instanceof ExistingQueryEditorStore) {
                 const query = editorStore.query;
@@ -464,24 +464,47 @@ export class Core_LegendQueryApplicationPlugin extends LegendQueryApplicationPlu
                     }
                   }
                 }
+              } else {
+                if (queryBuilderState.changeDetectionState.hasChanged) {
+                  queryBuilderState.applicationStore.alertService.setActionAlertInfo(
+                    {
+                      message:
+                        'Current query will be lost when creating a new query. Do you still want to proceed?',
+                      type: ActionAlertType.CAUTION,
+                      actions: [
+                        {
+                          label: 'Proceed',
+                          type: ActionAlertActionType.PROCEED_WITH_CAUTION,
+                          handler:
+                            queryBuilderState.applicationStore.guardUnhandledError(
+                              async () => queryBuilderState.resetQueryContent(),
+                            ),
+                        },
+                        {
+                          label: 'Cancel',
+                          type: ActionAlertActionType.PROCEED,
+                          default: true,
+                        },
+                      ],
+                    },
+                  );
+                } else {
+                  queryBuilderState.resetQueryContent();
+                }
               }
             };
             return (
-              <>
-                {isExistingQuery && (
-                  <Button
-                    className="query-editor__header__action btn--dark"
-                    disabled={editorStore.isPerformingBlockingAction}
-                    onClick={handleNewQuery}
-                    title="New query"
-                  >
-                    <SaveCurrIcon />
-                    <div className="query-editor__header__action__label">
-                      New Query
-                    </div>
-                  </Button>
-                )}
-              </>
+              <Button
+                className="query-editor__header__action btn--dark"
+                disabled={editorStore.isPerformingBlockingAction}
+                onClick={handleNewQuery}
+                title="New query"
+              >
+                <SaveCurrIcon />
+                <div className="query-editor__header__action__label">
+                  New Query
+                </div>
+              </Button>
             );
           }
           return undefined;

diff --git a/packages/legend-application-query/src/stores/QueryEditorStore.ts b/packages/legend-application-query/src/stores/QueryEditorStore.ts
@@ -525,6 +525,9 @@ export abstract class QueryEditorStore {
       this.queryBuilderState = (yield this.initializeQueryBuilderState(
         stopWatch,
       )) as QueryBuilderState;
+      this.queryBuilderState.changeDetectionState.initialize(
+        this.queryBuilderState.buildQuery(),
+      );
       this.queryLoaderState.initialize(this.queryBuilderState);
       this.initState.pass();
     } catch (error) {