From e96df0c87b7f00a3968bafca91617aac1164aa4e Mon Sep 17 00:00:00 2001
From: Bhavya-egov <137176879+Bhavya-egov@users.noreply.github.com>
Date: Fri, 2 Aug 2024 14:02:17 +0530
Subject: [PATCH] fixed the pop up button issue (#1215)

---
 .../src/components/TimelineComponent.js       | 65 +++++++++++--------
 .../src/configs/UICustomizations.js           | 44 +++++++++++--
 2 files changed, 78 insertions(+), 31 deletions(-)

diff --git a/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/TimelineComponent.js b/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/TimelineComponent.js
index 4241e439635..b3d8d3ae393 100644
--- a/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/TimelineComponent.js
+++ b/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/components/TimelineComponent.js
@@ -38,6 +38,8 @@ const TimelineComponent = ({campaignId, resourceId}) => {
   const searchParams = new URLSearchParams(location.search);
   const [userCredential, setUserCredential] = useState(null);
   const [newResourceId, setNewResourceId] = useState(resourceId);
+  const [searchDATA, setSearchDATA] = useState(null);
+  const [dataFetched, setDataFetched] = useState(false); 
   const { data: baseTimeOut } = Digit.Hooks.useCustomMDMS(tenantId, "HCM-ADMIN-CONSOLE", [{ name: "baseTimeOut" }]);
 
   const formatLabel = (label) => {
@@ -91,32 +93,49 @@ const TimelineComponent = ({campaignId, resourceId}) => {
       return latestProcess;
     }, null);
 
-  const reqCriteriaSearch = {
-    url: `/project-factory/v1/project-type/search`,
-    body: {
-      CampaignDetails: {
-        tenantId: tenantId,
-        ids: [campaignId],
-      },
-    },
-    config: {
-      enabled: resourceId.length == 0 && lastCompletedProcess?.type === "campaign-creation" && lastCompletedProcess?.status === "completed",
-    },
-  };
 
-  const { data: searchDATA } = Digit.Hooks.useCustomAPIHook(reqCriteriaSearch);
+  const searchAPIData = async (campaignId, resourceId) => {
+    try {
+      const response = await Digit.CustomService.getResponse({
+        url: "/project-factory/v1/project-type/search",
+        body: {
+          CampaignDetails: {
+            tenantId: tenantId,
+            ids: [campaignId],
+          },
+        },
+      });
+      return response;
+    } catch (error) {
+      throw new Error(error?.response?.data?.Errors?.[0].description);
+    }
+  };
 
+  useEffect(() => {
+    if (resourceId.length === 0 && lastCompletedProcess?.type === "campaign-creation" && lastCompletedProcess?.status === "completed" && !dataFetched ) {
+      const fetchData = async () => {
+        try {
+          const data = await searchAPIData(campaignId);
+          setSearchDATA(data);
+          setDataFetched(true)
+        } catch (error) {
+          console.error("Error fetching data:", error);
+        }
+      };
+  
+      fetchData();
+    }
+  }, [campaignId, newResourceId, lastCompletedProcess , dataFetched]);
+  
   useEffect(() => {
     if (searchDATA) {
-      const userResource = searchDATA?.CampaignDetails?.[0]?.resources?.find(resource => resource.type === "user");
+      const userResource = searchDATA?.CampaignDetails?.[0]?.resources?.find((resource) => resource.type === "user");
       if (userResource) {
         setNewResourceId([userResource?.createResourceId]);
       }
     }
   }, [searchDATA]);
-
-
-
+  
   useEffect(() => {
     let intervalId;
 
@@ -211,16 +230,8 @@ const TimelineComponent = ({campaignId, resourceId}) => {
               variant="inprogress"
               showConnector={true}
             /> */}
-            {subElements.length > 0 ? (
-              <Timeline label={t("HCM_CURRENT")} subElements={subElements} variant="inprogress" showConnector={true} />
-            ) : (
-              <Timeline
-                label={t(formatLabel(lastCompletedProcess?.type))}
-                subElements={[epochToDateTime(lastCompletedProcess?.lastModifiedTime)]}
-                variant="completed"
-                showConnector={true}
-              />
-            )}
+            {subElements.length > 0 && <Timeline label={t("HCM_CURRENT")} subElements={subElements} variant="inprogress" showConnector={true} />}
+
             {completedTimelines?.map((timeline, index) => (
               <Timeline key={index} label={timeline?.label} subElements={timeline?.subElements} variant="completed" showConnector={true} />
             ))}
diff --git a/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/configs/UICustomizations.js b/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/configs/UICustomizations.js
index 1dbd7e55099..5eaea720815 100644
--- a/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/configs/UICustomizations.js
+++ b/micro-ui/web/micro-ui-internals/packages/modules/campaign-manager/src/configs/UICustomizations.js
@@ -105,6 +105,12 @@ export const UICustomizations = {
     },
     additionalCustomizations: (row, key, column, value, t, searchResult) => {
       const [timeLine, setTimeline] = React.useState(false);
+      const resourceIdArr = [];
+      row?.resources?.map((i) => {
+        if (i?.createResourceId && i?.type === "user") {
+          resourceIdArr.push(i?.createResourceId);
+        }
+      });
       // const { t } = useTranslation();
       const onActionSelect = (value, row) => {
         switch (value?.code) {
@@ -168,7 +174,10 @@ export const UICustomizations = {
                   onOverlayClick={() => setTimeline(false)}
                   onClose={() => setTimeline(false)}
                 >
-                  <TimelineComponent campaignId={row?.id} resourceId={[row?.resources.find((resource) => resource?.type === "user")?.createResourceId]} />
+                  <TimelineComponent
+                    campaignId={row?.id}
+                    resourceId={resourceIdArr}
+                  />
                 </PopUp>
               )}
             </>
@@ -251,6 +260,12 @@ export const UICustomizations = {
     },
     additionalCustomizations: (row, key, column, value, t, searchResult) => {
       const [timeLine, setTimeline] = React.useState(false);
+      const resourceIdArr = [];
+      row?.resources?.map((i) => {
+        if (i?.createResourceId && i?.type === "user") {
+          resourceIdArr.push(i?.createResourceId);
+        }
+      });
       const onActionSelect = (value, row) => {
         switch (value?.code) {
           case "ACTION_LABEL_VIEW_TIMELINE":
@@ -296,7 +311,10 @@ export const UICustomizations = {
                   onOverlayClick={() => setTimeline(false)}
                   onClose={() => setTimeline(false)}
                 >
-                  <TimelineComponent campaignId={row?.id} resourceId={[row?.resources.find((resource) => resource?.type === "user")?.createResourceId]} />
+                  <TimelineComponent
+                    campaignId={row?.id}
+                    resourceId={resourceIdArr}
+                  />
                 </PopUp>
               )}
             </>
@@ -381,6 +399,12 @@ export const UICustomizations = {
     additionalCustomizations: (row, key, column, value, t, searchResult) => {
       const [timeLine, setTimeline] = React.useState(false);
       // const { t } = useTranslation();
+      const resourceIdArr = [];
+      row?.resources?.map((i) => {
+        if (i?.createResourceId && i?.type === "user") {
+          resourceIdArr.push(i?.createResourceId);
+        }
+      });
       const onActionSelect = (value, row) => {
         switch (value?.code) {
           case "ACTION_LABEL_UPDATE_DATES":
@@ -443,7 +467,10 @@ export const UICustomizations = {
                   onOverlayClick={() => setTimeline(false)}
                   onClose={() => setTimeline(false)}
                 >
-                  <TimelineComponent campaignId={row?.id} resourceId={[row?.resources.find((resource) => resource?.type === "user")?.createResourceId]} />
+                  <TimelineComponent
+                    campaignId={row?.id}
+                    resourceId={resourceIdArr}
+                  />
                 </PopUp>
               )}
             </>
@@ -616,6 +643,12 @@ export const UICustomizations = {
     },
     additionalCustomizations: (row, key, column, value, t, searchResult) => {
       const [timeLine, setTimeline] = React.useState(false);
+      const resourceIdArr = [];
+      row?.resources?.map((i) => {
+        if (i?.createResourceId && i?.type === "user") {
+          resourceIdArr.push(i?.createResourceId);
+        }
+      });
       const onActionSelect = (value, row) => {
         switch (value?.code) {
           case "ACTION_LABEL_VIEW_TIMELINE":
@@ -661,7 +694,10 @@ export const UICustomizations = {
                   onOverlayClick={() => setTimeline(false)}
                   onClose={() => setTimeline(false)}
                 >
-                  <TimelineComponent campaignId={row?.id} resourceId={[row?.resources.find((resource) => resource?.type === "user")?.createResourceId]} />
+                  <TimelineComponent
+                    campaignId={row?.id}
+                    resourceId={resourceIdArr}
+                  />
                 </PopUp>
               )}
             </>