colors

src/Pages/CrmTest/CrmTest.js

@@ -56,6 +56,26 @@ function MyBadge({ count, color = "blue" }) {
   return <Badge color={color} count={count} overflowCount={100000} showZero />;
 }
 
+const segmentedDmcPipelineBadgeColors = [
+  "grey",
+  "yellow",
+  "purple",
+  "blue",
+  "orange",
+  "green",
+  "red",
+];
+
+const segmentedSetterCloserBadgeColors = [
+  "grey",
+  "yellow",
+  "purple",
+  "blue",
+  "orange",
+  "green",
+  "red",
+];
+
 export default function CrmTest() {
   const { t } = useTranslation();
   const appContext = useAppContext();
@@ -222,6 +242,32 @@ export default function CrmTest() {
     return items;
   };
 
+  const getSegmentedLabels = (item, index) => {
+    console.log("item", index);
+
+    return (
+      <Space>
+        <span>{item}</span>
+        <MyBadge
+          count={
+            crmContext.customers.filter(
+              (customer) =>
+                customer.Pipeline ===
+                  (selectedSegmentedTypeValue === CRM_TYPE.DMC_PIPELINE
+                    ? 1
+                    : 2) && customer.DealPhase === index + 1
+            ).length
+          }
+          color={
+            selectedSegmentedTypeValue === CRM_TYPE.DMC_PIPELINE
+              ? segmentedDmcPipelineBadgeColors[index]
+              : segmentedSetterCloserBadgeColors[index]
+          }
+        />
+      </Space>
+    );
+  };
+
   useEffect(() => {
     const customersRequest = () => {
       setIsRequesting(true);
@@ -264,7 +310,7 @@ export default function CrmTest() {
             value: CRM_TYPE.CUSTOMERS,
             label: (
               <Space>
-                <span>All customers</span>
+                <span>All Leads</span>
                 <MyBadge count={crmContext.customers.length} />
               </Space>
             ),
@@ -339,23 +385,7 @@ export default function CrmTest() {
           options={segmentedOptions.map((item, index) => {
             return {
               value: index,
-              label: (
-                <Space>
-                  <span>{item}</span>
-                  <MyBadge
-                    count={
-                      crmContext.customers.filter(
-                        (customer) =>
-                          customer.Pipeline ===
-                            (selectedSegmentedTypeValue ===
-                            CRM_TYPE.DMC_PIPELINE
-                              ? 1
-                              : 2) && customer.DealPhase === index + 1
-                      ).length
-                    }
-                  />
-                </Space>
-              ),
+              label: getSegmentedLabels(item, index),
             };
           })}
           style={{ marginBottom: AppStyle.app.margin }}