Phase durations

.circleci/config.yml

@@ -150,7 +150,7 @@ workflows:
           context : org-global
           filters: &filters-dev
             branches:
-              only: ['develop', 'hot-fix-jira-vuln-2333']
+              only: ['develop']
 
       # Production builds are exectuted only on tagged commits to the
       # master branch.

package.json

@@ -7,6 +7,7 @@
     "@fortawesome/fontawesome-svg-core": "^1.2.14",
     "@fortawesome/free-solid-svg-icons": "^5.7.1",
     "@fortawesome/react-fontawesome": "^0.1.4",
+    "@nateradebaugh/react-datetime": "^4.4.11",
     "@popperjs/core": "^2.5.4",
     "@svgr/webpack": "2.4.1",
     "axios": "^0.19.0",
@@ -53,6 +54,7 @@
     "mini-css-extract-plugin": "0.4.3",
     "moment": "^2.24.0",
     "moment-duration-format": "^2.2.2",
+    "moment-timezone": "^0.5.34",
     "node-sass": "^4.14.0",
     "optimize-css-assets-webpack-plugin": "5.0.1",
     "pnp-webpack-plugin": "1.1.0",

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

@@ -6,7 +6,7 @@ import $ from 'jquery'
 import styles from './ChallengeSchedule-Field.module.scss'
 import cn from 'classnames'
 import jstz from 'jstimezonedetect'
-import PhaseInput from '../../PhaseInput'
+import StartDateInput from '../../StartDateInput'
 import Chart from 'react-google-charts'
 import Select from '../../Select'
 import { parseSVG } from '../../../util/svg'
@@ -183,7 +183,7 @@ class ChallengeScheduleField extends Component {
     return (
       _.map(challenge.phases, (p, index) => (
         <div className={styles.PhaseRow} key={index}>
-          <PhaseInput
+          <StartDateInput
             phase={this.getPhaseTemplate(p)}
             withDuration
             onUpdateSelect={onUpdateSelect}
@@ -345,7 +345,7 @@ class ChallengeScheduleField extends Component {
           </div>
         </div> }
         <div className={styles.PhaseRow}>
-          <PhaseInput
+          <StartDateInput
             withDates
             phase={{
               name: 'Start Date',

src/components/ChallengeEditor/ChallengeView/index.js

@@ -16,12 +16,12 @@ import ChallengePrizesField from '../ChallengePrizes-Field'
 import CopilotFeeField from '../CopilotFee-Field'
 import ChallengeTotalField from '../ChallengeTotal-Field'
 import Loader from '../../Loader'
-import PhaseInput from '../../PhaseInput'
 import AssignedMemberField from '../AssignedMember-Field'
 import { getResourceRoleByName } from '../../../util/tc'
 import { isBetaMode } from '../../../util/cookie'
 import { loadGroupDetails } from '../../../actions/challenges'
 import { REVIEW_TYPES, CONNECT_APP_URL, PHASE_PRODUCT_CHALLENGE_ID_FIELD } from '../../../config/constants'
+import PhaseInput from '../../PhaseInput'
 
 const ChallengeView = ({
   projectDetail,
@@ -90,6 +90,7 @@ const ChallengeView = ({
   if (isLoading || _.isEmpty(metadata.challengePhases) || challenge.id !== challengeId) return <Loader />
   const showTimeline = false // disables the timeline for time being https://github.com/topcoder-platform/challenge-engine-ui/issues/706
   const isTask = _.get(challenge, 'task.isTask', false)
+  const phases = _.get(challenge, 'phases', [])
 
   return (
     <div className={styles.wrapper}>
@@ -188,16 +189,14 @@ const ChallengeView = ({
               </>
             )}
             {
-              <div className={styles.PhaseRow}>
+              phases.map((phase, index) => (
                 <PhaseInput
-                  withDates
-                  phase={{
-                    name: 'Start Date',
-                    date: challenge.startDate
-                  }}
+                  phase={phase}
+                  phaseIndex={index}
+                  key={index}
                   readOnly
                 />
-              </div>
+              ))
             }
             {showTimeline && (
               <ChallengeScheduleField