diff --git a/ui/cypress/e2e/dashboardsIndex.test.ts b/ui/cypress/e2e/dashboardsIndex.test.ts index 25a42a5a81..d0abe08f69 100644 --- a/ui/cypress/e2e/dashboardsIndex.test.ts +++ b/ui/cypress/e2e/dashboardsIndex.test.ts @@ -65,6 +65,8 @@ describe('Dashboards', () => { cy.getByTestID('card-select-Bashboard-Template').click() + cy.getByTestID('template-panel').should('exist') + cy.getByTestID('create-dashboard-button').click() cy.getByTestID('dashboard-card').should('have.length', 1) diff --git a/ui/src/dashboards/components/DashboardImportFromTemplateOverlay.tsx b/ui/src/dashboards/components/DashboardImportFromTemplateOverlay.tsx index ee37d11e7a..3a7019bf70 100644 --- a/ui/src/dashboards/components/DashboardImportFromTemplateOverlay.tsx +++ b/ui/src/dashboards/components/DashboardImportFromTemplateOverlay.tsx @@ -11,6 +11,7 @@ import { Panel, EmptyState, ComponentSize, + ComponentStatus, } from '@influxdata/clockface' import {Overlay, ResponsiveGridSizer} from 'src/clockface' import { @@ -80,7 +81,10 @@ class DashboardImportFromTemplateOverlay extends PureComponent< {!selectedTemplateSummary && this.emptyState} {selectedTemplateSummary && ( - + @@ -132,6 +136,11 @@ class DashboardImportFromTemplateOverlay extends PureComponent< text="Create Dashboard" onClick={this.onSubmit} key="submit-button" + status={ + this.state.selectedTemplate + ? ComponentStatus.Default + : ComponentStatus.Disabled + } testID="create-dashboard-button" color={ComponentColor.Primary} />, @@ -189,9 +198,9 @@ class DashboardImportFromTemplateOverlay extends PureComponent< private selectTemplate = ( selectedTemplateSummary: TemplateSummary ) => async (): Promise => { - this.setState({selectedTemplateSummary}) const selectedTemplate = await getTemplateByID(selectedTemplateSummary.id) this.setState({ + selectedTemplateSummary, selectedTemplate, variables: this.getVariablesForTemplate(selectedTemplate), cells: this.getCellsForTemplate(selectedTemplate),