diff --git a/webapp/components/post_view/components/date_separator.jsx b/webapp/components/post_view/components/date_separator.jsx
new file mode 100644
index 0000000000..18dc0c7ff3
--- /dev/null
+++ b/webapp/components/post_view/components/date_separator.jsx
@@ -0,0 +1,27 @@
+import React from 'react';
+import {FormattedDate} from 'react-intl';
+
+export default class DateSeparator extends React.Component {
+ render() {
+ return (
+
+ );
+ }
+}
+
+DateSeparator.propTypes = {
+ date: React.PropTypes.instanceOf(Date)
+};
diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx
index c9a582877f..52e4d9851e 100644
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -564,9 +564,6 @@ export default class RhsComment extends React.Component {
}
const timeOptions = {
- day: 'numeric',
- month: 'short',
- year: 'numeric',
hour: '2-digit',
minute: '2-digit',
hour12: !this.props.useMilitaryTime
diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index 6a6b01a7f4..83d930bcab 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -511,9 +511,6 @@ export default class RhsRootPost extends React.Component {
}
const timeOptions = {
- day: 'numeric',
- month: 'short',
- year: 'numeric',
hour: '2-digit',
minute: '2-digit',
hour12: !this.props.useMilitaryTime
diff --git a/webapp/components/rhs_thread.jsx b/webapp/components/rhs_thread.jsx
index 3c0b2e1140..2c1d039019 100644
--- a/webapp/components/rhs_thread.jsx
+++ b/webapp/components/rhs_thread.jsx
@@ -8,6 +8,7 @@ import RootPost from './rhs_root_post.jsx';
import Comment from './rhs_comment.jsx';
import FileUploadOverlay from './file_upload_overlay.jsx';
import FloatingTimestamp from './post_view/components/floating_timestamp.jsx';
+import DateSeparator from './post_view/components/date_separator.jsx';
import PostStore from 'stores/post_store.jsx';
import UserStore from 'stores/user_store.jsx';
@@ -325,6 +326,7 @@ export default class RhsThread extends React.Component {
const postsArray = this.state.postsArray;
const selected = this.state.selected;
const profiles = this.state.profiles || {};
+ let previousPostDay = Utils.getDateForUnixTicks(selected.create_at);
if (postsArray == null || selected == null) {
return (
@@ -355,6 +357,55 @@ export default class RhsThread extends React.Component {
rootStatus = this.state.statuses[selected.user_id] || 'offline';
}
+ const commentsLists = [];
+ for (let i = 0; i < postsArray.length; i++) {
+ const comPost = postsArray[i];
+ let p;
+ if (UserStore.getCurrentId() === comPost.user_id) {
+ p = UserStore.getCurrentUser();
+ } else {
+ p = profiles[comPost.user_id];
+ }
+
+ let isFlagged = false;
+ if (this.state.flaggedPosts) {
+ isFlagged = this.state.flaggedPosts.get(comPost.id) === 'true';
+ }
+
+ let status = 'offline';
+ if (this.state.statuses && p && p.id) {
+ status = this.state.statuses[p.id] || 'offline';
+ }
+
+ const keyPrefix = comPost.id ? comPost.id : comPost.pending_post_id;
+
+ const currentPostDay = Utils.getDateForUnixTicks(comPost.create_at);
+
+ if (currentPostDay.toDateString() !== previousPostDay.toDateString()) {
+ previousPostDay = currentPostDay;
+ commentsLists.push(
+ );
+ }
+
+ commentsLists.push(
+
+
+
+ );
+ }
+
return (
@@ -384,6 +435,9 @@ export default class RhsThread extends React.Component {
onScroll={this.handleScroll}
>
+
- {postsArray.map((comPost) => {
- let p;
- if (UserStore.getCurrentId() === comPost.user_id) {
- p = UserStore.getCurrentUser();
- } else {
- p = profiles[comPost.user_id];
- }
-
- let isFlagged = false;
- if (this.state.flaggedPosts) {
- isFlagged = this.state.flaggedPosts.get(comPost.id) === 'true';
- }
-
- let status = 'offline';
- if (this.state.statuses && p && p.id) {
- status = this.state.statuses[p.id] || 'offline';
- }
-
- const keyPrefix = comPost.id ? comPost.id : comPost.pending_post_id;
-
- return (
-
- );
- })}
+ {commentsLists}