Skip to content

Revert "messages by same user with time gap of 10min + show separately with a…" #2077

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
gondzo merged 1 commit into from
Jun 22, 2018
Merged

Revert "messages by same user with time gap of 10min + show separately with a…" #2077

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
20 changes: 7 additions & 13 deletions src/components/ActionCard/CommentMobile.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,25 +8,20 @@ import PropTypes from 'prop-types'
import _ from 'lodash'
import moment from 'moment'
import { Link } from 'react-router-dom'
import cn from 'classnames'

import UserWithName from '../User/UserWithName'
import { POST_TIME_FORMAT } from '../../config/constants.js'

import './CommentMobile.scss'

const CommentMobile = ({ messageId, author, date, children, noInfo }) => {
const CommentMobile = ({ messageId, author, date, children }) => {
const messageLink = window.location.pathname.substr(0, window.location.pathname.indexOf('#')) + `#comment-${messageId}`

return (
<div styleName={cn('comment', {'is-bundled' : noInfo})} id={`comment-${messageId}`}>
{
!noInfo &&
<div styleName="header">
<UserWithName {..._.pick(author, 'firstName', 'lastName', 'photoURL')} size="40" />
<Link styleName="date" to={messageLink}>{moment(date).format(POST_TIME_FORMAT)}</Link>
</div>
}
<div styleName="comment" id={`comment-${messageId}`}>
<div styleName="header">
<UserWithName {..._.pick(author, 'firstName', 'lastName', 'photoURL')} size="40" />
<Link styleName="date" to={messageLink}>{moment(date).format(POST_TIME_FORMAT)}</Link>
</div>
<div styleName="text" className="draftjs-post">{children}</div>
</div>
)
Expand All @@ -36,8 +31,7 @@ CommentMobile.propTypes = {
messageId: PropTypes.string.isRequired,
author: PropTypes.any.isRequired,
date: PropTypes.any.isRequired,
children: PropTypes.node.isRequired,
noInfo: PropTypes.bool
children: PropTypes.node.isRequired
}

export default CommentMobile
11 changes: 0 additions & 11 deletions src/components/ActionCard/CommentMobile.scss
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -5,17 +5,6 @@
border-radius: 4px;
margin-top: 3 * $base-unit;
padding: 2 * $base-unit 2 * $base-unit 3 * $base-unit 2 * $base-unit;

&.is-bundled {
margin-top: 0;
padding-top: 0;
padding-bottom: 0;
}


&:not(.is-bundled) + .comment.is-bundled {
margin-top: -15px;
}
}

.header {
Expand Down
34 changes: 14 additions & 20 deletions src/components/Feed/FeedComments.jsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import cn from 'classnames'
import {markdownToHTML} from '../../helpers/markdownToState'
import MediaQuery from 'react-responsive'
import CommentMobile from '../ActionCard/CommentMobile'
import { SCREEN_BREAKPOINT_MD, POSTS_BUNDLE_TIME_DIFF } from '../../config/constants'
import { SCREEN_BREAKPOINT_MD } from '../../config/constants'

import './FeedComments.scss'

Expand Down Expand Up @@ -61,7 +61,6 @@ class FeedComments extends React.Component {
}

const desktopBlocks = []
const mobileBlocks = []

if (hasMoreComments) {
desktopBlocks.push(
Expand All @@ -73,12 +72,10 @@ class FeedComments extends React.Component {
)
}

comments && comments.forEach((item, idx) => {
comments && comments.forEach((item, idx) => {
const createdAt = moment(item.createdAt)
const prevComment = comments[idx - 1]
const timeDiffPrevComment = prevComment && moment(item.createdAt).diff(prevComment.createdAt)
const isSameAuthor = prevComment && prevComment.author.userId === item.author.userId &&
timeDiffPrevComment && timeDiffPrevComment <= POSTS_BUNDLE_TIME_DIFF
const isSameAuthor = prevComment && prevComment.author.userId === item.author.userId
const isSameDay = prevComment && moment(prevComment.createdAt).isSame(createdAt, 'day')
const isFirstUnread = prevComment && !prevComment.unread && item.unread

Expand All @@ -103,7 +100,7 @@ class FeedComments extends React.Component {
key={idx}
message={item}
author={item.author}
date={item.createdAt}
date={item.date}
edited={item.edited}
active={item.unread}
self={item.author && item.author.userId === currentUser.userId}
Expand All @@ -118,18 +115,6 @@ class FeedComments extends React.Component {
<div dangerouslySetInnerHTML={{__html: markdownToHTML(item.content)}} />
</Comment>
)

mobileBlocks.push(
<CommentMobile
key={idx}
messageId={item.id.toString()}
author={item.author}
date={item.createdAt}
noInfo={isSameAuthor}
>
<div dangerouslySetInnerHTML={{__html: markdownToHTML(item.content)}} />
</CommentMobile>
)
})

return (
Expand Down Expand Up @@ -164,7 +149,16 @@ class FeedComments extends React.Component {
</a>
</div>
}
{mobileBlocks}
{comments.map((item, idx) => (
<CommentMobile
key={idx}
messageId={item.id.toString()}
author={item.author}
date={item.date}
>
<div dangerouslySetInnerHTML={{__html: markdownToHTML(item.content)}} />
</CommentMobile>
))}
</div>
))}
</MediaQuery>
Expand Down
5 changes: 1 addition & 4 deletions src/config/constants.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -537,7 +537,4 @@ export const NOTIFICATION_SETTINGS_PERIODS = [
]

// date time formats
export const POST_TIME_FORMAT = 'h:mm a'

// max time difference between consecutive posts to bundle posts by same user
export const POSTS_BUNDLE_TIME_DIFF = 1000 * 60 * 10 // 10 min difference
export const POST_TIME_FORMAT = 'h:mm a'