From 9e2f6f1f63922239f2a6fcc003a24659bc00d798 Mon Sep 17 00:00:00 2001 From: Chi Vinh Le Date: Fri, 25 Aug 2017 19:40:55 +0700 Subject: [PATCH] Use factory --- client/coral-embed-stream/src/actions/stream.js | 2 +- client/coral-embed-stream/src/reducers/stream.js | 4 ++-- plugin-api/beta/client/factories/index.js | 4 ++++ plugin-api/beta/client/hocs/withSortOption.js | 6 +++--- .../client/components/SortOption.css | 9 --------- .../client/components/SortOption.js | 15 --------------- .../client/containers/SortOption.js | 4 ---- .../client/containers/SortOptionNewest.js | 4 ---- plugins/talk-plugin-sort-oldest/client/index.js | 14 +++++++++----- .../client/translations.yml | 1 + 10 files changed, 20 insertions(+), 43 deletions(-) create mode 100644 plugin-api/beta/client/factories/index.js delete mode 100644 plugins/talk-plugin-sort-oldest/client/components/SortOption.css delete mode 100644 plugins/talk-plugin-sort-oldest/client/components/SortOption.js delete mode 100644 plugins/talk-plugin-sort-oldest/client/containers/SortOption.js delete mode 100644 plugins/talk-plugin-sort-oldest/client/containers/SortOptionNewest.js diff --git a/client/coral-embed-stream/src/actions/stream.js b/client/coral-embed-stream/src/actions/stream.js index d7301f8a1..5e5bede81 100644 --- a/client/coral-embed-stream/src/actions/stream.js +++ b/client/coral-embed-stream/src/actions/stream.js @@ -5,7 +5,7 @@ import queryString from 'query-string'; export const setActiveReplyBox = (id) => ({type: actions.SET_ACTIVE_REPLY_BOX, id}); -export const setSort = ({order, by}) => ({type: actions.SET_SORT, order, by}); +export const setSort = ({sortOrder, sortBy}) => ({type: actions.SET_SORT, sortOrder, sortBy}); export const viewAllComments = () => { diff --git a/client/coral-embed-stream/src/reducers/stream.js b/client/coral-embed-stream/src/reducers/stream.js index dd1817769..578c66017 100644 --- a/client/coral-embed-stream/src/reducers/stream.js +++ b/client/coral-embed-stream/src/reducers/stream.js @@ -71,8 +71,8 @@ export default function stream(state = initialState, action) { case actions.SET_SORT : return { ...state, - sortOrder: action.order ? action.order : state.order, - sortBy: action.by ? action.by : state.by, + sortOrder: action.sortOrder ? action.sortOrder : state.sortOrder, + sortBy: action.sortBy ? action.sortBy : state.sortBy, }; default: return state; diff --git a/plugin-api/beta/client/factories/index.js b/plugin-api/beta/client/factories/index.js new file mode 100644 index 000000000..485651821 --- /dev/null +++ b/plugin-api/beta/client/factories/index.js @@ -0,0 +1,4 @@ +import withSortOption from '../hocs/withSortOption'; +import SortOption from '../components/SortOption'; + +export const createSortOption = (label, sort) => withSortOption({...sort, label})(SortOption); diff --git a/plugin-api/beta/client/hocs/withSortOption.js b/plugin-api/beta/client/hocs/withSortOption.js index 16162710d..7870b668e 100644 --- a/plugin-api/beta/client/hocs/withSortOption.js +++ b/plugin-api/beta/client/hocs/withSortOption.js @@ -18,14 +18,14 @@ const mapDispatchToProps = (dispatch) => dispatch ); -export default ({by = 'created_at', order = 'DESC', label}) => hoistStatics((WrappedComponent) => { +export default ({sortBy = 'created_at', sortOrder = 'DESC', label}) => hoistStatics((WrappedComponent) => { class WithSortOption extends React.Component { setSort = () => { - this.props.setSort({by, order}); + this.props.setSort({sortBy, sortOrder}); } render() { - const active = this.props.sortOrder === order && this.props.sortBy === by; + const active = this.props.sortOrder === sortOrder && this.props.sortBy === sortBy; const resolvedLabel = typeof label === 'function' ? label() : label; return ( - - - - ); - } -} diff --git a/plugins/talk-plugin-sort-oldest/client/containers/SortOption.js b/plugins/talk-plugin-sort-oldest/client/containers/SortOption.js deleted file mode 100644 index 9c4567f18..000000000 --- a/plugins/talk-plugin-sort-oldest/client/containers/SortOption.js +++ /dev/null @@ -1,4 +0,0 @@ -import {withSortOption} from 'plugin-api/beta/client/hocs'; -import SortOption from '../components/SortOption'; - -export default withSortOption({by: 'CREATED_AT', order: 'ASC', label: 'Oldest first'})(SortOption); diff --git a/plugins/talk-plugin-sort-oldest/client/containers/SortOptionNewest.js b/plugins/talk-plugin-sort-oldest/client/containers/SortOptionNewest.js deleted file mode 100644 index 7ab5dcad7..000000000 --- a/plugins/talk-plugin-sort-oldest/client/containers/SortOptionNewest.js +++ /dev/null @@ -1,4 +0,0 @@ -import {withSortOption} from 'plugin-api/beta/client/hocs'; -import SortOption from '../components/SortOption'; - -export default withSortOption({by: 'CREATED_AT', order: 'DESC', label: 'Newest first'})(SortOption); diff --git a/plugins/talk-plugin-sort-oldest/client/index.js b/plugins/talk-plugin-sort-oldest/client/index.js index 5d3f08ee8..a1aac7709 100644 --- a/plugins/talk-plugin-sort-oldest/client/index.js +++ b/plugins/talk-plugin-sort-oldest/client/index.js @@ -1,15 +1,19 @@ import translations from './translations.yml'; -import SortOption from './containers/SortOption'; -import SortOptionNewest from './containers/SortOptionNewest'; +import {createSortOption} from 'plugin-api/beta/client/factories'; +import {t} from 'plugin-api/beta/client/services'; + +const SortOption = createSortOption( + () => t('talk-plugin-sort-oldest.label'), + {sortBy: 'CREATED_AT', sortOrder: 'ASC'}, +); /** - * talk-plugin-sort-oldest depends on talk-plugin-viewing-options - * in other to display sort option. + * talk-plugin-sort-oldest depends on talk-plugin-viewing-options. */ export default { translations, slots: { - viewingOptionsSort: [SortOptionNewest, SortOption] + viewingOptionsSort: [SortOption] } }; diff --git a/plugins/talk-plugin-sort-oldest/client/translations.yml b/plugins/talk-plugin-sort-oldest/client/translations.yml index 50645be77..66e59b823 100644 --- a/plugins/talk-plugin-sort-oldest/client/translations.yml +++ b/plugins/talk-plugin-sort-oldest/client/translations.yml @@ -1,4 +1,5 @@ en: talk-plugin-sort-oldest: + label: Oldest first es: talk-plugin-sort-oldest: