Refactor useQueryExecution & add inline query execution status

client/app/assets/less/redash/query.less

@@ -17,34 +17,6 @@ body.fixed-layout {
   }
 }
 
-.bottom-controller {
-  padding: 10px 15px;
-  background: #fff;
-  display: flex;
-  align-items: center;
-
-  button,
-  div,
-  span {
-    position: relative;
-  }
-
-  div:last-child {
-    flex-grow: 1;
-    text-align: right;
-  }
-
-  &:before {
-    content: "";
-    height: 50px;
-    position: fixed;
-    bottom: 0;
-    width: 100%;
-    pointer-events: none;
-    left: 0;
-  }
-}
-
 .p-b-60 {
   padding-bottom: 60px !important;
 }

client/app/components/EditInPlace.jsx

@@ -33,14 +33,9 @@ export default class EditInPlace extends React.Component {
     this.state = {
       editing: props.defaultEditing,
     };
-    this.inputRef = React.createRef();
   }
 
   componentDidUpdate(_, prevState) {
-    if (this.state.editing && !prevState.editing) {
-      this.inputRef.current.focus();
-    }
-
     if (!this.state.editing && prevState.editing) {
       this.props.onStopEditing();
     }
@@ -90,10 +85,10 @@ export default class EditInPlace extends React.Component {
     const InputComponent = multiline ? Input.TextArea : Input;
     return (
       <InputComponent
-        ref={this.inputRef}
         defaultValue={value}
         onBlur={e => this.stopEditing(e.target.value)}
         onKeyDown={this.handleKeyDown}
+        autoFocus
         {...editorProps}
       />
     );

client/app/components/tags-control/TagsControl.jsx

@@ -34,7 +34,10 @@ export class TagsControl extends React.Component {
   renderEditButton() {
     const tags = map(this.props.tags, trim);
     return (
-      <a className="label label-tag" role="none" onClick={() => this.editTags(tags, this.props.getAvailableTags)}>
+      <a
+        className="label label-tag hidden-xs"
+        role="none"
+        onClick={() => this.editTags(tags, this.props.getAvailableTags)}>
         {tags.length === 0 && (
           <React.Fragment>
             <i className="zmdi zmdi-plus m-r-5" />

client/app/lib/getQueryResultData.js

@@ -0,0 +1,16 @@
+import { get, invoke } from "lodash";
+
+export default function getQueryResultData(queryResult) {
+  return {
+    status: invoke(queryResult, "getStatus") || null,
+    columns: invoke(queryResult, "getColumns") || [],
+    rows: invoke(queryResult, "getData") || [],
+    filters: invoke(queryResult, "getFilters") || [],
+    updatedAt: invoke(queryResult, "getUpdatedAt") || null,
+    retrievedAt: get(queryResult, "query_result.retrieved_at", null),
+    log: invoke(queryResult, "getLog") || [],
+    error: invoke(queryResult, "getError") || null,
+    runtime: invoke(queryResult, "getRuntime") || null,
+    metadata: get(queryResult, "query_result.data.metadata", {}),
+  };
+}

client/app/pages/dashboards/hooks/useDashboard.js

@@ -10,7 +10,7 @@ import TextboxDialog from "@/components/dashboards/TextboxDialog";
 import PermissionsEditorDialog from "@/components/PermissionsEditorDialog";
 import { editableMappingsToParameterMappings, synchronizeWidgetTitles } from "@/components/ParameterMappingInput";
 import ShareDashboardDialog from "../components/ShareDashboardDialog";
-import useFullscreenHandler from "./useFullscreenHandler";
+import useFullscreenHandler from "../../../lib/hooks/useFullscreenHandler";
 import useRefreshRateHandler from "./useRefreshRateHandler";
 import useEditModeHandler from "./useEditModeHandler";