This is an automated email from the ASF dual-hosted git repository.
cwylie pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-druid.git
The following commit(s) were added to refs/heads/master by this push:
new 4ea37e2 Add time taken by last query in SQL view (#7421)
4ea37e2 is described below
commit 4ea37e2614375aea55079eb08bb47487bdfba31b
Author: Qi Shu <shuqi...@gmail.com>
AuthorDate: Wed Apr 10 23:35:47 2019 -0700
Add time taken by last query in SQL view (#7421)
* Add time taken by query
* Fix time to 2 dp; set state in on state change; hide time taken at first
* Refactored code: defined query result interface; more concise shorthand
expression
* Use single quote
---
web-console/src/components/sql-control.scss | 5 +++++
web-console/src/components/sql-control.tsx | 9 ++++++--
web-console/src/views/sql-view.tsx | 35 +++++++++++++++++++++--------
3 files changed, 38 insertions(+), 11 deletions(-)
diff --git a/web-console/src/components/sql-control.scss
b/web-console/src/components/sql-control.scss
index 468e91a..d5e894d 100644
--- a/web-console/src/components/sql-control.scss
+++ b/web-console/src/components/sql-control.scss
@@ -28,11 +28,16 @@
}
.buttons {
+ position: relative;
button{
margin-right: 15px;
}
+ .query-elapsed {
+ position: absolute;
+ right: 10px;
+ }
}
}
diff --git a/web-console/src/components/sql-control.tsx
b/web-console/src/components/sql-control.tsx
index 99c7c43..6b4de1d 100644
--- a/web-console/src/components/sql-control.tsx
+++ b/web-console/src/components/sql-control.tsx
@@ -40,6 +40,7 @@ export interface SqlControlProps extends React.Props<any> {
initSql: string | null;
onRun: (query: string) => void;
onExplain: (query: string) => void;
+ queryElapsed: number | null;
}
export interface SqlControlState {
@@ -166,7 +167,7 @@ export class SqlControl extends
React.Component<SqlControlProps, SqlControlState
}
render() {
- const { onRun, onExplain } = this.props;
+ const { onRun, onExplain, queryElapsed } = this.props;
const { query, autoCompleteOn } = this.state;
const isRune = query.trim().startsWith('{');
@@ -217,7 +218,11 @@ export class SqlControl extends
React.Component<SqlControlProps, SqlControlState
<Button rightIcon={IconNames.CARET_RIGHT} onClick={() => onRun(query)}>
{isRune ? 'Rune' : 'Run'}
</Button>
- {!isRune ? SqlControlPopover : null}
+ {!isRune && SqlControlPopover}
+ {
+ queryElapsed &&
+ <span className={'query-elapsed'}> Last query took {(queryElapsed /
1000).toFixed(2)} seconds</span>
+ }
</div>
</div>;
}
diff --git a/web-console/src/views/sql-view.tsx
b/web-console/src/views/sql-view.tsx
index e8f90d7..53712d9 100644
--- a/web-console/src/views/sql-view.tsx
+++ b/web-console/src/views/sql-view.tsx
@@ -29,7 +29,8 @@ import {
localStorageGet, LocalStorageKeys,
localStorageSet, parseQueryPlan,
queryDruidRune,
- queryDruidSql, QueryManager, SemiJoinQueryExplanation
+ queryDruidSql, QueryManager,
+ SemiJoinQueryExplanation
} from '../utils';
import './sql-view.scss';
@@ -46,11 +47,17 @@ export interface SqlViewState {
explainResult: BasicQueryExplanation | SemiJoinQueryExplanation | string |
null;
loadingExplain: boolean;
explainError: Error | null;
+ queryElapsed: number | null;
+}
+
+interface SqlQueryResult {
+ queryResult: HeaderRows;
+ queryElapsed: number;
}
export class SqlView extends React.Component<SqlViewProps, SqlViewState> {
- private sqlQueryManager: QueryManager<string, HeaderRows>;
+ private sqlQueryManager: QueryManager<string, SqlQueryResult>;
private explainQueryManager: QueryManager<string, any>;
constructor(props: SqlViewProps, context: any) {
@@ -62,34 +69,42 @@ export class SqlView extends React.Component<SqlViewProps,
SqlViewState> {
explainDialogOpen: false,
loadingExplain: false,
explainResult: null,
- explainError: null
+ explainError: null,
+ queryElapsed: null
};
}
componentDidMount(): void {
this.sqlQueryManager = new QueryManager({
processQuery: async (query: string) => {
+ const startTime = new Date();
if (query.trim().startsWith('{')) {
// Secret way to issue a native JSON "rune" query
const runeQuery = Hjson.parse(query);
- return decodeRune(runeQuery, await queryDruidRune(runeQuery));
-
+ const result = await queryDruidRune(runeQuery);
+ return {
+ queryResult: decodeRune(runeQuery, result),
+ queryElapsed: new Date().valueOf() - startTime.valueOf()
+ };
} else {
const result = await queryDruidSql({
query,
resultFormat: 'array',
header: true
});
-
return {
- header: (result && result.length) ? result[0] : [],
- rows: (result && result.length) ? result.slice(1) : []
+ queryResult: {
+ header: (result && result.length) ? result[0] : [],
+ rows: (result && result.length) ? result.slice(1) : []
+ },
+ queryElapsed: new Date().valueOf() - startTime.valueOf()
};
}
},
onStateChange: ({ result, loading, error }) => {
this.setState({
- result,
+ result: result ? result.queryResult : null,
+ queryElapsed: result ? result.queryElapsed : null,
loading,
error
});
@@ -158,6 +173,7 @@ export class SqlView extends React.Component<SqlViewProps,
SqlViewState> {
render() {
const { initSql } = this.props;
+ const { queryElapsed } = this.state;
return <div className="sql-view app-view">
<SqlControl
@@ -167,6 +183,7 @@ export class SqlView extends React.Component<SqlViewProps,
SqlViewState> {
this.sqlQueryManager.runQuery(q);
}}
onExplain={(q: string) => this.getExplain(q)}
+ queryElapsed={queryElapsed}
/>
{this.renderResultTable()}
{this.renderExplainDialog()}
---------------------------------------------------------------------
To unsubscribe, e-mail: commits-unsubscr...@druid.apache.org
For additional commands, e-mail: commits-h...@druid.apache.org
