Web-Console: Replace from clause (#8371)

* add replace from

* add failture state

* fix uninential downgrade

* use uppercase for SQL keywords

web-console/README.md

@@ -42,7 +42,7 @@ As part of this repo:
 - `public/` - The compiled destination of the file powering this console
 - `assets/` - The images (and other assets) used within the console
 - `script/` - Some helper bash scripts for running this console
-- `src/` - This directory (together with `lib`) constitutes all the source code for this console 
+- `src/` - This directory (together with `lib`) constitutes all the source code for this console
 
 Generated/copied dynamically
 

web-console/package-lock.json

@@ -4428,9 +4428,9 @@
       "integrity": "sha512-0sYnfUHHMoajaud/i5BHKA12bUxiWEHJ9rxGqVEppFxsEcxef0TZQ5J59lU+UniEBcz/sG5fTESRyS7cOm3tSQ=="
     },
     "druid-query-toolkit": {
-      "version": "0.3.21",
-      "resolved": "https://registry.npmjs.org/druid-query-toolkit/-/druid-query-toolkit-0.3.21.tgz",
-      "integrity": "sha512-CdMLIqXy3pzjZb8iq2n6B8R7jTKVyAuAUdnH6kF0EbP1Fb2XSh8Kg8O88Ew+3ye4R9PY86a4LlXMPW4NSyKX+A==",
+      "version": "0.3.23",
+      "resolved": "https://registry.npmjs.org/druid-query-toolkit/-/druid-query-toolkit-0.3.23.tgz",
+      "integrity": "sha512-6wVAGFw1sjLT9U5f7QNaIKCS0VgUfWLn/X8YWf3YQN3awSCxClzFUQnLKnHeIEb7ot0ca4H6axlb7NpzGqmtzA==",
       "requires": {
         "tslib": "^1.10.0"
       }

web-console/package.json

@@ -61,7 +61,7 @@
     "d3": "^5.10.1",
     "d3-array": "^2.3.1",
     "druid-console": "0.0.2",
-    "druid-query-toolkit": "^0.3.21",
+    "druid-query-toolkit": "^0.3.23",
     "file-saver": "^2.0.2",
     "has-own-prop": "^2.0.0",
     "hjson": "^3.1.2",

web-console/src/views/query-view/__snapshots__/query-view.spec.tsx.snap

@@ -16,6 +16,7 @@ exports[`sql view matches snapshot 1`] = `
     hasGroupBy={[Function]}
     onQueryStringChange={[Function]}
     queryAst={[Function]}
+    replaceFrom={[Function]}
   />
   <t
     customClassName=""

web-console/src/views/query-view/column-tree/column-tree.spec.tsx

@@ -59,6 +59,7 @@ describe('column tree', () => {
           ] as ColumnMetadata[]
         }
         onQueryStringChange={() => {}}
+        replaceFrom={() => null}
       />
     );
 

web-console/src/views/query-view/column-tree/column-tree.tsx

@@ -27,7 +27,15 @@ import {
   Tree,
 } from '@blueprintjs/core';
 import { IconNames } from '@blueprintjs/icons';
-import { Alias, FilterClause, RefExpression, SqlQuery, StringType } from 'druid-query-toolkit';
+import {
+  Alias,
+  FilterClause,
+  RefExpression,
+  refExpressionFactory,
+  SqlQuery,
+  stringFactory,
+  StringType,
+} from 'druid-query-toolkit';
 import React, { ChangeEvent } from 'react';
 
 import { Loader } from '../../../components';
@@ -136,6 +144,7 @@ export interface ColumnTreeProps {
     filter?: FilterClause,
   ) => void;
   filterByRow: (filters: RowFilter[], preferablyRun: boolean) => void;
+  replaceFrom: (table: RefExpression, preferablyRun: boolean) => void;
   hasGroupBy: () => boolean;
   queryAst: () => SqlQuery | undefined;
   clear: (column: string, preferablyRun: boolean) => void;
@@ -173,7 +182,7 @@ export class ColumnTree extends React.PureComponent<ColumnTreeProps, ColumnTreeS
                     <Menu>
                       <MenuItem
                         icon={IconNames.FULLSCREEN}
-                        text={`Select ... from ${table}`}
+                        text={`SELECT ... FROM ${table}`}
                         onClick={() => {
                           handleTableClick(
                             schema,
@@ -198,6 +207,24 @@ export class ColumnTree extends React.PureComponent<ColumnTreeProps, ColumnTreeS
                           copyAndAlert(table, `${table} query copied to clipboard`);
                         }}
                       />
+                      <Deferred
+                        content={() => (
+                          <>
+                            {props.queryAst() && (
+                              <MenuItem
+                                icon={IconNames.EXCHANGE}
+                                text={`Replace FROM with: ${table}`}
+                                onClick={() => {
+                                  props.replaceFrom(
+                                    refExpressionFactory(stringFactory(table, `"`)),
+                                    true,
+                                  );
+                                }}
+                              />
+                            )}
+                          </>
+                        )}
+                      />
                     </Menu>
                   }
                 >

web-console/src/views/query-view/query-view.tsx

@@ -574,6 +574,13 @@ export class QueryView extends React.PureComponent<QueryViewProps, QueryViewStat
     this.handleQueryStringChange(modifiedAst.toString(), preferablyRun);
   };
 
+  private replaceFrom = (table: RefExpression, preferablyRun: boolean): void => {
+    const { queryAst } = this.state;
+    if (!queryAst) return;
+    const modifiedAst = queryAst.replaceFrom(table);
+    this.handleQueryStringChange(modifiedAst.toString(), preferablyRun);
+  };
+
   private addAggregateColumn = (
     columnName: string | RefExpression,
     functionName: string,
@@ -698,7 +705,10 @@ export class QueryView extends React.PureComponent<QueryViewProps, QueryViewStat
 
   private getCurrentFilters = () => {
     const { queryAst } = this.state;
-    return queryAst.getCurrentFilters();
+    if (queryAst) {
+      return queryAst.getCurrentFilters();
+    }
+    return [];
   };
 
   render(): JSX.Element {
@@ -730,6 +740,7 @@ export class QueryView extends React.PureComponent<QueryViewProps, QueryViewStat
             defaultSchema={defaultSchema ? defaultSchema : 'druid'}
             defaultTable={defaultTable}
             currentFilters={this.getCurrentFilters}
+            replaceFrom={this.replaceFrom}
           />
         )}
         {this.renderMainArea()}