From 874e41075adc6dcd72bcd7bd54904c9e9b075b5e Mon Sep 17 00:00:00 2001 From: Andrew Watkins Date: Fri, 3 Mar 2017 14:22:07 -0800 Subject: [PATCH] Revert "Allow user to set auto-refresh interval" --- CHANGELOG.md | 1 - ui/src/dashboards/components/Dashboard.js | 10 ++- .../dashboards/components/DashboardHeader.js | 13 +--- ui/src/dashboards/containers/DashboardPage.js | 12 +--- .../data_explorer/components/Visualization.js | 6 +- .../data_explorer/containers/DataExplorer.js | 30 +++----- ui/src/data_explorer/containers/Header.js | 29 +++----- ui/src/data_explorer/reducers/index.js | 4 +- ui/src/hosts/containers/HostPage.js | 21 ++---- ui/src/index.js | 2 +- .../components/KubernetesDashboard.js | 16 ++--- .../kubernetes/containers/KubernetesPage.js | 20 ++---- ui/src/localStorage.js | 5 +- ui/src/shared/actions/app.js | 22 ------ ui/src/shared/actions/ui.js | 19 +++++ ui/src/shared/components/AutoRefresh.js | 25 +++---- .../shared/components/AutoRefreshDropdown.js | 72 ------------------- ui/src/shared/components/Dropdown.js | 22 ++---- ui/src/shared/components/LayoutRenderer.js | 8 +-- ui/src/shared/components/TimeRangeDropdown.js | 4 +- ui/src/shared/constants/index.js | 2 - ui/src/shared/data/autoRefreshes.hson | 7 -- ui/src/shared/dispatchers/index.js | 2 +- ui/src/shared/reducers/app.js | 57 --------------- ui/src/shared/reducers/index.js | 8 +-- ui/src/shared/reducers/ui.js | 23 ++++++ ui/src/side_nav/containers/SideNavApp.js | 10 +-- ui/src/store/configureStore.js | 4 +- 28 files changed, 125 insertions(+), 329 deletions(-) delete mode 100644 ui/src/shared/actions/app.js create mode 100644 ui/src/shared/actions/ui.js delete mode 100644 ui/src/shared/components/AutoRefreshDropdown.js delete mode 100644 ui/src/shared/data/autoRefreshes.hson delete mode 100644 ui/src/shared/reducers/app.js create mode 100644 ui/src/shared/reducers/ui.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 9a6da3508..d157bc66b 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -21,7 +21,6 @@ 4. [#892](https://github.com/influxdata/chronograf/issues/891): Make dashboard visualizations resizable 5. [#893](https://github.com/influxdata/chronograf/issues/893): Persist dashboard visualization position 6. [#922](https://github.com/influxdata/chronograf/issues/922): Additional OAuth2 support for [Heroku](https://github.com/influxdata/chronograf/blob/master/docs/auth.md#heroku) and [Google](https://github.com/influxdata/chronograf/blob/master/docs/auth.md#google) - 7. [#781](https://github.com/influxdata/chronograf/issues/781): Add global auto-refresh dropdown to all graph dashboards ### UI Improvements 1. [#905](https://github.com/influxdata/chronograf/pull/905): Make scroll bar thumb element bigger diff --git a/ui/src/dashboards/components/Dashboard.js b/ui/src/dashboards/components/Dashboard.js index 3ff1c1ca4..46eb173b0 100644 --- a/ui/src/dashboards/components/Dashboard.js +++ b/ui/src/dashboards/components/Dashboard.js @@ -10,7 +10,6 @@ const Dashboard = ({ inPresentationMode, onPositionChange, source, - autoRefresh, timeRange, }) => { if (dashboard.id === 0) { @@ -21,13 +20,14 @@ const Dashboard = ({
{isEditMode ? : null} - {Dashboard.renderDashboard(dashboard, autoRefresh, timeRange, source, onPositionChange)} + {Dashboard.renderDashboard(dashboard, timeRange, source, onPositionChange)}
) } -Dashboard.renderDashboard = (dashboard, autoRefresh, timeRange, source, onPositionChange) => { +Dashboard.renderDashboard = (dashboard, timeRange, source, onPositionChange) => { + const autoRefreshMs = 15000 const cells = dashboard.cells.map((cell, i) => { i = `${i}` const dashboardCell = {...cell, i} @@ -42,7 +42,7 @@ Dashboard.renderDashboard = (dashboard, autoRefresh, timeRange, source, onPositi @@ -54,7 +54,6 @@ const { func, shape, string, - number, } = PropTypes Dashboard.propTypes = { @@ -67,7 +66,6 @@ Dashboard.propTypes = { proxy: string, }).isRequired, }).isRequired, - autoRefresh: number.isRequired, timeRange: shape({}).isRequired, } diff --git a/ui/src/dashboards/components/DashboardHeader.js b/ui/src/dashboards/components/DashboardHeader.js index 55dd1b7b0..be6fd69a0 100644 --- a/ui/src/dashboards/components/DashboardHeader.js +++ b/ui/src/dashboards/components/DashboardHeader.js @@ -2,7 +2,6 @@ import React, {PropTypes} from 'react' import ReactTooltip from 'react-tooltip' import {Link} from 'react-router'; -import AutoRefreshDropdown from 'shared/components/AutoRefreshDropdown' import TimeRangeDropdown from 'shared/components/TimeRangeDropdown' const DashboardHeader = ({ @@ -11,10 +10,8 @@ const DashboardHeader = ({ dashboard, headerText, timeRange, - autoRefresh, isHidden, handleChooseTimeRange, - handleChooseAutoRefresh, handleClickPresentationButton, sourceID, }) => isHidden ? null : ( @@ -48,7 +45,6 @@ const DashboardHeader = ({ Graph Tips -
@@ -59,12 +55,11 @@ const DashboardHeader = ({ ) const { - array, - bool, - func, - number, shape, + array, string, + func, + bool, } = PropTypes DashboardHeader.propTypes = { @@ -74,10 +69,8 @@ DashboardHeader.propTypes = { dashboard: shape({}), headerText: string, timeRange: shape({}).isRequired, - autoRefresh: number.isRequired, isHidden: bool.isRequired, handleChooseTimeRange: func.isRequired, - handleChooseAutoRefresh: func.isRequired, handleClickPresentationButton: func.isRequired, } diff --git a/ui/src/dashboards/containers/DashboardPage.js b/ui/src/dashboards/containers/DashboardPage.js index 0b6efe1b4..c83c92020 100644 --- a/ui/src/dashboards/containers/DashboardPage.js +++ b/ui/src/dashboards/containers/DashboardPage.js @@ -51,7 +51,6 @@ const DashboardPage = React.createClass({ id: number.isRequired, cells: arrayOf(shape({})).isRequired, }).isRequired, - autoRefresh: number.isRequired, timeRange: shape({}).isRequired, inPresentationMode: bool.isRequired, isEditMode: bool.isRequired, @@ -101,7 +100,6 @@ const DashboardPage = React.createClass({ isEditMode, handleClickPresentationButton, source, - autoRefresh, timeRange, } = this.props @@ -112,7 +110,6 @@ const DashboardPage = React.createClass({ {}} /> :
@@ -147,10 +143,7 @@ const DashboardPage = React.createClass({ const mapStateToProps = (state) => { const { - app: { - ephemeral: {inPresentationMode}, - persisted: {autoRefresh}, - }, + appUI, dashboardUI: { dashboards, dashboard, @@ -160,12 +153,11 @@ const mapStateToProps = (state) => { } = state return { + inPresentationMode: appUI.presentationMode, dashboards, dashboard, - autoRefresh, timeRange, isEditMode, - inPresentationMode, } } diff --git a/ui/src/data_explorer/components/Visualization.js b/ui/src/data_explorer/components/Visualization.js index b58355da6..b88972a9e 100644 --- a/ui/src/data_explorer/components/Visualization.js +++ b/ui/src/data_explorer/components/Visualization.js @@ -15,7 +15,6 @@ const { const Visualization = React.createClass({ propTypes: { - autoRefresh: number.isRequired, timeRange: shape({ upper: string, lower: string, @@ -46,7 +45,7 @@ const Visualization = React.createClass({ }, render() { - const {queryConfigs, autoRefresh, timeRange, activeQueryIndex, height, heightPixels} = this.props; + const {queryConfigs, timeRange, activeQueryIndex, height, heightPixels} = this.props; const {source} = this.context; const proxyLink = source.links.proxy; @@ -58,6 +57,7 @@ const Visualization = React.createClass({ const queries = statements.filter((s) => s.text !== null).map((s) => { return {host: [proxyLink], text: s.text, id: s.id}; }); + const autoRefreshMs = 10000; const isInDataExplorer = true; return ( @@ -77,7 +77,7 @@ const Visualization = React.createClass({ {isGraphInView ? ( diff --git a/ui/src/data_explorer/containers/DataExplorer.js b/ui/src/data_explorer/containers/DataExplorer.js index 9468fca75..68a7c7b2e 100644 --- a/ui/src/data_explorer/containers/DataExplorer.js +++ b/ui/src/data_explorer/containers/DataExplorer.js @@ -1,18 +1,17 @@ import React, {PropTypes} from 'react'; import {connect} from 'react-redux'; -import {bindActionCreators} from 'redux'; import QueryBuilder from '../components/QueryBuilder'; import Visualization from '../components/Visualization'; import Header from '../containers/Header'; import ResizeContainer from 'src/shared/components/ResizeContainer'; -import {setAutoRefresh} from 'shared/actions/app' -import {setTimeRange as setTimeRangeAction} from '../actions/view'; +import { + setTimeRange as setTimeRangeAction, +} from '../actions/view'; const { arrayOf, func, - number, shape, string, } = PropTypes; @@ -26,8 +25,6 @@ const DataExplorer = React.createClass({ }).isRequired, }).isRequired, queryConfigs: PropTypes.shape({}), - autoRefresh: number.isRequired, - handleChooseAutoRefresh: func.isRequired, timeRange: shape({ upper: string, lower: string, @@ -62,20 +59,18 @@ const DataExplorer = React.createClass({ }, render() { - const {autoRefresh, handleChooseAutoRefresh, timeRange, setTimeRange, queryConfigs, dataExplorer} = this.props; + const {timeRange, setTimeRange, queryConfigs, dataExplorer} = this.props; const {activeQueryID} = this.state; const queries = dataExplorer.queryIDs.map((qid) => queryConfigs[qid]); return (
@@ -62,7 +50,6 @@ const Header = React.createClass({ {this.context.source.name}
-
diff --git a/ui/src/data_explorer/reducers/index.js b/ui/src/data_explorer/reducers/index.js index 6db959b19..cccca5d79 100644 --- a/ui/src/data_explorer/reducers/index.js +++ b/ui/src/data_explorer/reducers/index.js @@ -2,8 +2,8 @@ import queryConfigs from './queryConfigs'; import timeRange from './timeRange'; import dataExplorer from './ui'; -export default { +export { queryConfigs, timeRange, dataExplorer, -} +}; diff --git a/ui/src/hosts/containers/HostPage.js b/ui/src/hosts/containers/HostPage.js index 641aa63f1..38ff3ae16 100644 --- a/ui/src/hosts/containers/HostPage.js +++ b/ui/src/hosts/containers/HostPage.js @@ -1,7 +1,6 @@ import React, {PropTypes} from 'react' import {Link} from 'react-router' import {connect} from 'react-redux' -import {bindActionCreators} from 'redux' import _ from 'lodash' import classnames from 'classnames'; @@ -10,8 +9,6 @@ import DashboardHeader from 'src/dashboards/components/DashboardHeader'; import timeRanges from 'hson!../../shared/data/timeRanges.hson'; import {getMappings, getAppsForHosts, getMeasurementsForHost, getAllHosts} from 'src/hosts/apis'; import {fetchLayouts} from 'shared/apis'; - -import {setAutoRefresh} from 'shared/actions/app' import {presentationButtonDispatcher} from 'shared/dispatchers' const { @@ -19,7 +16,6 @@ const { string, bool, func, - number, } = PropTypes export const HostPage = React.createClass({ @@ -39,8 +35,6 @@ export const HostPage = React.createClass({ app: string, }), }), - autoRefresh: number.isRequired, - handleChooseAutoRefresh: func.isRequired, inPresentationMode: bool, handleClickPresentationButton: func, }, @@ -93,8 +87,9 @@ export const HostPage = React.createClass({ }, renderLayouts(layouts) { + const autoRefreshMs = 15000; const {timeRange} = this.state; - const {source, autoRefresh} = this.props; + const {source} = this.props; const autoflowLayouts = layouts.filter((layout) => !!layout.autoflow); @@ -142,7 +137,7 @@ export const HostPage = React.createClass({ @@ -150,7 +145,7 @@ export const HostPage = React.createClass({ }, render() { - const {params: {hostID}, location: {query: {app}}, source: {id}, autoRefresh, handleChooseAutoRefresh, inPresentationMode, handleClickPresentationButton} = this.props + const {params: {hostID}, location: {query: {app}}, source: {id}, inPresentationMode, handleClickPresentationButton} = this.props const {layouts, timeRange, hosts} = this.state const appParam = app ? `?app=${app}` : '' @@ -158,11 +153,9 @@ export const HostPage = React.createClass({
{Object.keys(hosts).map((host, i) => { @@ -188,13 +181,11 @@ export const HostPage = React.createClass({ }, }); -const mapStateToProps = ({app: {ephemeral: {inPresentationMode}, persisted: {autoRefresh}}}) => ({ - inPresentationMode, - autoRefresh, +const mapStateToProps = (state) => ({ + inPresentationMode: state.appUI.presentationMode, }) const mapDispatchToProps = (dispatch) => ({ - handleChooseAutoRefresh: bindActionCreators(setAutoRefresh, dispatch), handleClickPresentationButton: presentationButtonDispatcher(dispatch), }) diff --git a/ui/src/index.js b/ui/src/index.js index e45201ad6..c2a8f4cd3 100644 --- a/ui/src/index.js +++ b/ui/src/index.js @@ -19,7 +19,7 @@ import configureStore from 'src/store/configureStore'; import {getMe, getSources} from 'shared/apis'; import {receiveMe} from 'shared/actions/me'; import {receiveAuth} from 'shared/actions/auth'; -import {disablePresentationMode} from 'shared/actions/app'; +import {disablePresentationMode} from 'shared/actions/ui'; import {loadLocalStorage} from './localStorage'; import 'src/style/chronograf.scss'; diff --git a/ui/src/kubernetes/components/KubernetesDashboard.js b/ui/src/kubernetes/components/KubernetesDashboard.js index 6092b03e8..2c4afc5b4 100644 --- a/ui/src/kubernetes/components/KubernetesDashboard.js +++ b/ui/src/kubernetes/components/KubernetesDashboard.js @@ -6,12 +6,11 @@ import DashboardHeader from 'src/dashboards/components/DashboardHeader'; import timeRanges from 'hson!../../shared/data/timeRanges.hson'; const { + shape, + string, arrayOf, bool, func, - number, - shape, - string, } = PropTypes export const KubernetesDashboard = React.createClass({ @@ -23,8 +22,6 @@ export const KubernetesDashboard = React.createClass({ telegraf: string.isRequired, }), layouts: arrayOf(shape().isRequired).isRequired, - autoRefresh: number.isRequired, - handleChooseAutoRefresh: func.isRequired, inPresentationMode: bool.isRequired, handleClickPresentationButton: func, }, @@ -37,8 +34,9 @@ export const KubernetesDashboard = React.createClass({ }, renderLayouts(layouts) { + const autoRefreshMs = 15000; const {timeRange} = this.state; - const {source, autoRefresh} = this.props; + const {source} = this.props; let layoutCells = []; layouts.forEach((layout) => { @@ -58,7 +56,7 @@ export const KubernetesDashboard = React.createClass({ ); @@ -70,7 +68,7 @@ export const KubernetesDashboard = React.createClass({ }, render() { - const {layouts, autoRefresh, handleChooseAutoRefresh, inPresentationMode, handleClickPresentationButton} = this.props; + const {layouts, inPresentationMode, handleClickPresentationButton} = this.props; const {timeRange} = this.state; const emptyState = (
@@ -83,8 +81,6 @@ export const KubernetesDashboard = React.createClass({
@@ -59,13 +51,11 @@ export const KubernetesPage = React.createClass({ }, }); -const mapStateToProps = ({app: {ephemeral: {inPresentationMode}, persisted: {autoRefresh}}}) => ({ - inPresentationMode, - autoRefresh, +const mapStateToProps = (state) => ({ + inPresentationMode: state.appUI.presentationMode, }) const mapDispatchToProps = (dispatch) => ({ - handleChooseAutoRefresh: bindActionCreators(setAutoRefresh, dispatch), handleClickPresentationButton: presentationButtonDispatcher(dispatch), }) diff --git a/ui/src/localStorage.js b/ui/src/localStorage.js index 4b8381503..5cd29aa07 100644 --- a/ui/src/localStorage.js +++ b/ui/src/localStorage.js @@ -9,12 +9,9 @@ export const loadLocalStorage = () => { } }; -export const saveToLocalStorage = ({app: {persisted}, queryConfigs, timeRange, dataExplorer}) => { +export const saveToLocalStorage = ({queryConfigs, timeRange, dataExplorer}) => { try { - const appPersisted = Object.assign({}, {app: {persisted}}) - window.localStorage.setItem('state', JSON.stringify({ - ...appPersisted, queryConfigs, timeRange, dataExplorer, diff --git a/ui/src/shared/actions/app.js b/ui/src/shared/actions/app.js deleted file mode 100644 index f8939f408..000000000 --- a/ui/src/shared/actions/app.js +++ /dev/null @@ -1,22 +0,0 @@ -import {PRESENTATION_MODE_ANIMATION_DELAY} from '../constants' - -// ephemeral state reducers -export const enablePresentationMode = () => ({ - type: 'ENABLE_PRESENTATION_MODE', -}) - -export const disablePresentationMode = () => ({ - type: 'DISABLE_PRESENTATION_MODE', -}) - -export const delayEnablePresentationMode = () => (dispatch) => { - setTimeout(() => dispatch(enablePresentationMode()), PRESENTATION_MODE_ANIMATION_DELAY) -} - -// persistent state reducers -export const setAutoRefresh = (milliseconds) => ({ - type: 'SET_AUTOREFRESH', - payload: { - milliseconds, - }, -}) diff --git a/ui/src/shared/actions/ui.js b/ui/src/shared/actions/ui.js new file mode 100644 index 000000000..740566beb --- /dev/null +++ b/ui/src/shared/actions/ui.js @@ -0,0 +1,19 @@ +import {PRESENTATION_MODE_ANIMATION_DELAY} from '../constants' + +export function enablePresentationMode() { + return { + type: 'ENABLE_PRESENTATION_MODE', + } +} + +export function disablePresentationMode() { + return { + type: 'DISABLE_PRESENTATION_MODE', + } +} + +export function delayEnablePresentationMode() { + return (dispatch) => { + setTimeout(() => dispatch(enablePresentationMode()), PRESENTATION_MODE_ANIMATION_DELAY) + } +} diff --git a/ui/src/shared/components/AutoRefresh.js b/ui/src/shared/components/AutoRefresh.js index ecf560bef..fd79cd620 100644 --- a/ui/src/shared/components/AutoRefresh.js +++ b/ui/src/shared/components/AutoRefresh.js @@ -6,34 +6,25 @@ function _fetchTimeSeries(source, db, rp, query) { return proxy({source, db, rp, query}); } -const { - element, - number, - arrayOf, - shape, - oneOfType, - string, -} = PropTypes - export default function AutoRefresh(ComposedComponent) { const wrapper = React.createClass({ displayName: `AutoRefresh_${ComposedComponent.displayName}`, propTypes: { - children: element, - autoRefresh: number.isRequired, - queries: arrayOf(shape({ - host: oneOfType([string, arrayOf(string)]), - text: string, + children: PropTypes.element, + autoRefresh: PropTypes.number, + queries: PropTypes.arrayOf(PropTypes.shape({ + host: PropTypes.oneOfType([PropTypes.string, PropTypes.arrayOf(PropTypes.string)]), + text: PropTypes.string, }).isRequired).isRequired, }, getInitialState() { return {timeSeries: []}; }, componentDidMount() { - const {queries, autoRefresh} = this.props; + const {queries} = this.props; this.executeQueries(queries); - if (autoRefresh) { - this.intervalID = setInterval(() => this.executeQueries(queries), autoRefresh); + if (this.props.autoRefresh) { + this.intervalID = setInterval(() => this.executeQueries(queries), this.props.autoRefresh); } }, componentWillReceiveProps(nextProps) { diff --git a/ui/src/shared/components/AutoRefreshDropdown.js b/ui/src/shared/components/AutoRefreshDropdown.js deleted file mode 100644 index d8bafe2fd..000000000 --- a/ui/src/shared/components/AutoRefreshDropdown.js +++ /dev/null @@ -1,72 +0,0 @@ -import React, {PropTypes} from 'react'; -import classnames from 'classnames'; -import OnClickOutside from 'shared/components/OnClickOutside'; - -import autoRefreshItems from 'hson!../data/autoRefreshes.hson'; - -const { - number, - func, -} = PropTypes - -const AutoRefreshDropdown = React.createClass({ - autobind: false, - - propTypes: { - selected: number.isRequired, - onChoose: func.isRequired, - }, - - getInitialState() { - return { - isOpen: false, - }; - }, - - findAutoRefreshItem(milliseconds) { - return autoRefreshItems.find((values) => values.milliseconds === milliseconds) - }, - - handleClickOutside() { - this.setState({isOpen: false}); - }, - - handleSelection(milliseconds) { - this.props.onChoose(milliseconds); - this.setState({isOpen: false}); - }, - - toggleMenu() { - this.setState({isOpen: !this.state.isOpen}); - }, - - render() { - const self = this; - const {selected} = self.props; - const {isOpen} = self.state; - - return ( -
-
self.toggleMenu()}> - - {this.findAutoRefreshItem(selected).inputValue} - -
- -
- ); - }, -}); - -export default OnClickOutside(AutoRefreshDropdown); diff --git a/ui/src/shared/components/Dropdown.js b/ui/src/shared/components/Dropdown.js index 2c749449a..178b842d5 100644 --- a/ui/src/shared/components/Dropdown.js +++ b/ui/src/shared/components/Dropdown.js @@ -1,23 +1,14 @@ import React, {PropTypes} from 'react'; -import classnames from 'classnames'; import OnClickOutside from 'shared/components/OnClickOutside'; -const { - arrayOf, - shape, - string, - func, -} = PropTypes - const Dropdown = React.createClass({ propTypes: { - items: arrayOf(shape({ - text: string.isRequired, + items: PropTypes.arrayOf(PropTypes.shape({ + text: PropTypes.string.isRequired, })).isRequired, - onChoose: func.isRequired, - selected: string.isRequired, - iconName: string, - className: string, + onChoose: PropTypes.func.isRequired, + selected: PropTypes.string.isRequired, + className: PropTypes.string, }, getInitialState() { return { @@ -48,12 +39,11 @@ const Dropdown = React.createClass({ }, render() { const self = this; - const {items, selected, className, iconName, actions} = self.props; + const {items, selected, className, actions} = self.props; return (
- {iconName ? : null} {selected}
diff --git a/ui/src/shared/components/LayoutRenderer.js b/ui/src/shared/components/LayoutRenderer.js index 60eace146..e1c2df5e7 100644 --- a/ui/src/shared/components/LayoutRenderer.js +++ b/ui/src/shared/components/LayoutRenderer.js @@ -18,7 +18,6 @@ const { export const LayoutRenderer = React.createClass({ propTypes: { - autoRefresh: number.isRequired, timeRange: shape({ defaultGroupBy: string.isRequired, queryValue: string.isRequired, @@ -47,6 +46,7 @@ export const LayoutRenderer = React.createClass({ name: string.isRequired, }).isRequired ), + autoRefreshMs: number.isRequired, host: string, source: string, onPositionChange: func, @@ -84,7 +84,7 @@ export const LayoutRenderer = React.createClass({ }, generateVisualizations() { - const {autoRefresh, source, cells} = this.props; + const {autoRefreshMs, source, cells} = this.props; return cells.map((cell) => { const qs = cell.queries.map((q) => { @@ -100,7 +100,7 @@ export const LayoutRenderer = React.createClass({

{cell.name || `Graph`}

- +
); @@ -117,7 +117,7 @@ export const LayoutRenderer = React.createClass({
diff --git a/ui/src/shared/components/TimeRangeDropdown.js b/ui/src/shared/components/TimeRangeDropdown.js index 076226896..dbdf5155c 100644 --- a/ui/src/shared/components/TimeRangeDropdown.js +++ b/ui/src/shared/components/TimeRangeDropdown.js @@ -1,5 +1,5 @@ import React from 'react'; -import classnames from 'classnames'; +import cN from 'classnames'; import OnClickOutside from 'shared/components/OnClickOutside'; import timeRanges from 'hson!../data/timeRanges.hson'; @@ -48,7 +48,7 @@ const TimeRangeDropdown = React.createClass({ {selected}
-
    +
    • Time Range
      • {timeRanges.map((item) => { return ( diff --git a/ui/src/shared/constants/index.js b/ui/src/shared/constants/index.js index f6f5bb7b6..6b0d7cb60 100644 --- a/ui/src/shared/constants/index.js +++ b/ui/src/shared/constants/index.js @@ -470,5 +470,3 @@ export const STROKE_WIDTH = { export const PRESENTATION_MODE_ANIMATION_DELAY = 0 // In milliseconds. export const PRESENTATION_MODE_NOTIFICATION_DELAY = 2000 // In milliseconds. - -export const AUTOREFRESH_DEFAULT = 15000 // in milliseconds diff --git a/ui/src/shared/data/autoRefreshes.hson b/ui/src/shared/data/autoRefreshes.hson deleted file mode 100644 index 09b4237ff..000000000 --- a/ui/src/shared/data/autoRefreshes.hson +++ /dev/null @@ -1,7 +0,0 @@ -[ - {milliseconds: 5000, inputValue: 'Every 5 seconds', menuOption: 'Every 5 seconds'}, - {milliseconds: 10000, inputValue: 'Every 10 seconds', menuOption: 'Every 10 seconds'}, - {milliseconds: 15000, inputValue: 'Every 15 seconds', menuOption: 'Every 15 seconds'}, - {milliseconds: 30000, inputValue: 'Every 30 seconds', menuOption: 'Every 30 seconds'}, - {milliseconds: 60000, inputValue: 'Every 60 seconds', menuOption: 'Every 60 seconds'} -] diff --git a/ui/src/shared/dispatchers/index.js b/ui/src/shared/dispatchers/index.js index a7771a9ff..fcf02767f 100644 --- a/ui/src/shared/dispatchers/index.js +++ b/ui/src/shared/dispatchers/index.js @@ -1,4 +1,4 @@ -import {delayEnablePresentationMode} from 'shared/actions/app' +import {delayEnablePresentationMode} from 'shared/actions/ui' import {publishNotification, delayDismissNotification} from 'shared/actions/notifications' import {PRESENTATION_MODE_NOTIFICATION_DELAY} from 'shared/constants' diff --git a/ui/src/shared/reducers/app.js b/ui/src/shared/reducers/app.js deleted file mode 100644 index adcb4c242..000000000 --- a/ui/src/shared/reducers/app.js +++ /dev/null @@ -1,57 +0,0 @@ -import {combineReducers} from 'redux'; - -import {AUTOREFRESH_DEFAULT} from 'src/shared/constants' - -const initialState = { - ephemeral: { - inPresentationMode: false, - }, - persisted: { - autoRefresh: AUTOREFRESH_DEFAULT, - }, -} - -const { - ephemeral: initialEphemeralState, - persisted: initialPersistedState, -} = initialState - -const ephemeralReducer = (state = initialEphemeralState, action) => { - switch (action.type) { - case 'ENABLE_PRESENTATION_MODE': { - return { - ...state, - inPresentationMode: true, - } - } - - case 'DISABLE_PRESENTATION_MODE': { - return { - ...state, - inPresentationMode: false, - } - } - - default: - return state - } -} - -const persistedReducer = (state = initialPersistedState, action) => { - switch (action.type) { - case 'SET_AUTOREFRESH': { - return { - ...state, - autoRefresh: action.payload.milliseconds, - } - } - - default: - return state - } -} - -export default combineReducers({ - ephemeral: ephemeralReducer, - persisted: persistedReducer, -}) diff --git a/ui/src/shared/reducers/index.js b/ui/src/shared/reducers/index.js index bf191ecd7..47ed0c62f 100644 --- a/ui/src/shared/reducers/index.js +++ b/ui/src/shared/reducers/index.js @@ -1,13 +1,13 @@ +import appUI from './ui'; import me from './me'; -import app from './app'; import auth from './auth'; import notifications from './notifications'; import sources from './sources'; -export default { +export { + appUI, me, - app, auth, notifications, sources, -} +}; diff --git a/ui/src/shared/reducers/ui.js b/ui/src/shared/reducers/ui.js new file mode 100644 index 000000000..77a2f77a8 --- /dev/null +++ b/ui/src/shared/reducers/ui.js @@ -0,0 +1,23 @@ +const initialState = { + presentationMode: false, +}; + +export default function ui(state = initialState, action) { + switch (action.type) { + case 'ENABLE_PRESENTATION_MODE': { + return { + ...state, + presentationMode: true, + } + } + + case 'DISABLE_PRESENTATION_MODE': { + return { + ...state, + presentationMode: false, + } + } + } + + return state +} diff --git a/ui/src/side_nav/containers/SideNavApp.js b/ui/src/side_nav/containers/SideNavApp.js index 5c2541571..a93bffdf7 100644 --- a/ui/src/side_nav/containers/SideNavApp.js +++ b/ui/src/side_nav/containers/SideNavApp.js @@ -34,9 +34,11 @@ const SideNavApp = React.createClass({ }, }); -const mapStateToProps = ({me, app: {ephemeral: {inPresentationMode}}}) => ({ - me, - inPresentationMode, -}) +function mapStateToProps(state) { + return { + me: state.me, + inPresentationMode: state.appUI.presentationMode, + }; +} export default connect(mapStateToProps)(SideNavApp); diff --git a/ui/src/store/configureStore.js b/ui/src/store/configureStore.js index 5aa6b77ee..44b03fa66 100644 --- a/ui/src/store/configureStore.js +++ b/ui/src/store/configureStore.js @@ -3,8 +3,8 @@ import {combineReducers} from 'redux'; import thunkMiddleware from 'redux-thunk'; import makeQueryExecuter from 'src/shared/middleware/queryExecuter'; import resizeLayout from 'src/shared/middleware/resizeLayout'; -import sharedReducers from 'src/shared/reducers'; -import dataExplorerReducers from 'src/data_explorer/reducers'; +import * as dataExplorerReducers from 'src/data_explorer/reducers'; +import * as sharedReducers from 'src/shared/reducers'; import rulesReducer from 'src/kapacitor/reducers/rules'; import dashboardUI from 'src/dashboards/reducers/ui'; import persistStateEnhancer from './persistStateEnhancer';