fix: issue #504

src/constants/index.js

@@ -391,7 +391,7 @@ export const MAX_ALLOWED_INTERVIEWS = 3;
 /**
  * Custom role names to remove from RoleList component
  */
-export const CUSTOM_ROLE_NAMES = ["custom", "niche", "custom role"];
+export const CUSTOM_ROLE_NAMES = ["custom", "niche"];
 
 /**
  * Minimal Resource Booking duration (weeks)

src/routes/CreateNewTeam/components/NoMatchingProfilesResultCard/index.jsx

@@ -35,16 +35,18 @@ function NoMatchingProfilesResultCard({ role, onSubmit }) {
     if (role.jobTitle && role.jobTitle.length) {
       name = role.jobTitle;
     }
-    dispatch(
-      addSearchedRole({
-        searchId,
-        name,
-        rates: role.rates,
-        imageUrl: role.imageUrl,
-      })
-    );
-    onSubmit()
-  }, [dispatch, role]);
+    if (!alreadyAdded) {
+      dispatch(
+        addSearchedRole({
+          searchId,
+          name,
+          rates: role.rates,
+          imageUrl: role.imageUrl,
+        })
+      );
+    }
+    onSubmit();
+  }, [dispatch, role, alreadyAdded]);
 
   return (
     <div styleName="result-card">
@@ -54,11 +56,13 @@ function NoMatchingProfilesResultCard({ role, onSubmit }) {
         <Curve styleName="curve" />
       </div>
       <div styleName="content">
-        <h4 styleName="job-title">
-          What happens next
-        </h4>
+        <h4 styleName="job-title">What happens next</h4>
         <p styleName="info-txt">
-          We routinely place great people with the skills you’ve asked for. Right now, we don’t have anyone available. However, our database is dynamic and updated often. Please continue below so we can finalize your talent request and alert you when a great candidate becomes available. 
+          We routinely place great people with the skills you’ve asked for.
+          Right now, we don’t have anyone available. However, our database is
+          dynamic and updated often. Please continue below so we can finalize
+          your talent request and alert you when a great candidate becomes
+          available.
         </p>
         <div styleName="button-group">
           <Link to="/taas/createnewteam">

src/routes/CreateNewTeam/pages/CreateTaasPayment/index.jsx

@@ -5,7 +5,6 @@ import { Elements } from "@stripe/react-stripe-js";
 import { loadStripe } from "@stripe/stripe-js";
 import { ThemeProvider } from "@material-ui/styles";
 import { toastr } from "react-redux-toastr";
-import { isCustomRole } from "utils/helpers";
 
 import PaymentForm from "./PaymentForm";
 import PageHeader from "components/PageHeader";
@@ -59,7 +58,8 @@ const CreateTassPayment = () => {
         durationWeeks,
         availability,
       });
-      if (!isCustomRole(role)) {
+      // not custome role
+      if (role.imageUrl) {
         amount.push({ rate, numberOfResources });
       }
     });
@@ -112,15 +112,20 @@ const CreateTassPayment = () => {
                         <div>
                           <p styleName="title">{data.name}</p>
                           <ul styleName="details">
-                            {!isCustomRole(data) && <li>
-                              {data.numberOfResources} x ${data.rate}/ Week
-                            </li>}
+                            {data.imageUrl && (
+                              <li>
+                                {data.numberOfResources} x ${data.rate}/ Week
+                              </li>
+                            )}
                             <li>{data.durationWeeks} Week Duration</li>
                             <li>{data.availability}</li>
                           </ul>
                         </div>
                         <p styleName="amount">
-                          ${isCustomRole(data) ? '0' : data.numberOfResources * data.rate}
+                          $
+                          {!data.imageUrl
+                            ? "0"
+                            : data.numberOfResources * data.rate}
                         </p>
                       </div>
                       <hr styleName="divider" />