Git-2400:Fixed-Timeline content updates

Author: RishiRajSahu

src/config/constants.js

@@ -603,6 +603,13 @@ export const MILESTONE_STATUS = {
   CANCELLED: 'cancelled'
 }
 
+export const MILESTONE_STATUS_TEXT = [
+  {status: 'reviewed', textValue: 'plannedText' },
+  {status: 'active', textValue: 'activeText' },
+  {status: 'paused', textValue: 'blockedText' },
+  {status: 'completed', textValue: 'completedText' }
+]
+
 // minimum designs to select during checkpoint type milestone
 export const MIN_CHECKPOINT_REVIEW_DESIGNS = 5
 

src/helpers/milestoneHelper.js

@@ -0,0 +1,11 @@
+import _ from 'lodash'
+
+import { MILESTONE_STATUS } from '../config/constants'
+import { MILESTONE_STATUS_TEXT } from '../config/constants'
+
+export const getMilestoneStatusText = (milestone) => {
+  const status = milestone && milestone.status ? milestone.status : MILESTONE_STATUS.PLANNED
+  const statusTextMap = _.find(MILESTONE_STATUS_TEXT, s => s.status === status)
+  const statusText = statusTextMap ? statusTextMap.textValue : MILESTONE_STATUS.PLANNED
+  return milestone[statusText]
+}

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

@@ -5,7 +5,6 @@ import React from 'react'
 import PT from 'prop-types'
 import _ from 'lodash'
 
-import TimelineHeader from '../TimelineHeader'
 import Milestone from '../Milestone'
 
 class Timeline extends React.Component {
@@ -79,12 +78,6 @@ class Timeline extends React.Component {
     const orderedMilestones = timeline.milestones ? _.orderBy(timeline.milestones, ['order']) : []
     return (
       <div>
-        <TimelineHeader
-          postContent={{
-            title: timeline.name,
-            postMsg: timeline.description,
-          }}
-        />
         {_.reject(orderedMilestones, { hidden: true }).map((milestone) => (
           <Milestone
             key={milestone.id}

src/projects/detail/components/timeline/milestones/MilestoneTypeAddLinks/MilestoneTypeAddLinks.jsx

@@ -13,6 +13,7 @@ import MilestonePostMessage from '../../MilestonePostMessage'
 import ProjectProgress from '../../../ProjectProgress'
 import MilestoneDescription from '../../MilestoneDescription'
 import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import {
   MILESTONE_STATUS
@@ -94,12 +95,6 @@ class MilestoneTypeAddLinks extends React.Component {
     })
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   render() {
     const {
       milestone,
@@ -135,7 +130,7 @@ class MilestoneTypeAddLinks extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*

src/projects/detail/components/timeline/milestones/MilestoneTypeCheckpointReview/MilestoneTypeCheckpointReview.jsx

@@ -13,6 +13,7 @@ import MilestonePostMessage from '../../MilestonePostMessage'
 import ProjectProgress from '../../../ProjectProgress'
 import MilestoneDescription from '../../MilestoneDescription'
 import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import {
   MILESTONE_STATUS,
@@ -175,12 +176,6 @@ class MilestoneTypeCheckpointReview extends React.Component {
     }
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   shouldDisableCompleteReviewButton(links, selectedLinks) {
     const linksLength = links.length
     const selectedLinksLength = selectedLinks.length
@@ -240,7 +235,7 @@ class MilestoneTypeCheckpointReview extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*

src/projects/detail/components/timeline/milestones/MilestoneTypeDelivery/MilestoneTypeDelivery.jsx

@@ -11,6 +11,7 @@ import LinkList from '../../LinkList'
 import MilestonePostMessage from '../../MilestonePostMessage'
 import MilestonePostEditText from '../../MilestonePostEditText'
 import MilestoneDescription from '../../MilestoneDescription'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import { MILESTONE_STATUS } from '../../../../../../config/constants'
 
@@ -177,12 +178,6 @@ class MilestoneTypeDelivery extends React.Component {
     completeMilestone()
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   render() {
     const { milestone, theme, currentUser, previousMilestone } = this.props
     const { isShowFinalFixesRequestForm, finalFixRequests } = this.state
@@ -209,7 +204,7 @@ class MilestoneTypeDelivery extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*

src/projects/detail/components/timeline/milestones/MilestoneTypeFinalDesigns/MilestoneTypeFinalDesigns.jsx

@@ -14,6 +14,7 @@ import ProjectProgress from '../../../ProjectProgress'
 import WinnerSelectionBar from '../../WinnerSelectionBar'
 import MilestoneDescription from '../../MilestoneDescription'
 import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import {
   MILESTONE_STATUS,
@@ -214,12 +215,6 @@ class MilestoneTypeFinalDesigns extends React.Component {
     })
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   render() {
     const {
       milestone,
@@ -268,7 +263,7 @@ class MilestoneTypeFinalDesigns extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*

src/projects/detail/components/timeline/milestones/MilestoneTypeFinalFixes/MilestoneTypeFinalFixes.jsx

@@ -15,6 +15,7 @@ import LinkList from '../../LinkList'
 import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
 
 import { MILESTONE_STATUS  } from '../../../../../../config/constants'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import './MilestoneTypeFinalFixes.scss'
 
@@ -62,12 +63,6 @@ class MilestoneTypeFinalFixes extends React.Component {
     })
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   completeMilestone() {
     const { completeFinalFixesMilestone } = this.props
 
@@ -104,7 +99,7 @@ class MilestoneTypeFinalFixes extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {isActive && (

src/projects/detail/components/timeline/milestones/MilestoneTypePhaseSpecification/MilestoneTypePhaseSpecification.jsx

@@ -13,6 +13,7 @@ import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
 
 import { MILESTONE_STATUS } from '../../../../../../config/constants'
 
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 import './MilestoneTypePhaseSpecification.scss'
 
 class MilestoneTypePhaseSpecification extends React.Component {
@@ -64,12 +65,6 @@ class MilestoneTypePhaseSpecification extends React.Component {
     completeMilestone()
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   render() {
     const {
       milestone,
@@ -89,7 +84,7 @@ class MilestoneTypePhaseSpecification extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideFirstLine={currentUser.isCustomer} hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*

src/projects/detail/components/timeline/milestones/MilestoneTypeProgress/MilestoneTypeProgress.jsx

@@ -14,6 +14,7 @@ import MilestoneDescription from '../../MilestoneDescription'
 import { withMilestoneExtensionRequest } from '../../MilestoneExtensionRequest'
 
 import { MILESTONE_STATUS } from '../../../../../../config/constants'
+import { getMilestoneStatusText } from '../../../../../../helpers/milestoneHelper'
 
 import './MilestoneTypeProgress.scss'
 
@@ -63,12 +64,6 @@ class MilestoneTypeProgress extends React.Component {
     completeMilestone()
   }
 
-  getDescription() {
-    const { milestone } = this.props
-
-    return milestone[`${milestone.status}Text`]
-  }
-
   render() {
     const {
       milestone,
@@ -100,7 +95,7 @@ class MilestoneTypeProgress extends React.Component {
     return (
       <div styleName={cn('milestone-post', theme)}>
         <DotIndicator hideDot>
-          <MilestoneDescription description={this.getDescription()} />
+          <MilestoneDescription description={getMilestoneStatusText(milestone)} />
         </DotIndicator>
 
         {/*