From 1b93f39f6b69df6710b02fdc742804bdca7e7158 Mon Sep 17 00:00:00 2001
From: yoution <zhuyan207@gmail.com>
Date: Sat, 9 Jan 2021 11:19:49 +0800
Subject: [PATCH] fix:issue #4254

---
 .../create/components/ProjectSubmitted.jsx    | 113 +++++++++++++-----
 1 file changed, 81 insertions(+), 32 deletions(-)

diff --git a/src/projects/create/components/ProjectSubmitted.jsx b/src/projects/create/components/ProjectSubmitted.jsx
index a9bb554aa..cd246f8f8 100644
--- a/src/projects/create/components/ProjectSubmitted.jsx
+++ b/src/projects/create/components/ProjectSubmitted.jsx
@@ -7,49 +7,98 @@ import {
   CONNECT_MAIN_PAGE_URL, PROJECT_TYPE_TALENT_AS_A_SERVICE, TAAS_APP_URL
 } from '../../../config/constants'
 
-/**
- * Build project URL based on the `type` query param in URL.
- *
- * @param {String} projectId project id
- */
-const formatProjectURL = (projectId = '') => {
-  const { type } = qs.parse(window.location.search)
+class ProjectSubmitted extends React.Component {
+  /**
+   * Build project URL based on the `type` query param in URL.
+   *
+   * @param {boolean} isTaas   
+   * @param {String} projectId project id
+   */
+  getProjectUrl(isTaas, projectId = '') {
+    const url = isTaas 
+      // if the project type is TaaS, then use link to TaaS App
+      ? `${TAAS_APP_URL}/myteams/${projectId}`
+      // otherwise use link inside Connect App
+      : `${CONNECT_MAIN_PAGE_URL}/projects/${projectId}`
 
-  const url = type === PROJECT_TYPE_TALENT_AS_A_SERVICE
-    // if the project type is TaaS, then use link to TaaS App
-    ? `${TAAS_APP_URL}/myteams/${projectId}`
-    // otherwise use link inside Connect App
-    : `${CONNECT_MAIN_PAGE_URL}/projects/${projectId}`
+    return url
+  }
 
-  return url
-}
+  getPageConfiguration() {
+    const { type } = qs.parse(window.location.search)
+    const isTaas  = type === PROJECT_TYPE_TALENT_AS_A_SERVICE
+
+    const projectId = this.props.params.status || this.props.projectId 
+
+    const project = {
+      headerSubTitle: 'Your project has been created',
+      textBody: (
+        <div className="content">
+            Topcoder will be contacting you soon to discuss your project proposal.
+          <br />
+          <br />
+          <span>
+In the meantime, get a jump on the process by inviting your coworkers to your project and securely share any detailed requirements documents you have inside your project.
+          </span>
+        </div>
+      ),
+      leftButton: {
+        header: 'Go to Project',
+        subText: 'Invite your team members and share requirements',
+        url: this.getProjectUrl(isTaas, projectId)
+      },
+      rightButton: {
+        header: 'All Projects',
+        subText: 'View all of your projects',
+        url: this.getProjectUrl(isTaas)
+      },
+    }
+
+    const taas = {
+      headerSubTitle: 'Your talent request has been created',
+      textBody: (
+        <div className="content">
+            Topcoder will be contacting you soon to discuss your talent needs.
+        </div>
+      ),
+      leftButton: {
+        header: 'View Talent Request',
+        subText: 'Modify your request and track fulfillment',
+        url: this.getProjectUrl(isTaas, projectId)
+      },
+      rightButton: {
+        header: 'All Projects',
+        subText: 'View all of your projects',
+        url: this.getProjectUrl(isTaas)
+      },
+    }
+
+    return isTaas? taas: project
+  }
 
-class ProjectSubmitted extends React.Component {
   render() {
-    const projectUrl = formatProjectURL(this.props.params.status || this.props.projectId)
-    const projectsListUrl = formatProjectURL()
+
+    const {
+      headerSubTitle, 
+      textBody,
+      leftButton,
+      rightButton
+    } = this.getPageConfiguration()
 
     return (
       <div className="ProjectSubmitted flex column middle center tc-ui">
         <div className="container flex column middle center">
           <div className="title">Congratulations!</div>
-          <div className="sub-title">Your project has been created</div>
-          <div className="content">
-            Topcoder will be contacting you soon to discuss your project proposal.
-            <br />
-            <br />
-            <span>
-In the meantime, get a jump on the process by inviting your coworkers to your project and securely share any detailed requirements documents you have inside your project.
-            </span>
-          </div>
+          <div className="sub-title">{headerSubTitle}</div>
+          {textBody}
           <div className="button-container flex row middle center">
-            <a type="button" href={projectUrl} className="go-to-project-btn tc-btn tc-btn-sm tc-btn-default flex middle center" disabled={false}>
-              Go to Project
-              <small>Invite your team members and share requirements</small>
+            <a type="button" href={leftButton.url} className="go-to-project-btn tc-btn tc-btn-sm tc-btn-default flex middle center" disabled={false}>
+              {leftButton.header}
+              <small>{leftButton.subText}</small>
             </a>
-            <a href={projectsListUrl} type="button" className="go-to-project-dashboard-btn tc-btn tc-btn-sm tc-btn-primary flex middle center" disabled={false}>
-              All Projects
-              <small>View all of your projects</small>
+            <a href={rightButton.url} type="button" className="go-to-project-dashboard-btn tc-btn tc-btn-sm tc-btn-primary flex middle center" disabled={false}>
+              {rightButton.header}
+              <small>{rightButton.subText}</small>
             </a>
           </div>
         </div>