Feature/copilot feedback (#4408)

* fix: issue #4399

* Temp deployable feature branch

* fix: issue #4399

Co-authored-by: yoution <[email protected]>

Author: vikasrohit

.circleci/config.yml

@@ -188,7 +188,7 @@ workflows:
             - build-dev
           filters: &filters-dev
             branches:
-              only: ['dev', 'feature/billing_account_protection']
+              only: ['dev', 'feature/copilot-feedback']
 
       - deployTest01:
           context : org-global

config/constants/dev.js

@@ -32,6 +32,7 @@ module.exports = {
 
   ACCOUNTS_APP_URL             : 'https://accounts-auth0.topcoder-dev.com',
   ACCOUNTS_APP_CONNECTOR_URL   : 'https://accounts-auth0.topcoder-dev.com',
+  TYPEFORM_URL      : 'https://topcoder.typeform.com/to/vgqiBXdk',
 
   FILE_PICKER_API_KEY: process.env.FILE_PICKER_API_KEY_DEV,
   FILE_PICKER_SUBMISSION_CONTAINER_NAME: 'submission-staging-dev',

config/constants/master.js

@@ -33,6 +33,7 @@ module.exports = {
 
   ACCOUNTS_APP_URL             : 'https://accounts-auth0.topcoder.com',
   ACCOUNTS_APP_CONNECTOR_URL   : 'https://accounts-auth0.topcoder.com',
+  TYPEFORM_URL      : 'https://topcoder.typeform.com/to/vgqiBXdk',
 
   FILE_PICKER_API_KEY: process.env.FILE_PICKER_API_KEY_PROD,
   FILE_PICKER_SUBMISSION_CONTAINER_NAME: 'submission-staging-prod',

config/constants/qa.js

@@ -32,6 +32,7 @@ module.exports = {
 
   ACCOUNTS_APP_URL             : 'https://accounts.topcoder-qa.com/#!/member',
   ACCOUNTS_APP_CONNECTOR_URL   : 'https://accounts.topcoder-qa.com/connector.html',
+  TYPEFORM_URL      : 'https://topcoder.typeform.com/to/vgqiBXdk',
 
   FILE_PICKER_API_KEY: process.env.FILE_PICKER_API_KEY_QA,
   FILE_PICKER_SUBMISSION_CONTAINER_NAME: 'submission-staging-qa',

src/components/TeamManagement/MemberItem.jsx

@@ -5,12 +5,13 @@ require('moment-timezone')
 import UserTooltip from '../User/UserTooltip'
 import SunIcon from '../../assets/icons/daylight.svg'
 import MoonIcon from '../../assets/icons/moon.svg'
+import FAQIcon from '../../assets/icons/faq.svg'
 import { getFullNameWithFallback } from '../../helpers/tcHelpers'
 import './MemberItem.scss'
 
 const  MemberItem  = (props) => {
 
-  const {usr, showEmailOnly} = props
+  const {usr, showEmailOnly, feedback} = props
 
   const userFullName = getFullNameWithFallback(usr)
   const workingHourStart = _.get(usr, 'workingHourStart')
@@ -64,6 +65,7 @@ const  MemberItem  = (props) => {
   return (
     <div styleName="container">
       <UserTooltip {...props} localTimeInfo={localTimeInfoEl}/>
+      {feedback && <span styleName="feed-back"> <a href={feedback} target="_blank"><FAQIcon/></a></span>}
       <div styleName="member-detail">
         <div styleName="member-name">{showEmailOnly? email :userFullName}</div>
         {localWhStart && localWhEnd && <div styleName="wk-hour">WH: {localWhStart} - {localWhEnd} {localTimeOffsetFormat}</div>}
@@ -84,6 +86,7 @@ MemberItem.propTypes = {
     PropTypes.number
   ]).isRequired,
   previewAvatar: PropTypes.bool,
+  feedback: PropTypes.string,
   showEmailOnly: PropTypes.bool,
   size: PropTypes.number
 }

src/components/TeamManagement/MemberItem.scss

@@ -5,6 +5,7 @@
   flex-direction: row;
   min-height: 51px;
   width: 100%;
+  position: relative;
 
   & + & {
     margin-top: 2 * $base-unit;
@@ -20,6 +21,20 @@
   }
 }
 
+.feed-back {
+  position: absolute;
+  font-size: 12px;
+  right: 0px;
+  top: 4px;
+  display: flex;
+  align-items: center;
+
+  svg {
+    width: 15px;
+    margin-top: -2px;
+  }
+}
+
 .member-detail {
   margin-left: 2 * $base-unit;
   overflow: hidden;

src/components/TeamManagement/TeamManagement.jsx

@@ -9,6 +9,7 @@ import MemberItem from './MemberItem'
 import AddIcon from  '../../assets/icons/icon-ui-bold-add.svg'
 import Dialog from './Dialog'
 import { PERMISSIONS } from '../../config/permissions'
+import { TYPEFORM_URL } from '../../config/constants'
 import {hasPermission} from '../../helpers/permissions'
 import { getFullNameWithFallback } from '../../helpers/tcHelpers'
 
@@ -213,8 +214,13 @@ class TeamManagement extends React.Component {
                 return null
               }
 
+              let feedback = ''
+              if (member.handle !== currentUser.handle) {
+                feedback = `${TYPEFORM_URL}#copilot=${member.handle}&projectid=${projectId}&submitter=${currentUser.handle}`
+              }
+
               return (
-                <MemberItem usr={member} id={i} key={i} previewAvatar size={40}/>
+                <MemberItem usr={member} id={i} key={i} previewAvatar size={40} feedback={feedback} />
               )
             })}
             {copilotTeamInvites.map((invite, i) => {

src/config/constants.js

@@ -764,6 +764,7 @@ export const TC_NOTIFICATION_URL = process.env.TC_NOTIFICATION_URL || `${TC_API_
 
 export const TC_CDN_URL = process.env.TC_CDN_URL || `https://community-app.${DOMAIN}/api/cdn/public`
 
+export const TYPEFORM_URL = process.env.TYPEFORM_URL || 'https://topcoder.typeform.com/to/vgqiBXdk'
 export const RESET_PASSWORD_URL = `https://accounts.${DOMAIN}/member/reset-password`
 export const VERIFY_EMAIL_URL = `http://www.${DOMAIN}/settings/account/changeEmail`
 export const TOPCODER_CONNECT_TERMS_URL = `https://connect.${DOMAIN}/terms`