diff --git a/src/components/ActionCard/AddComment.jsx b/src/components/ActionCard/AddComment.jsx
index 72fbab580..0a02c49d5 100644
--- a/src/components/ActionCard/AddComment.jsx
+++ b/src/components/ActionCard/AddComment.jsx
@@ -25,7 +25,7 @@ export default class AddComment extends React.Component {
}
render() {
- const { className, avatarUrl, authorName, placeholder, isAdding, hasError, allMembers, projectMembers } = this.props
+ const { className, avatarUrl, authorName, placeholder, isAdding, hasError, allMembers, projectMembers, defaultContent } = this.props
return (
)
}
@@ -57,5 +58,9 @@ AddComment.propTypes = {
hasError: PropTypes.bool,
isAdding: PropTypes.bool,
allMembers: PropTypes.object,
- projectMembers: PropTypes.object
+ projectMembers: PropTypes.object,
+ /**
+ * Default value for comment content
+ */
+ defaultContent: PropTypes.string,
}
diff --git a/src/components/Feed/Feed.jsx b/src/components/Feed/Feed.jsx
index feeb4e4cd..9eec7834c 100644
--- a/src/components/Feed/Feed.jsx
+++ b/src/components/Feed/Feed.jsx
@@ -104,7 +104,7 @@ class Feed extends React.Component {
allowComments, comments, children, onNewCommentChange, onAddNewComment, isAddingComment, onSaveMessageChange,
onEditMessage, onSaveMessage, isSavingTopic, onDeleteMessage, onDeleteTopic, isDeletingTopic, error, allMembers,
onEnterFullscreenClick, onExitFullscreenClick, isFullScreen, commentId, projectMembers, commentAnchorPrefix, tag,
- inTopicDrawer, onDrawerClose
+ inTopicDrawer, onDrawerClose, newComment
} = this.props
const { editTopicMode, headerHeight } = this.state
@@ -222,6 +222,7 @@ class Feed extends React.Component {
commentId={commentId}
error={error}
commentAnchorPrefix={commentAnchorPrefix}
+ newComment={newComment}
/>
{children}
{isDeletingTopic &&
diff --git a/src/components/Feed/FeedComments.jsx b/src/components/Feed/FeedComments.jsx
index 0c16e242c..6cbf2a63d 100644
--- a/src/components/Feed/FeedComments.jsx
+++ b/src/components/Feed/FeedComments.jsx
@@ -180,7 +180,7 @@ class FeedComments extends React.Component {
const {
currentUser, onLoadMoreComments, isLoadingComments, hasMoreComments, onAddNewComment,
onNewCommentChange, error, avatarUrl, isAddingComment, allowComments, onSaveMessage, onDeleteMessage, allMembers,
- totalComments, isFullScreen, headerHeight, projectMembers, commentAnchorPrefix
+ totalComments, isFullScreen, headerHeight, projectMembers, commentAnchorPrefix, newComment
} = this.props
let { comments } = this.props
comments = _.sortBy(comments, 'createdBy')
@@ -383,6 +383,7 @@ class FeedComments extends React.Component {
hasError={error}
allMembers={allMembers}
projectMembers={projectMembers}
+ defaultContent={newComment}
/>
}
diff --git a/src/projects/detail/containers/FeedContainer.js b/src/projects/detail/containers/FeedContainer.js
index 991ab6dd8..4ab05e360 100644
--- a/src/projects/detail/containers/FeedContainer.js
+++ b/src/projects/detail/containers/FeedContainer.js
@@ -113,7 +113,7 @@ class FeedView extends React.Component {
return hasThread || hasComment
}
- mapFeed(feed, showAll = false, resetNewComment = false, prevProps) {
+ mapFeed(feed, showAll = false, resetNewComment = false, prevProps, currentProps) {
const { allMembers, project, currentMemberRole } = this.props
const item = _.pick(feed, ['id', 'date', 'read', 'tag', 'title', 'totalPosts', 'userId', 'reference', 'referenceId', 'postIds', 'isSavingTopic', 'isDeletingTopic', 'isAddingComment', 'isLoadingComments', 'error'])
// Github issue##623, allow comments on all posts (including system posts)
@@ -189,7 +189,8 @@ class FeedView extends React.Component {
item.newComment = ''
if (!resetNewComment) {
const feedFromState = _.find(this.state.feeds, f => feed.id === f.id)
- item.newComment = feedFromState ? feedFromState.newComment : ''
+ const preservedNewComment =_.find(currentProps && currentProps.preservedNewComments, { feedId: feed.id })
+ item.newComment = (feedFromState || preservedNewComment) ? (feedFromState || preservedNewComment).newComment : ''
}
item.hasMoreComments = item.comments.length !== item.totalComments
// adds permalink for the feed
@@ -214,7 +215,7 @@ class FeedView extends React.Component {
}
// reset new comment if we were adding comment and there is no error in doing so
const resetNewComment = prevFeed && prevFeed.isAddingComment && !feed.isAddingComment && !feed.error
- return this.mapFeed(feed, this.state.showAll.indexOf(feed.id) > -1, resetNewComment, prevProps)
+ return this.mapFeed(feed, this.state.showAll.indexOf(feed.id) > -1, resetNewComment, prevProps, props)
}).filter(item => item)
})
}
@@ -247,6 +248,8 @@ class FeedView extends React.Component {
return item
})
})
+ // also save new comment to a place where we can keep it even during feed reloading
+ this.props.updatePreservedNewComment(feedId, content)
}
onShowAllComments(feedId) {
@@ -489,6 +492,32 @@ const EnhancedFeedView = enhance(FeedView)
class FeedContainer extends React.Component {
constructor(props) {
super(props)
+
+ this.state = {
+ // as we loose `newComment` in the state inside `EnhancedFeedView` we have to keep it here
+ // so we can restore the currently edited new comment, in case the feed has been reloaded
+ preservedNewComments: []
+ }
+
+ this.updatePreservedNewComment = this.updatePreservedNewComment.bind(this)
+ }
+
+ updatePreservedNewComment (feedId, newComment) {
+ const feedIndex = _.findIndex(this.state.preservedNewComments, { feedId })
+
+ if (feedIndex !== -1) {
+ this.setState({
+ preservedNewComments: [
+ ...this.state.preservedNewComments.slice(0, feedIndex),
+ { feedId, newComment },
+ ...this.state.preservedNewComments.slice(feedIndex + 1),
+ ]
+ })
+ } else {
+ this.setState({
+ preservedNewComments: [...this.state.preservedNewComments, { feedId, newComment }]
+ })
+ }
}
componentWillMount() {
@@ -502,11 +531,14 @@ class FeedContainer extends React.Component {
}
render() {
+ console.log('preservedNewComments', this.state.preservedNewComments)
// Load only specified topics if topics input is available. Otherwise, load all feeds
const {feeds, topics} = this.props
const props = {
...this.props,
- feeds: topics ? feeds.filter(f => _.includes(topics, f.id)) : feeds
+ feeds: topics ? feeds.filter(f => _.includes(topics, f.id)) : feeds,
+ preservedNewComments: this.state.preservedNewComments,
+ updatePreservedNewComment: this.updatePreservedNewComment,
}
return
}