Merge branch 'cf-jan-2021' into fixes-#927

Author: mark-nakachon

README.md

@@ -39,8 +39,6 @@ npm install
 
 1. copy the environment file in docs/dev.env to /.env
 
-1. add `127.0.0.1 local.topcoder-dev.com` to your /etc/hosts file
-
 1. If you are using local instances of the API's, change the DEV_API_HOSTNAME in configs/constants/development.js to match your local api endpoint.
     - For example change it to 'http://localhost:3000/',
 
@@ -50,7 +48,7 @@ npm install
 npm run dev
 ```
 
-You can access the app from [http://local.topcoder-dev.com:3001/](http://local.topcoder-dev.com:3001/)
+You can access the app from [http://localhost:3000/](http://localhost:3000/)
 
 The page will reload if you make edits.
 

config/constants/development.js

@@ -7,7 +7,6 @@ module.exports = {
   COMMUNITY_APP_URL: `https://www.${DOMAIN}`,
   MEMBER_API_URL: `${DEV_API_HOSTNAME}/v4/members`,
   MEMBER_API_V3_URL: `${DEV_API_HOSTNAME}/v3/members`,
-  DEV_APP_URL: `http://local.${DOMAIN}`,
   CHALLENGE_API_URL: `${DEV_API_HOSTNAME}/v5/challenges`,
   CHALLENGE_TIMELINE_TEMPLATES_URL: `${DEV_API_HOSTNAME}/v5/timeline-templates`,
   CHALLENGE_TYPES_URL: `${DEV_API_HOSTNAME}/v5/challenge-types`,

config/constants/production.js

@@ -7,7 +7,6 @@ module.exports = {
   COMMUNITY_APP_URL: `https://www.${DOMAIN}`,
   MEMBER_API_URL: `${PROD_API_HOSTNAME}/v4/members`,
   MEMBER_API_V3_URL: `${PROD_API_HOSTNAME}/v3/members`,
-  DEV_APP_URL: `https://submission-review.${DOMAIN}`,
   CHALLENGE_API_URL: `${PROD_API_HOSTNAME}/v5/challenges`,
   CHALLENGE_TIMELINE_TEMPLATES_URL: `${PROD_API_HOSTNAME}/v5/timeline-templates`,
   CHALLENGE_TYPES_URL: `${PROD_API_HOSTNAME}/v5/challenge-types`,

public/favicon.ico

@@ -99,7 +99,7 @@ checkBrowsers(paths.appPath, isInteractive)
         clearConsole()
       }
       console.log(chalk.cyan('Starting the development server...\n'))
-      openBrowser(constants.DEV_APP_URL ? `${constants.DEV_APP_URL}:${process.env.PORT || 3000}` : urls.localUrlForBrowser)
+      openBrowser(urls.localUrlForBrowser)
     })
 
     const SIGNALS = ['SIGINT', 'SIGTERM']

scripts/start.js

@@ -13,6 +13,7 @@ import {
   fetchResourceRoles,
   fetchChallengeTimelines,
   fetchChallengeTracks,
+  fetchGroupDetail,
   updateChallenge,
   patchChallenge,
   deleteChallenge as deleteChallengeAPI,
@@ -186,6 +187,14 @@ export function loadChallengeDetails (projectId, challengeId) {
   }
 }
 
+/**
+ * Loads group details
+ */
+export function loadGroupDetails (groupIds) {
+  const promiseAll = groupIds.map(id => fetchGroupDetail(id))
+  return Promise.all(promiseAll)
+}
+
 /**
  * Update challenge details
  *

src/actions/challenges.js

@@ -45,5 +45,10 @@
   .readOnlyValue {
     margin-bottom: 0.5rem; // the same like `label` to be aligned
   }
+
+  .assignSelfField {
+    margin-left: 20px;
+    padding-top: 6px;
+  }
 }
 

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

@@ -7,12 +7,13 @@ import cn from 'classnames'
 import styles from './AssignedMember-Field.module.scss'
 import SelectUserAutocomplete from '../../SelectUserAutocomplete'
 
-const AssignedMemberField = ({ challenge, onChange, assignedMemberDetails, readOnly }) => {
+const AssignedMemberField = ({ challenge, onAssignSelf, onChange, assignedMemberDetails, readOnly }) => {
   const value = assignedMemberDetails ? {
     // if we know assigned member details, then show user `handle`, otherwise fallback to `userId`
     label: assignedMemberDetails.handle,
     value: assignedMemberDetails.userId + ''
   } : null
+
   return (
     <div className={styles.row}>
       <div className={cn(styles.field, styles.col1)}>
@@ -28,6 +29,15 @@ const AssignedMemberField = ({ challenge, onChange, assignedMemberDetails, readO
           />
         )}
       </div>
+      {
+        !readOnly &&
+          <div className={styles.assignSelfField}>
+            <a href='#' onClick={(e) => {
+              e.preventDefault()
+              onAssignSelf()
+            }}>Assign to me</a>
+          </div>
+      }
     </div>
   )
 }
@@ -41,7 +51,8 @@ AssignedMemberField.propTypes = {
   challenge: PropTypes.shape().isRequired,
   onChange: PropTypes.func,
   assignedMemberDetails: PropTypes.shape(),
-  readOnly: PropTypes.bool
+  readOnly: PropTypes.bool,
+  onAssignSelf: PropTypes.func
 }
 
 export default AssignedMemberField

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

@@ -1,4 +1,4 @@
-import React, { useState } from 'react'
+import React, { useState, useEffect } from 'react'
 import _ from 'lodash'
 import { Helmet } from 'react-helmet'
 import PropTypes from 'prop-types'
@@ -21,6 +21,7 @@ import PhaseInput from '../../PhaseInput'
 import LegacyLinks from '../../LegacyLinks'
 import AssignedMemberField from '../AssignedMember-Field'
 import { getResourceRoleByName } from '../../../util/tc'
+import { loadGroupDetails } from '../../../actions/challenges'
 import Tooltip from '../../Tooltip'
 import { MESSAGE, REVIEW_TYPES } from '../../../config/constants'
 
@@ -40,6 +41,18 @@ const ChallengeView = ({
   const challengeTrack = _.find(metadata.challengeTracks, { id: challenge.trackId })
 
   const [openAdvanceSettings, setOpenAdvanceSettings] = useState(false)
+  const [groups, setGroups] = useState('')
+
+  useEffect(() => {
+    if (challenge.groups && challenge.groups.length > 0) {
+      loadGroupDetails(challenge.groups).then(res => {
+        const groups = _.map(res, 'name').join(', ')
+        setGroups(groups)
+      })
+    } else {
+      setGroups('')
+    }
+  }, [challenge.groups])
 
   const getResourceFromProps = (name) => {
     const { resourceRoles } = metadata
@@ -167,7 +180,7 @@ const ChallengeView = ({
             </div>
             {openAdvanceSettings && (<div className={cn(styles.row, styles.topRow)}>
               <div className={styles.col}>
-                <span><span className={styles.fieldTitle}>Groups:</span> {challenge.groups ? challenge.groups.join(', ') : ''}</span>
+                <span><span className={styles.fieldTitle}>Groups:</span> {groups}</span>
               </div>
             </div>)}
             {

src/components/ChallengeEditor/ChallengeView/index.js

@@ -91,6 +91,7 @@ class ChallengeEditor extends Component {
     this.onUpdateOthers = this.onUpdateOthers.bind(this)
     this.onUpdateCheckbox = this.onUpdateCheckbox.bind(this)
     this.onUpdateAssignedMember = this.onUpdateAssignedMember.bind(this)
+    this.onAssignSelf = this.onAssignSelf.bind(this)
     this.addFileType = this.addFileType.bind(this)
     this.removeFileType = this.removeFileType.bind(this)
     this.updateFileTypesMetadata = this.updateFileTypesMetadata.bind(this)
@@ -359,6 +360,22 @@ class ChallengeEditor extends Component {
     })
   }
 
+  /**
+   * Update Assigned Member to Current User
+   */
+  onAssignSelf () {
+    const { loggedInUser } = this.props
+
+    const assignedMemberDetails = {
+      handle: loggedInUser.handle,
+      userId: loggedInUser.userId
+    }
+
+    this.setState({
+      assignedMemberDetails
+    })
+  }
+
   /**
    * Update Single Select
    * @param option The select option
@@ -1350,6 +1367,7 @@ class ChallengeEditor extends Component {
                 challenge={challenge}
                 onChange={this.onUpdateAssignedMember}
                 assignedMemberDetails={assignedMemberDetails}
+                onAssignSelf={this.onAssignSelf}
               />
             )}
             <CopilotField challenge={challenge} copilots={metadata.members} onUpdateOthers={this.onUpdateOthers} />
@@ -1508,7 +1526,8 @@ ChallengeEditor.propTypes = {
   createChallenge: PropTypes.func,
   replaceResourceInRole: PropTypes.func,
   partiallyUpdateChallengeDetails: PropTypes.func.isRequired,
-  deleteChallenge: PropTypes.func.isRequired
+  deleteChallenge: PropTypes.func.isRequired,
+  loggedInUser: PropTypes.shape().isRequired
 }
 
 export default withRouter(ChallengeEditor)

src/components/ChallengeEditor/index.js

@@ -231,7 +231,8 @@ class ChallengeEditor extends Component {
       partiallyUpdateChallengeDetails,
       createChallenge,
       replaceResourceInRole,
-      deleteChallenge
+      deleteChallenge,
+      loggedInUser
       // members
     } = this.props
     const {
@@ -338,6 +339,7 @@ class ChallengeEditor extends Component {
             replaceResourceInRole={replaceResourceInRole}
             partiallyUpdateChallengeDetails={partiallyUpdateChallengeDetails}
             deleteChallenge={deleteChallenge}
+            loggedInUser={loggedInUser}
           />
         ))
         } />

src/containers/ChallengeEditor/index.js

@@ -65,6 +65,17 @@ export async function fetchGroups (filters) {
   return _.get(response, 'data', [])
 }
 
+/**
+ * Api request for fetching Group Detail
+ *
+ * @param groupId
+ * @returns {Promise<*>}
+ */
+export async function fetchGroupDetail (id) {
+  const response = await axiosInstance.get(`${GROUPS_API_URL}/${id}`)
+  return _.get(response, 'data', [])
+}
+
 /**
  * Api request for fetching timeline templates
  * @returns {Promise<*>}