From dcb6f2983a26e2fc2043fcfab0a061f554e6aa06 Mon Sep 17 00:00:00 2001
From: Vadim Ogievetsky <vadimon@gmail.com>
Date: Wed, 15 May 2019 20:49:22 -0700
Subject: [PATCH 1/4] add ability to submit 'other' task

---
 web-console/src/console-application.tsx  |  7 +++++--
 web-console/src/views/load-data-view.tsx | 17 ++++++++++++++---
 web-console/src/views/tasks-view.tsx     |  5 +++--
 3 files changed, 22 insertions(+), 7 deletions(-)

diff --git a/web-console/src/console-application.tsx b/web-console/src/console-application.tsx
index 4f10977d90d7..7be59d67911f 100644
--- a/web-console/src/console-application.tsx
+++ b/web-console/src/console-application.tsx
@@ -102,6 +102,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
 
   private loadDataViewSeed: LoadDataViewSeed | null;
   private taskId: string | null;
+  private openModal: string | null;
   private datasource: string | null;
   private onlyUnavailable: boolean | null;
   private initSql: string | null;
@@ -152,6 +153,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
     setTimeout(() => {
       this.loadDataViewSeed = null;
       this.taskId = null;
+      this.openModal = null;
       this.datasource = null;
       this.onlyUnavailable = null;
       this.initSql = null;
@@ -165,8 +167,9 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
     this.resetInitialsWithDelay();
   }
 
-  private goToTask = (taskId: string | null) => {
+  private goToTask = (taskId: string | null, openModal: string | null = null) => {
     this.taskId = taskId;
+    this.openModal = openModal;
     window.location.hash = 'tasks';
     this.resetInitialsWithDelay();
   }
@@ -224,7 +227,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
 
   private wrappedTasksView = () => {
     const { noSqlMode } = this.state;
-    return this.wrapInViewContainer('tasks', <TasksView taskId={this.taskId} goToSql={this.goToSql} goToMiddleManager={this.goToMiddleManager} goToLoadDataView={this.goToLoadDataView} noSqlMode={noSqlMode}/>, true);
+    return this.wrapInViewContainer('tasks', <TasksView taskId={this.taskId} openModal={this.openModal} goToSql={this.goToSql} goToMiddleManager={this.goToMiddleManager} goToLoadDataView={this.goToLoadDataView} noSqlMode={noSqlMode}/>, true);
   }
 
   private wrappedServersView = () => {
diff --git a/web-console/src/views/load-data-view.tsx b/web-console/src/views/load-data-view.tsx
index 22a0dbb6ab7d..44d72f79edfa 100644
--- a/web-console/src/views/load-data-view.tsx
+++ b/web-console/src/views/load-data-view.tsx
@@ -137,7 +137,7 @@ const VIEW_TITLE: Record<Stage, string> = {
 
 export interface LoadDataViewProps extends React.Props<any> {
   seed: LoadDataViewSeed | null;
-  goToTask: (taskId: string | null) => void;
+  goToTask: (taskId: string | null, openModal?: string | null) => void;
 }
 
 export interface LoadDataViewState {
@@ -370,6 +370,7 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
   }
 
   renderInitStage() {
+    const { goToTask } = this.props;
     const showStreaming = false;
 
     return <>
@@ -378,8 +379,10 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
       </div>
 
       <Callout intent={Intent.SUCCESS} icon={IconNames.INFO_SIGN}>
-        Welcome to the Druid data loader.
-        This project is under active development and we plan to support many other sources of raw data, including stream hubs such as Apache Kafka and AWS Kinesis, in the next few releases.
+        Welcome to the Apache Druid graphical data loader.
+        This feature is under active development and currently only supports Druid's native batch ingestion.
+        We plan to continue building this out, including support for Druid's Apache Kafka, Apache Hadoop, and AWS Kinesis based ingestion methods, over the next few releases.
+        Until then, you can load from these and any other Druid ingestion source by clicking on <Code>Other</Code>.
       </Callout>
 
       {
@@ -402,6 +405,14 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
           <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'local' })}>Local disk</Card>
         </div>
       </div>
+
+      <div className="section">
+        <div className="section-title">Raw spec</div>
+        <div className="cards">
+          <Card interactive onClick={() => goToTask(null, 'supervisor')}>Other (streaming)</Card>
+          <Card interactive onClick={() => goToTask(null, 'task')}>Other (batch)</Card>
+        </div>
+      </div>
     </>;
   }
 
diff --git a/web-console/src/views/tasks-view.tsx b/web-console/src/views/tasks-view.tsx
index 8acee1002803..d75ebd8e940b 100644
--- a/web-console/src/views/tasks-view.tsx
+++ b/web-console/src/views/tasks-view.tsx
@@ -49,6 +49,7 @@ const taskTableColumns: string[] = ['Task ID', 'Type', 'Datasource', 'Created ti
 
 export interface TasksViewProps extends React.Props<any> {
   taskId: string | null;
+  openModal: string | null;
   goToSql: (initSql: string) => void;
   goToMiddleManager: (middleManager: string) => void;
   goToLoadDataView: () => void;
@@ -139,8 +140,8 @@ export class TasksView extends React.Component<TasksViewProps, TasksViewState> {
 
       killTaskId: null,
 
-      supervisorSpecDialogOpen: false,
-      taskSpecDialogOpen: false,
+      supervisorSpecDialogOpen: props.openModal === 'supervisor',
+      taskSpecDialogOpen: props.openModal === 'task',
       initSpec: null,
       alertErrorMsg: null,
 

From 1835654bd4ae3e25d05c8662335f529e6219c958 Mon Sep 17 00:00:00 2001
From: Vadim Ogievetsky <vadimon@gmail.com>
Date: Wed, 15 May 2019 21:56:49 -0700
Subject: [PATCH 2/4] copy changes, fix sort

---
 web-console/src/views/load-data-view.tsx | 22 ++++++++++++++---
 web-console/src/views/tasks-view.tsx     | 30 ++++++++++++------------
 2 files changed, 34 insertions(+), 18 deletions(-)

diff --git a/web-console/src/views/load-data-view.tsx b/web-console/src/views/load-data-view.tsx
index 44d72f79edfa..fc520e416981 100644
--- a/web-console/src/views/load-data-view.tsx
+++ b/web-console/src/views/load-data-view.tsx
@@ -1190,6 +1190,22 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
             Click "Preview" to see the result of any specified transforms.
           </p>
         </Callout>
+        {
+          Boolean(transformQueryState.error && transforms.length) &&
+          <FormGroup>
+            <Button
+              icon={IconNames.EDIT}
+              text="Edit last added transform"
+              intent={Intent.PRIMARY}
+              onClick={() => {
+                this.setState({
+                  selectedTransformIndex: transforms.length - 1,
+                  selectedTransform: transforms[transforms.length - 1]
+                });
+              }}
+            />
+          </FormGroup>
+        }
         {this.renderTransformControls()}
         <Button
           text="Preview"
@@ -1740,7 +1756,7 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
               <Switch
                 checked={dimensionMode === 'specific'}
                 onChange={() => this.setState({ newDimensionMode: dimensionMode === 'specific' ? 'auto-detect' : 'specific' })}
-                label="Set dimensions and metrics"
+                label="Explicitly specify dimension list"
               />
               <Popover
                 content={
@@ -1875,8 +1891,8 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
       <p>
         {
           autoDetect ?
-          'Are you sure you don’t want to set the dimensions and metrics explicitly?' :
-          'Are you sure you want to set dimensions and metrics explicitly?'
+          `Are you sure you don't want to explicitly specify a dimension list?` :
+          `Are you sure you want to explicitly specify a dimension list?`
         }
       </p>
       <p>
diff --git a/web-console/src/views/tasks-view.tsx b/web-console/src/views/tasks-view.tsx
index d75ebd8e940b..0b757b1373e5 100644
--- a/web-console/src/views/tasks-view.tsx
+++ b/web-console/src/views/tasks-view.tsx
@@ -118,7 +118,7 @@ export class TasksView extends React.Component<TasksViewProps, TasksViewState> {
   private taskQueryManager: QueryManager<string, TaskQueryResultRow[]>;
   private supervisorTableColumnSelectionHandler: TableColumnSelectionHandler;
   private taskTableColumnSelectionHandler: TableColumnSelectionHandler;
-  static statusRanking = {RUNNING: 4, PENDING: 3, WAITING: 2, SUCCESS: 1, FAILED: 1};
+  static statusRanking: Record<string, number> = {RUNNING: 4, PENDING: 3, WAITING: 2, SUCCESS: 1, FAILED: 1};
 
   constructor(props: TasksViewProps, context: any) {
     super(props, context);
@@ -601,7 +601,7 @@ ORDER BY "rank" DESC, "created_time" DESC`);
             Header: 'Status',
             id: 'status',
             width: 110,
-            accessor: (row) => { return {status: row.status, created_time: row.created_time}; },
+            accessor: row => ({ status: row.status, created_time: row.created_time, toString: () => row.status }),
             Cell: row => {
               if (row.aggregated) return '';
               const { status, location } = row.original;
@@ -618,20 +618,20 @@ ORDER BY "rank" DESC, "created_time" DESC`);
                 {errorMsg && <a onClick={() => this.setState({ alertErrorMsg: errorMsg })} title={errorMsg}>&nbsp;?</a>}
               </span>;
             },
-            PivotValue: (opt) => {
-              const { subRows, value } = opt;
-              if (!subRows || !subRows.length) return '';
-              return `${subRows[0]._original['status']} (${subRows.length})`;
-            },
-            Aggregated: (opt: any) => {
-              const { subRows, column } = opt;
-              const previewValues = subRows.filter((d: any) => typeof d[column.id] !== 'undefined').map((row: any) => row._original[column.id]);
-              const previewCount = countBy(previewValues);
-              return <span>{Object.keys(previewCount).sort().map(v => `${v} (${previewCount[v]})`).join(', ')}</span>;
-            },
             sortMethod: (d1, d2) => {
-              const statusRanking: any = TasksView.statusRanking;
-              return statusRanking[d1.status] - statusRanking[d2.status] || d1.created_time.localeCompare(d2.created_time);
+              const typeofD1 = typeof d1;
+              const typeofD2 = typeof d2;
+              if (typeofD1 !== typeofD2) return 0;
+              switch (typeofD1) {
+                case 'string':
+                  return TasksView.statusRanking[d1] - TasksView.statusRanking[d2];
+
+                case 'object':
+                  return TasksView.statusRanking[d1.status] - TasksView.statusRanking[d2.status] || d1.created_time.localeCompare(d2.created_time);
+
+                default:
+                  return 0;
+              }
             },
             filterMethod: (filter: Filter, row: any) => {
               return booleanCustomTableFilter(filter, row.status.status);

From aab26b102d8f29392701288828285d0a1ce028a5 Mon Sep 17 00:00:00 2001
From: Vadim Ogievetsky <vadimon@gmail.com>
Date: Wed, 15 May 2019 22:08:34 -0700
Subject: [PATCH 3/4] lets call it dialog

---
 web-console/src/console-application.tsx  | 10 +++++-----
 web-console/src/views/load-data-view.tsx |  2 +-
 web-console/src/views/tasks-view.tsx     |  6 +++---
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/web-console/src/console-application.tsx b/web-console/src/console-application.tsx
index 7be59d67911f..58763b2f47c3 100644
--- a/web-console/src/console-application.tsx
+++ b/web-console/src/console-application.tsx
@@ -102,7 +102,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
 
   private loadDataViewSeed: LoadDataViewSeed | null;
   private taskId: string | null;
-  private openModal: string | null;
+  private openDialog: string | null;
   private datasource: string | null;
   private onlyUnavailable: boolean | null;
   private initSql: string | null;
@@ -153,7 +153,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
     setTimeout(() => {
       this.loadDataViewSeed = null;
       this.taskId = null;
-      this.openModal = null;
+      this.openDialog = null;
       this.datasource = null;
       this.onlyUnavailable = null;
       this.initSql = null;
@@ -167,9 +167,9 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
     this.resetInitialsWithDelay();
   }
 
-  private goToTask = (taskId: string | null, openModal: string | null = null) => {
+  private goToTask = (taskId: string | null, openDialog: string | null = null) => {
     this.taskId = taskId;
-    this.openModal = openModal;
+    this.openDialog = openDialog;
     window.location.hash = 'tasks';
     this.resetInitialsWithDelay();
   }
@@ -227,7 +227,7 @@ export class ConsoleApplication extends React.Component<ConsoleApplicationProps,
 
   private wrappedTasksView = () => {
     const { noSqlMode } = this.state;
-    return this.wrapInViewContainer('tasks', <TasksView taskId={this.taskId} openModal={this.openModal} goToSql={this.goToSql} goToMiddleManager={this.goToMiddleManager} goToLoadDataView={this.goToLoadDataView} noSqlMode={noSqlMode}/>, true);
+    return this.wrapInViewContainer('tasks', <TasksView taskId={this.taskId} openDialog={this.openDialog} goToSql={this.goToSql} goToMiddleManager={this.goToMiddleManager} goToLoadDataView={this.goToLoadDataView} noSqlMode={noSqlMode}/>, true);
   }
 
   private wrappedServersView = () => {
diff --git a/web-console/src/views/load-data-view.tsx b/web-console/src/views/load-data-view.tsx
index fc520e416981..2fd5a50ee54d 100644
--- a/web-console/src/views/load-data-view.tsx
+++ b/web-console/src/views/load-data-view.tsx
@@ -137,7 +137,7 @@ const VIEW_TITLE: Record<Stage, string> = {
 
 export interface LoadDataViewProps extends React.Props<any> {
   seed: LoadDataViewSeed | null;
-  goToTask: (taskId: string | null, openModal?: string | null) => void;
+  goToTask: (taskId: string | null, openDialog?: string | null) => void;
 }
 
 export interface LoadDataViewState {
diff --git a/web-console/src/views/tasks-view.tsx b/web-console/src/views/tasks-view.tsx
index 0b757b1373e5..6aee82055743 100644
--- a/web-console/src/views/tasks-view.tsx
+++ b/web-console/src/views/tasks-view.tsx
@@ -49,7 +49,7 @@ const taskTableColumns: string[] = ['Task ID', 'Type', 'Datasource', 'Created ti
 
 export interface TasksViewProps extends React.Props<any> {
   taskId: string | null;
-  openModal: string | null;
+  openDialog: string | null;
   goToSql: (initSql: string) => void;
   goToMiddleManager: (middleManager: string) => void;
   goToLoadDataView: () => void;
@@ -140,8 +140,8 @@ export class TasksView extends React.Component<TasksViewProps, TasksViewState> {
 
       killTaskId: null,
 
-      supervisorSpecDialogOpen: props.openModal === 'supervisor',
-      taskSpecDialogOpen: props.openModal === 'task',
+      supervisorSpecDialogOpen: props.openDialog === 'supervisor',
+      taskSpecDialogOpen: props.openDialog === 'task',
       initSpec: null,
       alertErrorMsg: null,
 

From 9695fd6d5671d6f5403aaf941eaa3a80844eeb1a Mon Sep 17 00:00:00 2001
From: Vadim Ogievetsky <vadimon@gmail.com>
Date: Thu, 16 May 2019 16:56:05 -0700
Subject: [PATCH 4/4] update name to Google Cloud Storage

---
 web-console/src/views/load-data-view.scss | 1 +
 web-console/src/views/load-data-view.tsx  | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/web-console/src/views/load-data-view.scss b/web-console/src/views/load-data-view.scss
index 050672d27c91..5e08831de66e 100644
--- a/web-console/src/views/load-data-view.scss
+++ b/web-console/src/views/load-data-view.scss
@@ -46,6 +46,7 @@
     .cards {
       .bp3-card {
         display: inline-block;
+        vertical-align: top;
         width: 250px;
         height: 140px;
         margin-right: 15px;
diff --git a/web-console/src/views/load-data-view.tsx b/web-console/src/views/load-data-view.tsx
index 2fd5a50ee54d..bbd9e76857d1 100644
--- a/web-console/src/views/load-data-view.tsx
+++ b/web-console/src/views/load-data-view.tsx
@@ -401,7 +401,7 @@ export class LoadDataView extends React.Component<LoadDataViewProps, LoadDataVie
         <div className="cards">
           <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'http' })}>HTTP(s)</Card>
           <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'static-s3' })}>AWS S3</Card>
-          <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'static-google-blobstore' })}>Google Blobstore</Card>
+          <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'static-google-blobstore' })}>Google Cloud Storage</Card>
           <Card interactive onClick={() => this.initWith({ type: 'index_parallel', firehoseType: 'local' })}>Local disk</Card>
         </div>
       </div>