Update Add Resource popup

https://topcoder.atlassian.net/browse/PROD-4325

Author: jmgasper

src/components/ChallengeEditor/AssignedMember-Field/AssignedMember-Field.module.scss

@@ -24,12 +24,15 @@
     }
 
     &.col1 {
-      max-width: 185px;
-      min-width: 185px;
+      width: 100px;
       margin-right: 14px;
       white-space: nowrap;
       display: flex;
       align-items: center;
+
+      &.showAssignToMe {
+        width: 185px;
+      }
     }
 
     &.col2 {

src/components/ChallengeEditor/AssignedMember-Field/index.js

@@ -7,7 +7,15 @@ import cn from 'classnames'
 import styles from './AssignedMember-Field.module.scss'
 import SelectUserAutocomplete from '../../SelectUserAutocomplete'
 
-const AssignedMemberField = ({ challenge, onAssignSelf, onChange, assignedMemberDetails, readOnly }) => {
+const AssignedMemberField = ({
+  challenge,
+  onAssignSelf,
+  onChange,
+  assignedMemberDetails,
+  readOnly,
+  showAssignToMe,
+  label
+}) => {
   const value = assignedMemberDetails ? {
     // if we know assigned member details, then show user `handle`, otherwise fallback to `userId`
     label: assignedMemberDetails.handle,
@@ -16,8 +24,14 @@ const AssignedMemberField = ({ challenge, onAssignSelf, onChange, assignedMember
 
   return (
     <div className={styles.row}>
-      <div className={cn(styles.field, styles.col1)}>
-        <label htmlFor='assignedMember'>Assigned Member :</label>
+      <div className={cn(
+        styles.field,
+        styles.col1,
+        {
+          [styles.showAssignToMe]: showAssignToMe
+        }
+      )}>
+        <label htmlFor='assignedMember'>{label} :</label>
       </div>
       <div className={cn(styles.field, styles.col2)}>
         {readOnly ? (
@@ -30,29 +44,33 @@ const AssignedMemberField = ({ challenge, onAssignSelf, onChange, assignedMember
         )}
       </div>
       {
-        !readOnly &&
-          <div className={styles.assignSelfField}>
+        (!readOnly && showAssignToMe)
+          ? (<div className={styles.assignSelfField}>
             <a href='#' onClick={(e) => {
               e.preventDefault()
               onAssignSelf()
             }}>Assign to me</a>
-          </div>
+          </div>) : null
       }
     </div>
   )
 }
 
 AssignedMemberField.defaultProps = {
   assignedMemberDetails: null,
-  readOnly: false
+  readOnly: false,
+  showAssignToMe: true,
+  label: 'Assigned Member'
 }
 
 AssignedMemberField.propTypes = {
   challenge: PropTypes.shape().isRequired,
   onChange: PropTypes.func,
   assignedMemberDetails: PropTypes.shape(),
   readOnly: PropTypes.bool,
-  onAssignSelf: PropTypes.func
+  showAssignToMe: PropTypes.bool,
+  onAssignSelf: PropTypes.func,
+  label: PropTypes.string
 }
 
 export default AssignedMemberField

src/components/ChallengeEditor/ResourcesAdd/index.js

@@ -66,17 +66,8 @@ const ResourcesAdd = ({
                 setAssignedMemberDetails(null)
               }
             }}
-            onAssignSelf={rs => {
-              const assignedMemberDetails = {
-                handle: loggedInUser.handle,
-                userId: loggedInUser.userId,
-                email: loggedInUser.email
-              }
-
-              setAssignedMemberDetails({
-                assignedMemberDetails
-              })
-            }}
+            showAssignToMe={false}
+            label='Member'
           />
 
           <div className={styles.fieldContainer}>

src/components/ChallengeEditor/ResourcesAdd/styles.module.scss

@@ -77,8 +77,7 @@
   margin: 30px 30px 0 30px;
 
   .field {
-    max-width: 185px;
-    min-width: 185px;
+    width: 100px;
     margin-right: 14px;
     white-space: nowrap;
     display: flex;