Edit Dashboard title and Slice title in place (#2940)

* Edit Dashboard title and Slice title in place

Add EditableTitle component into Dashboard and Explore view to support edit title inline.

superset/assets/javascripts/dashboard/components/Header.jsx

@@ -2,6 +2,7 @@ import React from 'react';
 import PropTypes from 'prop-types';
 
 import Controls from './Controls';
+import EditableTitle from '../../components/EditableTitle';
 
 const propTypes = {
   dashboard: PropTypes.object,
@@ -14,14 +15,22 @@ class Header extends React.PureComponent {
     super(props);
     this.state = {
     };
+    this.handleSaveTitle = this.handleSaveTitle.bind(this);
+  }
+  handleSaveTitle(title) {
+    this.props.dashboard.updateDashboardTitle(title);
   }
   render() {
     const dashboard = this.props.dashboard;
     return (
       <div className="title">
         <div className="pull-left">
-          <h1>
-            {dashboard.dashboard_title} &nbsp;
+          <h1 className="outer-container">
+            <EditableTitle
+              title={dashboard.dashboard_title}
+              canEdit={dashboard.dash_save_perm}
+              onSaveTitle={this.handleSaveTitle}
+            />
             <span is class="favstar" class_name="Dashboard" obj_id={dashboard.id} />
           </h1>
         </div>

superset/assets/javascripts/dashboard/components/SaveModal.jsx

@@ -79,6 +79,7 @@ class SaveModal extends React.PureComponent {
       positions,
       css: this.state.css,
       expanded_slices: expandedSlices,
+      dashboard_title: dashboard.dashboard_title,
     };
     let url = null;
     if (saveType === 'overwrite') {