Gantt ftth parents

src/views/Dashboard/DashboardProject.js

@@ -86,6 +86,8 @@ const DashboardProject = () => {
     const [assignedHrCount, setAssignedHrCount] = useState(0);
     const [actualHrCount, setActualHrCount] = useState(0);
     const [dataGantt, setDataGantt] = useState({});
+    const [dataGanttParents, setDataGanttParents] = useState({});
+    const [isReadyGanttParents, setIsReadyGanttParents] = useState(false);
     let history = useHistory();
 
 
@@ -96,6 +98,7 @@ const DashboardProject = () => {
         getReportDistribution()
         getComments()
         getGantt()
+        getGanttParents()
         return () => {
             console.log('unmount RenderMap');
         }
@@ -154,6 +157,19 @@ const DashboardProject = () => {
         }
     }
 
+   const getGanttParents = async () => {
+      setIsReadyGanttParents(false)
+      const url = `${BASE_OSPRO}/api/hierarchy-ftths/tree-gantt/${GANTT_ID}`
+        try {
+            const response = await axios.get(url, HEADER)
+            setDataGanttParents(response)
+            setIsReadyGanttParents(true)
+        } catch (error) {
+            console.error('Failed to get gantt data:', error)
+            setIsReadyGanttParents(true)
+        }
+    }
+
     const getAssignedHR = async () => {
         const url = `${BASE_OSPRO}/api/project/manpower/assigned/${GANTT_ID}`
         try {
@@ -565,7 +581,18 @@ const DashboardProject = () => {
                                 <div style={{ display: 'flex', flexDirection: 'row', marginBottom: 10 }}>
                                     <div style={{ flex: 20, display: 'flex', flexDirection: 'column' }}>
                                         <div style={{ fontSize: 16, fontWeight: 'bold', marginBottom: 10 }}>Project</div>
-                                        <div style={{ fontSize: 14 }}>{isReadyProjectDetail ? projectName : <SingleTextLoader />}</div>
+                                        <div style={{ fontSize: 14 }}>
+                                          {isReadyProjectDetail && isReadyGanttParents && isReadyGantt
+                                            ? (() => {
+                                                let parentNames = "";
+                                                for (let i = dataGanttParents.data.data.length - 1; i >= 0; i--) {
+                                                  parentNames += " - ";
+                                                  parentNames += dataGanttParents.data.data[i].name;
+                                                }
+                                                return projectName + parentNames + " - " + dataGantt.data.data.name_version;
+                                              })()
+                                            : <SingleTextLoader />}
+                                        </div>
                                     </div>
                                     <div>
                                         <i className="fa fa-check-square" style={{ fontSize: 28 }}></i>