datastake-daf 0.6.99 → 0.6.100

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

@@ -5,238 +5,241 @@ import MoreTags from "../../Table/MoreTags";
 const isMineSite = true;
 
 export const storyConfig = {
-	data: [
-		{
-			gps: {
-				latitude: -1.545726158025555,
-				longitude: 28.875630614904935,
-			},
-			name: "Rubaya",
-			datastakeId: "LOC-00000000241",
-			data: [
-				{
-					_id: "68af116e2cb57a4e3dd2e056",
-					createdBy: "4274fdb4-2798-46ea-a0a6-b4af5d92566e",
-					form: "event",
-					id: "91c3176a-d312-4259-9ddf-9d286ff6df87",
-					datastakeId: "EV-000000000150",
-					name: "Eboulement",
-					authorId: "7e17f076-09e7-4668-927c-11c12ccd1346",
-					collectId: "d78271301d04f76dfe0f70ce3c9e114ffe4dc4e0",
-					country: "CD",
-					date: "2025-08-25",
-					typeOfEvent: "incident",
-					implementers: [],
-					associatedSubjects: [],
-					testimonialsSource: [],
-					pictures: [],
-					documents: [],
-					channels: ["NAS-00000000105"],
-					published: true,
-					version: 1,
-					identifiedPerpetrators: [],
-					identifiedVictims: [],
-					assistedVictims: [],
-					mitigationMeasures: [],
-					createdAt: "2025-08-27T00:00:00.000Z",
-					updatedAt: "2025-08-27T14:12:21.395Z",
-					__v: 0,
-					percentageCompletion: 40,
-					eventCategory: "conflict",
-					incindentType: null,
-					initiative: null,
-					meta: null,
-					namespace: "incident",
-					primarySource: null,
-					severity: "moderate",
-					sources: ["7e17f076-09e7-4668-927c-11c12ccd1346"],
-					type: "minor_incident",
-				},
-				{
-					_id: "68af1fb6b52f86d82f57e945",
-					createdBy: "b1e3f288-01a2-4cea-95d2-03f65dfede99",
-					form: "event",
-					id: "5bee0d0f-39da-4bd1-85a4-e66276c82303",
-					datastakeId: "EV-000000000153",
-					name: "Request of security equipment",
-					authorId: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
-					collectId: "2142bd9f3306c9ec3c823f63bbbbb8fe3ebad7fa",
-					country: "CD",
-					date: "2025-08-11",
-					typeOfEvent: "testimonials",
-					implementers: [],
-					typeOfTestimonials: "request",
-					associatedSubjects: [],
-					testimonialsSource: [],
-					pictures: [],
-					documents: [],
-					channels: [],
-					published: true,
-					version: 1,
-					identifiedPerpetrators: [],
-					identifiedVictims: [],
-					assistedVictims: [],
-					mitigationMeasures: [],
-					createdAt: "2025-08-27T00:00:00.000Z",
-					updatedAt: "2025-08-27T15:10:00.619Z",
-					__v: 0,
-					percentageCompletion: 50,
-					meta: null,
-					namespace: "testimonials",
-					sources: ["fc4ca5c6-f46d-424f-a948-d66b031a82c3"],
-					type: "correctiveActions",
-				},
-				{
-					_id: "68af5d45b52f86d82f580fc8",
-					createdBy: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
-					form: "event",
-					id: "97348b4c-f7cf-4124-9b70-0f6891a40a15",
-					datastakeId: "EV-000000000161",
-					name: "76867485768",
-					authorId: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
-					collectId: "33b9aea707761a7a735aee81ebd29d5656f049fa",
-					country: "CD",
-					date: "2025-08-11",
-					typeOfEvent: "incident",
-					implementers: [],
-					associatedSubjects: [],
-					testimonialsSource: [],
-					pictures: [],
-					documents: [],
-					channels: [],
-					published: false,
-					version: 1,
-					identifiedPerpetrators: [],
-					identifiedVictims: [],
-					assistedVictims: [],
-					mitigationMeasures: [],
-					createdAt: "2025-08-27T00:00:00.000Z",
-					updatedAt: "2025-08-27T00:00:00.000Z",
-					__v: 0,
-					percentageCompletion: 40,
-					eventCategory: null,
-					initiative: null,
-					meta: null,
-					namespace: "incident",
-					primarySource: null,
-					severity: "major",
-					sources: ["fc4ca5c6-f46d-424f-a948-d66b031a82c3"],
-					type: "major_incident",
-				},
-			],
-			type: "Mine site",
-			total: 5,
-			sources: 2,
-		},
-	],
-	filtersConfig: [
-		{
-			label: "Location type",
-			placeholder: "Select",
-			key: "type",
-			type: "select",
-			value: "A",
-			options: [{ label: "Typ A", value: "A" }],
-		},
-		{
-			label: "Location type",
-			placeholder: "Select",
-			key: "type2",
-			type: "select",
-			value: undefined,
-			options: [{ label: "Typ A", value: "A" }],
-		},
-	],
-	onFilterChange: (v) => {
-		console.log(v);
-	},
-	// tooltipAsText: true,
-	primaryLink: true,
-	renderSider: () =>
-		isMineSite ? (
-			<div className="body-list">
-				<div className="body-row">
-					<span className="label">Territory</span>
-					<span>Territory</span>
-				</div>
+  data: [
+    {
+      gps: {
+        latitude: -1.545726158025555,
+        longitude: 28.875630614904935,
+      },
+      name: "Rubaya",
+      datastakeId: "LOC-00000000241",
+      data: [
+        {
+          _id: "68af116e2cb57a4e3dd2e056",
+          createdBy: "4274fdb4-2798-46ea-a0a6-b4af5d92566e",
+          form: "event",
+          id: "91c3176a-d312-4259-9ddf-9d286ff6df87",
+          datastakeId: "EV-000000000150",
+          name: "Eboulement",
+          authorId: "7e17f076-09e7-4668-927c-11c12ccd1346",
+          collectId: "d78271301d04f76dfe0f70ce3c9e114ffe4dc4e0",
+          country: "CD",
+          date: "2025-08-25",
+          typeOfEvent: "incident",
+          implementers: [],
+          associatedSubjects: [],
+          testimonialsSource: [],
+          pictures: [],
+          documents: [],
+          channels: ["NAS-00000000105"],
+          published: true,
+          version: 1,
+          identifiedPerpetrators: [],
+          identifiedVictims: [],
+          assistedVictims: [],
+          mitigationMeasures: [],
+          createdAt: "2025-08-27T00:00:00.000Z",
+          updatedAt: "2025-08-27T14:12:21.395Z",
+          __v: 0,
+          percentageCompletion: 40,
+          eventCategory: "conflict",
+          incindentType: null,
+          initiative: null,
+          meta: null,
+          namespace: "incident",
+          primarySource: null,
+          severity: "moderate",
+          sources: ["7e17f076-09e7-4668-927c-11c12ccd1346"],
+          type: "minor_incident",
+        },
+        {
+          _id: "68af1fb6b52f86d82f57e945",
+          createdBy: "b1e3f288-01a2-4cea-95d2-03f65dfede99",
+          form: "event",
+          id: "5bee0d0f-39da-4bd1-85a4-e66276c82303",
+          datastakeId: "EV-000000000153",
+          name: "Request of security equipment",
+          authorId: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
+          collectId: "2142bd9f3306c9ec3c823f63bbbbb8fe3ebad7fa",
+          country: "CD",
+          date: "2025-08-11",
+          typeOfEvent: "testimonials",
+          implementers: [],
+          typeOfTestimonials: "request",
+          associatedSubjects: [],
+          testimonialsSource: [],
+          pictures: [],
+          documents: [],
+          channels: [],
+          published: true,
+          version: 1,
+          identifiedPerpetrators: [],
+          identifiedVictims: [],
+          assistedVictims: [],
+          mitigationMeasures: [],
+          createdAt: "2025-08-27T00:00:00.000Z",
+          updatedAt: "2025-08-27T15:10:00.619Z",
+          __v: 0,
+          percentageCompletion: 50,
+          meta: null,
+          namespace: "testimonials",
+          sources: ["fc4ca5c6-f46d-424f-a948-d66b031a82c3"],
+          type: "correctiveActions",
+        },
+        {
+          _id: "68af5d45b52f86d82f580fc8",
+          createdBy: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
+          form: "event",
+          id: "97348b4c-f7cf-4124-9b70-0f6891a40a15",
+          datastakeId: "EV-000000000161",
+          name: "76867485768",
+          authorId: "fc4ca5c6-f46d-424f-a948-d66b031a82c3",
+          collectId: "33b9aea707761a7a735aee81ebd29d5656f049fa",
+          country: "CD",
+          date: "2025-08-11",
+          typeOfEvent: "incident",
+          implementers: [],
+          associatedSubjects: [],
+          testimonialsSource: [],
+          pictures: [],
+          documents: [],
+          channels: [],
+          published: false,
+          version: 1,
+          identifiedPerpetrators: [],
+          identifiedVictims: [],
+          assistedVictims: [],
+          mitigationMeasures: [],
+          createdAt: "2025-08-27T00:00:00.000Z",
+          updatedAt: "2025-08-27T00:00:00.000Z",
+          __v: 0,
+          percentageCompletion: 40,
+          eventCategory: null,
+          initiative: null,
+          meta: null,
+          namespace: "incident",
+          primarySource: null,
+          severity: "major",
+          sources: ["fc4ca5c6-f46d-424f-a948-d66b031a82c3"],
+          type: "major_incident",
+        },
+      ],
+      type: "Mine site",
+      total: 5,
+      sources: 2,
+    },
+  ],
+  filtersConfig: [
+    {
+      label: "Location type",
+      placeholder: "Select",
+      key: "type",
+      type: "select",
+      value: "A",
+      options: [{ label: "Typ A", value: "A" }],
+    },
+    {
+      label: "Location type",
+      placeholder: "Select",
+      key: "type2",
+      type: "select",
+      value: undefined,
+      options: [{ label: "Typ A", value: "A" }],
+    },
+  ],
+  onFilterChange: (v) => {
+    console.log(v);
+  },
+  // tooltipAsText: true,
+  primaryLink: true,
+  renderSider: () =>
+    isMineSite ? (
+      <div className="body-list">
+        <div className="body-row">
+          <span className="label">Territory</span>
+          <span>Territory</span>
+        </div>
 
-				<div className="body-row">
-					<span className="label">Territory</span>
-					<span>Territory</span>
-				</div>
+        <div className="body-row">
+          <span className="label">Territory</span>
+          <span>Territory</span>
+        </div>
 
-				<div className="body-row">
-					<span className="label">Territory</span>
-					<span>Territory</span>
-				</div>
-			</div>
-		) : (
-			<div className="daf-table-wrapper extra-small">
-				<DAFTable
-					loading={false}
-					scroll={{ y: 300 }}
-					className="no-padding no-margin"
-					data={[
-						{ worker: "Redis RIra", activity: "1234", key: 0 },
-						{ empty: true, key: 1 },
-						{ empty: true, key: 2 },
-						{ empty: true, key: 3 },
-						{ empty: true, key: 4 },
-						{ empty: true, key: 5 },
-						{ empty: true, key: 6 },
-						{ empty: true, key: 7 },
-						{ empty: true, key: 8 },
-					]}
-					pagination={false}
-					columns={[
-						{
-							title: "Worker",
-							dataIndex: "worker",
-							key: "worker",
-							ellipsis: true,
-							width: 90,
-						},
-						{
-							title: "Activity",
-							dataIndex: "activity",
-							key: "activity",
-							width: 90,
-							render: (_, all) => {
-								if (all.empty) {
-									return <div className="daf-default-cell md" />;
-								}
+        <div className="body-row">
+          <span className="label">Territory</span>
+          <span>Territory</span>
+        </div>
+      </div>
+    ) : (
+      <div className="daf-table-wrapper extra-small">
+        <DAFTable
+          loading={false}
+          scroll={{ y: 300 }}
+          className="no-padding no-margin"
+          data={[
+            { worker: "Redis RIra", activity: "1234", key: 0 },
+            { empty: true, key: 1 },
+            { empty: true, key: 2 },
+            { empty: true, key: 3 },
+            { empty: true, key: 4 },
+            { empty: true, key: 5 },
+            { empty: true, key: 6 },
+            { empty: true, key: 7 },
+            { empty: true, key: 8 },
+          ]}
+          pagination={false}
+          columns={[
+            {
+              title: "Worker",
+              dataIndex: "worker",
+              key: "worker",
+              ellipsis: true,
+              width: 90,
+            },
+            {
+              title: "Activity",
+              dataIndex: "activity",
+              key: "activity",
+              width: 90,
+              render: (_, all) => {
+                if (all.empty) {
+                  return <div className="daf-default-cell md" />;
+                }
 
-								return (
-									<MoreTags values={[{ label: "DDdadsdas" }]} maxTextCont={40} />
-								);
-							},
-						},
-						{
-							title: "",
-							dataIndex: "action",
-							key: "action",
-							width: 34,
-							render: (_, all) => {
-								if (all.empty) {
-									return <div className="daf-default-cell md" />;
-								}
+                return (
+                  <MoreTags
+                    values={[{ label: "DDdadsdas" }]}
+                    maxTextCont={40}
+                  />
+                );
+              },
+            },
+            {
+              title: "",
+              dataIndex: "action",
+              key: "action",
+              width: 34,
+              render: (_, all) => {
+                if (all.empty) {
+                  return <div className="daf-default-cell md" />;
+                }
 
-								return <CustomIcon name="LinkNewTab" width={12} height={12} />;
-							},
-						},
-					]}
-					rowKey="key"
-				/>
-			</div>
-		),
-	renderTooltip: (data) => {
-		return [
-			{ label: "Workers", value: data?.administrativeLevel1 },
-			{ label: "Opinion", value: "RROFTE GERRDECI " },
-		];
-	},
-	link: true,
-	onClickLink: (data) => {
-		console.log(data);
-	},
+                return <CustomIcon name="LinkNewTab" width={12} height={12} />;
+              },
+            },
+          ]}
+          rowKey="key"
+        />
+      </div>
+    ),
+  renderTooltip: (data) => {
+    return [
+      { label: "Workers", value: data?.administrativeLevel1 },
+      { label: "Opinion", value: "RROFTE GERRDECI " },
+    ];
+  },
+  link: true,
+  onClickLink: (data) => {
+    console.log(data);
+  },
 };

package/src/helpers/Map.js

@@ -1,4 +1,10 @@
-import L from 'leaflet';
+import L from "leaflet";
+const EVENT_COLORS = {
+  MAJOR: "#cf1322", // Red for major incidents
+  MODERATE: "#fa8c16", // Orange for moderate incidents
+  MINOR: "#fadb14", // Yellow for minor incidents
+  CORRECTIVE: "#12b76a", // Green for corrective actions
+};
 
 /**
  * Converts a latitude or longitude coordinate to degrees, minutes and seconds.
@@ -15,7 +21,7 @@ export const toDegreesMinutesAndSeconds = (coordinate) => {
   var minutes = Math.floor(minutesNotTruncated);
   var seconds = Math.floor((minutesNotTruncated - minutes) * 60);
   return degrees + "°" + minutes + "'" + seconds;
-}
+};
 
 /**
  * Converts latitude and longitude coordinates in decimal degrees to degrees, minutes and seconds.
@@ -28,12 +34,82 @@ export const toDegreesMinutesAndSeconds = (coordinate) => {
  */
 export const convertDMS = (lat, lng) => {
   const latitude = toDegreesMinutesAndSeconds(lat);
-  const latitudeCardinal = lat >= 0 ? 'N' : 'S';
+  const latitudeCardinal = lat >= 0 ? "N" : "S";
   const longitude = toDegreesMinutesAndSeconds(lng);
-  const longitudeCardinal = lng >= 0 ? 'E' : 'W';
-  return [(latitude + '"' + latitudeCardinal), (longitude + '"' + longitudeCardinal)];
-}
+  const longitudeCardinal = lng >= 0 ? "E" : "W";
+  return [
+    latitude + '"' + latitudeCardinal,
+    longitude + '"' + longitudeCardinal,
+  ];
+};
 
 export const southWest = L.latLng(85, -180),
   northEast = L.latLng(-85, 180),
   maxBounds = L.latLngBounds(southWest, northEast);
+
+export const getEventMarkerStyle = (data) => {
+  const incidents = data?.data || [];
+
+  const totals = {
+    major: incidents.filter((d) => d.type === "major_incident").length,
+    minor: incidents.filter((d) => d.type === "minor_incident").length,
+    moderate: incidents.filter((d) => d.type === "moderate_incident").length,
+    correctiveActions: incidents.filter((d) => d.type === "correctiveActions")
+      .length,
+  };
+
+  const total = incidents.length;
+  let background = "#f1f1f1";
+
+  if (total > 0) {
+    // Build a dynamic array of categories with colors & percentages
+    const categories = [
+      { key: "major", value: totals.major, color: EVENT_COLORS.MAJOR },
+      {
+        key: "moderate",
+        value: totals.moderate,
+        color: EVENT_COLORS.MODERATE,
+      },
+      { key: "minor", value: totals.minor, color: EVENT_COLORS.MINOR },
+      {
+        key: "corrective",
+        value: totals.correctiveActions,
+        color: EVENT_COLORS.CORRECTIVE,
+      },
+    ]
+      .filter((c) => c.value > 0)
+      .map((c) => ({ ...c, perc: (c.value / total) * 100 }));
+
+    if (categories.length === 1) {
+      background = categories[0].color;
+    } else {
+      let currentStop = 0;
+      const gradientStops = categories.map((cat, index) => {
+        const stop = categories
+          .slice(0, index)
+          .reduce((acc, c) => acc + c.perc, 0);
+
+        return `${cat.color} ${Math.round(stop)}%`;
+      });
+
+      background = `radial-gradient(circle, ${gradientStops.join(", ")})`;
+    }
+  }
+
+  let radius = 35;
+
+  if (data.total > 20) {
+    radius = 65;
+  } else if (data.total > 10) {
+    radius = 50;
+  } else {
+    radius = 40;
+  }
+
+  return {
+    radius,
+    background,
+    totals,
+    total,
+  };
+};

package/src/styles/_index.scss

@@ -6,7 +6,7 @@
 @import "./layout/index";
 @import "./pages/index";
 @import "./xyflow.scss";
-@import "./datastake.scss";
+/* @import "./datastake.scss"; */
 // form classes
 
 .max-char-cont {

package/src/styles/datastake/_index.css

@@ -0,0 +1,5 @@
+@import "./fonts/outfit.css";
+@import "./fonts/sfDisplay.css";
+@import "./datastake.css";
+@import "./leaflet.css";
+@import "./leaflet.markercluster.css";