diff --git a/client/coral-configure/components/ConfigureCommentStream.js b/client/coral-configure/components/ConfigureCommentStream.js index 4be5714c7..a413054cd 100644 --- a/client/coral-configure/components/ConfigureCommentStream.js +++ b/client/coral-configure/components/ConfigureCommentStream.js @@ -2,7 +2,7 @@ import React from 'react'; import {Button, Checkbox} from 'coral-ui'; import styles from './ConfigureCommentStream.css'; -export default ({handleChange, handleApply, changed}) => ( +export default ({handleChange, handleApply, changed, ...props}) => (

Configure Comment Stream

@@ -24,6 +24,7 @@ export default ({handleChange, handleApply, changed}) => ( cStyle={changed ? 'green' : 'darkGrey'} name="premod" onChange={handleChange} + checked={props.premod} info={{ title: 'Enable Premoderation', description: 'Moderators must approve any comment before its published' @@ -36,6 +37,7 @@ export default ({handleChange, handleApply, changed}) => ( cStyle={changed ? 'green' : 'darkGrey'} name="premodLinks" onChange={handleChange} + checked={props.premodLinks} info={{ title: 'Pre-Moderate Comments Containing Links', description: 'Moderators must approve any comment containing a link before its published.' diff --git a/client/coral-configure/containers/ConfigureStreamContainer.js b/client/coral-configure/containers/ConfigureStreamContainer.js index 4da5a266d..d4b71f4e5 100644 --- a/client/coral-configure/containers/ConfigureStreamContainer.js +++ b/client/coral-configure/containers/ConfigureStreamContainer.js @@ -1,7 +1,7 @@ import React, {Component} from 'react'; import {connect} from 'react-redux'; -import {updateOpenStatus} from '../../coral-framework/actions/config'; +import {updateOpenStatus, updateConfiguration} from '../../coral-framework/actions/config'; import CloseCommentsInfo from '../components/CloseCommentsInfo'; import ConfigureCommentStream from '../components/ConfigureCommentStream'; @@ -11,12 +11,28 @@ class ConfigureStreamContainer extends Component { super(props); this.state = { - premod: false, + premod: props.config.moderation === 'pre', premodLinks: false }; this.toggleStatus = this.toggleStatus.bind(this); this.handleChange = this.handleChange.bind(this); + this.handleApply = this.handleApply.bind(this); + } + + handleApply () { + const {premod, changed} = this.state; + const newConfig = { + moderation: premod ? 'pre' : 'post' + }; + if (changed) { + this.props.updateConfiguration(newConfig); + setTimeout(() => { + this.setState({ + changed: false + }); + }, 300); + } } handleChange (e) { @@ -37,8 +53,9 @@ class ConfigureStreamContainer extends Component {

{status === 'open' ? 'Close' : 'Open'} Comment Stream

@@ -57,7 +74,7 @@ const mapStateToProps = (state) => ({ const mapDispatchToProps = dispatch => ({ updateStatus: status => dispatch(updateOpenStatus(status)), - handleApply: () => {} + updateConfiguration: newConfig => dispatch(updateConfiguration(newConfig)) }); export default connect( diff --git a/client/coral-framework/actions/config.js b/client/coral-framework/actions/config.js index 6dc880434..6cab702f0 100644 --- a/client/coral-framework/actions/config.js +++ b/client/coral-framework/actions/config.js @@ -1,18 +1,33 @@ import coralApi from '../helpers/response'; -/* Config Actions */ +import * as actions from '../constants/config'; +import {addNotification} from '../actions/notification'; -/** - * Action name constants - */ - -export const OPEN_COMMENTS = 'OPEN_COMMENTS'; -export const CLOSE_COMMENTS = 'CLOSE_COMMENTS'; -export const ADD_ITEM = 'ADD_ITEM'; +import I18n from 'coral-framework/modules/i18n/i18n'; +import translations from './../translations'; +const lang = new I18n(translations); export const updateOpenStatus = status => (dispatch, getState) => { const assetId = getState().items.get('assets') .keySeq() .toArray()[0]; return coralApi(`/asset/${assetId}/status?status=${status}`, {method: 'PUT'}) - .then(() => dispatch({type: status === 'open' ? OPEN_COMMENTS : CLOSE_COMMENTS})); + .then(() => dispatch({type: status === 'open' ? actions.OPEN_COMMENTS : actions.CLOSE_COMMENTS})); +}; + +const updateConfigRequest = () => ({type: actions.UPDATE_CONFIG_REQUEST}); +const updateConfigSuccess = config => ({type: actions.UPDATE_CONFIG_SUCCESS, config}); +const updateConfigFailure = () => ({type: actions.UPDATE_CONFIG_FAILURE}); + +export const updateConfiguration = newConfig => (dispatch, getState) => { + const assetId = getState().items.get('assets') + .keySeq() + .toArray()[0]; + + dispatch(updateConfigRequest()); + coralApi(`/asset/${assetId}/settings`, {method: 'PUT', body: newConfig}) + .then(({settings}) => { + dispatch(addNotification('success', lang.t('successUpdateSettings'))); + dispatch(updateConfigSuccess(settings)); + }) + .catch(error => dispatch(updateConfigFailure(error))); }; diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js index 2029714c7..cdaa7c1a6 100644 --- a/client/coral-framework/actions/items.js +++ b/client/coral-framework/actions/items.js @@ -1,14 +1,9 @@ import coralApi from '../helpers/response'; import {fromJS} from 'immutable'; -/* Item Actions */ - -/** - * Action name constants - */ +import {UPDATE_CONFIG} from '../constants/config'; export const ADD_ITEM = 'ADD_ITEM'; export const UPDATE_ITEM = 'UPDATE_ITEM'; -export const UPDATE_SETTINGS = 'UPDATE_SETTINGS'; export const APPEND_ITEM_ARRAY = 'APPEND_ITEM_ARRAY'; /** @@ -106,7 +101,7 @@ export function getStream (assetUrl) { dispatch(addItem(action, 'actions')); }); } else if (type === 'settings') { - dispatch({type: UPDATE_SETTINGS, config: fromJS(json[type])}); + dispatch({type: UPDATE_CONFIG, config: fromJS(json[type])}); } else { json[type].forEach(item => { dispatch(addItem(item, type)); diff --git a/client/coral-framework/constants/config.js b/client/coral-framework/constants/config.js new file mode 100644 index 000000000..5dca44ba9 --- /dev/null +++ b/client/coral-framework/constants/config.js @@ -0,0 +1,9 @@ +export const UPDATE_CONFIG_REQUEST = 'UPDATE_CONFIG_REQUEST'; +export const UPDATE_CONFIG_SUCCESS = 'UPDATE_CONFIG_SUCCESS'; +export const UPDATE_CONFIG_FAILURE = 'UPDATE_CONFIG_FAILURE'; + +export const UPDATE_CONFIG = 'UPDATE_CONFIG'; + +export const OPEN_COMMENTS = 'OPEN_COMMENTS'; +export const CLOSE_COMMENTS = 'CLOSE_COMMENTS'; +export const ADD_ITEM = 'ADD_ITEM'; diff --git a/client/coral-framework/reducers/config.js b/client/coral-framework/reducers/config.js index 9620f5b97..0a8a01291 100644 --- a/client/coral-framework/reducers/config.js +++ b/client/coral-framework/reducers/config.js @@ -1,30 +1,28 @@ -/* @flow */ - import {Map} from 'immutable'; -import * as actions from '../actions/config'; +import * as actions from '../constants/config'; const initialState = Map({ features: Map({}), - status: 'open' + status: 'open', + moderation: null }); export default (state = initialState, action) => { switch(action.type) { - // Override config if worked - case actions.UPDATE_SETTINGS: - return action.config; - + case actions.UPDATE_CONFIG: + return state + .merge(Map(action.config)); + case actions.UPDATE_CONFIG_SUCCESS: + return state + .merge(Map(action.settings)); case actions.OPEN_COMMENTS: - return state.set('status', 'open'); - + return state + .set('status', 'open'); case actions.CLOSE_COMMENTS: - return state.set('status', 'closed'); - + return state + .set('status', 'closed'); case actions.ADD_ITEM: - return action.item_type === 'assets' ? - state.set('status', action.item.status) - : state; - + return action.item_type === 'assets' ? state.set('status', action.item.status) : state; default: return state; } diff --git a/client/coral-framework/translations.json b/client/coral-framework/translations.json index ab65ba565..06a39944a 100644 --- a/client/coral-framework/translations.json +++ b/client/coral-framework/translations.json @@ -1,5 +1,6 @@ { "en": { + "successUpdateSettings": "The changes you have made have been applied to the comment stream on this article", "successBioUpdate": "Your Bio has been updated", "contentNotAvailable": "This content is not available", "suspendedAccountMsg": "Your account is currently suspended. This means that you cannot Like, Flag, or write comments. Please contact moderator@fakeurl.com for more information", @@ -13,6 +14,7 @@ } }, "es": { + "successUpdateSettings": "La configuración de este articulo fue actualizada", "successBioUpdate": "Tu bio fue actualizada", "contentNotAvailable": "El contenido no se encuentra disponible", "suspendedAccountMsg": "Tu cuenta se encuentra suspendida. Esto significa que no puedes dar Like, Marcar o escribir commentarios. Por favor, contacta moderator@fakeurl for more information", diff --git a/client/coral-ui/components/Checkbox.js b/client/coral-ui/components/Checkbox.js index c4cf6363d..94626295f 100644 --- a/client/coral-ui/components/Checkbox.js +++ b/client/coral-ui/components/Checkbox.js @@ -1,9 +1,9 @@ import React from 'react'; import styles from './Checkbox.css'; -export default ({name, cStyle = 'base', onChange, label, className, info}) => ( +export default ({name, cStyle = 'base', onChange, label, className, info, checked = 'false'}) => (