Merge pull request #3350 from appirio-tech/hotfix/post-release-2.4.15.2

[HOTFIX] [PROD] Post-release 2.4.15.2

Author: vikasrohit

src/components/TeamManagement/TeamManagement.scss

@@ -453,6 +453,45 @@
     }
   }
 
+  .decline-btn {
+    @include roboto;
+    cursor: pointer;
+    padding: $base-unit*2 $base-unit*3;
+    display: flex;
+    align-items: center;
+    height: 40px;
+    border: 1px solid $tc-gray-10;
+    border-radius: 20px !important;
+    margin: $base-unit*2 0 $base-unit 0;
+    color: $tc-gray-70;
+    font-size: $tc-label-md;
+    text-align: center;
+    justify-content: center;
+    width: 130px;
+    margin: 5px;
+
+    svg {
+      margin-right: $base-unit * 0.5;
+      transform: scale(.6);
+      fill: $tc-gray-90;
+    }
+
+    &.in-grid {
+      width: 103px;
+      margin: 0 5px 5px 5px;
+    }
+  }
+
+  .accept-btn {
+    border-radius: 20px !important;
+    white-space: nowrap;
+    margin: 5px;
+
+    &.in-grid {
+      padding: 0px 11px !important;
+    }
+  }
+
   .join-btn {
     @include roboto;
     cursor: pointer;
@@ -472,6 +511,7 @@
       fill: $tc-gray-90;
     }
   }
+
 }
 
 .separator {

src/config/constants.js

@@ -652,6 +652,21 @@ export const ROLE_PROGRAM_MANAGER = 'Program Manager'
 export const ROLE_SOLUTION_ARCHITECT = 'Solution Architect'
 export const ROLE_PROJECT_MANAGER = 'Project Manager'
 
+export const ADMIN_ROLES = [ROLE_ADMINISTRATOR, ROLE_CONNECT_ADMIN]
+
+export const MANAGER_ROLES = [
+  ...ADMIN_ROLES,
+  ROLE_CONNECT_MANAGER,
+  ROLE_CONNECT_ACCOUNT_MANAGER,
+  ROLE_CONNECT_COPILOT_MANAGER,
+  ROLE_BUSINESS_DEVELOPMENT_REPRESENTATIVE,
+  ROLE_PRESALES,
+  ROLE_ACCOUNT_EXECUTIVE,
+  ROLE_PROGRAM_MANAGER,
+  ROLE_SOLUTION_ARCHITECT,
+  ROLE_PROJECT_MANAGER,
+]
+
 // to be able to start the Connect App we should pass at least the dummy value for `FILE_PICKER_API_KEY`
 // but if we want to test file uploading we should provide the real value in `FILE_PICKER_API_KEY` env variable
 export const FILE_PICKER_API_KEY = process.env.FILE_PICKER_API_KEY || 'DUMMY'

src/helpers/utils.js

@@ -53,9 +53,20 @@ export const compareEmail = (email1, email2, options = { UNIQUE_GMAIL_VALIDATION
  *
  * @returns {Boolean} true if two user handles are same
  */
-export const compareHandles = (handle1, handle2) => (
-  (handle1 || '').toLowerCase() === (handle2 || '').toLowerCase()
-)
+export const compareHandles = (handle1, handle2) => {
+  if (handle1 === undefined || handle2 === undefined) {
+    return false
+  }
+  let h1 = handle1
+  let h2 = handle2
+  if (handle2.indexOf('@') === 0) {
+    h2 = (handle2 || '').substring(1)
+  }
+  if (handle1.indexOf('@') === 0) {
+    h1 = (handle1 || '').substring(1)
+  }
+  return h1.toLowerCase() === h2.toLowerCase()
+}
 
 // remove empty object, null/undefined value and empty string recursively from passed obj
 const deepClean = obj => _.transform(obj, (result, value, key) => {
@@ -90,4 +101,4 @@ export const createEvent = (eventName) => {
     event.initEvent(eventName, true, true)
   }
   return event
-}
+}

src/projects/actions/projectMember.js

@@ -19,7 +19,8 @@ import {ADD_PROJECT_MEMBER, REMOVE_PROJECT_MEMBER, UPDATE_PROJECT_MEMBER,
   PROJECT_ROLE_CUSTOMER,
   PROJECT_MEMBER_INVITE_STATUS_CANCELED,
   RELOAD_PROJECT_MEMBERS,
-  CLEAR_MEMBER_SUGGESTIONS
+  CLEAR_MEMBER_SUGGESTIONS,
+  ACCEPT_OR_REFUSE_INVITE_FAILURE
 } from '../../config/constants'
 
 
@@ -160,15 +161,32 @@ export function inviteProjectMembers(projectId, emailIds, handles) {
   }
 }
 
-export function acceptOrRefuseInvite(projectId, item) {
+/**
+ * Accept or refuse invite
+ * @param {Number} projectId project id
+ * @param {Object} item accept or refuse invite info
+ * @param {Object} currentUser current user info
+ */
+export function acceptOrRefuseInvite(projectId, item, currentUser) {
   return (dispatch) => {
     return dispatch({
       type: ACCEPT_OR_REFUSE_INVITE,
-      payload: updateProjectMemberInvite(projectId, item)
+      payload: updateProjectMemberInvite(projectId, item),
+      meta: { projectId, currentUser },
     })
   }
 }
 
+/**
+ * Accept or refuse invite request fail
+ * @param {Object} error error object
+ */
+export function acceptOrRefuseInviteFail(error) {
+  return (dispatch) => {
+    return dispatch({ type: ACCEPT_OR_REFUSE_INVITE_FAILURE, payload: error })
+  }
+}
+
 export function reloadProjectMembers(projectId) {
   return (dispatch) => {
     return dispatch({

src/projects/components/projectsCard/ProjectCard.jsx

@@ -1,14 +1,15 @@
 import React from 'react'
 import PT from 'prop-types'
 import _ from 'lodash'
-import { withRouter, Link } from 'react-router-dom'
+import { withRouter } from 'react-router-dom'
 import { getProjectRoleForCurrentUser } from '../../../helpers/projectHelper'
 import ProjectCardHeader from './ProjectCardHeader'
 import ProjectCardBody from './ProjectCardBody'
 import ProjectManagerAvatars from '../../list/components/Projects/ProjectManagerAvatars'
+import LoadingIndicator from '../../../components/LoadingIndicator/LoadingIndicator'
 import './ProjectCard.scss'
 
-function ProjectCard({ project, duration, disabled, currentUser, history, onChangeStatus, projectTemplates, unreadMentionsCount }) {
+function ProjectCard({ project, duration, disabled, currentUser, history, onChangeStatus, projectTemplates, unreadMentionsCount, callInviteRequest, isAcceptingInvite }) {
   const className = `ProjectCard ${ disabled ? 'disabled' : 'enabled'}`
   if (!project) return null
   const currentMemberRole = getProjectRoleForCurrentUser({ project, currentUserId: currentUser.userId})
@@ -41,11 +42,27 @@ function ProjectCard({ project, duration, disabled, currentUser, history, onChan
         <ProjectManagerAvatars managers={project.members} maxShownNum={10} />
         <div>
           {(!isMember && isInvited) &&
-            <Link to={`/projects/${project.id}`} className="spacing">
-              <div className="join-btn" style={{margin: '5px'}}>
-                Join project
-              </div>
-            </Link>
+            <div className="spacing join-btn-container">
+              {(!isAcceptingInvite) && (
+                <button
+                  onClick={(event) => {
+                    event.stopPropagation()
+                    callInviteRequest(project, true)
+                  }}
+                  className={'tc-btn tc-btn-primary tc-btn-md blue accept-btn'}
+                >
+                  Join project
+                </button>)}
+              {(!isAcceptingInvite) && (
+                <button
+                  onClick={(event) => {
+                    event.stopPropagation()
+                    callInviteRequest(project, false)
+                  }}
+                  className="decline-btn"
+                >Decline</button>)}
+              {isAcceptingInvite && (<LoadingIndicator isSmall />)}
+            </div>
           }
         </div>
       </div>
@@ -54,13 +71,17 @@ function ProjectCard({ project, duration, disabled, currentUser, history, onChan
 }
 
 ProjectCard.defaultTypes = {
+  callInviteRequest: () => {},
+  isAcceptingInvite: false,
 }
 
 ProjectCard.propTypes = {
   project: PT.object.isRequired,
   currentMemberRole: PT.string,
   projectTemplates: PT.array.isRequired,
-  unreadMentionsCount: PT.number.isRequired
+  unreadMentionsCount: PT.number.isRequired,
+  callInviteRequest: PT.func,
+  isAcceptingInvite: PT.bool
   // duration: PT.object.isRequired,
 }
 

src/projects/components/projectsCard/ProjectCard.scss

@@ -84,10 +84,15 @@
 
     .card-footer {
       // padding-top: 4 * $base_unit;
+      display: flex;
+      justify-content: space-between;
+      align-items: flex-end;
     }
 
-    .join-btn {
-      float: right;
+    .join-btn-container {
+      display: flex;
+      align-items: flex-end;
+      flex-direction: column;
     }
   }
 }

src/projects/components/projectsCard/ProjectsCardView.jsx

@@ -20,7 +20,8 @@ const ProjectsCardView = props => {
   //const { projects, members, totalCount, criteria, pageNum, applyFilters, sortHandler, onPageChange, error, isLoading, onNewProjectIntent } = props
   // TODO: use applyFilters and onNewProjectIntent. Temporary delete to avoid lint errors.
   const { projects, members, currentUser, onPageChange, pageNum, totalCount, infiniteAutoload, newProjectLink,
-    setInfiniteAutoload, isLoading, onChangeStatus, projectsStatus, projectTemplates, applyFilters, notifications } = props
+    setInfiniteAutoload, isLoading, onChangeStatus, projectsStatus, projectTemplates, applyFilters, notifications,
+    callInviteRequest, isAcceptingInvite } = props
   // const currentSortField = _.get(criteria, 'sort', '')
 
   // annotate projects with member data
@@ -50,6 +51,8 @@ const ProjectsCardView = props => {
         onChangeStatus={onChangeStatus}
         projectTemplates={projectTemplates}
         unreadMentionsCount={unreadMentionsCount}
+        callInviteRequest={callInviteRequest}
+        isAcceptingInvite={isAcceptingInvite[project.id]}
       />
     </div>)
   }
@@ -97,7 +100,7 @@ const ProjectsCardView = props => {
         hasMore={hasMore}
         threshold={500}
       >
-        { [...projects, ...placeholders].map(renderProject)}
+        { [...projects, ...placeholders].map((project) => renderProject(project))}
         {moreProject(true)}
         <div className="project-card project-card-new">
           <NewProjectCard link={newProjectLink} />
@@ -129,6 +132,8 @@ ProjectsCardView.propTypes = {
   applyFilters: PropTypes.func,
   isLoading: PropTypes.bool,
   projectTemplates: PropTypes.array.isRequired,
+  callInviteRequest: PropTypes.func,
+  isAcceptingInvite: PropTypes.object,
 }