Merge branch 'master' into flags-button

This commit is contained in:
Belén Curcio
2017-02-15 16:33:53 -03:00
committed by GitHub
15 changed files with 163 additions and 54 deletions
+6
View File
@@ -26,6 +26,7 @@ import ChangeDisplayNameContainer from '../../coral-sign-in/containers/ChangeDis
import SettingsContainer from 'coral-settings/containers/SettingsContainer';
import RestrictedContent from 'coral-framework/components/RestrictedContent';
import ConfigureStreamContainer from 'coral-configure/containers/ConfigureStreamContainer';
import LoadMore from './LoadMore';
class Embed extends Component {
@@ -158,6 +159,11 @@ class Embed extends Component {
clearNotification={this.props.clearNotification}
notification={{text: null}}
/>
<LoadMore
assetId={asset.id}
comments={asset.comments}
moreComments={asset.commentCount > asset.comments.length}
loadMore={this.props.loadMore}/>
</TabContent>
<TabContent show={activeTab === 1}>
<SettingsContainer
+40
View File
@@ -0,0 +1,40 @@
import React, {PropTypes} from 'react';
import I18n from 'coral-framework/modules/i18n/i18n';
import translations from 'coral-framework/translations.json';
import {Button} from 'coral-ui';
const lang = new I18n(translations);
const loadMoreComments = (assetId, comments, loadMore) => {
if (!comments.length) {
return;
}
loadMore({
limit: 10,
cursor: comments[comments.length - 1].created_at,
assetId,
sort: 'REVERSE_CHRONOLOGICAL'
});
};
const LoadMore = ({assetId, comments, loadMore, moreComments}) => (
moreComments
? <Button
className='coral-load-more'
onClick={() => loadMoreComments(assetId, comments, loadMore)}>
{
lang.t('loadMore')
}
</Button>
: null
);
LoadMore.propTypes = {
assetId: PropTypes.string.isRequired,
comments: PropTypes.array.isRequired,
moreComments: PropTypes.bool.isRequired,
loadMore: PropTypes.func.isRequired
};
export default LoadMore;
+4 -4
View File
@@ -47,8 +47,8 @@ class Stream extends React.Component {
return (
<div>
{
comments.map(comment => {
return <Comment
comments.map(comment =>
<Comment
refetch={refetch}
setActiveReplyBox={this.setActiveReplyBox}
activeReplyBox={this.state.activeReplyBox}
@@ -63,8 +63,8 @@ class Stream extends React.Component {
showSignInDialog={showSignInDialog}
key={comment.id}
reactKey={comment.id}
comment={comment} />;
})
comment={comment} />
)
}
</div>
);
@@ -304,3 +304,16 @@ hr {
.close-comments-alert i.material-icons {
font-size: 16px !important;
}
/* Load More */
button.coral-load-more {
width: 100%;
text-align: center;
color: #FFF;
background-color: #2376D8;
}
button.coral-load-more:hover {
background-color: #4399FF;
}
@@ -0,0 +1,10 @@
query LoadCommentCounts($asset_id: ID, $limit: Int = 5, $sort: SORT_ORDER) {
asset(id: $asset_id) {
id
commentCount
comments(sort: $sort, limit: $limit) {
id
replyCount
}
}
}
@@ -1,5 +1,6 @@
import {graphql} from 'react-apollo';
import STREAM_QUERY from './streamQuery.graphql';
import LOAD_MORE from './loadMore.graphql';
import MY_COMMENT_HISTORY from './myCommentHistory.graphql';
function getQueryVariable(variable) {
@@ -21,6 +22,28 @@ export const queryStream = graphql(STREAM_QUERY, {
variables: {
asset_url: getQueryVariable('asset_url')
}
}),
props: ({data}) => ({
data,
loadMore: ({limit, cursor, parent_id, asset_id, sort}) => {
return data.fetchMore({
query: LOAD_MORE,
variables: {
limit,
cursor,
parent_id,
asset_id,
sort
},
updateQuery: (oldData, {fetchMoreResult:{data:{new_top_level_comments}}}) => ({
...oldData,
asset: {
...oldData.asset,
comments: [...oldData.asset.comments, ...new_top_level_comments]
}
})
});
}
})
});
@@ -0,0 +1,10 @@
#import "../fragments/commentView.graphql"
query LoadMoreComments($limit: Int = 5, $cursor: Date, $parent_id: ID, $asset_id: ID, $sort: SORT_ORDER) {
new_top_level_comments: comments(query: {limit: $limit, cursor: $cursor, parent_id: $parent_id, asset_id: $asset_id, sort: $sort}) {
...commentView
replies(limit: 3) {
...commentView
}
}
}
@@ -18,9 +18,9 @@ query AssetQuery($asset_url: String!) {
requireEmailConfirmation
}
commentCount
comments {
comments(limit: 10) {
...commentView
replies {
replies(limit: 3) {
...commentView
}
}
+2
View File
@@ -3,6 +3,7 @@
"successUpdateSettings": "The changes you have made have been applied to the comment stream on this article",
"successNameUpdate": "Your username has been updated",
"contentNotAvailable": "This content is not available",
"loadMore": "View more",
"bannedAccountMsg": "Your account is currently suspended. This means that you cannot Like, Flag, or write comments. Please contact moderator@fakeurl.com for more information",
"editName": {
"msg": "Your account is currently suspended because your username has been deemed inappropriate. To restore your account, please enter a new username. You may contact moderator@fakeurl.com for more information.",
@@ -35,6 +36,7 @@
"contentNotAvailable": "El contenido no se encuentra disponible",
"bannedAccountMsg": "Tu cuenta se encuentra suspendida. Esto significa que no puedes dar Like, Marcar o escribir commentarios. Por favor, contacta moderator@fakeurl for more information",
"editNameMsg": "",
"loadMore": "Ver más",
"error": {
"emailNotVerified": "Dirección de correo electrónico {0} no verificada.",
"email": "No es un email válido",
-1
View File
@@ -19,7 +19,6 @@ class Stream extends Component {
}
render() {
console.log(this.props);
const {data} = this.props;
return <div>
<button onClick={this.logMeIn.bind(this)}>Login or whatever</button>
+2 -2
View File
@@ -49,7 +49,7 @@
},
"homepage": "https://github.com/coralproject/talk#readme",
"dependencies": {
"apollo-client": "^0.7.3",
"apollo-client": "^0.8.3",
"bcrypt": "^0.8.7",
"body-parser": "^1.15.2",
"cli-table": "^0.3.1",
@@ -83,7 +83,7 @@
"passport": "^0.3.2",
"passport-facebook": "^2.1.1",
"passport-local": "^1.0.0",
"react-apollo": "^0.8.1",
"react-apollo": "^0.10.0",
"redis": "^2.6.3",
"uuid": "^2.0.3"
},
+3
View File
@@ -6,6 +6,9 @@ set -e
# install selenium
selenium-standalone install --config=./selenium.config.js
# Clear db
mongo test --eval "db.dropDatabase()"
# Init application
./bin/cli setup --defaults
+1 -1
View File
@@ -12,7 +12,7 @@ module.exports.comments = (comments) => Assets.findOrCreateByUrl(globals.baseUrl
comment.asset_id = asset.id;
return comment;
});
return Comments.create(comments);
return Comments.publicCreate(comments);
});
/* Create an array of users */
+3 -3
View File
@@ -43,9 +43,9 @@ const embedStreamCommands = {
},
logout() {
return this
.waitForElementVisible('@logoutButton')
.waitForElementVisible('@logoutButton', 5000)
.click('@logoutButton')
.waitForElementVisible('@signInButton', 2000);
.waitForElementVisible('@signInButton', 5000);
},
postComment(comment = 'Test Comment') {
return this
@@ -108,7 +108,7 @@ module.exports = {
selector: '#coralSignInViewTrigger'
},
logoutButton: {
selector: '.commentStream #logout'
selector: '#coralStream #logout'
},
commentBox: {
selector: '.coral-plugin-commentbox-textarea'
+44 -41
View File
@@ -119,48 +119,51 @@ module.exports = {
});
});
},
'User replies to a comment with premod on': client => {
client.perform((client, done) => {
mocks.settings({moderation: 'PRE'})
// Add a mock user
.then(() => mocks.users([{
username: 'Baby Blue',
email: 'whale@tale.sea',
password: 'krill'
}]))
// Add a mock preapproved comment by that user
.then((user) => mocks.comments([{
body: 'Whales are not fish.',
status: 'accepted',
author_id: user.id
}]))
.then(() => {
// Load Page
client.resizeWindow(1200, 800)
.url(client.globals.baseUrl)
.frame('coralStreamEmbed_iframe');
// Post a reply
client.waitForElementVisible('.coral-plugin-replies-reply-button', 5000)
.click('.coral-plugin-replies-reply-button')
.waitForElementVisible('#replyText')
.setValue('#replyText', mockReply)
.click('.coral-plugin-replies-textarea button')
.waitForElementVisible('#coral-notif', 1000)
// Verify that it appears
.assert.containsText('#coral-notif', 'moderation team');
done();
})
.catch((err) => {
console.log(err);
done();
});
});
},
// Commenting out this test, it fails if the notification is below the fold, which
// happens if too many previous tests have added comments
// 'User replies to a comment with premod on': client => {
// client.perform((client, done) => {
// mocks.settings({moderation: 'PRE'})
//
// // Add a mock user
// .then(() => mocks.users([{
// username: 'BabyBlue',
// email: 'whale@tale.sea',
// password: 'krillaretasty'
// }]))
//
// // Add a mock preapproved comment by that user
// .then((user) => mocks.comments([{
// body: 'Whales are not fish.',
// status: 'ACCEPTED',
// author_id: user.id
// }]))
// .then(() => {
//
// // Load Page
// client.resizeWindow(1200, 800)
// .url(client.globals.baseUrl)
// .frame('coralStreamEmbed_iframe');
//
// // Post a reply
// client.waitForElementVisible('.coral-plugin-replies-reply-button', 5000)
// .click('.coral-plugin-replies-reply-button')
// .waitForElementVisible('#replyText')
// .setValue('#replyText', mockReply)
// .click('.coral-plugin-replies-textarea button')
// .waitForElementVisible('#coral-notif', 1000)
//
// // Verify that it appears
// .assert.containsText('#coral-notif', 'moderation team');
// done();
// })
// .catch((err) => {
// console.log(err);
// done();
// });
// });
// },
'Total comment count premod on': client => {
client.perform((client, done) => {
client.url(client.globals.baseUrl)