diff --git a/CHANGELOG.md b/CHANGELOG.md index 72676c2fa..234ff70bc 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,7 @@ ### Features ### Bug Fixes 1. [#1065](https://github.com/influxdata/chronograf/pull/1065): Save and Cancel edits to a Dashboard name + 2. [#1069](https://github.com/influxdata/chronograf/pull/1069): Graphs are no longer editable from a Host Page ## v1.2.0-beta6 [2017-03-24] diff --git a/ui/src/dashboards/components/DashboardHeader.js b/ui/src/dashboards/components/DashboardHeader.js index f8df74e44..29ce9aafa 100644 --- a/ui/src/dashboards/components/DashboardHeader.js +++ b/ui/src/dashboards/components/DashboardHeader.js @@ -91,8 +91,8 @@ DashboardHeader.propTypes = { handleChooseAutoRefresh: func.isRequired, handleClickPresentationButton: func.isRequired, source: shape({}), - onAddCell: func.isRequired, - onEditDashboard: func.isRequired, + onAddCell: func, + onEditDashboard: func, } export default DashboardHeader diff --git a/ui/src/hosts/containers/HostPage.js b/ui/src/hosts/containers/HostPage.js index 6a0d75be5..1e4d5e0fa 100644 --- a/ui/src/hosts/containers/HostPage.js +++ b/ui/src/hosts/containers/HostPage.js @@ -145,6 +145,7 @@ export const HostPage = React.createClass({ autoRefresh={autoRefresh} source={source.links.proxy} host={this.props.params.hostID} + shouldNotBeEditable={true} /> ); }, diff --git a/ui/src/shared/components/LayoutRenderer.js b/ui/src/shared/components/LayoutRenderer.js index 89c744a1f..fcc74db56 100644 --- a/ui/src/shared/components/LayoutRenderer.js +++ b/ui/src/shared/components/LayoutRenderer.js @@ -14,6 +14,7 @@ const RefreshingSingleStat = AutoRefresh(SingleStat); const { arrayOf, + bool, func, number, shape, @@ -52,6 +53,7 @@ export const LayoutRenderer = React.createClass({ onUpdateCell: func, onDeleteCell: func, onSummonOverlayTechnologies: func, + shouldNotBeEditable: bool, }, buildQuery(q) { @@ -87,7 +89,7 @@ export const LayoutRenderer = React.createClass({ }, generateVisualizations() { - const {autoRefresh, source, cells, onEditCell, onRenameCell, onUpdateCell, onDeleteCell, onSummonOverlayTechnologies} = this.props; + const {autoRefresh, source, cells, onEditCell, onRenameCell, onUpdateCell, onDeleteCell, onSummonOverlayTechnologies, shouldNotBeEditable} = this.props; return cells.map((cell) => { const qs = cell.queries.map((query) => { @@ -106,6 +108,7 @@ export const LayoutRenderer = React.createClass({ onUpdateCell={onUpdateCell} onDeleteCell={onDeleteCell} onSummonOverlayTechnologies={onSummonOverlayTechnologies} + shouldNotBeEditable={shouldNotBeEditable} cell={cell} > @@ -127,6 +130,7 @@ export const LayoutRenderer = React.createClass({ onUpdateCell={onUpdateCell} onDeleteCell={onDeleteCell} onSummonOverlayTechnologies={onSummonOverlayTechnologies} + shouldNotBeEditable={shouldNotBeEditable} cell={cell} > ) } else { - nameOrField = ({name}) + nameOrField = ({name}) } let onClickHandler @@ -98,7 +100,18 @@ const NameableGraph = React.createClass({
{nameOrField}
- + { + shouldNotBeEditable ? + null : + + }
{children} diff --git a/ui/src/style/pages/dashboards.scss b/ui/src/style/pages/dashboards.scss index 4c01c0c0f..46b5c4d51 100644 --- a/ui/src/style/pages/dashboards.scss +++ b/ui/src/style/pages/dashboards.scss @@ -141,28 +141,30 @@ $dash-graph-heading: 30px; border: 2px solid $g3-castle; top: 2px; - &:after { - display: inline-block; - content: "\f058"; - font-family: 'icomoon' !important; - font-style: normal; - font-weight: normal; - font-variant: normal; - line-height: 1; - text-transform: none; - color: $g11-sidewalk; - font-size: 14px; - opacity: 0; - transition: opacity 0.25s ease; - margin-left: 5px; - } - - &:hover { - cursor: text; - color: $g20-white; - + &.editable { &:after { - opacity: 1; + display: inline-block; + content: "\f058"; + font-family: 'icomoon' !important; + font-style: normal; + font-weight: normal; + font-variant: normal; + line-height: 1; + text-transform: none; + color: $g11-sidewalk; + font-size: 14px; + opacity: 0; + transition: opacity 0.25s ease; + margin-left: 5px; + } + + &:hover { + cursor: text; + color: $g20-white; + + &:after { + opacity: 1; + } } } }