From f045c08b2e80c78fa624b4dbb10b16bf89f0ccac Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Joel=20Elias=20M=C3=A9ndez?=
 <67445275+joelmendez1@users.noreply.github.com>
Date: Fri, 19 Nov 2021 14:22:35 -0300
Subject: [PATCH] [DEV-147] Add resend user-staff invitation (#1069)

* add resend user-staff invitation

* fix width issue

* fix styles issues

* fix code blank spaces

* improve coding

* improve coding
---
 .../src/app/admin/panel/staff/staff-editor.js | 55 +++++++++++++++++++
 .../app/admin/panel/staff/staff-editor.scss   | 16 +++++-
 client/src/data/languages/en.js               |  3 +
 3 files changed, 72 insertions(+), 2 deletions(-)

diff --git a/client/src/app/admin/panel/staff/staff-editor.js b/client/src/app/admin/panel/staff/staff-editor.js
index 09acc304..118cbe86 100644
--- a/client/src/app/admin/panel/staff/staff-editor.js
+++ b/client/src/app/admin/panel/staff/staff-editor.js
@@ -53,6 +53,8 @@ class StaffEditor extends React.Component {
         departments: this.getUserDepartments(),
         closedTicketsShown: false,
         sendEmailOnNewTicket: this.props.sendEmailOnNewTicket,
+        loadingReInviteStaff: false,
+        reInviteStaff: "",
         rawForm: {
             dateRange: statsUtils.getInitialDateRange(),
             departments: [],
@@ -152,6 +154,8 @@ class StaffEditor extends React.Component {
                     <div className="col-md-8">
                         <div className="staff-editor__activity">
                             <div className="staff-editor__activity-title">{i18n('ACTIVITY')}</div>
+                            {myData.lastLogin ? null : this.renderReInviteStaffButton()}
+                            {this.renderReInviteStaffMessage()}
                             {this.renderStaffStats()}
                         </div>
                     </div>
@@ -162,6 +166,56 @@ class StaffEditor extends React.Component {
         );
     }
 
+    renderReInviteStaffButton () {
+        const inviteStaffButtonContent = <div><Icon name="user-plus" /> {i18n('INVITE_STAFF')}</div>;
+
+        return (
+            <div className="staff-editor__staff-invitation-content">
+                {i18n('USER_UNLOGGED_IN')}
+                <Button onClick={this.onReInviteStaffButton.bind(this)} size="medium" type="secondary" className="staff-editor__staff-invitation-button" disabled={this.state.loadingReInviteStaff}>
+                    {this.state.loadingReInviteStaff ? <Loading /> : inviteStaffButtonContent}
+                </Button>
+            </div>
+        );
+    }
+
+    renderReInviteStaffMessage() {
+        const { reInviteStaff } = this.state;
+
+        if (reInviteStaff) {
+            return (
+                 <Message className="staff-editor__staff-invitation-message" type={reInviteStaff} leftAligned>
+                    {(reInviteStaff === "success") ? i18n('RESEND_STAFF_INVITATION_SUCCESS') : i18n('RESEND_STAFF_INVITATION_FAIL')}
+                </Message>
+            );
+        } else {
+            return null;
+        }
+    }
+
+    onReInviteStaffButton() {
+        this.setState({
+            loadingReInviteStaff: true
+        })
+
+        API.call({
+            path: '/staff/resend-invite-staff',
+            data: {
+                email: this.props.email
+            }
+        }).then(() => {
+            this.setState({
+                loadingReInviteStaff: false,
+                reInviteStaff: 'success'
+            })
+        }).catch(() => {
+            this.setState({
+                loadingReInviteStaff: false,
+                reInviteStaff: 'error'
+            })
+        })
+    }
+
     renderMessage() {
         const { message } = this.state;
         let messageType = (message === 'FAIL') ? 'error' : 'success';
@@ -317,6 +371,7 @@ class StaffEditor extends React.Component {
                 departmentIndexes.push(index);
             }
         });
+
         return departmentIndexes;
     }
 
diff --git a/client/src/app/admin/panel/staff/staff-editor.scss b/client/src/app/admin/panel/staff/staff-editor.scss
index 6ddfa0ff..0782f0aa 100644
--- a/client/src/app/admin/panel/staff/staff-editor.scss
+++ b/client/src/app/admin/panel/staff/staff-editor.scss
@@ -213,11 +213,23 @@
     }
 
     &__activity {
-
         &-title {
             margin-bottom: 10px;
             text-align: left;
         }
     }
 
-}
\ No newline at end of file
+    &__staff {
+        &-invitation-content {
+            width: 100%;
+            display: flex;
+            justify-content: space-between;
+            align-items: center;
+            padding: 20px 0;
+        }
+
+        &-invitation-button {
+            min-width: 180px;
+        }
+    }
+}
diff --git a/client/src/data/languages/en.js b/client/src/data/languages/en.js
index c40cefda..140cb7ea 100644
--- a/client/src/data/languages/en.js
+++ b/client/src/data/languages/en.js
@@ -244,6 +244,9 @@ export default {
     'RESEND_EMAIL_VERIFICATION': 'Resend e-mail verification',
     'RESEND_EMAIL_VERIFICATION_SUCCESS': 'The mail was sent successfully',
     'RESEND_EMAIL_VERIFICATION_FAIL': 'An error has occurred',
+    'USER_UNLOGGED_IN': 'This user has never logged in before',
+    'RESEND_STAFF_INVITATION_SUCCESS': 'The invitation was sent successfully',
+    'RESEND_STAFF_INVITATION_FAIL': 'The invitation could not be sent',
 
     //ACTIVITIES
     'ACTIVITY_COMMENT': 'commented ticket',