diff --git a/client/coral-configure/components/ConfigureCommentStream.js b/client/coral-configure/components/ConfigureCommentStream.js index 507c764d7..e8978a713 100644 --- a/client/coral-configure/components/ConfigureCommentStream.js +++ b/client/coral-configure/components/ConfigureCommentStream.js @@ -7,47 +7,47 @@ import translations from '../translations.json'; const lang = new I18n(translations); export default ({handleChange, handleApply, changed, ...props}) => ( -
-
-

{lang.t('configureCommentStream.title')}

-

{lang.t('configureCommentStream.description')}

- -
- -
+ cStyle={changed ? 'green' : 'darkGrey'} > + {lang.t('configureCommentStream.apply')} + + + + + ); diff --git a/client/coral-configure/containers/ConfigureStreamContainer.js b/client/coral-configure/containers/ConfigureStreamContainer.js index 90835ab3f..dfe94de42 100644 --- a/client/coral-configure/containers/ConfigureStreamContainer.js +++ b/client/coral-configure/containers/ConfigureStreamContainer.js @@ -1,8 +1,9 @@ import React, {Component} from 'react'; import {connect} from 'react-redux'; +import {compose} from 'react-apollo'; -import {I18n} from '../../coral-framework'; -import {updateOpenStatus, updateConfiguration} from '../../coral-framework/actions/asset'; +import {I18n} from 'coral-framework'; +import {updateOpenStatus, updateConfiguration} from 'coral-framework/actions/asset'; import CloseCommentsInfo from '../components/CloseCommentsInfo'; import ConfigureCommentStream from '../components/ConfigureCommentStream'; @@ -13,11 +14,8 @@ class ConfigureStreamContainer extends Component { constructor (props) { super(props); - console.log('moderation', props.asset.settings.moderation); - this.state = { - premod: props.asset.settings.moderation === 'PRE', - premodLinks: false + changed: false }; this.toggleStatus = this.toggleStatus.bind(this); @@ -25,11 +23,18 @@ class ConfigureStreamContainer extends Component { this.handleApply = this.handleApply.bind(this); } - handleApply () { - const {premod, changed} = this.state; + handleApply (e) { + e.preventDefault(); + const {elements} = e.target; + const premod = elements.premod.checked; + + // const premodLinks = elements.premodLinks.checked; + const {changed} = this.state; + const newConfig = { moderation: premod ? 'PRE' : 'POST' }; + if (changed) { this.props.updateConfiguration(newConfig); setTimeout(() => { @@ -40,16 +45,16 @@ class ConfigureStreamContainer extends Component { } } - handleChange (e) { - const {name, checked} = e.target; + handleChange () { this.setState({ - [name]: checked, changed: true }); } toggleStatus () { - this.props.updateStatus(this.props.asset.closedAt === null ? 'closed' : 'open'); + this.props.updateStatus( + this.props.asset.closedAt === null ? 'closed' : 'open' + ); } getClosedIn () { @@ -60,13 +65,16 @@ class ConfigureStreamContainer extends Component { render () { const status = this.props.asset.closedAt === null ? 'open' : 'closed'; + const premod = this.props.asset.settings.moderation === 'PRE'; + return (

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

@@ -89,7 +97,6 @@ const mapDispatchToProps = dispatch => ({ updateConfiguration: newConfig => dispatch(updateConfiguration(newConfig)) }); -export default connect( - mapStateToProps, - mapDispatchToProps +export default compose( + connect(mapStateToProps, mapDispatchToProps) )(ConfigureStreamContainer); diff --git a/client/coral-embed-stream/src/Embed.js b/client/coral-embed-stream/src/Embed.js index 5922266fa..416c7fef8 100644 --- a/client/coral-embed-stream/src/Embed.js +++ b/client/coral-embed-stream/src/Embed.js @@ -9,8 +9,8 @@ const {logout, showSignInDialog} = authActions; const {addNotification, clearNotification} = notificationActions; const {fetchAssetSuccess} = assetActions; -import {queryStream} from './graphql/queries'; -import {postComment, postAction, deleteAction} from './graphql/mutations'; +import {queryStream} from 'coral-framework/graphql/queries'; +import {postComment, postAction, deleteAction} from 'coral-framework/graphql/mutations'; import {Notification, notificationActions, authActions, assetActions, pym} from 'coral-framework'; import Stream from './Stream'; @@ -90,9 +90,12 @@ class Embed extends Component { render () { const {activeTab} = this.state; + const {closedAt} = this.props.asset; const {loading, asset, refetch} = this.props.data; const {loggedIn, isAdmin, user, showSignInDialog, signInOffset} = this.props.auth; + const openStream = closedAt === null; + const expandForLogin = showSignInDialog ? { minHeight: document.body.scrollHeight + 200 } : {}; @@ -109,7 +112,7 @@ class Embed extends Component { {loggedIn && } { - asset.closedAt === null + openStream ?
({ - items: state.items.toJS(), notification: state.notification.toJS(), auth: state.auth.toJS(), - userData: state.user.toJS() + userData: state.user.toJS(), + asset: state.asset.toJS() }); const mapDispatchToProps = dispatch => ({ diff --git a/client/coral-embed-stream/src/graphql/mutations/postComment.graphql b/client/coral-embed-stream/src/graphql/mutations/postComment.graphql deleted file mode 100644 index a9496f1fa..000000000 --- a/client/coral-embed-stream/src/graphql/mutations/postComment.graphql +++ /dev/null @@ -1,23 +0,0 @@ - - fragment commentView on Comment { - id - body - status - user { - name: displayName - } - actions { - type: action_type - count - current: current_user { - id - created_at - } - } - } - -mutation CreateComment ($asset_id: ID!, $parent_id: ID, $body: String!) { - createComment(asset_id:$asset_id, parent_id:$parent_id, body:$body) { - ...commentView - } -} diff --git a/client/coral-framework/actions/asset.js b/client/coral-framework/actions/asset.js index b8474857c..d5db289c3 100644 --- a/client/coral-framework/actions/asset.js +++ b/client/coral-framework/actions/asset.js @@ -10,30 +10,30 @@ export const fetchAssetRequest = () => ({type: actions.FETCH_ASSET_REQUEST}); export const fetchAssetSuccess = asset => ({type: actions.FETCH_ASSET_SUCCESS, asset}); export const fetchAssetFailure = error => ({type: actions.FETCH_ASSET_FAILURE, error}); -const updateConfigRequest = () => ({type: actions.UPDATE_CONFIG_REQUEST}); -const updateConfigSuccess = config => ({type: actions.UPDATE_CONFIG_SUCCESS, config}); -const updateConfigFailure = () => ({type: actions.UPDATE_CONFIG_FAILURE}); +const updateAssetSettingsRequest = () => ({type: actions.UPDATE_ASSET_SETTINGS_REQUEST}); +const updateAssetSettingsSuccess = settings => ({type: actions.UPDATE_ASSET_SETTINGS_SUCCESS, settings}); +const updateAssetSettingsFailure = () => ({type: actions.UPDATE_ASSET_SETTINGS_FAILURE}); export const updateConfiguration = newConfig => (dispatch, getState) => { const assetId = getState().asset.toJS().id; - dispatch(updateConfigRequest()); + dispatch(updateAssetSettingsRequest()); coralApi(`/assets/${assetId}/settings`, {method: 'PUT', body: newConfig}) .then(() => { dispatch(addNotification('success', lang.t('successUpdateSettings'))); - dispatch(updateConfigSuccess(newConfig)); + dispatch(updateAssetSettingsSuccess(newConfig)); }) - .catch(error => dispatch(updateConfigFailure(error))); + .catch(error => dispatch(updateAssetSettingsFailure(error))); }; export const updateOpenStream = closedBody => (dispatch, getState) => { const assetId = getState().asset.toJS().id; - dispatch(updateConfigRequest()); + dispatch(fetchAssetRequest()); coralApi(`/assets/${assetId}/status`, {method: 'PUT', body: closedBody}) .then(() => { dispatch(addNotification('success', lang.t('successUpdateSettings'))); - dispatch(updateConfigSuccess(closedBody)); + dispatch(fetchAssetSuccess(closedBody)); }) - .catch(error => dispatch(updateConfigFailure(error))); + .catch(error => dispatch(fetchAssetFailure(error))); }; const openStream = () => ({type: actions.OPEN_COMMENTS}); diff --git a/client/coral-framework/actions/auth.js b/client/coral-framework/actions/auth.js index e815fd5d0..f7bce4808 100644 --- a/client/coral-framework/actions/auth.js +++ b/client/coral-framework/actions/auth.js @@ -3,7 +3,6 @@ import translations from './../translations'; const lang = new I18n(translations); import * as actions from '../constants/auth'; import coralApi, {base} from '../helpers/response'; -import {addItem} from './items'; // Dialog Actions export const showSignInDialog = (offset = 0) => ({type: actions.SHOW_SIGNIN_DIALOG, offset}); @@ -30,7 +29,6 @@ export const fetchSignIn = (formData) => (dispatch) => { const isAdmin = !!user.roles.filter(i => i === 'ADMIN').length; dispatch(signInSuccess(user, isAdmin)); dispatch(hideSignInDialog()); - dispatch(addItem(user, 'users')); }) .catch(() => dispatch(signInFailure(lang.t('error.emailPasswordError')))); }; @@ -59,7 +57,6 @@ export const facebookCallback = (err, data) => dispatch => { const user = JSON.parse(data); dispatch(signInFacebookSuccess(user)); dispatch(hideSignInDialog()); - dispatch(addItem(user, 'users')); } catch (err) { dispatch(signInFacebookFailure(err)); return; diff --git a/client/coral-framework/actions/items.js b/client/coral-framework/actions/items.js deleted file mode 100644 index e289e9f60..000000000 --- a/client/coral-framework/actions/items.js +++ /dev/null @@ -1,268 +0,0 @@ -import coralApi from '../helpers/response'; -import {fromJS} from 'immutable'; -import {UPDATE_CONFIG} from '../constants/config'; - -/** -* Action name constants -*/ - -export const ADD_ITEM = 'ADD_ITEM'; -export const UPDATE_ITEM = 'UPDATE_ITEM'; -export const APPEND_ITEM_ARRAY = 'APPEND_ITEM_ARRAY'; - -/** - * Action creators - */ - - /* - * Adds an item to the local store without posting it to the server - * Useful for optimistic posting, etc. - * - * @params - * item - the item to be posted - * - */ - -export const addItem = (item, item_type) => { - if (!item.id) { - console.warn('addItem called without an item id.'); - } - return { - type: ADD_ITEM, - item, - item_type, - id: item.id - }; -}; - -/* -* Updates an item in the local store without posting it to the server -* Useful for item-level toggles, etc. -* -* @params -* id - the id of the item to be posted -* property - the property to be updated -* value - the value that the property should be set to -* item_type - the type of the item being updated (users, comments, etc) -* -*/ -export const updateItem = (id, property, value, item_type) => { - return { - type: UPDATE_ITEM, - id, - property, - value, - item_type - }; -}; - -/* -* Appends data to an array in an item in the local store without posting it to the server -* Useful for adding a recently posted reply to a comment, etc. -* -* @params -* id - the id of the item to be posted -* property - the property to be updated (should be an array) -* value - the value that should be added to the array -* add_to_front - boolean that defines whether value is added at the beginning (unshift) or end (push) -* item_type - the type of the item being updated (users, comments, etc) -* -*/ -export const appendItemArray = (id, property, value, add_to_front, item_type) => { - return { - type: APPEND_ITEM_ARRAY, - id, - property, - value, - add_to_front, - item_type - }; -}; - -/* -* Get Items from Query -* Gets a set of items from a predefined query -* -* @params -* Query - a predefiend query for retreiving items -* -* @returns -* A promise resolving to a set of items -* -* @dispatches -* A set of items to the item store -*/ -export function getStream (assetUrl) { - return (dispatch) => { - return coralApi(`/stream?asset_url=${encodeURIComponent(assetUrl)}`) - .then((json) => { - - /* Add items to the store */ - Object.keys(json).forEach(type => { - if (type === 'actions') { - json[type].forEach(action => { - action.id = `${action.action_type}_${action.item_id}`; - dispatch(addItem(action, 'actions')); - }); - } else if (type === 'settings') { - dispatch({type: UPDATE_CONFIG, config: fromJS(json[type])}); - } else { - json[type].forEach(item => { - dispatch(addItem(item, type)); - }); - } - }); - - const assetId = json.assets[0].id; - - /* Sort comments by date*/ - json.comments.sort((a, b) => new Date(b.created_at).getTime() - new Date(a.created_at).getTime()); - const rels = json.comments.reduce((h, item) => { - - /* Check for root and child comments. */ - if ( - item.asset_id === assetId && - !item.parent_id) { - h.rootComments.push(item.id); - } else if ( - item.asset_id === assetId - ) { - let children = h.childComments[item.parent_id] || []; - h.childComments[item.parent_id] = children.concat(item.id); - } - return h; - }, {rootComments: [], childComments: {}}); - - dispatch(updateItem(assetId, 'comments', rels.rootComments, 'assets')); - - Object.keys(rels.childComments).forEach(key => { - dispatch(updateItem(key, 'children', rels.childComments[key].reverse(), 'comments')); - }); - - /* Hydrate actions on comments */ - json.actions.forEach(action => { - dispatch(updateItem(action.item_id, action.action_type, action.id, 'comments')); - }); - - return (json); - }); - }; -} - -/* -* Get Items Array -* Gets a set of items from an array of item ids -* -* @params -* Query - a predefiend query for retreiving items -* -* @returns -* A promise resolving to a set of items -* -* @dispatches -* A set of items to the item store -*/ - -export function getItemsArray (ids) { - return (dispatch) => { - return coralApi(`/item/${ids}`) - .then((json) => { - for (let i = 0; i < json.items.length; i++) { - dispatch(addItem(json.items[i])); - } - return json.items; - }); - }; -} - -/* -* PutItem -* Puts an item -* -* @params -* Item - the item to be put -* -* @returns -* A promise resolving to an item is -* -* @dispatches -* The newly put item to the item store -*/ - -export function postItem (item, type, id, mutate) { - console.log( - item, - type, - id, - mutate - ); - mutate({ - variables: { - asset_id: id, - body: item, - parent_id: null - } - }).then(({data}) => { - console.log('it workt'); - console.log(data); - }); - - // return (dispatch) => { - // if (id) { - // item.id = id; - // } - // return coralApi(`/${type}`, {method: 'POST', body: item}) - // .then((json) => { - // dispatch(addItem({...item, id:json.id}, type)); - // return json; - // }); - // }; -} - -/* -* PostAction -* Posts an action to an item -* -* @params -* id - the id of the item on which the action is taking place -* action - the action object. -* Must include an 'action_type' string. -* May optionally include a `metadata` object with arbitrary action data. -* user - the user performing the action -* host - the coral host -* -* @returns -* A promise resolving to null or an error -* -*/ - -export function postAction (item_id, item_type, action) { - return (dispatch) => { - return coralApi(`/${item_type}/${item_id}/actions`, {method: 'POST', body: action}) - .then((json) => { - dispatch(updateItem(action.item_id, action.action_type, action.id, item_type)); - return json; - }); - }; -} - -/* -* DeleteAction -* Deletes an action to an item -* -* @params -* id - the id of the item on which the action is taking place -* action - the name of the action -* user - the user performing the action -* host - the coral host -* -* @returns -* A promise resolving to null or an error -* -*/ - -export function deleteAction (action_id) { - return () => { - return coralApi(`/actions/${action_id}`, {method: 'DELETE'}); - }; -} diff --git a/client/coral-framework/actions/user.js b/client/coral-framework/actions/user.js index 021c48eeb..4620262d3 100644 --- a/client/coral-framework/actions/user.js +++ b/client/coral-framework/actions/user.js @@ -1,7 +1,5 @@ import * as actions from '../constants/user'; -import * as assetActions from '../constants/assets'; import {addNotification} from '../actions/notification'; -import {addItem} from '../actions/items'; import coralApi from '../helpers/response'; import I18n from 'coral-framework/modules/i18n/i18n'; @@ -21,36 +19,3 @@ export const saveBio = (user_id, formData) => dispatch => { }) .catch(error => dispatch(saveBioFailure(error))); }; - -/** - * - * Get a list of comments by a single user - * - * @param {string} user_id - * @returns Promise - */ -export const fetchCommentsByUserId = userId => { - return (dispatch, getState) => { - dispatch({type: actions.COMMENTS_BY_USER_REQUEST}); - return coralApi(`/comments?user_id=${userId}`) - .then(({comments, assets}) => { - const state = getState(); - comments.forEach(comment => dispatch(addItem(comment, 'comments'))); - assets.forEach(asset => { - const prevAsset = state.items.getIn(['assets', asset.id]); - - if (prevAsset) { - - // Include data such as hydrated comments from assets already in the system. - dispatch(addItem({...prevAsset.toJS(), ...asset}, 'assets')); - } else { - dispatch(addItem(asset, 'assets')); - } - }); - - dispatch({type: actions.COMMENTS_BY_USER_SUCCESS, comments: comments.map(comment => comment.id)}); - dispatch({type: assetActions.MULTIPLE_ASSETS_SUCCESS, assets: assets.map(asset => asset.id)}); - }) - .catch(error => dispatch({type: actions.COMMENTS_BY_USER_FAILURE, error})); - }; -}; diff --git a/client/coral-framework/client.js b/client/coral-framework/client.js index 40a539634..b4a7a38df 100644 --- a/client/coral-framework/client.js +++ b/client/coral-framework/client.js @@ -2,6 +2,7 @@ import ApolloClient, {addTypename} from 'apollo-client'; import getNetworkInterface from './transport'; export const client = new ApolloClient({ + connectToDevTools: true, queryTransformer: addTypename, dataIdFromObject: (result) => { if (result.id && result.__typename) { // eslint-disable-line no-underscore-dangle diff --git a/client/coral-framework/constants/asset.js b/client/coral-framework/constants/asset.js index bfeb98441..40f746706 100644 --- a/client/coral-framework/constants/asset.js +++ b/client/coral-framework/constants/asset.js @@ -2,12 +2,9 @@ export const FETCH_ASSET_REQUEST = 'FETCH_ASSET_REQUEST'; export const FETCH_ASSET_FAILURE = 'FETCH_ASSET_FAILURE'; export const FETCH_ASSET_SUCCESS = 'FETCH_ASSET_SUCCESS'; -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 UPDATE_ASSET_SETTINGS_REQUEST = 'UPDATE_ASSET_SETTINGS_REQUEST'; +export const UPDATE_ASSET_SETTINGS_SUCCESS = 'UPDATE_ASSET_SETTINGS_SUCCESS'; +export const UPDATE_ASSET_SETTINGS_FAILURE = 'UPDATE_ASSET_SETTINGS_FAILURE'; export const OPEN_COMMENTS = 'OPEN_COMMENTS'; export const CLOSE_COMMENTS = 'CLOSE_COMMENTS'; -export const ADD_ITEM = 'ADD_ITEM'; diff --git a/client/coral-framework/graphql/fragments/commentView.graphql b/client/coral-framework/graphql/fragments/commentView.graphql new file mode 100644 index 000000000..b54c00e67 --- /dev/null +++ b/client/coral-framework/graphql/fragments/commentView.graphql @@ -0,0 +1,20 @@ +fragment commentView on Comment { + id + body + created_at + user { + id + name: displayName + settings { + bio + } + } + actions { + type: action_type + count + current: current_user { + id + created_at + } + } +} diff --git a/client/coral-embed-stream/src/graphql/mutations/deleteAction.graphql b/client/coral-framework/graphql/mutations/deleteAction.graphql similarity index 100% rename from client/coral-embed-stream/src/graphql/mutations/deleteAction.graphql rename to client/coral-framework/graphql/mutations/deleteAction.graphql diff --git a/client/coral-embed-stream/src/graphql/mutations/index.js b/client/coral-framework/graphql/mutations/index.js similarity index 88% rename from client/coral-embed-stream/src/graphql/mutations/index.js rename to client/coral-framework/graphql/mutations/index.js index 383862455..b97e5ff22 100644 --- a/client/coral-embed-stream/src/graphql/mutations/index.js +++ b/client/coral-framework/graphql/mutations/index.js @@ -3,7 +3,12 @@ import POST_COMMENT from './postComment.graphql'; import POST_ACTION from './postAction.graphql'; import DELETE_ACTION from './deleteAction.graphql'; +import commentView from '../fragments/commentView.graphql'; + export const postComment = graphql(POST_COMMENT, { + options: () => ({ + fragments: commentView + }), props: ({mutate}) => ({ postItem: ({asset_id, body, parent_id} /* , type */ ) => { return mutate({ diff --git a/client/coral-embed-stream/src/graphql/mutations/postAction.graphql b/client/coral-framework/graphql/mutations/postAction.graphql similarity index 100% rename from client/coral-embed-stream/src/graphql/mutations/postAction.graphql rename to client/coral-framework/graphql/mutations/postAction.graphql diff --git a/client/coral-framework/graphql/mutations/postComment.graphql b/client/coral-framework/graphql/mutations/postComment.graphql new file mode 100644 index 000000000..499871766 --- /dev/null +++ b/client/coral-framework/graphql/mutations/postComment.graphql @@ -0,0 +1,7 @@ +#import "../fragments/commentView.graphql" + +mutation CreateComment ($asset_id: ID!, $parent_id: ID, $body: String!) { + createComment(asset_id:$asset_id, parent_id:$parent_id, body:$body) { + ...commentView + } +} diff --git a/client/coral-embed-stream/src/graphql/queries/index.js b/client/coral-framework/graphql/queries/index.js similarity index 66% rename from client/coral-embed-stream/src/graphql/queries/index.js rename to client/coral-framework/graphql/queries/index.js index db4e08cde..1a9e8d36e 100644 --- a/client/coral-embed-stream/src/graphql/queries/index.js +++ b/client/coral-framework/graphql/queries/index.js @@ -1,5 +1,6 @@ import {graphql} from 'react-apollo'; import STREAM_QUERY from './streamQuery.graphql'; +import MY_COMMENT_HISTORY from './myCommentHistory.graphql'; function getQueryVariable(variable) { let query = window.location.search.substring(1); @@ -13,5 +14,11 @@ function getQueryVariable(variable) { } export const queryStream = graphql(STREAM_QUERY, { - options: {variables: {asset_url: getQueryVariable('asset_url')}} + options: () => ({ + variables: { + asset_url: getQueryVariable('asset_url') + } + }) }); + +export const myCommentHistory = graphql(MY_COMMENT_HISTORY, {}); diff --git a/client/coral-framework/graphql/queries/myCommentHistory.graphql b/client/coral-framework/graphql/queries/myCommentHistory.graphql new file mode 100644 index 000000000..6a4309dac --- /dev/null +++ b/client/coral-framework/graphql/queries/myCommentHistory.graphql @@ -0,0 +1,9 @@ +query myCommentHistory { + me { + comments { + id + body + created_at + } + } +} diff --git a/client/coral-embed-stream/src/graphql/queries/streamQuery.graphql b/client/coral-framework/graphql/queries/streamQuery.graphql similarity index 62% rename from client/coral-embed-stream/src/graphql/queries/streamQuery.graphql rename to client/coral-framework/graphql/queries/streamQuery.graphql index 64bb46b47..77f8ed356 100644 --- a/client/coral-embed-stream/src/graphql/queries/streamQuery.graphql +++ b/client/coral-framework/graphql/queries/streamQuery.graphql @@ -1,24 +1,4 @@ - -fragment commentView on Comment { - id - body - created_at - user { - id - name: displayName - settings { - bio - } - } - actions { - type: action_type - count - current: current_user { - id - created_at - } - } -} +#import "../fragments/commentView.graphql" query AssetQuery($asset_url: String!) { asset(url: $asset_url) { diff --git a/client/coral-framework/index.js b/client/coral-framework/index.js index c21136d27..d2cd4197b 100644 --- a/client/coral-framework/index.js +++ b/client/coral-framework/index.js @@ -1,19 +1,17 @@ -import Notification from './modules/notification/Notification'; import store from './store'; -import * as itemActions from './actions/items'; +import pym from './PymConnection'; import I18n from './modules/i18n/i18n'; -import * as notificationActions from './actions/notification'; import * as authActions from './actions/auth'; import * as assetActions from './actions/asset'; -import pym from './PymConnection'; +import * as notificationActions from './actions/notification'; +import Notification from './modules/notification/Notification'; export { - Notification, - store, - itemActions, + pym, I18n, - notificationActions, + store, authActions, assetActions, - pym + Notification, + notificationActions }; diff --git a/client/coral-framework/reducers/asset.js b/client/coral-framework/reducers/asset.js index 495307aeb..f9d0a55e3 100644 --- a/client/coral-framework/reducers/asset.js +++ b/client/coral-framework/reducers/asset.js @@ -13,23 +13,12 @@ const initialState = Map({ export default function asset (state = initialState, action) { switch (action.type) { - case actions.FETCH_ASSET_SUCCESS : + case actions.FETCH_ASSET_SUCCESS: return state .merge(action.asset); - case actions.UPDATE_CONFIG: + case actions.UPDATE_ASSET_SETTINGS_SUCCESS: return state - .merge(action.config); - case actions.UPDATE_CONFIG_SUCCESS: - return state - .merge(action.config); - case actions.OPEN_COMMENTS: - return state - .set('status', 'open') - .set('closedAt', null); - case actions.CLOSE_COMMENTS: - return state - .set('status', 'closed') - .set('closedAt', Date.now()); + .setIn(['settings'], action.settings); default: return state; } diff --git a/client/coral-framework/reducers/index.js b/client/coral-framework/reducers/index.js index 8c1457bfe..720f15232 100644 --- a/client/coral-framework/reducers/index.js +++ b/client/coral-framework/reducers/index.js @@ -1,13 +1,11 @@ import auth from './auth'; import user from './user'; import asset from './asset'; -import items from './items'; import notification from './notification'; export default { auth, user, asset, - items, notification }; diff --git a/client/coral-framework/reducers/items.js b/client/coral-framework/reducers/items.js deleted file mode 100644 index 268557809..000000000 --- a/client/coral-framework/reducers/items.js +++ /dev/null @@ -1,30 +0,0 @@ -/* Items Reducer */ - -import {fromJS} from 'immutable'; -import * as actions from '../actions/items'; - -const initialState = fromJS({ - comments: {}, - users: {}, - assets: {}, - actions: {} -}); - -export default (state = initialState, action) => { - switch (action.type) { - case actions.ADD_ITEM: - return state.setIn([action.item_type, action.id], fromJS(action.item)); - case actions.UPDATE_ITEM: - return state.setIn([action.item_type, action.id, action.property], fromJS(action.value)); - case actions.APPEND_ITEM_ARRAY: - return state.updateIn([action.item_type, action.id, action.property], (prop) => { - if (action.add_to_front) { - return prop ? prop.unshift(fromJS(action.value)) : fromJS([action.value]); - } else { - return prop ? prop.push(fromJS(action.value)) : fromJS([action.value]); - } - }); - default: - return state; - } -}; diff --git a/client/coral-plugin-history/CommentHistory.js b/client/coral-plugin-history/CommentHistory.js index add7c121a..1940f2695 100644 --- a/client/coral-plugin-history/CommentHistory.js +++ b/client/coral-plugin-history/CommentHistory.js @@ -7,12 +7,11 @@ const CommentHistory = props => {
{props.comments.map((comment, i) => { - const asset = props.assets.find(asset => asset.id === comment.asset_id); return ; + asset={props.asset} />; })}
@@ -20,8 +19,8 @@ const CommentHistory = props => { }; CommentHistory.propTypes = { - comments: PropTypes.arrayOf(PropTypes.object).isRequired, - assets: PropTypes.arrayOf(PropTypes.object).isRequired + comments: PropTypes.array.isRequired, + asset: PropTypes.object.isRequired }; export default CommentHistory; diff --git a/client/coral-settings/containers/SettingsContainer.js b/client/coral-settings/containers/SettingsContainer.js index 001190f1d..f02badd80 100644 --- a/client/coral-settings/containers/SettingsContainer.js +++ b/client/coral-settings/containers/SettingsContainer.js @@ -1,17 +1,18 @@ -import React, {Component} from 'react'; import {connect} from 'react-redux'; - -import {saveBio, fetchCommentsByUserId} from 'coral-framework/actions/user'; - -import {link} from 'coral-framework/PymConnection'; -import BioContainer from './BioContainer'; -import NotLoggedIn from '../components/NotLoggedIn'; -import {TabBar, Tab, TabContent} from '../../coral-ui'; -import CommentHistory from 'coral-plugin-history/CommentHistory'; -import SettingsHeader from '../components/SettingsHeader'; -import RestrictedContent from 'coral-framework/components/RestrictedContent'; - +import {compose} from 'react-apollo'; +import React, {Component} from 'react'; import I18n from 'coral-framework/modules/i18n/i18n'; + +import {myCommentHistory} from 'coral-framework/graphql/queries'; +import {saveBio} from 'coral-framework/actions/user'; + +import BioContainer from './BioContainer'; +import {link} from 'coral-framework/PymConnection'; +import NotLoggedIn from '../components/NotLoggedIn'; +import {TabBar, Tab, TabContent, Spinner} from 'coral-ui'; +import SettingsHeader from '../components/SettingsHeader'; +import CommentHistory from 'coral-plugin-history/CommentHistory'; + import translations from '../translations'; const lang = new I18n(translations); @@ -25,12 +26,6 @@ class SettingsContainer extends Component { this.handleTabChange = this.handleTabChange.bind(this); } - componentWillMount () { - - // Fetch commentHistory - this.props.fetchCommentsByUserId(this.props.userData.id); - } - handleTabChange(tab) { this.setState({ activeTab: tab @@ -38,55 +33,56 @@ class SettingsContainer extends Component { } render() { - const {loggedIn, userData, showSignInDialog, items, user} = this.props; + const {loggedIn, userData, asset, showSignInDialog, data, user} = this.props; const {activeTab} = this.state; + const {me} = this.props.data; - const commentsMostRecentFirst = user - .myComments.map(id => items.comments[id]) - .sort(({created_at:a}, {created_at:b}) => { + if (!loggedIn || !me) { + return ; + } - // descending order, created_at - // js date strings can be sorted lexigraphically. - const aLessThanB = a < b ? 1 : 0; - return a > b ? -1 : aLessThanB; - }); + if (data.loading) { + return ; + } return ( - }> +
- All Comments ({user.myComments.length}) - Profile Settings + {lang.t('allComments')} ({user.myComments.length}) + {lang.t('profileSettings')} { - user.myComments.length && user.myAssets.length - ? items.assets[id])} /> - :

{lang.t('user-no-comment')}

+ me.comments.length ? + + : +

{lang.t('userNoComment')}

} - +
); } } const mapStateToProps = state => ({ - items: state.items.toJS(), - user: state.user.toJS() + user: state.user.toJS(), + asset: state.asset.toJS(), + auth: state.auth.toJS() }); const mapDispatchToProps = dispatch => ({ - saveBio: (user_id, formData) => dispatch(saveBio(user_id, formData)), - fetchCommentsByUserId: userId => dispatch(fetchCommentsByUserId(userId)) + saveBio: (user_id, formData) => dispatch(saveBio(user_id, formData)) }); -export default connect( - mapStateToProps, - mapDispatchToProps +export default compose( + connect(mapStateToProps, mapDispatchToProps), + myCommentHistory )(SettingsContainer); diff --git a/client/coral-settings/translations.json b/client/coral-settings/translations.json index f1d32b9d2..2a827a4f0 100644 --- a/client/coral-settings/translations.json +++ b/client/coral-settings/translations.json @@ -1,8 +1,14 @@ { "en":{ - "user-no-comment": "This user has not yet left a comment." + "userNoComment": "This user has not yet left a comment.", + "allComments": "All Comments", + "profileSettings": "Profile Settings", + "myCommentHistory": "My comment History" }, "es":{ - "user-no-comment": "Aún no ha escrito ningún comentario." + "userNoComment": "Aún no ha escrito ningún comentario.", + "allComments": "Todos los comentarios", + "profileSettings": "Configuración del perfil", + "myCommentHistory": "Mi historial de comentarios" } } diff --git a/client/coral-sign-in/containers/SignInContainer.js b/client/coral-sign-in/containers/SignInContainer.js index 07f82a849..9e9ca1f72 100644 --- a/client/coral-sign-in/containers/SignInContainer.js +++ b/client/coral-sign-in/containers/SignInContainer.js @@ -20,7 +20,7 @@ import { invalidForm, validForm, checkLogin -} from '../../coral-framework/actions/auth'; +} from 'coral-framework/actions/auth'; class SignInContainer extends Component { initialState = { diff --git a/client/coral-ui/components/Checkbox.js b/client/coral-ui/components/Checkbox.js index 94626295f..9b88d83ad 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, checked = 'false'}) => ( +export default ({name, cStyle = 'base', onChange, label, className, info, ...props}) => (