From bd62f71035ece723e9650c57b96c80190310464e Mon Sep 17 00:00:00 2001
From: Cagdas U <cagdasugurlu01@gmail.com>
Date: Wed, 11 Aug 2021 11:14:06 +0300
Subject: [PATCH 1/2] fix(create-new-team): display spinner while searching
 inside progress card button

* Fix an issue which was preventing loading spinner to be displayed inside the submit button of progress card.
* Adjust progress card percentage values, as per the design.

Addresses https://github.com/topcoder-platform/taas-app/issues/406#issuecomment-895856856
---
 .../components/SearchContainer/index.jsx            | 13 ++++++-------
 .../components/SubmitContainer/index.jsx            |  2 +-
 .../CreateNewTeam/pages/CreateTaasPayment/index.jsx |  2 +-
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/src/routes/CreateNewTeam/components/SearchContainer/index.jsx b/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
index eb72a88..291de89 100644
--- a/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
+++ b/src/routes/CreateNewTeam/components/SearchContainer/index.jsx
@@ -80,11 +80,10 @@ function SearchContainer({
     return <NoMatchingProfilesResultCard role={matchingRole} />;
   };
 
-  const getPercentage = useCallback(() => {
-    if (searchState === "searching") return "26";
-    if (matchingRole) return "53";
-    return "84";
-  }, [searchState, matchingRole]);
+  const progressBarPercentage = useMemo(
+    () => (searchState === "searching" ? 53 : 84),
+    [searchState]
+  );
 
   return (
     <div styleName="page">
@@ -94,14 +93,14 @@ function SearchContainer({
         <Progress
           isDisabled={
             !buttonClickable ||
-            searchState === "searching" ||
             (searchState === "done" && (!addedRoles || !addedRoles.length))
           }
+          isSearching={searchState === "searching"}
           onClick={() => setAddAnotherOpen(true)}
           extraStyleName={progressStyle}
           buttonLabel="Continue"
           stages={stages}
-          percentage={getPercentage()}
+          percentage={progressBarPercentage}
         />
       </div>
       <AddAnotherModal
diff --git a/src/routes/CreateNewTeam/components/SubmitContainer/index.jsx b/src/routes/CreateNewTeam/components/SubmitContainer/index.jsx
index 86faa01..a219a26 100644
--- a/src/routes/CreateNewTeam/components/SubmitContainer/index.jsx
+++ b/src/routes/CreateNewTeam/components/SubmitContainer/index.jsx
@@ -163,7 +163,7 @@ function SubmitContainer({
           isDisabled={!buttonClickable}
           buttonLabel="Continue"
           stages={stages}
-          percentage="98"
+          percentage="84"
         />
       </div>
       <AddAnotherModal
diff --git a/src/routes/CreateNewTeam/pages/CreateTaasPayment/index.jsx b/src/routes/CreateNewTeam/pages/CreateTaasPayment/index.jsx
index 2eb56d4..a5e27b2 100644
--- a/src/routes/CreateNewTeam/pages/CreateTaasPayment/index.jsx
+++ b/src/routes/CreateNewTeam/pages/CreateTaasPayment/index.jsx
@@ -160,7 +160,7 @@ const CreateTassPayment = () => {
         stages={stages}
         extraStyleName="role-selection final-step"
         disabled="true"
-        percentage="98"
+        percentage="97"
       />
     </div>
   );

From f4a2219e23ef8d3f861614f2c331b5df4f771f81 Mon Sep 17 00:00:00 2001
From: Cagdas U <cagdasugurlu01@gmail.com>
Date: Wed, 11 Aug 2021 11:21:46 +0300
Subject: [PATCH 2/2] fix(create-new-team): update the title & subtitle of
 SkillListPopup

Addresses https://github.com/topcoder-platform/taas-app/issues/400#issuecomment-889930409
---
 .../CreateNewTeam/components/SkillListPopup/index.jsx      | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/src/routes/CreateNewTeam/components/SkillListPopup/index.jsx b/src/routes/CreateNewTeam/components/SkillListPopup/index.jsx
index e3b43d1..704d847 100644
--- a/src/routes/CreateNewTeam/components/SkillListPopup/index.jsx
+++ b/src/routes/CreateNewTeam/components/SkillListPopup/index.jsx
@@ -23,10 +23,11 @@ function SkillListPopup({
   onClose,
   onContinueClick,
 }) {
+  const title = page === "jd" ? "Identified Skills" : "Selected Skills";
   const subTitle =
     page === "jd"
-      ? `Topcoder has identified the following skills referenced in your job description. Select your the ${MAX_SELECTED_SKILLS} skills most important to be successful in the job. These skills will be weighted more heavily in matching.`
-      : `You have chosen the following skills in your request. Please select your the ${MAX_SELECTED_SKILLS} skills most important to be successful in the job. These skills will be weighted more heavily in matching.`;
+      ? `Topcoder has identified the following skills referenced in your job description. Select the ${MAX_SELECTED_SKILLS} skills most important to be successful in the job. These skills will be weighted more heavily in matching.`
+      : `You have chosen the following skills in your request. Please select the ${MAX_SELECTED_SKILLS} skills most important to be successful in the job. These skills will be weighted more heavily in matching.`;
   const skillsNotFoundTxt = "No skills are found in your Job Description";
 
   const toggleSkill = useCallback(
@@ -62,7 +63,7 @@ function SkillListPopup({
       open={open}
       onClose={onClose}
       headerIcon={<IconSingleManAdd />}
-      title="Identified Skills"
+      title={title}
       subtitle={skills.length ? subTitle : skillsNotFoundTxt}
       isLoading={isLoading}
       loadingMessage={loadingTxt || "Loading..."}