Merge pull request #3323 from rashmi73/issue_3210

Issue #3210 fix

Author: maxceem

src/projects/detail/components/PhaseCard/EditStageForm.jsx

@@ -20,6 +20,10 @@ import Tooltip from 'appirio-tech-react-components/components/Tooltip/Tooltip'
 import { TOOLTIP_DEFAULT_DELAY } from '../../../../config/constants'
 import { getPhaseActualData } from '../../../../helpers/projectHelper'
 import DeletePhase from './DeletePhase'
+import {
+  ROLE_CONNECT_ADMIN,
+  ROLE_ADMINISTRATOR,
+} from '../../../../config/constants'
 
 const moment = extendMoment(Moment)
 const phaseStatuses = PHASE_STATUS.map(ps => ({
@@ -33,7 +37,7 @@ class EditStageForm extends React.Component {
 
     this.state = {
       isUpdating: false,
-      isEdittable: _.get(props, 'phase.status') !== PHASE_STATUS_COMPLETED,
+      isEdittable: (_.get(props, 'phase.status') !== PHASE_STATUS_COMPLETED) || (_.get(props, 'isAdmin')),
       disableActiveStatusFields: _.get(props, 'phase.status') !== PHASE_STATUS_ACTIVE,
       showPhaseOverlapWarning: false,
       phaseIsdirty: false,
@@ -83,7 +87,7 @@ class EditStageForm extends React.Component {
   componentWillReceiveProps(nextProps) {
     this.setState({
       isUpdating: nextProps.isUpdating,
-      isEdittable: nextProps.phase.status !== PHASE_STATUS_COMPLETED,
+      isEdittable: nextProps.phase.status !== PHASE_STATUS_COMPLETED || nextProps.isAdmin,
       disableActiveStatusFields: nextProps.phase.status !== PHASE_STATUS_ACTIVE,
     })
 
@@ -399,11 +403,18 @@ EditStageForm.propTypes = {
   phaseIndex: PT.number
 }
 
-const mapStateToProps = ({projectState, productsTimelines}) => ({
-  isUpdating: projectState.processing,
-  phases: projectState.phases,
-  productsTimelines
-})
+const mapStateToProps = ({projectState, productsTimelines, loadUser}) => {
+  const adminRoles = [
+    ROLE_ADMINISTRATOR,
+    ROLE_CONNECT_ADMIN,
+  ]
+  return {
+    isUpdating: projectState.processing,
+    phases: projectState.phases,
+    productsTimelines,
+    isAdmin: _.intersection(loadUser.user.roles, adminRoles).length > 0
+  }
+}
 
 const actionCreators = {
   updatePhaseAction,

src/projects/detail/components/PhaseCard/PhaseCard.jsx

@@ -19,6 +19,8 @@ import {
   PROJECT_STATUS_CANCELLED,
   SCREEN_BREAKPOINT_MD,
   EVENT_TYPE,
+  ROLE_CONNECT_ADMIN,
+  ROLE_ADMINISTRATOR,
 } from '../../../../config/constants'
 
 import ProjectProgress from '../../../../components/ProjectProgress/ProjectProgress'
@@ -93,15 +95,16 @@ class PhaseCard extends React.Component {
       hasUnseen,
       phaseId,
       isExpanded,
-      project
+      project,
+      isAdmin
     } = this.props
     const progressInPercent = attr.progressInPercent || 0
 
     let status = attr && attr.status ? attr.status : PHASE_STATUS_DRAFT
     status = _.find(PHASE_STATUS, s => s.value === status) ? status : PHASE_STATUS_DRAFT
     const statusDetails = _.find(PHASE_STATUS, s => s.value === status)
 
-    const phaseEditable = checkPermission(PERMISSIONS.EDIT_PROJECT_PLAN, project) && status !== PHASE_STATUS_COMPLETED && projectStatus !== PROJECT_STATUS_CANCELLED && projectStatus !== PROJECT_STATUS_COMPLETED
+    const phaseEditable = checkPermission(PERMISSIONS.EDIT_PROJECT_PLAN, project) && (status !== PHASE_STATUS_COMPLETED || (isAdmin)) && projectStatus !== PROJECT_STATUS_CANCELLED && projectStatus !== PROJECT_STATUS_COMPLETED
 
     return (
       <div styleName={'phase-card ' + (isExpanded ? ' expanded ' : ' ')} id={`phase-${phaseId}`}>
@@ -280,9 +283,14 @@ PhaseCard.propTypes = {
 
 
 const mapStateToProps = ({loadUser, projectState}) => {
+  const adminRoles = [
+    ROLE_ADMINISTRATOR,
+    ROLE_CONNECT_ADMIN,
+  ]
   return {
     currentUserRoles: loadUser.user.roles,
-    isUpdating: projectState.processing
+    isUpdating: projectState.processing,
+    isAdmin: _.intersection(loadUser.user.roles, adminRoles).length > 0
   }
 }
 

src/projects/detail/components/timeline/FormFieldDate/FormFieldDate.jsx

@@ -5,32 +5,21 @@
  */
 import React from 'react'
 import PT from 'prop-types'
-import _ from 'lodash'
-import cn from 'classnames'
 
 import FormsyForm from 'appirio-tech-react-components/components/Formsy'
+import './FormFieldDate.scss'
 const TCFormFields = FormsyForm.Fields
 
-import styles from './FormFieldDate.scss'
 
-const FormFieldDate = ({ startDate, endDate, theme }) => {
-  const startDateProps = _.omit(startDate, 'label')
-  startDateProps.type = 'date'
-  startDateProps.wrapperClass = styles['field-wrapper']
-
-  const endDateProps = _.omit(endDate, 'label')
-  endDateProps.type = 'date'
-  endDateProps.wrapperClass = styles['field-wrapper']
+const FormFieldDate = (props) => {
 
   return (
-    <div styleName={cn('milestone-post', theme)}>
+    <div styleName="milestone-post">
       <div styleName="col-left">
-        <label styleName="label-title">{startDate.label}</label>
+        <label styleName="label-title">{props.label}</label>
       </div>
       <div styleName="col-right">
-        <TCFormFields.TextInput {...startDateProps} />
-        <label styleName="label-title">{endDate.label}</label>
-        <TCFormFields.TextInput {...endDateProps} />
+        <TCFormFields.TextInput {...props} />
       </div>
     </div>
   )

src/projects/detail/components/timeline/Milestone/Milestone.jsx

@@ -102,10 +102,32 @@ class Milestone extends React.Component {
     this.setState({ isMobileEditing: true })
   }
 
+  isActualStartDateEditable() {
+    const { milestone, currentUser } = this.props
+    const isActive = milestone.status === MILESTONE_STATUS.ACTIVE
+    const isCompleted = milestone.status === MILESTONE_STATUS.COMPLETED
+    return (isActive || isCompleted) && currentUser.isAdmin
+
+  }
+
+  isCompletionDateEditable() {
+    const { milestone, currentUser } = this.props
+    const isCompleted = milestone.status === MILESTONE_STATUS.COMPLETED
+    return isCompleted && currentUser.isAdmin
+  }
+
   updateMilestoneWithData(values) {
     const { milestone, updateMilestone } = this.props
-
-    updateMilestone(milestone.id, values)
+    let milestoneData = {
+      ...values
+    };
+    if (values.actualStartDate) {
+      milestoneData.actualStartDate = moment.utc(new Date(values.actualStartDate))
+    }
+    if (values.completionDate) {
+      milestoneData.completionDate = moment.utc(new Date(values.completionDate))
+    }
+    updateMilestone(milestone.id, milestoneData)
   }
 
   milestoneEditorChanged(values) {
@@ -211,6 +233,8 @@ class Milestone extends React.Component {
     const date = startDate.format('D')
     const title = milestone.name
     const isUpdating = milestone.isUpdating
+    const isActualDateEditable = this.isActualStartDateEditable()
+    const isCompletionDateEditable = this.isCompletionDateEditable()
     const editForm = (
       <Form
         fields={[{
@@ -278,7 +302,27 @@ class Milestone extends React.Component {
             isRequired: true
           },
           validationError: 'Completed text is required',
-        }]}
+        }, ...( isActualDateEditable && [{
+          label: 'Actual Start date',
+          placeholder: 'Actual Start date',
+          name: 'actualStartDate',
+          value: moment.utc(milestone.actualStartDate).format('YYYY-MM-DD'),
+          type: 'date',
+          validations: {
+            isRequired: true
+          },
+          validationError: 'Actual Start date is required',
+        }]), ...( isCompletionDateEditable && [{
+          label: 'Completion date',
+          placeholder: 'Completion date',
+          name: 'completionDate',
+          value: moment.utc(milestone.completionDate).format('YYYY-MM-DD'),
+          type: 'date',
+          validations: {
+            isRequired: true
+          },
+          validationError: 'Completion date is required',
+        }])]}
         onCancelClick={this.closeEditForm}
         onSubmit={this.updateMilestoneWithData}
         onChange={this.milestoneEditorChanged}