From 04298aca7d39d739e5d98a6fb7c353e66f4656ca Mon Sep 17 00:00:00 2001 From: Riley Davis Date: Tue, 14 Mar 2017 16:30:02 -0600 Subject: [PATCH] change Stream > Story sometimes --- client/coral-admin/src/AppRouter.js | 4 +- .../coral-admin/src/components/ui/Drawer.js | 4 +- .../coral-admin/src/components/ui/Header.js | 4 +- .../Streams.css => Stories/Stories.css} | 0 .../Streams.js => Stories/Stories.js} | 6 +- .../src/containers/Streams/Stories.js | 187 ++++++++++++++++++ client/coral-admin/src/translations.json | 10 +- 7 files changed, 201 insertions(+), 14 deletions(-) rename client/coral-admin/src/containers/{Streams/Streams.css => Stories/Stories.css} (100%) rename client/coral-admin/src/containers/{Streams/Streams.js => Stories/Stories.js} (97%) create mode 100644 client/coral-admin/src/containers/Streams/Stories.js diff --git a/client/coral-admin/src/AppRouter.js b/client/coral-admin/src/AppRouter.js index 38d06dcb1..a2990677f 100644 --- a/client/coral-admin/src/AppRouter.js +++ b/client/coral-admin/src/AppRouter.js @@ -1,7 +1,7 @@ import React from 'react'; import {Router, Route, IndexRoute, IndexRedirect, browserHistory} from 'react-router'; -import Streams from 'containers/Streams/Streams'; +import Stories from 'containers/Stories/Stories'; import Configure from 'containers/Configure/Configure'; import LayoutContainer from 'containers/LayoutContainer'; import InstallContainer from 'containers/Install/InstallContainer'; @@ -18,7 +18,7 @@ const routes = ( - + {/* Moderation Routes */} diff --git a/client/coral-admin/src/components/ui/Drawer.js b/client/coral-admin/src/components/ui/Drawer.js index 9af651f3b..5ac55045c 100644 --- a/client/coral-admin/src/components/ui/Drawer.js +++ b/client/coral-admin/src/components/ui/Drawer.js @@ -23,9 +23,9 @@ const CoralDrawer = ({handleLogout, restricted = false}) => ( {lang.t('configure.moderate')} - {lang.t('configure.streams')} + {lang.t('configure.stories')} ( - {lang.t('configure.streams')} + {lang.t('configure.stories')} { }; }; -export default connect(mapStateToProps, mapDispatchToProps)(Streams); +export default connect(mapStateToProps, mapDispatchToProps)(Stories); const lang = new I18n(translations); diff --git a/client/coral-admin/src/containers/Streams/Stories.js b/client/coral-admin/src/containers/Streams/Stories.js new file mode 100644 index 000000000..4d2ad086a --- /dev/null +++ b/client/coral-admin/src/containers/Streams/Stories.js @@ -0,0 +1,187 @@ +import React, {Component} from 'react'; +import styles from './Stories.css'; +import {connect} from 'react-redux'; +import I18n from 'coral-framework/modules/i18n/i18n'; +import {fetchAssets, updateAssetState} from '../../actions/assets'; +import translations from '../../translations.json'; +import {Link} from 'react-router'; + +import {Pager, Icon} from 'coral-ui'; +import {DataTable, TableHeader, RadioGroup, Radio} from 'react-mdl'; +import EmptyCard from 'coral-admin/src/components/EmptyCard'; + +const limit = 25; + +class Stories extends Component { + + state = { + search: '', + sort: 'desc', + filter: 'all', + statusMenus: {}, + timer: null, + page: 0 + } + + componentDidMount () { + this.props.fetchAssets(0, limit, '', this.state.sortBy); + } + + onSettingChange = (setting) => (e) => { + let options = this.state; + this.setState({[setting]: e.target.value}); + options[setting] = e.target.value; + this.props.fetchAssets(0, limit, options.search, options.sort, options.filter); + } + + onSearchChange = (e) => { + const search = e.target.value; + this.setState((prevState) => { + prevState.search = search; + clearTimeout(prevState.timer); + const fetchAssets = this.props.fetchAssets; + prevState.timer = setTimeout(() => { + fetchAssets(0, limit, search, this.state.sort, this.state.filter); + }, 350); + return prevState; + }); + } + + renderDate = (date) => { + const d = new Date(date); + return `${d.getMonth() + 1}/${d.getDate()}/${d.getFullYear()}`; + } + + onStatusClick = (closeStream, id, statusMenuOpen) => () => { + if (statusMenuOpen) { + this.setState(prev => { + prev.statusMenus[id] = false; + return prev; + }); + this.props.updateAssetState(id, closeStream ? Date.now() : null) + .then(() => { + const {search, sort, filter, page} = this.state; + this.props.fetchAssets(page, limit, search, sort, filter); + }); + } else { + this.setState(prev => { + prev.statusMenus[id] = true; + return prev; + }); + } + } + + renderTitle = (title, {id}) => {title} + + renderStatus = (closedAt, {id}) => { + const closed = closedAt && new Date(closedAt).getTime() < Date.now(); + const statusMenuOpen = this.state.statusMenus[id]; + return
+
+ {!statusMenuOpen && } + {closed ? lang.t('streams.closed') : lang.t('streams.open')} +
+ { + statusMenuOpen && +
+ {!closed ? lang.t('streams.closed') : lang.t('streams.open')} +
+ } +
; + } + + onPageClick = (page) => { + this.setState({page}); + const {search, sort, filter} = this.state; + this.props.fetchAssets((page - 1) * limit, limit, search, sort, filter); + } + + render () { + const {search, sort, filter} = this.state; + const {assets} = this.props; + + const assetsIds = assets.ids.map((id) => assets.byId[id]); + + return ( +
+
+
+ + +
+
{lang.t('streams.filter-streams')}
+
{lang.t('streams.stream-status')}
+ + {lang.t('streams.all')} + {lang.t('streams.open')} + {lang.t('streams.closed')} + +
{lang.t('streams.sort-by')}
+ + {lang.t('streams.newest')} + {lang.t('streams.oldest')} + +
+ { + assetsIds.length + ?
+ + {lang.t('streams.article')} + + {lang.t('streams.pubdate')} + + + {lang.t('streams.status')} + + + +
+ : {lang.t('streams.empty_result')} + } +
+ ); + } +} + +const mapStateToProps = ({assets}) => { + return { + assets: assets.toJS() + }; +}; + +const mapDispatchToProps = (dispatch) => { + return { + fetchAssets: (...args) => { + dispatch(fetchAssets.apply(this, args)); + }, + updateAssetState: (...args) => dispatch(updateAssetState.apply(this, args)) + }; +}; + +export default connect(mapStateToProps, mapDispatchToProps)(Stories); + +const lang = new I18n(translations); diff --git a/client/coral-admin/src/translations.json b/client/coral-admin/src/translations.json index 58788e546..91fa60d43 100644 --- a/client/coral-admin/src/translations.json +++ b/client/coral-admin/src/translations.json @@ -81,7 +81,7 @@ "moderate": "Moderate", "configure": "Configure", "community": "Community", - "streams": "Streams", + "stories": "Stories", "closed-comments-desc": "Write a message to be displayed when when your comment stream is closed and no longer accepting comments.", "closed-comments-label": "Write a message...", "hours": "Hours", @@ -138,9 +138,9 @@ "sort-by": "Sort By", "open": "Open", "closed": "Closed", - "article": "Article", + "article": "Story", "pubdate": "Publication Date", - "status": "Status" + "status": "Stream Status" } }, "es": { @@ -212,7 +212,7 @@ "moderate": "Moderar", "configure": "Configurar", "community": "Comunidad", - "streams": "Streams", + "stories": "Artículos", "closed-comments-desc": "Escribe un mensaje que será mostrado cuando los comentarios estén cerrados y no se acepten más comentarios.", "closed-comments-label": "Escribe un mensaje...", "never": "Nunca", @@ -259,7 +259,7 @@ "sort-by": "", "open": "", "closed": "", - "article": "", + "article": "artículo", "pubdate": "", "status": "" }