datastake-daf 0.6.847 → 0.6.849

package/src/@daf/pages/Dashboards/ConflictManagement/components/RisksWidget/components/TerritorialDistribution/index.js

@@ -3,88 +3,37 @@ import PropTypes from 'prop-types';
 import { renderTooltipJsx } from '../../../../../../../utils/tooltip.js';
 import Widget from '../../../../../../../core/components/Dashboard/Widget/index.jsx';
 import Chart from '../../../../../../../core/components/Charts/PieChart/chart.jsx';
-import {useWidgetFetch} from '../../../../../../../hooks/useWidgetFetch.js';
-import DashboardService from '../../../../../../../services/DashboardService.js';
-import { getColors } from './config.js';
+import { buildQueryString } from '../../../../../../../../helpers/urlHelpers.js';
+import { useTerritorialDistribution } from './hook.js';
 
-function TerritorialDistribution({ selectedPartners = {}, loading: parentLoading = false, t = (s) => s, theme = {}, category = "conflict", selectedRange ,goTo = () => {}, getRedirectLink = () => {}}) {
-    const colors = getColors(theme);
-
-    const defaultFetchConfig = useMemo(
-        () => ({
-            url: "/territorial-distribution",
-            basepath: "dashboard/conflict-management",
-            filters: {
-                category,
-                period: selectedRange,
-                sources: selectedPartners?.partners || [],
-            },
-            defaultData: {},
-            stop: selectedPartners?.loading,
-        }),
-        [category, selectedRange, selectedPartners],
-    );
-
-    const getData = useCallback(({ url, filters, basepath }) => {
-        return DashboardService.getWidgetConflictManagement(url, filters, basepath);
-    }, []);
-
-    const { data, loading } = useWidgetFetch({ 
-        config: defaultFetchConfig,
-        getData 
+function TerritorialDistribution({ 
+    selectedPartners = {}, 
+    loading: parentLoading = false, 
+    t = (s) => s, theme = {}, 
+    category = "conflict", 
+    selectedRange,
+    goTo = () => {}, 
+    getRedirectLink = () => {}
+}) {
+    const { 
+        pieData, 
+        loading, 
+        isEmpty 
+    } = useTerritorialDistribution({ 
+        category, 
+        selectedRange, 
+        selectedPartners, 
+        theme,
     });
 
-    const pieData = useMemo(() => {
-        if (!data || Array.isArray(data)) return []; 
-        const all = Object.keys(data);
-        const totalEvents = all.reduce((acc, key) => acc + (data[key]?.events?.length || 0), 0);
-
-        return all
-            .sort((a, b) => (data[b]?.events?.length || 0) - (data[a]?.events?.length || 0))
-            .map((key, index) => {
-                const item = data[key];
-                return {
-                   value: item?.events?.length,
-                   label: item?.locationData?.name,
-                   locationData: item?.locationData,
-                   color: colors[index % colors.length],
-                   percent: totalEvents ? (item?.events?.length / totalEvents) : 0,
-                }
-            });
-    }, [data, colors]);
-
-    const isEmpty = !pieData.length;
-
-    const getTooltipChildren = useCallback((items) => {
-        const item = Array.isArray(items) ? items[0] : items;
-        
-        return renderTooltipJsx({
-            title: item?.label || t("Undetermined"),
-            link: true,
-            onClickLink: () => {
-                 if (item?.label) {
-                     goTo(
-                         `/app/incidents?administrativeLevel1=${item?.locationData?.administrativeLevel1}&administrativeLevel2=${item?.locationData?.administrativeLevel2}&country=${item?.locationData?.country}`,
-                     );
-                 } else {
-                    goTo("/app/incident");
-                 }
-            },
-            items: [
-                {
-                    label: t("Number of incidents"),
-                    value: item?.value,
-                },
-            ],
-        });
-    }, [t, goTo]);
-
     return (
         <Widget
             loading={loading || parentLoading}
             title={t("Territorial Distribution")}
-            className="with-border-header"
+
+            className="with-border-header h-w-btn-header"
         >
+   
             <Chart
                 mouseXOffset={10}
                 mouseYOffset={10}
@@ -94,8 +43,34 @@ function TerritorialDistribution({ selectedPartners = {}, loading: parentLoading
                 isPie
                 t={t}
                 isEmpty={isEmpty}
-                getTooltipChildren={getTooltipChildren}
+                getTooltipChildren={(items) => {
+                    const item = Array.isArray(items) ? items[0] : items;
+                    
+                    return renderTooltipJsx({
+                        title: item?.label || t("Undetermined"),
+                        link: true,
+                        onClickLink: () => {
+                             if (item?.label) {
+                                const queryString = buildQueryString({
+                                    administrativeLevel1: item?.locationData?.administrativeLevel1,
+                                    administrativeLevel2: item?.locationData?.administrativeLevel2,
+                                    country: item?.locationData?.country,
+                                });
+                                 goTo(`/app/incidents${queryString}`);
+                             } else {
+                                goTo("/app/incidents");
+                             }
+                        },
+                        items: [
+                            {
+                                label: t("Number of incidents"),
+                                value: item?.value,
+                            },
+                        ],
+                    });
+                }}
             />
+            		
         </Widget>
     );
 }

package/src/@daf/pages/Dashboards/ConflictManagement/index.js

@@ -2,8 +2,6 @@ import React, { useMemo, useEffect } from "react";
 import KeyIndicators from "./components/KeyIndicators/index.js";
 import MineSites from "./components/MineSite/index.js";
 import RisksWidget from "./components/RisksWidget/index.js";
-import { useSources } from "../../../hooks/useSources.js";
-import { renderBreadCrumbs } from "../../../../helpers/breadCrumbs.js";
 import CustomIcon from "../../../core/components/Icon/CustomIcon.jsx";
 import { Header, Multiselect } from "../../../../index.js";
 import DashboardLayout from '../../../core/components/Dashboard/DashboardLayout/index.jsx';
@@ -16,24 +14,26 @@ export default function ConflictManagement({
     getRedirectLink = (s) => s, 
     theme = {},
     options = {},
-	breadcrumbs = [],
-
+    breadcrumbs = [],
+	partners, 
+	selectedPartners,
+	setSelectedPartners, 
+	informationSources
 }) {
-	const { partners, selectedPartners, setSelectedPartners, informationSources } =
-		useSources({ user, t });
-
 	// const { pushPath } = useHistory();
 
 	// useEffect(() => {
 	// 	pushPath(`/app/conflict-management`);
 	// }, []);
 
-	const breadCrumbs = useMemo(() => {
-		return renderBreadCrumbs({ t, view: "conflict-management", mod: APP, goTo });
-	}, [t, APP, goTo]);
+	console.log(partners, "partners");
+
+	// const breadCrumbs = useMemo(() => {
+	// 	return renderBreadCrumbs({ t, view: "conflict-management", mod: APP, goTo });
+	// }, [t, APP, goTo]);
 
 	const sourceOptions = useMemo(() => {
-		return partners.map((partner) => {
+		return partners?.map((partner) => {
 			const isOwnData = partner.id === user?.company?.id;
 
 			return {
@@ -53,7 +53,7 @@ export default function ConflictManagement({
 		header={
 		<Header
 				title={t("conflict-management")}
-				breadcrumbs={breadCrumbs}
+				breadcrumbs={breadcrumbs}
 				supportText={
 					<>
 						{t("Supported by")}{" "}
@@ -69,7 +69,7 @@ export default function ConflictManagement({
 				addedHeader={
 					<div>
 						<Multiselect
-							options={[...sourceOptions]}
+							options={[...(Array.isArray(sourceOptions) ? sourceOptions : [])]}
 							isAvatarGroup
 							canUnselectLast={false}
 							key={partners?.length}
@@ -82,7 +82,7 @@ export default function ConflictManagement({
 							}}
 							dropDownWidth={200}
 							selectionType="checkbox"
-							defaultSelected={partners.map((p) => p.id) || []}
+							defaultSelected={partners?.map((p) => p.id) || []}
 						/>
 					</div>
 				}

package/src/@daf/pages/Dashboards/SupplyChain/components/ChartsContainer/components/GenderDistribution/index.js

@@ -39,56 +39,6 @@ function GenderDistribution({
 
     const isEmpty = useMemo(() => Object.keys(data).filter((k) => !!data[k]).length === 0, [data]);
 
-	const getTooltipChildren = useCallback(
-		(item) => {
-			if (isTradeActions) {
-				if (isEmpty) {
-					return;
-				}
-
-				return renderTooltipJsx({
-					title: t("Role"),
-					items: [
-						{
-							label:
-								(options?.optionPositionSupplyChain || options?.positionSupplyChainOptions || [])?.find((o) => {
-									return o.value === item.key;
-								}).label || item.key,
-							value: data[item.key] || 0,
-						},
-					],
-				});
-			} else {
-				if (isEmpty) {
-					return renderTooltipJsx({
-						title: t("Gender"),
-						items: config.map((conf) => ({
-							label: t(conf.label),
-							value: 0,
-						})),
-					});
-				}
-
-				const _config = config?.find((c) => c.key === item.key);
-
-				if (_config) {
-					return renderTooltipJsx({
-						title: t("Gender"),
-						items: [
-							{
-								label: t(_config.label),
-								value: `${Math.round(item.percent * 100)}%`,
-							},
-						],
-					});
-				}
-
-				return null;
-			}
-		},
-		[t, data, isTradeActions],
-	);
-
     return (
         <Widget
             loading={loading}
@@ -110,7 +60,52 @@ function GenderDistribution({
                     isPie
                     t={t}
                     isEmpty={isEmpty}
-                    getTooltipChildren={getTooltipChildren}
+                    getTooltipChildren={		(item) => {
+						if (isTradeActions) {
+							if (isEmpty) {
+								return;
+							}
+			
+							return renderTooltipJsx({
+								title: t("Role"),
+								items: [
+									{
+										label:
+											(options?.optionPositionSupplyChain || options?.positionSupplyChainOptions || [])?.find((o) => {
+												return o.value === item.key;
+											}).label || item.key,
+										value: data[item.key] || 0,
+									},
+								],
+							});
+						} else {
+							if (isEmpty) {
+								return renderTooltipJsx({
+									title: t("Gender"),
+									items: config.map((conf) => ({
+										label: t(conf.label),
+										value: 0,
+									})),
+								});
+							}
+			
+							const _config = config?.find((c) => c.key === item.key);
+			
+							if (_config) {
+								return renderTooltipJsx({
+									title: t("Gender"),
+									items: [
+										{
+											label: t(_config.label),
+											value: `${Math.round(item.percent * 100)}%`,
+										},
+									],
+								});
+							}
+			
+							return null;
+						}
+					}}
                 />
             </div>
         </Widget>

package/src/@daf/pages/Dashboards/SupplyChain/components/ChartsContainer/components/Identification/hook.js

@@ -53,27 +53,27 @@ export function useIdentification({ data, theme = {}, options = {} }) {
 			yFieldKey: "value",
 			seriesField: "typeOfProduct",
 			color: allSeenProducts.map((_, index) => colors[index % colors.length]),
-			renderTooltipContent: (title, items) => {
-				if (Array.isArray(items) && items[0]) {
-					const title = items[0].title;
-					const values = graphData.filter((d) => d.date === title);
-					return {
-						title: "Products",
-						items: values.map((val) => {
-							return{
-								label: findOptions(val.typeOfProduct, options?.mineralOptions) || val.typeOfProduct,
-								color: colors[
-									allSeenProducts.indexOf(val.typeOfProduct) % colors.length
-								],
-								value: val.value.toLocaleString(),
-							}
-						}),
-					};
-				}
-				return { title: "", items: [] };
-			},
+			// renderTooltipContent: (title, items) => {
+			// 	if (Array.isArray(items) && items[0]) {
+			// 		const title = items[0].title;
+			// 		const values = graphData.filter((d) => d.date === title);
+			// 		return {
+			// 			title: "Products",
+			// 			items: values.map((val) => {
+			// 				return{
+			// 					label: findOptions(val.typeOfProduct, options?.mineralOptions) || val.typeOfProduct,
+			// 					color: colors[
+			// 						allSeenProducts.indexOf(val.typeOfProduct) % colors.length
+			// 					],
+			// 					value: val.value.toLocaleString(),
+			// 				}
+			// 			}),
+			// 		};
+			// 	}
+			// 	return { title: "", items: [] };
+			// },
 		};
 	}, [graphData, allSeenProducts, options.minerals]);
 
-	return chartConfig;
+	return { chartConfig, colors, allSeenProducts, graphData};
 }

package/src/@daf/pages/Dashboards/SupplyChain/components/ChartsContainer/components/Identification/index.js

@@ -4,6 +4,7 @@ import LineChart from '../../../../../../../core/components/Charts/LineChart/ind
 import { Select } from 'antd';
 import { useIdentification } from './hook';
 import PropTypes from 'prop-types';
+import { findOptions } from '../../../../../../../../helpers/StringHelper.js';
 
 function Identification({
     selectedSources = {}, 
@@ -25,7 +26,7 @@ function Identification({
 		[t],
 	);
 
-    const chartConfig = useIdentification({ data, theme, options });
+    const { chartConfig, colors, allSeenProducts, graphData } = useIdentification({ data, theme, options });
 
     return (
 		<Widget
@@ -45,7 +46,30 @@ function Identification({
 				</>
 			}
 		>
-			<LineChart {...chartConfig} height="400px" t={t} />
+			<LineChart 
+				{...chartConfig} 
+				height="400px" 
+				t={t} 			
+				renderTooltipContent={(title, items) => {
+					if (Array.isArray(items) && items[0]) {
+						const title = items[0].title;
+						const values = graphData.filter((d) => d.date === title);
+						return {
+							title: "Products",
+							items: values.map((val) => {
+								return{
+									label: findOptions(val.typeOfProduct, options?.mineralOptions) || val.typeOfProduct,
+									color: colors[
+										allSeenProducts.indexOf(val.typeOfProduct) % colors.length
+									],
+									value: val.value.toLocaleString(),
+								}
+							}),
+						};
+					}
+					return { title: "", items: [] };
+				}} 
+			/>
 		</Widget>
     )
 }

package/src/@daf/pages/Dashboards/SupplyChain/index.jsx

@@ -5,7 +5,6 @@ import Header from '../../../core/components/Header/index.jsx';
 import Multiselect from '../../../core/components/Select/MultiSelect/index.jsx';
 import KeyIndicators from './components/KeyIndicators';
 import SupplyChainMap from './components/SupplyChainMap';
-import TradeRelationships from './components/TradeRelationships';
 import ChartsContainer from './components/ChartsContainer';
 
 function SupplyChain({

package/src/@daf/pages/Dashboards/UserDashboard/components/DataChainOfCustody/index.jsx

@@ -18,13 +18,14 @@ function DataChainOfCustody({
 	goTo = () => {},
 	options = {},
 	hardcodedData = [],
+	APP
 }) {
 	const fetchConfig = useMemo(() => ({
 		...defaultFetchConfig,}),[],
 	);
 	const { data, loading } = useWidgetFetch({config: fetchConfig});
 
-	const mappedData = mapDataForChainOfCustody(Object.keys(data)?.length > 0 ? data : hardcodedData, options, goTo);
+	const mappedData = mapDataForChainOfCustody(Object.keys(data)?.length > 0 ? data : hardcodedData, options, goTo, APP);
 
 	return (
 		<Widget

package/src/@daf/pages/Dashboards/UserDashboard/index.jsx

@@ -104,6 +104,7 @@ function UserDashboard({
                     goTo={goTo} 
                     options={options} 
                     hardcodedData={hardcodedData} 
+                    APP={APP}
                 />
             </section>
         </DashboardLayout>

package/src/@daf/pages/Dashboards/helper.js

@@ -9,24 +9,29 @@ const kycIcon = <CustomIcon name="KYC" color="#6C737F" width={18} height={18} />
 const buildingIcon = <CustomIcon name="Building" color="#6C737F" width={18} height={18} />;
 const individualIcon = <CustomIcon name="UserCircle" color="#6C737F" width={18} height={18} />;
 const csIcon = <CustomIcon name="CivilSociety" color="#6C737F" width={18} height={18} />;
-const leftIcon = (
-	<CustomIcon
-		name="WaziDarkIcon"
-		color={theme.colorPrimary8}
-		width={16}
-		height={16}
-	/>
-);
-const middleIcon = (
-	<CustomIcon
-		name="WaziDarkIcon"
-		color={theme.colorPrimary2}
-		width={16}
-		height={16}
-	/>
-);
 
-const rightIcon = <CustomIcon name="WaziDarkIcon" color="white" width={16} height={16} />;
+const directionIcons = {
+	nashiriki: {
+		left: "NashirikiSmallLogo",
+		right: "NashirikiSmallLogo",
+		middle: "NashirikiSmallLogo",
+	},
+	wazi: {
+		left: "WaziDarkIcon",
+		right: "WaziDarkIcon",
+		middle: "WaziDarkIcon",
+	},
+}
+
+const directionColors = {
+	left: theme.colorPrimary8,
+	right: "white",
+	middle: theme.colorPrimary2,
+}
+
+const getDirectionIcon = (APP, direction) => {
+	return <CustomIcon name={directionIcons[APP][direction]} color={directionColors[direction]} width={16} height={16} />;
+}
 
 const mapIcon = (category) => {
 	switch (category) {
@@ -45,7 +50,7 @@ const mapIcon = (category) => {
 const leftBackground = theme.colorPrimary3;
 const rightBackground = theme.colorPrimary6;
 
-export const mapDataForChainOfCustody = (data = {}, options = {}, goTo = () => {}) => {
+export const mapDataForChainOfCustody = (data = {}, options = {}, goTo = () => {}, APP) => {
 	const mapChildren = (items, type, parentId, isDirect = true) => {
 		return (items ?? []).map((item) => {
 			return {
@@ -54,7 +59,7 @@ export const mapDataForChainOfCustody = (data = {}, options = {}, goTo = () => {
 			name: item.name,
 			sources: parentId ? [parentId] : [],
 			subTitle: findOptions(item?.category, options?.categoriesOptions || options?.category || []),
-			leftIcon: type === "client" ? rightIcon : leftIcon,
+			leftIcon:  getDirectionIcon(APP, type === "client" ? "right" : "left"),
 			leftBackground: type === "client" ? rightBackground : leftBackground,
 			topIcon: mapIcon(item.category),
 			children: mapChildren(item.sources ?? item.clients ?? [], type, item.id, false),
@@ -71,7 +76,7 @@ export const mapDataForChainOfCustody = (data = {}, options = {}, goTo = () => {
 		number: 0,
 		name: data.name,
 		subTitle: findOptions(data?.category, options?.categoriesOptions || options?.category || []),
-		leftIcon: middleIcon,
+		leftIcon: getDirectionIcon(APP, "middle"),
 		leftBackground: theme.colorPrimary10,
 		topIcon: mapIcon(data.category),
 		left: mapChildren(data.sources, "source", data.id),

package/src/@daf/pages/Edit/index.jsx

@@ -33,6 +33,7 @@ const Edit = ({
     params,
     clear,
     getRedirectLink,
+	selectedPartners,
     pathname,
     search,
     viewConfig,
@@ -153,6 +154,7 @@ const Edit = ({
 				view: namespaceConfig?.view,
 				...(namespaceConfig?.scope && { scope: namespaceConfig.scope }),
 				datastakeId: id ? id : 'user',
+				sources: selectedPartners?.partners,
 			})
 		}
 	}
@@ -169,6 +171,7 @@ const Edit = ({
 		user,
 		setLoading,
 		APP,
+		selectedPartners,
 	})
 
     const callback = (type, m) => {

package/src/@daf/pages/Partners/columns.js

@@ -17,6 +17,7 @@ export const getColumns = ({
 	activeTab,
 	setOpen,
 	block,
+	options,
 }) => [
 	{
 		title: t("ID"),
@@ -27,7 +28,6 @@ export const getColumns = ({
 			if (all.empty) {
 				return <div className="daf-default-cell" />;
 			}
-			// THE FALLBACK WAS DEPENDS BEFORE
 			return v || "-";
 		},
 	},
@@ -116,7 +116,7 @@ export const getColumns = ({
 			if (all.empty) {
 				return <div className="daf-default-cell" />;
 			}
-			return v ? findOptions(v, selectOptions?.category || []) : "-";
+			return v ? findOptions(v, options?.categoriesOptions || []) : "-";
 		},
 	},
 	{

package/src/@daf/pages/Partners/config.js

@@ -15,6 +15,28 @@ export const selectFiltersConfig = {
 	},
 };
 
+export const getSelectFiltersConfig = ({t}) => {
+	return {
+		category: {
+			type: "select",
+			label: "Category",
+			placeholder: (t) => `${t("Filter by")} ${t("Category").toLowerCase()}`,
+			style: { flex: 1 },
+			labelStyle: { flex: 1 },
+			getLabel: (option) => option.label,
+			getValue: (option) => option.value,
+		},
+	}
+}
+
+export const getFilterOptions = (options, t) => {
+	const { countries, category, categoriesOptions } = options || {};
+	return {
+		country: countries || [],
+		category: categoriesOptions || category || [],
+	}
+}
+
 export const checkboxConfig = {
 	name: "Name",
 	datastakeId: "ID",

package/src/@daf/pages/Partners/hook.js

@@ -3,8 +3,6 @@ import PartnerService from "../../services/PartnerService.js";
 import { message } from "antd";
 
 export const usePartnersActions = ({
-    activeTab,
-    filters,
     setTotalRequests,
     t = () => {},
 }) => {
@@ -13,14 +11,14 @@ export const usePartnersActions = ({
     const [requestDataFetch, setRequestDataFetch] = useState(false);
     const [initFetchDone, setInitFetchDone] = useState(false);
 
-	const fetchData = useCallback(async () => {
+	const fetchData = useCallback(async (params) => {
 		setLoading(true);
 		setData([]);
 	
 		try {
-			const { data } = await PartnerService.get(activeTab, {
-				...filters,
-				type: activeTab,
+			const { data } = await PartnerService.get({
+				...params,
+				type: params?.tab,
 			});
 			setData(data);
 			setTotalRequests(data?.meta?.total || 0);
@@ -33,7 +31,7 @@ export const usePartnersActions = ({
 		if (!initFetchDone) {
 			setInitFetchDone(true);
 		}
-	}, [activeTab, filters, initFetchDone, setLoading, setTotalRequests, setData, setInitFetchDone]);
+	}, [initFetchDone, setLoading, setTotalRequests, setData, setInitFetchDone]);
 
 	const accept = useCallback(
 		async (id) => {
@@ -106,14 +104,13 @@ export const usePartnersActions = ({
 
 			try {
 				await PartnerService.resendInvite(id);
-				await fetchData();
 			} catch (err) {
 				console.log(err);
 			}
 
 			setLoading(false);
 		},
-		[fetchData, setLoading],
+		[setLoading],
 	);
 
 	const block = useCallback(
@@ -122,14 +119,13 @@ export const usePartnersActions = ({
 
 			try {
 				await PartnerService.block(id);
-				await fetchData();
 			} catch (err) {
 				console.log(err);
 			}
 
 			setLoading(false);
 		},
-		[fetchData, setLoading],
+		[setLoading],
 	);
 
     return {