datastake-daf 0.6.278 → 0.6.280

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.278",
+	"version": "0.6.280",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/Dashboard/Globe/Globe.stories.js

@@ -2,7 +2,7 @@ import Globe from "./index";
 import ThemeLayout from "../../ThemeLayout";
 import Widget from "../Widget";
 
-import * as configs from "./storyConfig";
+import * as configs from "../Map/storyConfig";
 
 export default {
 	title: "Dashboard/Globe",
@@ -29,14 +29,14 @@ export default {
 export const DefaultGlobe = {
 	name: "Default Globe",
 	args: {
-		...configs.DefaultGlobeConfig,
+		...configs.DefaultMapConfig,
 	},
 };
 
 export const SatelliteGlobe = {
 	name: "Satellite Globe",
 	args: {
-		...configs.DefaultGlobeConfig,
+		...configs.DefaultMapConfig,
 		isSatellite: true,
 	},
 };
@@ -44,19 +44,11 @@ export const SatelliteGlobe = {
 export const TerritoryGlobe = {
 	name: "Territory Globe",
 	args: {
-		...configs.TerritoryGlobeConfig,
+		...configs.TerritoryMapConfig,
 		type: "territory",
 	},
 };
 
-export const StakeholderGlobe = {
-	name: "Stakeholder Globe",
-	args: {
-		...configs.StakeholderGlobeConfig,
-		type: "stakeholder",
-	},
-};
-
 export const EventGlobe = {
 	name: "Event Globe",
 	args: {
@@ -65,27 +57,10 @@ export const EventGlobe = {
 	},
 };
 
-export const ChainGlobe = {
-	name: "Supply Chain Globe",
-	args: {
-		...configs.ChainGlobeConfig,
-		type: "chain",
-	},
-};
-
 export const LocationGlobe = {
 	name: "Location Globe",
 	args: {
-		...configs.DefaultGlobeConfig,
+		...configs.DefaultMapConfig,
 		type: "location",
 	},
 };
-
-export const ProjectGlobe = {
-	name: "Project Globe",
-	args: {
-		...configs.ProjectGlobeConfig,
-		type: "project",
-	},
-};
-

package/src/@daf/core/components/Dashboard/Globe/hook.js

@@ -48,30 +48,15 @@ export const useGlobe = ({
   const isMounted = useRef(true);
 
   const addAllDataToMap = useCallback(() => {
-    console.log('🚀 [GLOBE HOOK] addAllDataToMap called');
-    console.log('🚀 [GLOBE HOOK] data:', data);
-    console.log('🚀 [GLOBE HOOK] mapRef exists:', !!mapRef);
-    console.log('🚀 [GLOBE HOOK] style loaded:', mapRef?.isStyleLoaded());
-    
-    if (!data || !mapRef) {
-      console.log('❌ [GLOBE HOOK] addAllDataToMap early return - missing data or mapRef');
-      return;
-    }
-    
-    if (!mapRef.isStyleLoaded()) {
-      console.log('⏳ [GLOBE HOOK] Style not loaded yet, retrying in 100ms...');
-      setTimeout(() => {
-        addAllDataToMap();
-      }, 100);
+
+    if (!data || !mapRef || !mapRef.isStyleLoaded()) {
       return;
     }
     
+    // Prevent multiple calls with empty data
     if (data.length === 0) {
-      console.log('❌ [GLOBE HOOK] addAllDataToMap early return - no data');
       return;
     }
-    
-    console.log('✅ [GLOBE HOOK] Starting to add markers to map...');
 
     // Clear existing markers using functional update to avoid dependency issues
     setMapMarkers(currentMarkers => {
@@ -123,14 +108,8 @@ export const useGlobe = ({
       const newMarkers = [];
       const maxTotal = Math.max(...(data || []).map((d) => d.total || 0));
       
-      console.log('🎯 [GLOBE HOOK] Processing data items:', data.length);
       data.forEach((d, i) => {
-        console.log(`🎯 [GLOBE HOOK] Processing item ${i}:`, d);
-        console.log(`🎯 [GLOBE HOOK] Item ${i} marker:`, d?.marker);
-        console.log(`🎯 [GLOBE HOOK] Item ${i} lat/lng:`, d?.marker?.lat, d?.marker?.lng);
-        
         if (d?.marker?.lat && d?.marker?.lng) {
-          console.log(`✅ [GLOBE HOOK] Item ${i} has valid coordinates, creating marker...`);
           let marker;
           let iconClassName = "";
           let innerHtml = "";
@@ -233,8 +212,6 @@ export const useGlobe = ({
               .setLngLat([d.marker.lng, d.marker.lat])
               .setPopup(new mapboxgl.Popup().setDOMContent(div))
               .addTo(mapRef);
-              
-            console.log(`🎉 [GLOBE HOOK] Marker ${i} added to map at:`, [d.marker.lng, d.marker.lat]);
 
           } else if (type === "territory") {
             // Handle territory polygons
@@ -320,8 +297,6 @@ export const useGlobe = ({
               .setLngLat([d.marker.lng, d.marker.lat])
               .setPopup(new mapboxgl.Popup().setDOMContent(div))
               .addTo(mapRef);
-              
-            console.log(`🎉 [GLOBE HOOK] Default marker ${i} added to map at:`, [d.marker.lng, d.marker.lat]);
           }
 
           // Add click handler
@@ -355,7 +330,6 @@ export const useGlobe = ({
       mapboxgl.accessToken = MAP_TOKEN;
 
       // Create the map with Mapbox GL JS - 3D globe
-      console.log('🗺️ [GLOBE HOOK] Creating map with style:', STYLE_URL);
       const map = new mapboxgl.Map({
         container: container.current,
         style: STYLE_URL,
@@ -374,13 +348,9 @@ export const useGlobe = ({
 
       // Configure the map when style loads
       map.on('style.load', () => {
-        console.log('🎨 [GLOBE HOOK] Style loaded event triggered');
-        console.log('🎨 [GLOBE HOOK] Map style loaded:', map.isStyleLoaded());
         
         // Wait a bit for the style to fully load
         setTimeout(() => {
-          console.log('🎨 [GLOBE HOOK] After timeout - Map style loaded:', map.isStyleLoaded());
-          
           // Set fog for the space background effect with stars - simplified to avoid errors
           try {
             map.setFog({
@@ -475,10 +445,9 @@ export const useGlobe = ({
       // Add navigation controls
       map.addControl(new mapboxgl.NavigationControl(), 'top-right');
 
-      console.log('🗺️ [GLOBE HOOK] Map created successfully');
       return map;
     } catch (error) {
-      console.error('❌ [GLOBE HOOK] Error creating Mapbox GL JS globe:', error);
+      console.error('Error creating Mapbox GL JS globe:', error);
       return null;
     }
   }, []);
@@ -491,13 +460,10 @@ export const useGlobe = ({
   // }, [initialMarkerSetIsDone]);
 
   useEffect(() => {
-    console.log('🔄 [GLOBE HOOK] useEffect for map creation - mapRef:', !!mapRef);
 
     if (!mapRef) {
-      console.log('🔄 [GLOBE HOOK] Creating map instance...');
       const instance = createInstance();
       if (instance) {
-        console.log('🔄 [GLOBE HOOK] Map instance created, setting mapRef');
         setMapRef(instance);
         
         // Add comprehensive resize detection for Mapbox GL JS responsiveness
@@ -586,24 +552,15 @@ export const useGlobe = ({
   }, [polygon, mapRef]);
 
   useEffect(() => {
-    console.log('📥 [GLOBE HOOK] allData received:', allData);
-    console.log('📥 [GLOBE HOOK] allData length:', allData?.length);
-    
+
     if (allData) {
       if (allData.length === 0) {
-        console.log('⚠️ [GLOBE HOOK] Empty data array');
         setEmptyStateIsVisible(true);
       } else if (emptyStateIsVisible) {
         setEmptyStateIsVisible(false);
       }
-      
-      console.log('🔍 [GLOBE HOOK] Filtering data with filterValidGPS...');
-      const filteredData = filterValidGPS(allData);
-      console.log('🔍 [GLOBE HOOK] filtered data result:', filteredData);
-      console.log('🔍 [GLOBE HOOK] filtered data length:', filteredData.length);
-      setData(filteredData);
+      setData(filterValidGPS(allData));
     } else {
-      console.log('❌ [GLOBE HOOK] No allData provided');
       setData(null);
     }
   }, [allData, emptyStateIsVisible]);
@@ -634,20 +591,7 @@ export const useGlobe = ({
   }, [user, mapRef, allData]);
 
   useEffect(() => {
-    console.log('🔄 [GLOBE HOOK] useEffect triggered:', { 
-      mapRef: !!mapRef, 
-      data: !!data, 
-      dataLength: data?.length, 
-      initialMarkerSetIsDone, 
-      styleLoaded: mapRef?.isStyleLoaded() 
-    });
-    
-    if (mapRef && data && !initialMarkerSetIsDone) {
-      console.log('🚀 [GLOBE HOOK] Attempting to add markers...');
-      console.log('🚀 [GLOBE HOOK] Style loaded check:', mapRef.isStyleLoaded());
-      
-      // Try to add markers immediately, and if style isn't loaded, 
-      // the addAllDataToMap function will handle it
+    if (mapRef && data && !initialMarkerSetIsDone && mapRef.isStyleLoaded()) {
       setInitialMarkerSetIsDone(true);
       addAllDataToMap();
     }

package/src/@daf/core/components/Dashboard/Globe/index.jsx

@@ -111,7 +111,7 @@ function Globe({
 	renderSider = null,
 	renderMarker = null,
 	type = "default",
-	showSider = false,
+	showSider = true,
 	filtersConfig,
 	onFilterChange = () => { },
 	isSatellite = false,
@@ -122,29 +122,11 @@ function Globe({
 }) {
 	// Map data to include marker coordinates
 	const mappedData = useMemo(
-		() => {
-			console.log('📊 [GLOBE COMPONENT] Original data received:', data);
-			console.log('📊 [GLOBE COMPONENT] Data length:', data?.length);
-			
-			if (!data || data.length === 0) {
-				console.log('❌ [GLOBE COMPONENT] No data to map');
-				return [];
-			}
-			
-			const mapped = data.map((d, i) => {
-				console.log(`📊 [GLOBE COMPONENT] Mapping item ${i}:`, d);
-				console.log(`📊 [GLOBE COMPONENT] Item ${i} GPS:`, d?.gps);
-				const result = {
-					...d,
-					marker: { lat: d?.gps?.latitude, lng: d?.gps?.longitude },
-				};
-				console.log(`📊 [GLOBE COMPONENT] Item ${i} mapped result:`, result);
-				return result;
-			});
-			
-			console.log('📊 [GLOBE COMPONENT] Final mapped data:', mapped);
-			return mapped;
-		},
+		() =>
+			data.map((d) => ({
+				...d,
+				marker: { lat: d?.gps?.latitude, lng: d?.gps?.longitude },
+			})),
 		[data],
 	);
 

package/src/@daf/core/components/Dashboard/Globe/style.js

@@ -6,34 +6,6 @@ const Style = styled.div`
   position: relative;
   width: 100%;
   height: 472px;
-  
-  /* CRITICAL: Protect against Leaflet CSS interference */
-  .daf-simple-globe-container {
-    position: relative;
-    width: 100%;
-    height: 100%;
-    
-    /* Override Leaflet CSS that interferes with Mapbox */
-    .mapboxgl-canvas-container {
-      position: relative !important;
-      left: auto !important;
-      top: auto !important;
-    }
-    
-    .mapboxgl-canvas-container canvas {
-      position: relative !important;
-      left: auto !important;
-      top: auto !important;
-      transform: none !important;
-    }
-    
-    /* Protect markers from Leaflet positioning */
-    .daf-globe-marker {
-      position: relative !important;
-      left: auto !important;
-      top: auto !important;
-    }
-  }
 
   .filter-cont {
     position: absolute; 
@@ -87,7 +59,6 @@ const Style = styled.div`
     height: 100%; 
   }
 
-  /* Narrow marker styling used by legacy components; avoid width/height overrides for SimpleGlobe */
   .map-marker {
     text-align: center;
     width 100%;

package/src/@daf/core/components/EditForm/EditForm.stories.js

@@ -94,6 +94,7 @@ const EForm = () => {
 						getAppHeader={storyData.getAppHeader}
 						getApiBaseUrl={storyData.getApiBaseUrl}
 						fullWidth={true}
+						namespace="project-readiness"
 						evaluationConfig={
 							[
 								// {

package/src/@daf/core/components/EditForm/form.jsx

@@ -13,6 +13,7 @@ import { convertToDayJs } from "../../../utils/date";
 import { convertUndefinedToNull } from "../../../utils/object";
 
 export const EditForm = ({
+	namespace,
 	isReview,
 	highlightMandatory,
 	onValuesChange = () => {},
@@ -333,6 +334,7 @@ export const EditForm = ({
 		}
 	}, [data]);
 
+	console.log("namespace", namespace);
 	const renderForm = () => {
 		switch (template) {
 			default:
@@ -544,6 +546,7 @@ export const EditForm = ({
 												onValuesChange={onValuesChange}
 												i={i}
 												setLoading={setLoading}
+												namespace={namespace}
 											/>
 										</div>
 									) : null;

package/src/@daf/core/components/EditForm/helper.js

@@ -2646,6 +2646,7 @@ export const GetFormItem = ({
 	inputMeta = {},
 	changeInputMeta = () => {},
 	changeLinking = () => {},
+	namespace,
 }) => {
 	const {
 		t,
@@ -2849,6 +2850,11 @@ export const GetFormItem = ({
 
 			if (input && typeof input === "object") {
 				// check if input is valid
+				const hideComment = namespace === "project-readiness";
+				console.log("hideComment", {
+					hideComment,
+					namespace,
+				});
 				return (
 					<>
 						<div className="flex-row input-cont">
@@ -3012,46 +3018,67 @@ export const GetFormItem = ({
 															</div>
 														</Tooltip>
 
-														<Tooltip title={t("Add comment")}>
-															<div>
-																<Button
-																	type="link"
-																	disabled={!input.meta?.comment}
-																	{...(!isShown
-																		? {
-																				className:
-																					"default p-0",
-																		  }
-																		: {
-																				className:
-																					"p-0 primary",
-																		  })}
-																	onClick={() => {
-																		if (
-																			inputMeta.comment !==
-																				undefined &&
-																			inputMeta.comment !==
-																				null
-																		) {
-																			return;
+														{!hideComment ? (
+															<Tooltip title={t("Add comment")}>
+																<div>
+																	<Button
+																		type="link"
+																		disabled={
+																			!input.meta?.comment
 																		}
-
-																		setIsShown(true);
-																		changeInputMeta({
-																			key: inputKey,
-																			type: input.type,
-																			value: { comment: "" },
-																		});
-																	}}
-																>
-																	<CustomIcon
-																		name="AddComment"
-																		width={16}
-																		height={16}
-																	/>
-																</Button>
-															</div>
-														</Tooltip>
+																		{...(!isShown
+																			? {
+																					className:
+																						"default p-0",
+																			  }
+																			: {
+																					className:
+																						"p-0 primary",
+																			  })}
+																		onClick={() => {
+																			if (
+																				inputMeta.comment !==
+																					undefined &&
+																				inputMeta.comment !==
+																					null
+																			) {
+																				return;
+																			}
+
+																			setIsShown(true);
+																			changeInputMeta({
+																				key: inputKey,
+																				type: input.type,
+																				value: {
+																					comment: "",
+																				},
+																			});
+																		}}
+																	>
+																		<CustomIcon
+																			name="AddComment"
+																			width={16}
+																			height={16}
+																		/>
+																	</Button>
+																</div>
+															</Tooltip>
+														) : (
+															<Tooltip title={t("Project Readiness")}>
+																<div>
+																	<Button
+																		type="link"
+																		className="default p-0"
+																	>
+																		<CustomIcon
+																			name="MagicWand"
+																			width={16}
+																			height={16}
+																		/>
+																	</Button>
+																</div>
+															</Tooltip>
+														)}
 													</>
 												) : null}
 											</div>

package/src/@daf/core/components/EditForm/storyConfig.js

@@ -1,3 +1,3 @@
-import { getApiBaseUrl, getAppHeader, storyData } from "./storyConfig2";
+import { getApiBaseUrl, getAppHeader, storyData } from "./storyConfig3";
 
 export { getApiBaseUrl, getAppHeader, storyData };