-
Notifications
You must be signed in to change notification settings - Fork 2k
/
actions.jsx
90 lines (78 loc) · 2.7 KB
/
actions.jsx
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
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
/**
* External dependencies
*/
import PropTypes from 'prop-types';
import React from 'react';
import { connect } from 'react-redux';
import { localize } from 'i18n-calypso';
/**
* Internal dependencies
*/
import getIsNoteApproved from '../state/selectors/get-is-note-approved';
import getIsNoteLiked from '../state/selectors/get-is-note-liked';
import ApproveButton from './button-approve';
import EditButton from './button-edit';
import LikeButton from './button-like';
import ReplyInput from './comment-reply-input';
import SpamButton from './button-spam';
import TrashButton from './button-trash';
import { getActions, getReferenceId } from '../helpers/notes';
const getType = ( note ) => ( null === getReferenceId( note, 'comment' ) ? 'post' : 'comment' );
const getInitialReplyValue = ( note, translate ) => {
let ranges;
let username;
if ( 'user' === note.subject[ 0 ].ranges[ 0 ].type ) {
// Build the username from the subject line
ranges = note.subject[ 0 ].ranges[ 0 ].indices;
username = note.subject[ 0 ].text.substring( ranges[ 0 ], ranges[ 1 ] );
} else if ( 'user' === note.body[ 0 ].type ) {
username = note.body[ 0 ].text;
} else {
username = null;
}
if ( username ) {
return translate( 'Reply to %(username)s...', {
args: { username },
} );
}
return getType( note ) === 'post'
? translate( 'Reply to post...' )
: translate( 'Reply to comment...' );
};
const ActionsPane = ( { global, isApproved, isLiked, note, translate } ) => {
const actions = getActions( note );
const hasAction = ( types ) =>
[].concat( types ).some( ( type ) => actions.hasOwnProperty( type ) );
return (
<div className="wpnc__note-actions">
<div className="wpnc__note-actions__buttons">
{ hasAction( 'approve-comment' ) && <ApproveButton { ...{ note, isApproved } } /> }
{ hasAction( 'spam-comment' ) && <SpamButton note={ note } /> }
{ hasAction( 'trash-comment' ) && <TrashButton note={ note } /> }
{ hasAction( [ 'like-post', 'like-comment' ] ) && <LikeButton { ...{ note, isLiked } } /> }
{ hasAction( 'edit-comment' ) && <EditButton note={ note } /> }
</div>
{ !! actions[ 'replyto-comment' ] && (
<ReplyInput
{ ...{
note,
defaultValue: getInitialReplyValue( note, translate ),
global,
} }
/>
) }
</div>
);
};
ActionsPane.propTypes = {
global: PropTypes.object.isRequired,
isApproved: PropTypes.bool.isRequired,
isLiked: PropTypes.bool.isRequired,
note: PropTypes.object.isRequired,
translate: PropTypes.func.isRequired,
};
const mapStateToProps = ( state, { note } ) => ( {
isApproved: getIsNoteApproved( state, note ),
isLiked: getIsNoteLiked( state, note ),
} );
export default connect( mapStateToProps )( localize( ActionsPane ) );