diff --git a/client/coral-admin/src/components/CountdownTimer.js b/client/coral-admin/src/components/CountdownTimer.js
new file mode 100644
index 000000000..3eaa6d305
--- /dev/null
+++ b/client/coral-admin/src/components/CountdownTimer.js
@@ -0,0 +1,79 @@
+import React, {PropTypes} from 'react';
+import I18n from 'coral-framework/modules/i18n/i18n';
+import translations from 'coral-admin/src/translations';
+import styles from 'coral-admin/src/containers/Dashboard/Dashboard.css';
+import {Icon} from 'coral-ui';
+
+const lang = new I18n(translations);
+const refreshIntervalSeconds = 60 * 5;
+
+class CountdownTimer extends React.Component {
+
+ static propTypes = {
+ handleTimeout: PropTypes.func.isRequired
+ }
+
+ constructor (props) {
+ super(props);
+ try {
+ if (window.localStorage.getItem('coral:dashboardNote') === null) {
+ window.localStorage.setItem('coral:dashboardNote', 'show');
+ }
+ } catch (e) {
+
+ // above will fail in Private Mode in some browsers.
+ }
+
+ this.state = {
+ secondsUntilRefresh: refreshIntervalSeconds,
+ dashboardNote: window.localStorage.getItem('coral:dashboardNote') || 'show'
+ };
+ }
+
+ componentWillMount () {
+ setInterval(() => { // the countdown timer
+ let nextCount = this.state.secondsUntilRefresh - 1;
+ if (nextCount < 0) {
+ nextCount = refreshIntervalSeconds;
+ this.props.handleTimeout();
+ }
+ this.setState({secondsUntilRefresh: nextCount});
+ }, 1000);
+ }
+
+ formatTime = () => {
+ const minutes = Math.floor(this.state.secondsUntilRefresh / 60);
+ let seconds = (this.state.secondsUntilRefresh % 60).toString();
+ if (seconds.length < 2) {
+ seconds = `0${seconds}`;
+ }
+
+ return `${minutes}:${seconds}`;
+ }
+
+ dismissNote = () => {
+ try {
+ window.localStorage.setItem('coral:dashboardNote', 'hide');
+ } catch (e) {
+
+ // when setItem fails in Safari Private mode
+ this.setState({dashboardNote: 'hide'});
+ }
+ }
+
+ render () {
+ const hideReloadNote = window.localStorage.getItem('coral:dashboardNote') === 'hide' ||
+ this.state.dashboardNote === 'hide'; // for Safari Incognito
+ return (
+
+ ×
+ {lang.t('dashboard.next-update', this.formatTime())} {lang.t('dashboard.auto-update')}
+
+ );
+ }
+}
+
+export default CountdownTimer;
diff --git a/client/coral-admin/src/containers/Dashboard/Dashboard.js b/client/coral-admin/src/containers/Dashboard/Dashboard.js
index 602a48d7f..728d40c07 100644
--- a/client/coral-admin/src/containers/Dashboard/Dashboard.js
+++ b/client/coral-admin/src/containers/Dashboard/Dashboard.js
@@ -5,63 +5,15 @@ import {connect} from 'react-redux';
import {getMetrics} from 'coral-admin/src/graphql/queries';
import FlagWidget from './FlagWidget';
import ActivityWidget from './ActivityWidget';
+import CountdownTimer from 'coral-admin/src/components/CountdownTimer';
import {showBanUserDialog, hideBanUserDialog} from 'coral-admin/src/actions/moderation';
-import I18n from 'coral-framework/modules/i18n/i18n';
-import translations from 'coral-admin/src/translations';
-import {Spinner, Icon} from 'coral-ui';
-const lang = new I18n(translations);
-const refreshIntervalSeconds = 60 * 5;
+import {Spinner} from 'coral-ui';
class Dashboard extends React.Component {
- constructor (props) {
- super(props);
-
- try {
- if (window.localStorage.getItem('coral:dashboardNote') === null) {
- window.localStorage.setItem('coral:dashboardNote', 'show');
- }
- } catch (e) {
-
- // above will fail in Private Mode in some browsers.
- }
-
- this.state = {
- secondsUntilRefresh: refreshIntervalSeconds,
- dashboardNote: window.localStorage.getItem('coral:dashboardNote') || 'show'
- };
- }
-
- componentWillMount () {
- setInterval(() => { // the countdown timer
- let nextCount = this.state.secondsUntilRefresh - 1;
- if (nextCount < 0) {
- nextCount = refreshIntervalSeconds;
- this.props.data.refetch();
- }
- this.setState({secondsUntilRefresh: nextCount});
- }, 1000);
- }
-
- dismissNote = () => {
- try {
- window.localStorage.setItem('coral:dashboardNote', 'hide');
- } catch (e) {
-
- // when setItem fails in Safari Private mode
- this.setState({dashboardNote: 'hide'});
- }
- }
-
- formatTime = () => {
- const minutes = Math.floor(this.state.secondsUntilRefresh / 60);
- let seconds = (this.state.secondsUntilRefresh % 60).toString();
- if (seconds.length < 2) {
- seconds = `0${seconds}`;
- }
-
- return `${minutes}:${seconds}`;
+ reloadData = () => {
+ this.props.data.refetch();
}
render () {
@@ -70,19 +22,16 @@ class Dashboard extends React.Component {
return ;
}
+ console.log('data', this.props.data);
+
const {data: {assetsByActivity, assetsByFlag}} = this.props;
- const hideReloadNote = window.localStorage.getItem('coral:dashboardNote') === 'hide' ||
- this.state.dashboardNote === 'hide'; // for Safari Incognito
+
+ console.log('assetsByActivity', assetsByActivity);
+ console.log('assetsByFlag', assetsByActivity);
return (
-
- ×
- {lang.t('dashboard.next-update', this.formatTime())} {lang.t('dashboard.auto-update')}
-
+