Update Org page to include Dashboards components

influxdata · Feb 7, 2019 · 0df9179 · 0df9179
1 parent 2376491
commit 0df9179
Show file tree

Hide file tree

Showing 10 changed files with 381 additions and 319 deletions.
diff --git a/ui/src/dashboards/components/dashboard_index/Contents.tsx b/ui/src/dashboards/components/dashboard_index/Contents.tsx
@@ -25,6 +25,7 @@ interface Props {
   onEditLabels: (dashboard: Dashboard) => void
   notify: (message: Notification) => void
   searchTerm: string
+  showInlineEdit?: boolean
 }
 
 @ErrorHandling
@@ -41,6 +42,7 @@ export default class DashboardsIndexContents extends Component<Props> {
       onEditLabels,
       searchTerm,
       orgs,
+      showInlineEdit,
     } = this.props
 
     return (
@@ -57,6 +59,7 @@ export default class DashboardsIndexContents extends Component<Props> {
           onUpdateDashboard={onUpdateDashboard}
           onEditLabels={onEditLabels}
           orgs={orgs}
+          showInlineEdit={showInlineEdit}
         />
       </div>
     )

diff --git a/ui/src/dashboards/components/dashboard_index/Table.tsx b/ui/src/dashboards/components/dashboard_index/Table.tsx
@@ -32,6 +32,7 @@ interface Props {
   onSetDefaultDashboard: (dashboardLink: string) => void
   onEditLabels: (dashboard: Dashboard) => void
   orgs: Organization[]
+  showInlineEdit?: boolean
 }
 
 interface DatedDashboard extends Dashboard {
@@ -108,6 +109,7 @@ class DashboardsTable extends PureComponent<Props & WithRouterProps, State> {
       onUpdateDashboard,
       onEditLabels,
       orgs,
+      showInlineEdit,
     } = this.props
 
     const {sortKey, sortDirection} = this.state
@@ -128,6 +130,7 @@ class DashboardsTable extends PureComponent<Props & WithRouterProps, State> {
               onUpdateDashboard={onUpdateDashboard}
               onEditLabels={onEditLabels}
               orgs={orgs}
+              showInlineEdit={showInlineEdit}
             />
           )}
         </SortingHat>

diff --git a/ui/src/dashboards/components/dashboard_index/TableRow.tsx b/ui/src/dashboards/components/dashboard_index/TableRow.tsx
@@ -27,6 +27,7 @@ import {
   UPDATED_AT_TIME_FORMAT,
   DEFAULT_DASHBOARD_NAME,
 } from 'src/dashboards/constants'
+import EditableName from 'src/shared/components/EditableName'
 
 interface Props {
   dashboard: Dashboard
@@ -36,6 +37,7 @@ interface Props {
   onExportDashboard: (dashboard: Dashboard) => void
   onUpdateDashboard: (dashboard: Dashboard) => void
   onEditLabels: (dashboard: Dashboard) => void
+  showInlineEdit?: boolean
 }
 
 export default class DashboardsIndexTableRow extends PureComponent<Props> {
@@ -55,9 +57,7 @@ export default class DashboardsIndexTableRow extends PureComponent<Props> {
               stackChildren={Stack.Columns}
               align={Alignment.Left}
             >
-              <Link className={this.nameClassName} to={`/dashboards/${id}`}>
-                {this.name}
-              </Link>
+              {this.resourceNames}
               {this.labels}
             </ComponentSpacer>
             <EditableDescription
@@ -91,6 +91,28 @@ export default class DashboardsIndexTableRow extends PureComponent<Props> {
     )
   }
 
+  private get resourceNames(): JSX.Element {
+    const {showInlineEdit, dashboard} = this.props
+    if (showInlineEdit) {
+      return (
+        <EditableName
+          onUpdate={this.handleUpdateDashboard}
+          name={dashboard.name}
+          hrefValue={`/dashboards/${dashboard.id}`}
+        />
+      )
+    }
+    return (
+      <Link className={this.nameClassName} to={`/dashboards/${dashboard.id}`}>
+        {this.name}
+      </Link>
+    )
+  }
+
+  private handleUpdateDashboard = (name: string) => {
+    this.props.onUpdateDashboard({...this.props.dashboard, name})
+  }
+
   private get labels(): JSX.Element {
     const {dashboard} = this.props
 

diff --git a/ui/src/dashboards/components/dashboard_index/TableRows.tsx b/ui/src/dashboards/components/dashboard_index/TableRows.tsx
@@ -15,6 +15,7 @@ interface Props {
   onUpdateDashboard: (dashboard: Dashboard) => void
   onEditLabels: (dashboard: Dashboard) => void
   orgs: Organization[]
+  showInlineEdit?: boolean
 }
 
 export default class DashboardsIndexTableRows extends PureComponent<Props> {
@@ -27,6 +28,7 @@ export default class DashboardsIndexTableRows extends PureComponent<Props> {
       onUpdateDashboard,
       onEditLabels,
       orgs,
+      showInlineEdit,
     } = this.props
 
     return dashboards.map(d => (
@@ -39,6 +41,7 @@ export default class DashboardsIndexTableRows extends PureComponent<Props> {
         onUpdateDashboard={onUpdateDashboard}
         onEditLabels={onEditLabels}
         orgs={orgs}
+        showInlineEdit={showInlineEdit}
       />
     ))
   }

diff --git a/ui/src/organizations/components/DashboardList.tsx b/ui/src/organizations/components/DashboardList.tsx
diff --git a/ui/src/organizations/components/DashboardRow.tsx b/ui/src/organizations/components/DashboardRow.tsx