diff --git a/CHANGELOG.md b/CHANGELOG.md index 6cbfb91ebe1..cc43fc5722a 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -17,6 +17,8 @@ 1. [11522](https://github.com/influxdata/influxdb/pull/11522): Add plugin information step to allow for config naming and configure one plugin at a time ### Bug Fixes +1. [11758](https://github.com/influxdata/influxdb/pull/11758): Update Dashboards tab on Org page to look like Dashboards Page +## Bug Fixes 1. [11678](https://github.com/influxdata/influxdb/pull/11678): Update the System Telegraf Plugin bundle to include the swap plugin 1. [11722](https://github.com/influxdata/influxdb/pull/11722): Revert behavior allowing users to create authorizations on behalf of another user diff --git a/ui/src/dashboards/components/dashboard_index/Contents.tsx b/ui/src/dashboards/components/dashboard_index/Contents.tsx index 985bdd59489..8710237caa4 100644 --- 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 { onEditLabels, searchTerm, orgs, + showInlineEdit, } = this.props return ( @@ -57,6 +59,7 @@ export default class DashboardsIndexContents extends Component { onUpdateDashboard={onUpdateDashboard} onEditLabels={onEditLabels} orgs={orgs} + showInlineEdit={showInlineEdit} /> ) diff --git a/ui/src/dashboards/components/dashboard_index/Table.tsx b/ui/src/dashboards/components/dashboard_index/Table.tsx index b065558fc63..1642621781b 100644 --- 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 { onUpdateDashboard, onEditLabels, orgs, + showInlineEdit, } = this.props const {sortKey, sortDirection} = this.state @@ -128,6 +130,7 @@ class DashboardsTable extends PureComponent { onUpdateDashboard={onUpdateDashboard} onEditLabels={onEditLabels} orgs={orgs} + showInlineEdit={showInlineEdit} /> )} diff --git a/ui/src/dashboards/components/dashboard_index/TableRow.tsx b/ui/src/dashboards/components/dashboard_index/TableRow.tsx index 81c2d83487d..83fb89a5cbb 100644 --- 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 { @@ -55,9 +57,7 @@ export default class DashboardsIndexTableRow extends PureComponent { stackChildren={Stack.Columns} align={Alignment.Left} > - - {this.name} - + {this.resourceNames} {this.labels} { ) } + private get resourceNames(): JSX.Element { + const {showInlineEdit, dashboard} = this.props + if (showInlineEdit) { + return ( + + ) + } + return ( + + {this.name} + + ) + } + + 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 index 9cd75e3d7a4..450d8135c1f 100644 --- 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 { @@ -27,6 +28,7 @@ export default class DashboardsIndexTableRows extends PureComponent { onUpdateDashboard, onEditLabels, orgs, + showInlineEdit, } = this.props return dashboards.map(d => ( @@ -39,6 +41,7 @@ export default class DashboardsIndexTableRows extends PureComponent { onUpdateDashboard={onUpdateDashboard} onEditLabels={onEditLabels} orgs={orgs} + showInlineEdit={showInlineEdit} /> )) } diff --git a/ui/src/organizations/components/DashboardList.tsx b/ui/src/organizations/components/DashboardList.tsx deleted file mode 100644 index ba6af0155db..00000000000 --- a/ui/src/organizations/components/DashboardList.tsx +++ /dev/null @@ -1,101 +0,0 @@ -// Libraries -import React, {PureComponent} from 'react' -import {InjectedRouter} from 'react-router' -import {connect} from 'react-redux' - -// Components -import {IndexList} from 'src/clockface' -import DashboardRow from 'src/organizations/components/DashboardRow' - -// APIs -import {cloneDashboard} from 'src/dashboards/apis/v2' - -// Constants -import {dashboardCreateFailed} from 'src/shared/copy/notifications' - -// Actions -import {notify as notifyAction} from 'src/shared/actions/notifications' - -// Types -import {Notification} from 'src/types/notifications' -import {Dashboard} from 'src/types/v2' - -// Decorators -import {ErrorHandling} from 'src/shared/decorators/errors' - -interface DispatchProps { - notify: (message: Notification) => void -} - -interface OwnProps { - router: InjectedRouter - orgID: string - dashboards: Dashboard[] - emptyState: JSX.Element - onDeleteDashboard: (dashboard: Dashboard) => void - onUpdateDashboard: (dashboard: Dashboard) => void -} - -type Props = DispatchProps & OwnProps - -@ErrorHandling -class DashboardList extends PureComponent { - public render() { - return ( - - - - - - - - {this.rows} - - - ) - } - - private handleCloneDashboard = async ( - dashboard: Dashboard - ): Promise => { - const {router, notify, orgID, dashboards} = this.props - const name = `${dashboard.name} (clone)` - try { - const data = await cloneDashboard( - { - ...dashboard, - name, - orgID, - }, - dashboards - ) - - router.push(`/dashboards/${data.id}`) - } catch (error) { - notify(dashboardCreateFailed()) - } - } - - private get rows(): JSX.Element[] { - const {onDeleteDashboard, onUpdateDashboard} = this.props - - return this.props.dashboards.map(d => ( - - )) - } -} - -const mdtp: DispatchProps = { - notify: notifyAction, -} - -export default connect( - null, - mdtp -)(DashboardList) diff --git a/ui/src/organizations/components/DashboardRow.tsx b/ui/src/organizations/components/DashboardRow.tsx deleted file mode 100644 index 54aa42541e5..00000000000 --- a/ui/src/organizations/components/DashboardRow.tsx +++ /dev/null @@ -1,93 +0,0 @@ -// Libraries -import React, {PureComponent} from 'react' -import moment from 'moment' - -// Components -import { - IndexList, - Alignment, - ComponentSize, - ConfirmationButton, - ComponentSpacer, - Stack, - Button, - IconFont, - ComponentColor, -} from 'src/clockface' - -// Types -import {Dashboard} from 'src/types/v2' - -// Constants -import {UPDATED_AT_TIME_FORMAT} from 'src/dashboards/constants' -import EditableName from 'src/shared/components/EditableName' - -interface Props { - dashboard: Dashboard - onDeleteDashboard: (dashboard: Dashboard) => void - onUpdateDashboard: (dashboard: Dashboard) => void - onCloneDashboard: (dashboard: Dashboard) => void -} - -export default class DashboardRow extends PureComponent { - public render() { - const {dashboard, onDeleteDashboard} = this.props - - return ( - - - - - {this.lastModifiedCell} - - -