datastake-daf 0.6.313 → 0.6.314

package/dist/components/index.js

@@ -51359,7 +51359,7 @@ function NameNode({
               },
               children: data.isEmpty ? translateFN("noValueIdentified", {
                 value: data?.name
-              }) : data?.name
+              }) : data?.isPdf ? `${data?.content} ${data?.name}` : data?.name
             })
           }), data?.country ? /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
             title: data?.country?.label,
@@ -52623,7 +52623,8 @@ function StakeholderMappings(_ref3) {
     isSelectable = true,
     iconOffsetY = 250,
     t = s => s,
-    emptyString = undefined
+    emptyString = undefined,
+    isPdf = false
   } = _ref3;
   const reactFlowWrapper = React.useRef(null);
   const [nodes, setNodes] = react.useNodesState([]);
@@ -52762,8 +52763,47 @@ function StakeholderMappings(_ref3) {
           })
         }];
       }
+      if (isPdf) {
+        var _node$data6, _node$data7, _node$data8, _node$data9, _node$data10, _node$data11, _node$data12, _node$data13, _node$data14;
+        iconEdges.push({
+          id: "".concat(node.id, "-empty"),
+          source: node.id,
+          target: node.data.name + "-name-node",
+          type: "tooltipEdge",
+          data: {
+            name: node === null || node === void 0 || (_node$data6 = node.data) === null || _node$data6 === void 0 ? void 0 : _node$data6.name,
+            content: node === null || node === void 0 || (_node$data7 = node.data) === null || _node$data7 === void 0 ? void 0 : _node$data7.content,
+            isOnlyOne: true
+          },
+          targetHandle: node.data.order % 2 === 0 ? "left-handle-target" : "right-handle-target"
+        });
+        mandatoryNodes.push("".concat(node.data.name, "-name-node"));
+        return [{
+          id: node.data.name + "-name-node",
+          type: "nameNode",
+          data: {
+            name: node === null || node === void 0 || (_node$data8 = node.data) === null || _node$data8 === void 0 ? void 0 : _node$data8.name,
+            content: node === null || node === void 0 || (_node$data9 = node.data) === null || _node$data9 === void 0 ? void 0 : _node$data9.content,
+            icon: (_node$data10 = node.data) === null || _node$data10 === void 0 ? void 0 : _node$data10.type,
+            backgroundColor: node === null || node === void 0 || (_node$data11 = node.data) === null || _node$data11 === void 0 ? void 0 : _node$data11.activeColour,
+            iconColor: node === null || node === void 0 || (_node$data12 = node.data) === null || _node$data12 === void 0 ? void 0 : _node$data12.hoverColor,
+            isPdf: true,
+            t: t
+          },
+          position: positionDataNodes({
+            isLeftSide: node.data.order % 2 !== 0,
+            isAboveMainNode: node.data.order <= 2,
+            iconNode: node,
+            index: 0,
+            total: 1,
+            mainNode,
+            type: "nameNode",
+            hasContent: (node === null || node === void 0 || (_node$data13 = node.data) === null || _node$data13 === void 0 ? void 0 : _node$data13.content) !== undefined && (node === null || node === void 0 || (_node$data14 = node.data) === null || _node$data14 === void 0 ? void 0 : _node$data14.content) !== null ? true : false
+          })
+        }];
+      }
       return children.map((child, index) => {
-        var _node$data6;
+        var _node$data15;
         iconEdges.push({
           id: "".concat(node.id, "-").concat(child.id),
           source: node.id,
@@ -52801,7 +52841,8 @@ function StakeholderMappings(_ref3) {
             onClick: child.onClick,
             backgroundColor: child.backgroundColor || "#ade9e1",
             iconColor: child.iconColor || "#08949a",
-            icon: child.icon || "UserCircle"
+            icon: child.icon || "UserCircle",
+            content: children.length
           },
           position: positionDataNodes({
             isLeftSide,
@@ -52811,7 +52852,7 @@ function StakeholderMappings(_ref3) {
             total,
             mainNode,
             type: child.type || "primaryNode",
-            hasContent: node !== null && node !== void 0 && (_node$data6 = node.data) !== null && _node$data6 !== void 0 && _node$data6.content ? true : false
+            hasContent: node !== null && node !== void 0 && (_node$data15 = node.data) !== null && _node$data15 !== void 0 && _node$data15.content ? true : false
           })
         };
       });

package/package.json

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

package/src/@daf/core/components/Graphs/StakeholderMappings/StakeholderMappings.stories.jsx

@@ -1,7 +1,7 @@
 import StakeholderMappings from "./index";
 import ThemeLayout from "../../ThemeLayout";
 import Widget from "../../Dashboard/Widget/index.jsx";
-import { storyConfig, storyConfig2, storyConfig3, storyConfig4 } from "./storyConfig";
+import { storyConfig, storyConfig2, storyConfig3, storyConfig4, storyConfig5 } from "./storyConfig";
 
 export default {
 	title: "Graphs/StakeholderMappings",
@@ -115,3 +115,21 @@ export const WithEmptyState = {
 		);
 	},
 };
+
+export const Test = {
+	args: {},
+	render: () => {
+		return (
+			<Widget title="Stakeholder Mappings" className="with-border-header no-px no-p-body">
+				<div
+					style={{
+						height: "70vh",
+						width: "100%",
+					}}
+				>
+					<StakeholderMappings data={storyConfig5} isPdf={true} />
+				</div>
+			</Widget>
+		);
+	},
+};

package/src/@daf/core/components/Graphs/StakeholderMappings/index.jsx

@@ -129,6 +129,7 @@ function StakeholderMappings({
 	iconOffsetY = 250,
 	t = (s) => s,
 	emptyString = undefined,
+	isPdf = false,
 }) {
 	const reactFlowWrapper = useRef(null);
 	const [nodes, setNodes] = useNodesState([]);
@@ -290,6 +291,53 @@ function StakeholderMappings({
 				];
 			}
 
+			if (isPdf) {
+				iconEdges.push({
+					id: `${node.id}-empty`,
+					source: node.id,
+					target: node.data.name + "-name-node",
+					type: "tooltipEdge",
+					data: {
+						name: node?.data?.name,
+						content: node?.data?.content,
+						isOnlyOne: true,
+					},
+					targetHandle:
+						node.data.order % 2 === 0 ? "left-handle-target" : "right-handle-target",
+				});
+
+				mandatoryNodes.push(`${node.data.name}-name-node`);
+
+				return [
+					{
+						id: node.data.name + "-name-node",
+						type: "nameNode",
+						data: {
+							name: node?.data?.name,
+							content: node?.data?.content,
+							icon: node.data?.type,
+							backgroundColor: node?.data?.activeColour,
+							iconColor: node?.data?.hoverColor,
+							isPdf: true,
+							t: t,
+						},
+						position: positionDataNodes({
+							isLeftSide: node.data.order % 2 !== 0,
+							isAboveMainNode: node.data.order <= 2,
+							iconNode: node,
+							index: 0,
+							total: 1,
+							mainNode,
+							type: "nameNode",
+							hasContent:
+								node?.data?.content !== undefined && node?.data?.content !== null
+									? true
+									: false,
+						}),
+					},
+				];
+			}
+
 			return children.map((child, index) => {
 				iconEdges.push({
 					id: `${node.id}-${child.id}`,
@@ -333,6 +381,7 @@ function StakeholderMappings({
 						backgroundColor: child.backgroundColor || "#ade9e1",
 						iconColor: child.iconColor || "#08949a",
 						icon: child.icon || "UserCircle",
+						content: children.length,
 					},
 					position: positionDataNodes({
 						isLeftSide,

package/src/@daf/core/components/Graphs/StakeholderMappings/storyConfig.js

@@ -403,3 +403,97 @@ export const storyConfig4 = {
 		},
 	],
 };
+
+export const storyConfig5 = {
+    "id": "LOC-00000000278",
+    "name": "New Mine Test",
+    "totalSources": 1,
+    "country": {
+        "label": "Colombia",
+        "value": "co"
+    },
+    "backgroundColor": "#ffd6e8",
+    "icon": "DashboardLocations",
+    "iconColor": "#f75aab",
+    "children": [
+        {
+            "id": "Producers",
+            "name": "Producers",
+            "icon": "TifAmp",
+            "order": 1,
+            "hoverColor": "#36cfca",
+            "activeColour": "#b6f5ec",
+            "iconHoverColor": "#fff",
+            "content": 1,
+            "children": [
+                {
+                    "type": "nameNode",
+                    "id": "STK-00000000442",
+                    "name": "New Producer Test",
+                    "icon": "DashboardStakeholder",
+                    "backgroundColor": "#b6f5ec",
+                    "iconColor": "#36cfca",
+                    "country": {
+                        "label": "Colombia",
+                        "value": "co"
+                    }
+                }
+            ],
+            "emptyName": "No Producers Identified"
+        },
+        {
+            "id": "Documents",
+            "name": "Documents",
+            "icon": "DashboardDocuments",
+            "order": 2,
+            "hoverColor": "#3f96ff",
+            "activeColour": "#b9e0ff",
+            "iconHoverColor": "#fff",
+            "content": 1,
+            "children": [
+                {
+                    "type": "nameNode",
+                    "id": "DOC-00000006729",
+                    "name": "fewsdz",
+                    "icon": "DashboardDocuments",
+                    "backgroundColor": "#b9e0ff",
+                    "iconColor": "#3f96ff"
+                }
+            ],
+            "emptyName": "No Documents Identified"
+        },
+        {
+            "id": "Stakeholders",
+            "name": "Stakeholders",
+            "icon": "DashboardStakeholder",
+            "order": 3,
+            "hoverColor": "#36cfca",
+            "activeColour": "#b6f5ec",
+            "iconHoverColor": "#fff",
+            "content": 0,
+            "children": [],
+            "emptyName": "No Stakeholders Identified"
+        },
+        {
+            "id": "Mine Image",
+            "name": "Mine Image",
+            "icon": "Image",
+            "order": 4,
+            "hoverColor": "#3f96ff",
+            "activeColour": "#b9e0ff",
+            "iconHoverColor": "#fff",
+            "content": 1,
+            "children": [
+                {
+                    "type": "nameNode",
+                    "id": "DOC-00000006727",
+                    "name": "te3wst",
+                    "icon": "DashboardDocuments",
+                    "backgroundColor": "#b9e0ff",
+                    "iconColor": "#3f96ff"
+                }
+            ],
+            "emptyName": "No Mine Image Identified"
+        }
+    ]
+}

package/src/@daf/core/components/Graphs/components/Nodes/NameNode.jsx

@@ -78,7 +78,7 @@ export default function NameNode({ data }) {
               >
                 {data.isEmpty
                   ? translateFN("noValueIdentified", { value: data?.name })
-                  : data?.name}
+                  : data?.isPdf ? `${data?.content} ${data?.name}` : data?.name}
               </span>
             </Tooltip>
             {data?.country ? (