Github issue#1283, Change Watson Chatbot project title

— Added feature of providing custom heading/title for project creation form for each project type and fall back to a default one when we don’t have one for particular project type.

Author: Vikas Agarwal

src/config/projectWizard/index.js

@@ -44,6 +44,7 @@ const products = {
       'Watson Chatbot': {
         brief: 'Watson Chatbot',
         details: 'Build Chatbot using IBM Watson',
+        formTitle: 'Chatbot powered by IBM Watson®',
         icon: 'product-chatbot-watson',
         id: 'watson_chatbot',
         aliases: ['watson_chatbot'],

src/projects/create/components/FillProjectDetails.js

@@ -2,7 +2,7 @@ import _ from 'lodash'
 import React, { PropTypes as PT, Component } from 'react'
 import Sticky from 'react-stickynode'
 
-import config from '../../../config/projectWizard'
+import { findProduct } from '../../../config/projectWizard'
 import './FillProjectDetails.scss'
 import ProjectBasicDetailsForm from '../components/ProjectBasicDetailsForm'
 import ProjectOutline from '../components/ProjectOutline'
@@ -33,22 +33,21 @@ class FillProjectDetails extends Component  {
 
   render() {
     const { project, dirtyProject, processing, submitBtnText } = this.props
-    const product = _.get(project, 'details.products[0]')
+    const productId = _.get(project, 'details.products[0]')
     const projectTypeId = _.get(project, 'type')
-    const subConfig = config[_.findKey(config, {id : projectTypeId})]
-    const productName = _.findKey(subConfig.subtypes, {id : product})
+    const product = findProduct(productId)
 
     let specification = 'topcoder.v1'
-    if (product)
-      specification = typeToSpecification[product]
+    if (productId)
+      specification = typeToSpecification[productId]
     let sections = require(`../../../config/projectQuestions/${specification}`).basicSections
     return (
       <div className="FillProjectDetailsWrapper">
         <div className="header headerFillProjectDetails">
         </div>
         <div className="FillProjectDetails">
           <div className="header">
-            <h1>Let's setup your { productName } project</h1>
+            <h1>{ _.get(product, 'formTitle', `Let's setup your ${ product.name } project`) }</h1>
           </div>
           <section className="two-col-content content">
             <div className="container">