diff --git a/edit-mode/function/ganttConfig.js b/edit-mode/function/ganttConfig.js
index 0c07b6a..c410033 100644
--- a/edit-mode/function/ganttConfig.js
+++ b/edit-mode/function/ganttConfig.js
@@ -320,7 +320,10 @@ var allColumns = [
 	{
 		name: "bobot_planning", label: "Bobot (%)", align: "center", editor: editor.bobot_planning, resize: true, min_width: 115, template: function (text) {
 			let bobot = parseFloat(text.bobot_planning);
+			console.log("bobot roundToTwo ", roundToTwo(bobot));
+			console.log("bobot toFixed ", bobot.toFixed(2));
 			if (bobot.toFixed(2) > 100) {
+				
 				gantt.alert("Bobot tidak boleh lebih dari 100%!");
 				return;
 			}
@@ -480,10 +483,14 @@ var allColumns = [
 		name: "progress_actual", label: "Total Actual Progress (%)", align: "center", min_width: 150, template: function (text) {
 			let progress = text.progress
 			progress = progress * 100
+			
+			console.log("progress roundToTwo ", roundToTwo(progress));
+			console.log("progress toFixed ", progress.toFixed(2));
 			if (progress.toFixed(2) > 100) {
-				gantt.alert("Bobot tidak boleh lebih dari 100%!");
+				gantt.alert("Progress tidak boleh lebih dari 100%!");
 				return;
 			}
+			
 			let bobot = text.bobot_planning
 			let actual = (progress * bobot) / 100
 			return roundToTwo(actual);
diff --git a/edit-mode/function/reportActivity.js b/edit-mode/function/reportActivity.js
index e9d58aa..c0771f6 100644
--- a/edit-mode/function/reportActivity.js
+++ b/edit-mode/function/reportActivity.js
@@ -588,6 +588,10 @@ $(document).ready(function () {
         assignMaterialId = $(this).data('id');
         materialName = $(this).data('material-name');
 
+        var attributeString = this.outerHTML;
+        if (attributeString.includes('"=""')) {
+          materialName = materialName + '"';
+        }
         // console.log(" okeee ",{ assignMaterialId, activityId, materialName });
         $("#report_activity_material_title").html(`Report Activity Actual ${materialName}`)
         $("#modal_report_activity").hide();
@@ -619,6 +623,10 @@ $(document).ready(function () {
     $("#table_report").on("click", ".btn-lihat-plan", function () {
         assignMaterialId = $(this).data('id');
         materialName = $(this).data('material-name');
+        var attributeString = this.outerHTML;
+        if (attributeString.includes('"=""')) {
+          materialName = materialName + '"';
+        }
         // console.log(" okeee ",{ assignMaterialId, activityId, materialName });
         $("#report_activity_material_title").html(`Report Activity Plan ${materialName}`)
         $("#modal_report_activity").hide();
diff --git a/view-mode/function/function.js b/view-mode/function/function.js
index 07ac9dc..9fa8536 100644
--- a/view-mode/function/function.js
+++ b/view-mode/function/function.js
@@ -241,6 +241,7 @@ function initialProperty()
 			let data = result.data;
 			if(data.status && data.status=="not have"){
 				toggleCollapseTasks();
+				gantt.ext.zoom.setLevel("month");
 			}else{
 				if(data.id){
 					userToVersionGanttId = data.id
diff --git a/view-mode/function/ganttConfig.js b/view-mode/function/ganttConfig.js
index 1b62b0f..1ce3594 100644
--- a/view-mode/function/ganttConfig.js
+++ b/view-mode/function/ganttConfig.js
@@ -379,7 +379,7 @@ gantt.templates.task_class = function (start, end, task) {
 		return classes.join(' ');
 	}
 };
-
+let dataOverdue = [];
 gantt.templates.rightside_text = function (start, end, task) {
 	if (task.planned_end) {
 		if (end.getTime() > task.planned_end.getTime()) {
@@ -398,6 +398,15 @@ gantt.templates.rightside_text = function (start, end, task) {
 				end_date: end,
 				task: task
 			}, 'day');
+      let found = dataOverdue.find((element) => element.id == task.id);
+      if (!found) {
+         dataOverdue.push({
+            id: task.id,
+            text: task.text,
+            overdue: overdue
+         })
+      }
+      window.parent.postMessage({ type: 'dataOverdueUpdate', dataOverdue: dataOverdue }, '*');
 			var text = "<b style='color: red;'>Overdue: " + overdue + " days</b>";
 			return text;
 		}
@@ -493,7 +502,7 @@ var zoomConfig = {
 	]
 };
 gantt.ext.zoom.init(zoomConfig);
-gantt.ext.zoom.setLevel("week");
+gantt.ext.zoom.setLevel("month");
 
 function zoomIn(){
 	gantt.ext.zoom.zoomIn();
diff --git a/view-mode/function/ganttSettings.js b/view-mode/function/ganttSettings.js
index 4cb0c48..3872a95 100644
--- a/view-mode/function/ganttSettings.js
+++ b/view-mode/function/ganttSettings.js
@@ -239,7 +239,7 @@ async function initHolidays(){
 async function initGanttSettings() {
     console.log('initGanttSettings');
     // if zoom is day
-    $("#scale1").attr('checked', true);
+    $("#scale3").attr('checked', true);
     // toggleCollapseTasks();
 
     // init to gantt chart view (holidays)
diff --git a/view-mode/function/overlaySCurve.js b/view-mode/function/overlaySCurve.js
index 636766c..8ac457e 100644
--- a/view-mode/function/overlaySCurve.js
+++ b/view-mode/function/overlaySCurve.js
@@ -95,31 +95,89 @@ function getChartScaleRange(){
 	return cells;
 }
 
-function getProgressLine(){
+function getProgressLine() {
 	// As long as the progress data length is same with chart scale range (period) then it's fine.
 	getSCurveData();
 	// console.log("apa ", return_first);
 	var cumulativePlannedDurations = return_first.data[0].data.percentagePlan;
 	var cumulativeRealDurations = return_first.data[0].data.percentageReal;
-			cumulativeRealDurations[cumulativeRealDurations.length - 1] = Math.ceil(cumulativeRealDurations[cumulativeRealDurations.length - 1]);
-  var maxPlan = cumulativePlannedDurations[cumulativePlannedDurations.length - 1]
-  var maxReal = cumulativeRealDurations[cumulativeRealDurations.length - 1]
-  var dates = return_first.data[0].data.date;
-  //jika summary s curve
-  if (maxReal > 100 || maxPlan > 100) {
-    var plannedDurations = cumulativePlannedDurations.map((item) => {
-      return item/maxPlan*100;
-    })
-    var realDurations = cumulativeRealDurations.map((item) => {
-      return item/maxPlan*100;
-    })
-    return {planned: plannedDurations, real: realDurations, dates: dates};
-  }
+	cumulativeRealDurations[cumulativeRealDurations.length - 1] = Math.ceil(cumulativeRealDurations[cumulativeRealDurations.length - 1]);
+	var maxPlan = cumulativePlannedDurations[cumulativePlannedDurations.length - 1]
+	var maxReal = cumulativeRealDurations[cumulativeRealDurations.length - 1]
+	var dates = return_first.data[0].data.date;
+    // Determine the appropriate data points based on the Gantt chart zoom level
+    var chartScaleRange = getChartScaleRange();
+    var zoomLevel = gantt.ext.zoom.getCurrentLevel();
+
+    // Adjust data points based on the zoom level
+    var plannedDurations, realDurations;
+
+    if (zoomLevel === 2) {
+        // Adjust data to monthly points
+        plannedDurations = adjustDataToZoom(dates, cumulativePlannedDurations, chartScaleRange, 2).data;
+        realDurations = adjustDataToZoom(dates, cumulativeRealDurations, chartScaleRange, 2).data;
+		dates = adjustDataToZoom(dates, cumulativeRealDurations, chartScaleRange, 2).dates;
+    } else if (zoomLevel === 1) {
+        // Adjust data to weekly points
+        plannedDurations = adjustDataToZoom(dates, cumulativePlannedDurations, chartScaleRange, 1).data;
+        realDurations = adjustDataToZoom(dates, cumulativeRealDurations, chartScaleRange, 1).data;
+		dates = adjustDataToZoom(dates, cumulativeRealDurations, chartScaleRange, 1).dates;
+    } else {
+        // Default: Use daily data points
+        plannedDurations = cumulativePlannedDurations;
+        realDurations = cumulativeRealDurations;
+  
+	}
+	if (maxReal > 100 || maxPlan > 100) {
+		plannedDurations = plannedDurations.map((item) => {
+			return item/maxPlan*100;
+		})
+		realDurations = realDurations.map((item) => {
+			return item/maxReal*100;
+		})
+	}
+
+    return { planned: plannedDurations, real: realDurations, dates: dates };
+}
+function adjustDataToZoom(dates, data, chartScaleRange, zoomLevel) {
+    // Implement logic to adjust data points based on the Gantt chart zoom level
+    // For example, if zoomLevel is 'month', aggregate daily data to monthly data
+
+    // Placeholder logic: This example assumes that the chartScaleRange is in days
+    var newData = [];
+    var newDates = [];
+    var aggregateValue = 0;
+
+    for (var i = 0; i < data.length; i++) {
+        aggregateValue = data[i];
+
+        if (zoomLevel === 2 && i % 30 === 0) {
+            // Aggregate data for each month (assuming 30 days in a month)
+            newData.push(aggregateValue);
+            newDates.push(dates[i]);
+            aggregateValue = 0;
+        } else if (zoomLevel === 1 && (i + 1) % 7 === 1) {
+            // Aggregate data for each week
+            newData.push(aggregateValue);
+            newDates.push(dates[i]);
+            aggregateValue = 0;
+        }
+    }
+
+    // If there are remaining data points after the loop, add them to the result
+    if (aggregateValue > 0) {
+        newData.push(aggregateValue);
+        newDates.push(dates[data.length - 1]);
+    }
 
-	return {planned: cumulativePlannedDurations, real: cumulativeRealDurations, dates: dates};
+    return {
+        data: newData,
+        dates: newDates
+    };
 }
 
 function getScalePaddings(values){
+	let zoom = gantt.ext.zoom.getCurrentLevel();
 	var scale = gantt.getScale();
 	var dataRange = gantt.getSubtaskDates();
 	// let minDate = new Date();