Remove Dashboard

client/coral-admin/src/AppRouter.js

@@ -3,7 +3,6 @@ import PropTypes from 'prop-types';
 import {Router, Route, IndexRedirect, IndexRoute} from 'react-router';
 
 import Configure from 'routes/Configure';
-import Dashboard from 'routes/Dashboard';
 import Install from 'routes/Install';
 import Stories from 'routes/Stories';
 import Community from 'routes/Community/containers/Community';
@@ -18,7 +17,6 @@ const routes = (
       <IndexRedirect to='/admin/moderate' />
       <Route path='configure' component={Configure} />
       <Route path='stories' component={Stories} />
-      <Route path='dashboard' component={Dashboard} />
 
       {/* Community Routes */}
 

client/coral-admin/src/components/Drawer.js

@@ -12,20 +12,14 @@ const CoralDrawer = ({handleLogout, auth = {}}) => (
     { auth && auth.user && can(auth.user, 'ACCESS_ADMIN') ?
       <div>
         <Navigation className={styles.nav}>
-          <IndexLink
-            className={cn('talk-admin-nav-dashboard', styles.navLink)}
-            to="/admin/dashboard"
-            activeClassName={styles.active}>
-            {t('configure.dashboard')}
-          </IndexLink>
           {
             can(auth.user, 'MODERATE_COMMENTS') && (
-              <Link
+              <IndexLink
                 className={cn('talk-admin-nav-moderate', styles.navLink)}   
                 to="/admin/moderate"
                 activeClassName={styles.active}>
                 {t('configure.moderate')}
-              </Link>
+              </IndexLink>
             )
           }
           <Link

client/coral-admin/src/components/ui/Header.js

@@ -23,23 +23,16 @@ const CoralHeader = ({
           {
             auth && auth.user && can(auth.user, 'ACCESS_ADMIN') ?
               <Navigation className={styles.nav}>
-                <IndexLink
-                  id='dashboardNav'
-                  className={cn('talk-admin-nav-dashboard', styles.navLink)}
-                  to="/admin/dashboard"
-                  activeClassName={styles.active}>
-                  {t('configure.dashboard')}
-                </IndexLink>
                 {
                   can(auth.user, 'MODERATE_COMMENTS') && (
-                    <Link
+                    <IndexLink
                       id='moderateNav'
                       className={cn('talk-admin-nav-moderate', styles.navLink)}
                       to="/admin/moderate"
                       activeClassName={styles.active}>
                       {t('configure.moderate')}
                       {(root.premodCount !== 0 || root.reportedCount !== 0) && <Indicator />}
-                    </Link>
+                    </IndexLink>
                   )
                 }
                 <Link

client/coral-admin/src/reducers/dashboard.js

@@ -1,15 +0,0 @@
-// this is initialized here because
-// currently you have to reload the dashboard to get new stats
-// cleaner updates are planned in the future.
-const DASHBOARD_WINDOW_MINUTES = 5;
-let then = new Date();
-then.setMinutes(then.getMinutes() - DASHBOARD_WINDOW_MINUTES);
-
-const initialState = {
-  windowStart: then.toISOString(),
-  windowEnd: new Date().toISOString(),
-};
-
-export default function dashboard (state = initialState, _action) {
-  return state;
-}

client/coral-admin/src/reducers/index.js

@@ -1,6 +1,5 @@
 import auth from './auth';
 import stories from './stories';
-import dashboard from './dashboard';
 import configure from './configure';
 import community from './community';
 import moderation from './moderation';
@@ -13,7 +12,6 @@ import userDetail from './userDetail';
 export default {
   auth,
   banUserDialog,
-  dashboard,
   configure,
   suspendUserDialog,
   userDetail,

client/coral-admin/src/routes/Dashboard/components/ActivityWidget.js

@@ -1,47 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {Link} from 'react-router';
-import styles from './Widget.css';
-import t from 'coral-framework/services/i18n';
-
-const ActivityWidget = ({assets}) => {
-  return (
-    <div className={styles.widget}>
-      <h2 className={styles.heading}>{t('dashboard.most_conversations')}</h2>
-      <div className={styles.widgetHead}>
-        <p>{t('streams.article')}</p>
-        <p>{t('dashboard.comment_count')}</p>
-      </div>
-      <div className={styles.widgetTable}>
-        {
-          assets.length
-            ? assets.map((asset) => {
-              return (
-                <div className={styles.rowLinkify} key={asset.id}>
-                  <Link className={styles.linkToModerate} to={`/admin/moderate/${asset.id}`}>Moderate</Link>
-                  <p className={styles.widgetCount}>{asset.commentCount}</p>
-                  <a className={styles.linkToAsset} href={`${asset.url}`} target="_blank">
-                    <p className={styles.assetTitle}>{asset.title}</p>
-                  </a>
-                  <p className={styles.lede}>{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}</p>
-                </div>
-              );
-            })
-            : <div className={styles.rowLinkify}>{t('dashboard.no_activity')}</div>
-        }
-      </div>
-    </div>
-  );
-};
-
-ActivityWidget.propTypes = {
-  assets: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string,
-    url: PropTypes.string,
-    commentCount: PropTypes.number,
-    author: PropTypes.string,
-    created_at: PropTypes.string
-  })).isRequired
-};
-
-export default ActivityWidget;

client/coral-admin/src/routes/Dashboard/components/CountdownTimer.js

@@ -1,93 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import styles from './Dashboard.css';
-import {Icon} from 'coral-ui';
-
-import t from 'coral-framework/services/i18n';
-const refreshIntervalSeconds = 60 * 5;
-
-// TODO: refactor out storage code into redux.
-
-class CountdownTimer extends React.Component {
-
-  static contextTypes = {
-    storage: PropTypes.object,
-  };
-
-  static propTypes = {
-    handleTimeout: PropTypes.func.isRequired
-  }
-
-  constructor (props, context) {
-    super(props, context);
-    const {storage} = context;
-    try {
-      if (storage && storage.getItem('coral:dashboardNote') === null) {
-        storage.setItem('coral:dashboardNote', 'show');
-      }
-    } catch (e) {
-
-      // above will fail in Private Mode in some browsers.
-    }
-
-    this.state = {
-      secondsUntilRefresh: refreshIntervalSeconds,
-      dashboardNote: (storage && storage.getItem('coral:dashboardNote')) || 'show'
-    };
-  }
-
-  componentWillMount () {
-    this.interval = setInterval(() => { // the countdown timer
-      let nextCount = this.state.secondsUntilRefresh - 1;
-      if (nextCount < 0) {
-        nextCount = refreshIntervalSeconds;
-        return this.props.handleTimeout();
-      }
-      this.setState({secondsUntilRefresh: nextCount});
-    }, 1000);
-  }
-
-  componentWillUnmount () {
-    window.clearInterval(this.interval);
-  }
-
-  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 = () => {
-    const {storage} = this.context;
-    try {
-      if (storage) {
-        storage.setItem('coral:dashboardNote', 'hide');
-      }
-    } catch (e) {
-
-      // when setItem fails in Safari Private mode
-      this.setState({dashboardNote: 'hide'});
-    }
-  }
-
-  render () {
-    const {storage} = this.context;
-    const hideReloadNote = (storage && storage.getItem('coral:dashboardNote') === 'hide') ||
-      this.state.dashboardNote === 'hide'; // for Safari Incognito
-    return (
-      <p
-        style={{display: hideReloadNote ? 'none' : 'block'}}
-        className={styles.autoUpdate}
-        onClick={this.dismissNote}>
-        <b>×</b>
-        <Icon name='timer' /> <strong>{t('dashboard.next_update', this.formatTime())}</strong> {t('dashboard.auto_update')}
-      </p>
-    );
-  }
-}
-
-export default CountdownTimer;

client/coral-admin/src/routes/Dashboard/components/Dashboard.css

@@ -1,40 +0,0 @@
-/**
- * @TODO: deprecated as this file contains styles from multiple components. Please refactor.
- */
-
-.Dashboard {
-  display: flex;
-  max-width: 1280px;
-  margin: 0 auto;
-}
-
-.heading {
-  margin: 0;
-  font-size: 1.5rem;
-  font-weight: bold;
-}
-
-.autoUpdate {
-  background-color: #d5d5d5;
-  padding: 3px 10px 10px 10px;
-  margin-bottom: 0;
-
-  i {
-    position: relative;
-    top: 7px;
-  }
-
-  b {
-    float: right;
-    border-radius: 20px;
-    cursor: pointer;
-    background-color: #c0c0c0;
-    width: 30px;
-    height: 30px;
-    text-align: center;
-    top: 4px;
-    position: relative;
-    line-height: 1.7em;
-    font-size: 1.3em;
-  }
-}

client/coral-admin/src/routes/Dashboard/components/Dashboard.js

@@ -1,15 +0,0 @@
-import React from 'react';
-import FlagWidget from './FlagWidget';
-import ActivityWidget from './ActivityWidget';
-import CountdownTimer from './CountdownTimer';
-import styles from './Dashboard.css';
-
-export default ({root: {assetsByActivity, assetsByFlag}, reloadData}) => (
-  <div>
-    <CountdownTimer handleTimeout={reloadData} />
-    <div className={styles.Dashboard}>
-      <FlagWidget assets={assetsByFlag} />
-      <ActivityWidget assets={assetsByActivity} />
-    </div>
-  </div>
-);

client/coral-admin/src/routes/Dashboard/components/FlagWidget.js

@@ -1,54 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {Link} from 'react-router';
-import styles from './Widget.css';
-
-import t from 'coral-framework/services/i18n';
-
-const FlagWidget = ({assets}) => {
-
-  return (
-    <div className={styles.widget}>
-      <h2 className={styles.heading}>{t('dashboard.most_flags')}</h2>
-      <div className={styles.widgetHead}>
-        <p>{t('streams.article')}</p>
-        <p>{t('dashboard.flags')}</p>
-      </div>
-      <div className={styles.widgetTable}>
-        {
-          assets.length
-            ? assets.map((asset) => {
-              let flagSummary = null;
-              if (asset.action_summaries) {
-                flagSummary = asset.action_summaries.find((s) => s.__typename === 'FlagAssetActionSummary');
-              }
-
-              return (
-                <div className={styles.rowLinkify} key={asset.id}>
-                  <Link className={styles.linkToModerate} to={`/admin/moderate/reported/${asset.id}`}>Moderate</Link>
-                  <p className={styles.widgetCount}>{flagSummary ? flagSummary.actionCount : 0}</p>
-                  <a className={styles.linkToAsset} href={`${asset.url}`} target="_blank">
-                    <p className={styles.assetTitle}>{asset.title}</p>
-                  </a>
-                  <p className={styles.lede}>{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}</p>
-                </div>
-              );
-            })
-            : <div className={styles.rowLinkify}>{t('dashboard.no_flags')}</div>
-        }
-      </div>
-    </div>
-  );
-};
-
-FlagWidget.propTypes = {
-  assets: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string,
-    url: PropTypes.string,
-    action_summaries: PropTypes.array,
-    author: PropTypes.string,
-    created_at: PropTypes.string
-  })).isRequired
-};
-
-export default FlagWidget;

client/coral-admin/src/routes/Dashboard/components/LikeWidget.js

@@ -1,49 +0,0 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import {Link} from 'react-router';
-import styles from './Widget.css';
-import t from 'coral-framework/services/i18n';
-
-const LikeWidget = ({assets}) => {
-
-  return (
-    <div className={styles.widget}>
-      <h2 className={styles.heading}>Articles with the most likes</h2>
-      <div className={styles.widgetHead}>
-        <p>{t('streams.article')}</p>
-        <p>{t('modqueue.likes')}</p>
-      </div>
-      <div className={styles.widgetTable}>
-        {
-          assets.length
-            ? assets.map((asset) => {
-              const likeSummary = asset.action_summaries.find((s) => s.type === 'LikeAssetActionSummary');
-              return (
-                <div className={styles.rowLinkify} key={asset.id}>
-                  <Link className={styles.linkToModerate} to={`/admin/moderate/${asset.id}`}>Moderate</Link>
-                  <p className={styles.widgetCount}>{likeSummary ? likeSummary.actionCount : 0}</p>
-                  <a className={styles.linkToAsset} href={`${asset.url}`} target="_blank">
-                    <p className={styles.assetTitle}>{asset.title}</p>
-                  </a>
-                  <p className={styles.lede}>{asset.author} — Published: {new Date(asset.created_at).toLocaleDateString()}</p>
-                </div>
-              );
-            })
-            : <div className={styles.rowLinkify}>{t('dashboard.no_likes')}</div>
-        }
-      </div>
-    </div>
-  );
-};
-
-LikeWidget.propTypes = {
-  assets: PropTypes.arrayOf(PropTypes.shape({
-    id: PropTypes.string,
-    url: PropTypes.string,
-    action_summaries: PropTypes.array,
-    author: PropTypes.string,
-    created_at: PropTypes.string
-  })).isRequired
-};
-
-export default LikeWidget;

client/coral-admin/src/routes/Dashboard/components/MostLikedCommentsWidget.js

@@ -1,38 +0,0 @@
-import React from 'react';
-
-import ModerationQueue from 'coral-admin/src/containers/ModerationQueue/ModerationQueue';
-import styles from './Widget.css';
-import BanUserDialog from 'coral-admin/src/components/BanUserDialog';
-import t from 'coral-framework/services/i18n';
-
-const MostLikedCommentsWidget = (props) => {
-  const {
-    comments,
-    moderation,
-    settings,
-    handleBanUser,
-    showBanUserDialog,
-    hideBanUserDialog,
-    acceptComment,
-    rejectComment
-  } = props;
-
-  return (
-    <div className={styles.widget}>
-      <h2 className={styles.heading}>{t('most_liked_comments')}</h2>
-      <ModerationQueue
-        comments={comments}
-        suspectWords={settings.wordlist.suspect}
-        showBanUserDialog={showBanUserDialog}
-        acceptComment={acceptComment}
-        rejectComment={rejectComment} />
-      <BanUserDialog
-        open={moderation.banDialog}
-        user={moderation.user}
-        handleClose={hideBanUserDialog}
-        handleBanUser={handleBanUser} />
-    </div>
-  );
-};
-
-export default MostLikedCommentsWidget;

client/coral-admin/src/routes/Dashboard/components/Widget.css

@@ -1,110 +0,0 @@
-/**
- * @TODO: deprecated as this file contains styles from multiple components. Please refactor.
- */
-
-:root {
-  --row-height: 60px;
-}
-
-.widget {
-  margin: 10px 5px 5px 5px;
-  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.2);
-  flex: 1;
-  background-color: white;
-  box-sizing: border-box;
-}
-
-.widget * {
-  box-sizing: border-box;
-}
-
-.heading {
-  margin: 0;
-  padding-left: 10px;
-  font-size: 1.3rem;
-  font-weight: 600;
-  color: #2c2c2c;
-}
-
-.widgetTable {
-  height: calc(var(--row-height) * 10);
-}
-
-.widgetTable + div:after {
-  content: '';
-  clear: both;
-  display: block;
-}
-
-.widgetHead p {
-  color: #2c2c2c;
-  font-weight: 500;
-  padding: 10px;
-  text-align: left;
-  text-transform: capitalize;
-  display: inline-block;
-  box-sizing: border-box;
-  margin-bottom: 0;
-}
-
-.widgetHead p:last-child {
-  float: right;
-  margin-right: 100px;
-}
-
-.rowLinkify {
-  border-bottom: 1px solid lightgrey;
-  color: #555;
-  height: var(--row-height);
-  padding: 10px;
-  transition: background-color 200ms;
-}
-
-.rowLinkify:last-child {
-  border-bottom: none;
-}
-
-.rowLinkify:hover {
-  background-color: #f8f8f8;
-  pointer: default;
-}
-
-.linkToAsset {
-  display: inline-block;
-  text-decoration: none;
-}
-
-.linkToModerate {
-  background-color: #BDBDBD;
-  padding: 10px 14px;
-  text-decoration: none;
-  color: black;
-  float: right;
-  margin-left: 15px;
-  transition: background-color 200ms;
-}
-
-.linkToModerate:hover {
-  background-color: #9E9E9E;
-}
-
-.lede {
-  font-size: 0.9em;
-  color: #aaa;
-}
-
-.assetTitle {
-  color: #555;
-  text-decoration: none;
-  font-size: 1.2em;
-  font-weight: 500;
-  margin: 0;
-}
-
-.widgetCount {
-  color: #555;
-  font-size: 1.3em;
-  font-weight: 400;
-  float: right;
-  margin-top: 7px;
-}

client/coral-admin/src/routes/Dashboard/containers/Dashboard.js

@@ -1,65 +0,0 @@
-import React from 'react';
-import {connect} from 'react-redux';
-import Dashboard from '../components/Dashboard';
-import {compose,  gql} from 'react-apollo';
-import withQuery from 'coral-framework/hocs/withQuery';
-
-import {Spinner} from 'coral-ui';
-
-class DashboardContainer extends React.Component {
-
-  reloadData = () => {
-    this.props.data.refetch();
-  }
-
-  render () {
-    if (this.props.data.loading) {
-      return <Spinner />;
-    }
-    return <Dashboard {...this.props} reloadData={this.reloadData} />;
-  }
-}
-
-export const witDashboardQuery = withQuery(gql`
-  query CoralAdmin_Dashboard($from: Date!, $to: Date!) {
-    assetsByFlag: assetMetrics(from: $from, to: $to, sortBy: FLAG) {
-      ...CoralAdmin_Metrics
-    }
-    assetsByActivity: assetMetrics(from: $from, to: $to, sortBy: ACTIVITY) {
-      ...CoralAdmin_Metrics
-    }
-  }
-  fragment CoralAdmin_Metrics on Asset {
-    id
-    title
-    url
-    author
-    created_at
-    commentCount
-    action_summaries {
-      actionCount
-      actionableItemCount
-    }
-  }
-`, {
-    options: ({windowStart, windowEnd}) => {
-      return {
-        variables: {
-          from: windowStart,
-          to: windowEnd,
-        }
-      };
-    }
-  });
-
-const mapStateToProps = (state) => {
-  return {
-    windowStart: state.dashboard.windowStart,
-    windowEnd: state.dashboard.windowEnd,
-  };
-};
-
-export default compose(
-  connect(mapStateToProps),
-  witDashboardQuery,
-)(DashboardContainer);

client/coral-admin/src/routes/Dashboard/index.js

@@ -1 +0,0 @@
-export {default} from './containers/Dashboard.js';