datastake-daf 0.6.780 → 0.6.782

package/src/@daf/core/components/Dashboard/Map/ChainIcon/utils.js

@@ -5,14 +5,13 @@ const VILLAGE = "village";
 const EXPORTER = "exporter";
 const PROCESSOR = "mineralProcessor";
 const DEPOT = "depot";
-const OPERATOR = "miningOperator";
 
 const MAX_EXTRA_SMALL_ZOOM_THRESHOLD = 2;
 const MAX_SMALL_ZOOM_THRESHOLD = 3;
 const MAX_MEDIUM_ZOOM_THRESHOLD = 6;
 
 const LOCATION_TYPES = [MINE_SITE, VILLAGE];
-const STAKEHOLDER_TYPES = [EXPORTER, PROCESSOR, DEPOT, OPERATOR];
+const STAKEHOLDER_TYPES = [EXPORTER, PROCESSOR, DEPOT];
 
 const RADIUS_SMALL = 15;
 const RADIUS_MEDIUM = 35;
@@ -101,6 +100,7 @@ export function getStakeholderPosition({ zoom, totalMarkers, markerIndex }) {
 
 	let radius;
 	let center = {
+		// NOT BEING USED FOR NOW AND MAYBE NEVER
 		left: 0,
 		top: 0,
 	};
@@ -117,32 +117,6 @@ export function getStakeholderPosition({ zoom, totalMarkers, markerIndex }) {
 	return { x, y, center, radius, angleDeg };
 }
 
-function applyAnimationDirect(el, isShortLink) {
-	if (!(el instanceof SVGElement) || isShortLink) return;
-  
-	el.style.strokeDasharray = "10, 10";
-	el.style.strokeDashoffset = "0";
-  
-	el.style.animation = "dash-flow 1.2s linear infinite";
-  
-	el.classList.add('animated-polyline');
-}
-
-function removeAnimationFromElement(element) {
-	if (!element) return;
-	
-	element.classList.remove('animated-polyline');
-	element.style.animation = '';
-	element.style.strokeDasharray = '';
-}
-
-function applyAnimationToPolyline(polyline, isShortLink) {
-	const element = polyline.getElement();
-	if (element) {
-		applyAnimationDirect(element, isShortLink);
-	}
-}
-
 export function createPolyline({
 	L,
 	startLatLng,
@@ -153,62 +127,32 @@ export function createPolyline({
 	listOfPolylines = [],
 	isFromStakeholder = false,
 	isForceOpen = false,
-	stakeholderType = null,
-	animated = false,
-	mapRef
 }) {
-	const lineWidth = isFromStakeholder && isExtraSmallMarker(zoom) && !isForceOpen ? 0 : 1.2;
-
-	const isShortLink = stakeholderType === OPERATOR || isFromStakeholder;
-	const shouldAnimate = animated;
+	const width = isFromStakeholder && isExtraSmallMarker(zoom) && !isForceOpen ? 0 : 1.2;
 
-	const lineCoordinates = [
+	const coordinates = [
 		[startLatLng.lat, startLatLng.lng],
 		[endLatLng.lat, endLatLng.lng],
 	];
-
-	const polylineStyle = {
+	const style = {
 		color: "var(--base-gray-70)",
-		weight: lineWidth,
-		opacity: isSelected ? 1 : 0.5,
-		smoothFactor: 0,
+		weight: width,
+		opacity: 0.5,
+		smoothFactor: 1,
 		id,
-		dashArray: isShortLink ? "0, 0" : (shouldAnimate ? "10, 10" : (!isSelected ? "5, 5" : "10, 10")),
-		renderer: L.svg()
+		dashArray: !isSelected ? "5, 5" : "0, 0",
 	};
 
-	const existingPolyline = listOfPolylines.find(p => p.options.id === id);
-
-	if (existingPolyline) {
-		removeAnimationFromElement(existingPolyline.getElement());
-		
-		existingPolyline.setLatLngs(lineCoordinates);
-		existingPolyline.setStyle(polylineStyle);
-		
-		if (shouldAnimate && isSelected) {
-			existingPolyline.once('add', () => {
-				applyAnimationToPolyline(existingPolyline, isShortLink);
-			});
-			
-			applyAnimationToPolyline(existingPolyline, isShortLink);
-		}
-		
-		return existingPolyline;
-	}
+	const newPolyline = L.polyline(coordinates, style);
 
-	const newPolyline = L.polyline(lineCoordinates, polylineStyle);
-	
-	newPolyline.addTo(mapRef);
-	listOfPolylines.push(newPolyline);
-	
-	if (shouldAnimate && isSelected) {
-		newPolyline.once('add', () => {
-			applyAnimationToPolyline(newPolyline, isShortLink);
-		});
-		
-		applyAnimationToPolyline(newPolyline, isShortLink);
+	if (listOfPolylines.find((p) => p.options.id === id)) {
+		const polylineToUpdateCoordinates = listOfPolylines.find((p) => p.options.id === id);
+		polylineToUpdateCoordinates.setLatLngs(coordinates);
+		polylineToUpdateCoordinates.setStyle(style);
+	} else {
+		listOfPolylines.push(newPolyline);
 	}
-	
+
 	return newPolyline;
 }
 

package/src/@daf/core/components/Dashboard/Map/helper.js

@@ -369,7 +369,6 @@ export function useMapHelper({
 							onClickLink={onClickLink}
 							activeStakeholder={activeStakeholder}
 							setActiveStakeholder={setActiveStakeholder}
-							mapRef={mapRef}
 						/>,
 					);
 

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

@@ -31,7 +31,7 @@ export const useMap = ({
 	const container = createRef();
 	const [data, setData] = useState([]);
 	const [mapRef, setMapRef] = useState(null);
-	const { TILE_LAYER_URL, MAP_TOKEN } = useMapConfig({ app, isSatellite, mapRef: container });
+	const { TILE_LAYER_URL, MAP_TOKEN } = useMapConfig({ app, isSatellite });
 	const [initialMarkerSetIsDone, setInitialMarkerSetIsDone] = useState(false);
 	const [mapCenter, setMapCenter] = useState([0, 0]);
 	const [emptyStateIsVisible, setEmptyStateIsVisible] = useState(false);
@@ -48,7 +48,6 @@ export const useMap = ({
 		const stakeToLoc = new Map();
 		const nodeTypes = new Map();
 
-		// Build the graph
 		for (const loc of data) {
 			const locId = loc.datastakeId;
 			nodeTypes.set(locId, loc.type);
@@ -82,45 +81,34 @@ export const useMap = ({
 
 		const highlightTable = {};
 
-		// Perform BFS/DFS to find all connected nodes in the entire chain
 		for (const [node] of graph) {
 			const highlighted = new Set();
-			const queue = [node];
-			const visited = new Set([node]);
 			
-			while (queue.length > 0) {
-				const current = queue.shift();
-				highlighted.add(current);
-				
-				// Add parent location if current is stakeholder
-				const currentIsStakeholder = !isLocation(nodeTypes.get(current));
-				if (currentIsStakeholder && stakeToLoc.has(current)) {
-					const parentLoc = stakeToLoc.get(current);
-					if (!visited.has(parentLoc)) {
-						highlighted.add(parentLoc);
-						visited.add(parentLoc);
-						queue.push(parentLoc);
-					}
-				}
+			highlighted.add(node);
+			
+			const nodeIsStakeholder = !isLocation(nodeTypes.get(node));
+			if (nodeIsStakeholder && stakeToLoc.has(node)) {
+				const parentLoc = stakeToLoc.get(node);
+				highlighted.add(parentLoc);
+			}
+			
+			for (const neighbor of graph.get(node) || []) {
+				const neighborIsStakeholder = !isLocation(nodeTypes.get(neighbor));
 				
-				// Traverse all neighbors
-				for (const neighbor of graph.get(current) || []) {
-					if (!visited.has(neighbor)) {
-						visited.add(neighbor);
-						queue.push(neighbor);
+				if (neighborIsStakeholder && stakeToLoc.has(neighbor)) {
+					const neighborParent = stakeToLoc.get(neighbor);
+					
+					if (
+						(isLocation(nodeTypes.get(node)) && neighborParent === node) ||
+						(nodeIsStakeholder && stakeToLoc.get(node) === neighborParent)
+					) {
+						highlighted.add(neighbor);
+					} else {
 						highlighted.add(neighbor);
-						
-						// If neighbor is stakeholder, add its parent location
-						const neighborIsStakeholder = !isLocation(nodeTypes.get(neighbor));
-						if (neighborIsStakeholder && stakeToLoc.has(neighbor)) {
-							const neighborParent = stakeToLoc.get(neighbor);
-							if (!visited.has(neighborParent)) {
-								highlighted.add(neighborParent);
-								visited.add(neighborParent);
-								queue.push(neighborParent);
-							}
-						}
+						highlighted.add(neighborParent);
 					}
+				} else {
+					highlighted.add(neighbor);
 				}
 			}
 
@@ -163,21 +151,10 @@ export const useMap = ({
 		destroyAllPopovers();
 		setSelectedMarkersId((prev) => {
 			if (prev.includes(clickedMarker.datastakeId)) {
-				// Deselecting - clear polylines
 				openPopupIdRef.current = null;
 				setMarkerWithPopup(null);
 				return [];
 			} else {
-				// CLEAR OLD POLYLINES BEFORE SELECTING NEW MARKER
-				if (polylinesRef.current.length > 0) {
-					polylinesRef.current.forEach((polyline) => {
-						if (mapRef.hasLayer(polyline)) {
-							mapRef.removeLayer(polyline);
-						}
-					});
-					polylinesRef.current = [];
-				}
-				
 				setMarkerWithPopup(isStakeholder(clickedMarker.type) ? clickedMarker : null);
 				const newSelectedMarkersId = highlightTable[clickedMarker.datastakeId];
 				openPopupIdRef.current = clickedMarker.datastakeId;
@@ -214,22 +191,12 @@ export const useMap = ({
 				});
 			}
 		}
-		
-		if (type === "chain" && selectedMarkersId.length === 0) {
-			if (polylinesRef.current.length) {
-				polylinesRef.current.forEach((polyline) => {
-					if (mapRef.hasLayer(polyline)) {
-						mapRef.removeLayer(polyline);
-					}
-				});
-				polylinesRef.current = [];
-			}
-		}
-		
 		clearMapMarkers();
 		if (data) {
+			// Filters out locations that are not connected to any stakeholders
+			const excludedType = ['village', 'town', 'area', 'territory']
 			const filteredData = data?.filter((obj) => 
-				obj.type === 'mineSite' || (obj?.stakeholders?.length > 0 || 
+				!excludedType.includes(obj?.type) && (obj?.stakeholders?.length > 0 || 
 				data.some((other) => 
 				  other.datastakeId !== obj.datastakeId &&
 				  (other.stakeholders || []).some((stk) =>
@@ -251,11 +218,9 @@ export const useMap = ({
 				);
 			});
 
-			if (selectedMarkersId.length > 0) {
-				polylinesRef.current.forEach((polyline) => {
-					mapRef.addLayer(polyline);
-				});
-			}
+			polylinesRef.current.forEach((polyline) => {
+				mapRef.addLayer(polyline);
+			});
 
 			mapRef.invalidateSize();
 			mapRef.fire("moveend");

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

@@ -7,8 +7,6 @@ const Style = styled.div`
   width: 100%;
   height: 472px;
 
-  
-
   .filter-cont {
     position: absolute; 
     top: 24px;
@@ -111,24 +109,11 @@ const Style = styled.div`
       align-items: center;
     }
 
-    .marker-chain {
-      display: flex;
-      align-items: center;
-      justify-content: center;
-    }
-
-    .animated-polyline {
-      stroke-dasharray: 10 10;
-      animation: dash-flow 1.5s linear infinite;
-      stroke-linecap: round;
-    }
-
-    @keyframes dash-flow {
-      to {
-        stroke-dashoffset: -20;
-      }
-    }
-
+	.marker-chain {
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
     
   }
 

package/src/@daf/hooks/useViewFormUrlParams.js

@@ -0,0 +1,84 @@
+import { useState, useEffect, useMemo } from "react";
+
+export const useViewFormUrlParams = ({
+    params,
+    pathname,
+    search,
+    searchParams,
+    setSearchParams,
+    push,
+}) => {
+    const [namespace, setNamespace] = useState(params.namespace);
+    const [id, setId] = useState(params.id);
+    const [group, setGroup] = useState(params.group);
+    const [subsection, setSubsection] = useState(params.subsection);
+    const [source, setSource] = useState(searchParams.get("source") || null);
+    const [version, setVersion] = useState(searchParams.get("version") || null);
+
+    useEffect(() => {
+        if (
+          (id && params.id !== id) ||
+          (namespace && namespace !== params.namespace)
+        ) {
+          setGroup(undefined);
+          setSubsection(undefined);
+        } else {
+          setGroup(params.group);
+          setSubsection(params.subsection);
+        }
+        setNamespace(params.namespace);
+        setId(params.id);
+    }, [params, id, namespace]);
+
+    useEffect(() => {
+        if (source && version) {
+            const newParams = new URLSearchParams(searchParams);
+            newParams.set("source", source);
+            newParams.set("version", version);
+            setSearchParams(newParams);
+        }
+	}, [source, version]);
+
+    const updateSourceAndVersion = (newSource, newVersion) => {
+        const newParams = new URLSearchParams(searchParams);
+        if (newSource && newVersion) {
+          newParams.set("source", newSource);
+          newParams.set("version", newVersion);
+        } else {
+          newParams.delete("source");
+          newParams.delete("version");
+        }
+        setSearchParams(newParams);
+        setSource(newSource);
+        setVersion(newVersion);
+      };
+    
+    const clearSourceAndVersion = () => {
+        updateSourceAndVersion(null, null);
+    };
+
+    const match = useMemo(
+		() => ({
+			params,
+			path: pathname,
+		}),
+		[params, pathname],
+	);
+    
+    return {
+        namespace,
+        id,
+        group,
+        subsection,
+        source,
+        version,
+        params,
+        searchParams,
+        setSource,
+        setVersion,
+        updateSourceAndVersion,
+        clearSourceAndVersion,
+        match,
+        search,
+      };
+}

package/src/@daf/pages/Summary/Activities/PlantingCycle/components/CycleOutcomes/index.jsx

@@ -82,7 +82,7 @@ const CycleOutcomes = ({
                     <section style={{ flex: 1 }}>
                         <StatCard
                             title={t("Total Area Restored")}
-                            value={totalAreaRestored?Number(totalAreaRestored.current).toLocaleString() : 0}
+                            value={totalAreaRestored?Number(totalAreaRestored.current).toLocaleString() + " ha" : 0 + " ha"}
                             icon="Tree"
                             change={totalAreaRestoredChange}
                         />