Press n or j to go to the next uncovered block, b, p or k for the previous block.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 | import React from 'react' import UserPicture from '../User/UserPicture' import PageCommentNotification from './ModelAction/PageCommentNotification' import PageLikeNotification from './ModelAction/PageLikeNotification' import { Notification as NotificationType } from 'client/types/crowi' interface Props { notification: NotificationType onClick: Function } export default class Notification extends React.Component<Props> { onClick() { this.props.onClick(this.props.notification) } getActionUsers() { const notification = this.props.notification const latestActionUsers = notification.actionUsers.slice(0, 3) const latestUsers = latestActionUsers.map(user => { return '@' + user.username }) let actionedUsers = '' const latestUsersCount = latestUsers.length if (latestUsersCount === 1) { actionedUsers = latestUsers[0] } else if (notification.actionUsers.length >= 4) { actionedUsers = latestUsers.slice(0, 2).join(', ') + ` and ${notification.actionUsers.length - 2} others` } else { actionedUsers = latestUsers.join(', ') } return actionedUsers } getUserImage() { const latestActionUsers = this.props.notification.actionUsers.slice(0, 3) if (latestActionUsers.length < 1) { // what is this case? return '' } return <UserPicture user={latestActionUsers[0]} /> } render() { const notification = this.props.notification const componentName = `${notification.targetModel}:${notification.action}` const props = { actionUsers: this.getActionUsers(), ...this.props, } switch (componentName) { case 'Page:COMMENT': return <PageCommentNotification {...props} onClick={this.onClick.bind(this)} /> case 'Page:LIKE': return <PageLikeNotification {...props} onClick={this.onClick.bind(this)} /> default: } return '' } } |