-
Notifications
You must be signed in to change notification settings - Fork 0
/
CommentsBlock.jsx
27 lines (21 loc) · 1.44 KB
/
CommentsBlock.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
import React from "react"
import commentsBlock_s from "./CommentsBlock_style.module.scss"
const CommentsBlock = (props) => {
return <div className={commentsBlock_s.commentsComponent}>
<div className={commentsBlock_s.commentsBlock}>
<div className={commentsBlock_s.addCommentsBlock}>
<textarea value={props.data.valueOfTheCommentAddingField} disabled={props.data.addCommentStatus} ref={props.data.commentField} onChange={() => props.data.setValueOfTheCommentAddingField(props.data.commentField.current.value)} placeholder={props.data.placeholder} className="form-control" id="exampleFormControlTextarea1" rows="3"></textarea>
<button disabled={props.data.addCommentStatus} onClick={() => props.data.postComment(props.data.commentField.current.value)}>Send</button>
</div>
<div className={commentsBlock_s.visibleComments}>
{props.data.visibleComments}
</div>
<nav className={commentsBlock_s.commentsPages}>
<button id={commentsBlock_s.listPagesBack} disabled={props.data.backButtonStatus} onClick={() => props.data.pagesBack()}><a>Back</a></button>
{props.data.visiblePages}
<button id={commentsBlock_s.listPagesForward} disabled={props.data.forwardButtonStatus} onClick={() => props.data.pagesForward()}><a>Forward</a></button>
</nav>
</div>
</div>
}
export default CommentsBlock;