From e16321741943568054ba55fd79f7478e977cec06 Mon Sep 17 00:00:00 2001
From: Michael An <37589122+Michael18811380328@users.noreply.github.com>
Date: Fri, 23 Nov 2018 16:18:58 +0800
Subject: [PATCH] delete (#2558)

---
 .../components/dialog/add-reviewer-dialog.js  | 24 +++++++++++++++++--
 frontend/src/css/add-reviewer-dialog.css      | 12 ++++++++++
 2 files changed, 34 insertions(+), 2 deletions(-)

diff --git a/frontend/src/components/dialog/add-reviewer-dialog.js b/frontend/src/components/dialog/add-reviewer-dialog.js
index 5a2d4b9ba0..652686ae45 100644
--- a/frontend/src/components/dialog/add-reviewer-dialog.js
+++ b/frontend/src/components/dialog/add-reviewer-dialog.js
@@ -93,6 +93,23 @@ class AddReviewerDialog extends React.Component {
     }
   }
 
+  deleteReviewer = (event) => {
+    let reviewer = event.target.getAttribute('name');
+    seafileAPI.deleteReviewer(this.props.reviewID, reviewer).then((res) => {
+      if (res.data === 200) {
+        let newReviewers = [];
+        for (let i = 0; i < this.state.reviewers.length; i ++) {
+          if (this.state.reviewers[i].user_email !== reviewer) {
+            newReviewers.push(this.state.reviewers[i]);
+          }
+        }
+        this.setState({
+          reviewers: newReviewers
+        });
+      }
+    });
+  }
+
   render() {
     return (
       <Modal isOpen={this.props.showReviewerDialog}>
@@ -118,8 +135,11 @@ class AddReviewerDialog extends React.Component {
             this.state.reviewers.map((item, index = 0, arr) => {
               return (
                 <div className="reviewer-select-info" key={index}>
-                  <img className="avatar reviewer-select-avatar" src={item.avatar_url} alt=""/>
-                  <span className="reviewer-select-name">{item.user_name}</span>
+                  <div>
+                    <img className="avatar reviewer-select-avatar" src={item.avatar_url} alt=""/>
+                    <span className="reviewer-select-name">{item.user_name}</span>
+                  </div>
+                  <i className="fa fa-times" name={item.user_email} onClick={this.deleteReviewer}></i>
                 </div>
               );
             })
diff --git a/frontend/src/css/add-reviewer-dialog.css b/frontend/src/css/add-reviewer-dialog.css
index 2039859e7d..bc77ad859c 100644
--- a/frontend/src/css/add-reviewer-dialog.css
+++ b/frontend/src/css/add-reviewer-dialog.css
@@ -1,5 +1,8 @@
 .reviewer-select-info {
   margin-top: 10px;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
 }
 .reviewer-select-avatar {
   margin-right: 10px;
@@ -13,4 +16,13 @@
 }
 .reviewer-select .true__dropdown-indicator, .reviewer-select .true__indicator-separator {
   display: none;
+}
+.reviewer-select-info i {
+  opacity: 0;
+  margin-right: 10px;
+}
+.reviewer-select-info:hover i {
+  cursor: pointer;
+  opacity: 1;
+  color: #a4a4a4;
 }
\ No newline at end of file