datastake-daf 0.6.830 → 0.6.832

package/src/@daf/core/components/Screens/ConflictManagement/components/RisksWidget/components/TerritorialDistribution/index.js

@@ -0,0 +1,107 @@
+import React, { useMemo, useCallback } from 'react'
+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 { getColors } from './config.js';
+import useTerritorialDistribution from './config.js';
+
+function TerritorialDistribution({ selectedPartners = {}, loading: parentLoading = false, t = (s) => s, theme = {}, category = "conflict", selectedRange ,goTo = () => {}, getRedirectLink = () => {}}) {
+    const { filters, filtersConfig } = useTerritorialDistribution({ t });
+    const colors = getColors(theme);
+
+    const defaultFetchConfig = useMemo(
+        () => ({
+            url: "/territorial-distribution",
+            filters: {
+                ...filters,
+                category,
+                period: selectedRange,
+                sources: selectedPartners?.partners || [],
+            },
+            defaultData: [],
+            stop: selectedPartners?.loading,
+        }),
+        [filters, category, selectedRange, selectedPartners],
+    );
+
+    const { data, loading } = useWidgetFetch({ config: defaultFetchConfig });
+
+    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 = items[0]; 
+        
+        return renderTooltipJsx({
+            title: item?.label || t("Undetermined"),
+            link: true,
+            onClickLink: () => {
+                 if (item?.label) {
+                     goTo(
+                         `/app/incident?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"
+            filtersConfig={filtersConfig}
+        >
+            <Chart
+                mouseXOffset={10}
+                mouseYOffset={10}
+                changeOpacityOnHover={false}
+                data={pieData}
+                doConstraints={false}
+                isPie
+                t={t}
+                isEmpty={isEmpty}
+                getTooltipChildren={getTooltipChildren}
+            />
+        </Widget>
+    );
+}
+
+TerritorialDistribution.propTypes = {
+    selectedPartners: PropTypes.object,
+    loading: PropTypes.bool,
+    t: PropTypes.func,
+    theme: PropTypes.object,
+    category: PropTypes.string,
+    selectedRange: PropTypes.string,
+}
+
+export default TerritorialDistribution;

package/src/@daf/core/components/Screens/ConflictManagement/components/RisksWidget/config.js

@@ -0,0 +1,5 @@
+export const filterOptions = [
+  { label: '12 months', value: '12' },
+  { label: '3 months', value: '3' },
+];
+

package/src/@daf/core/components/Screens/ConflictManagement/components/RisksWidget/index.js

@@ -0,0 +1,77 @@
+import { Select } from "antd";
+import { useState } from "react";
+import Widget from "../../../../Dashboard/Widget/index.jsx";
+import IncidentsTime from "./components/IncidentsTime/index.js";
+import TerritorialDistribution from "./components/TerritorialDistribution/index.js";
+import ProblemSolver from "./components/ProblemSolver/index.js";
+import { filterOptions } from "./config.js";
+
+export default function RisksWidget({ 
+    title = "Analytics",
+    selectedPartners = {},
+    t = (s) => s,
+    goTo = () => {},
+    getRedirectLink = (s) => s, 
+    theme = {}, 
+    APP, 
+    options = {},
+    category = "conflict",
+    user = {},
+}) {
+    const [range, setRange] = useState(filterOptions[0].value);
+
+    return (
+        <Widget
+            title={t(title)}
+            className="with-border-header month-select-header"
+            addedHeader={
+                <>
+                    <div className="flex-1" />
+                    <div>
+                        <Select
+                            value={range}
+                            className="custom-select white month-select"
+                            onChange={(val) => setRange(val)}
+                        >
+                            {filterOptions.map((o) => (
+                                <Select.Option value={o.value} key={o.value}>
+                                    {t(o.label)}
+                                </Select.Option>
+                            ))}
+                        </Select>
+                    </div>
+                </>
+            }
+        >
+            <div className="flex flex-row flex-col-mobile gap-6">
+                <IncidentsTime
+                    selectedRange={range} 
+                    selectedPartners={selectedPartners}
+                    t={t}
+                    theme={theme}
+                    goTo={goTo}
+                    getRedirectLink={getRedirectLink}
+                    options={options}
+                    user={user}
+                />
+                <TerritorialDistribution
+                    category={category}
+                    selectedRange={range}
+                    selectedPartners={selectedPartners}
+                    t={t}
+                    theme={theme}
+                    goTo={goTo}
+                    getRedirectLink={getRedirectLink}
+                />
+                <ProblemSolver 
+                    selectedRange={range} 
+                    selectedPartners={selectedPartners} 
+                    t={t}
+                    theme={theme}
+                    goTo={goTo}
+                    getRedirectLink={getRedirectLink}
+                />
+            </div>
+        </Widget>
+    );
+}

package/src/@daf/core/components/Screens/ConflictManagement/index.js

@@ -0,0 +1,136 @@
+import React, { useMemo, useEffect } from "react";
+import Header from "../../Header/index.jsx";
+import KeyIndicators from "./components/KeyIndicators/index.js";
+import Multiselect from "../../Select/MultiSelect/index.jsx";
+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 "../../Icon/CustomIcon.jsx";
+
+export default function ConflictManagement({ 
+    t=()=>{}, 
+    user = {}, 
+    APP, 
+    goTo = () => {}, 
+    getRedirectLink = (s) => s, 
+    theme = {},
+    options = {}
+}) {
+	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]);
+
+	const sourceOptions = useMemo(() => {
+		return partners.map((partner) => {
+			const isOwnData = partner.id === user?.company?.id;
+
+			return {
+				label: partner.nickName,
+				value: partner.id,
+				avatar: isOwnData ? <span>OWN</span> : <CustomIcon name={"Search02"} width={14} height={14} />,
+				background: isOwnData ? theme.colorPrimary7 : undefined,
+				color: isOwnData ? "white" : undefined,
+			};
+		});
+	}, [partners, user, theme]);
+
+	return (
+		<div className="daf-analysis">
+			<Header
+				title={t("conflict-management")}
+				breadcrumbs={breadCrumbs}
+				supportText={
+					<>
+						{t("Supported by")}{" "}
+						<a
+							href="https://www.eeas.europa.eu/delegations/dr-congo-kinshasa_en?s=94"
+							target="_blank"
+							rel="noreferrer"
+						>
+							{t("European Union")}
+						</a>
+					</>
+				}
+				addedHeader={
+					<div>
+						<div className="flex-1" />
+						<Multiselect
+							options={[...sourceOptions]}
+							isAvatarGroup
+							canUnselectLast={false}
+							key={partners?.length}
+							onChange={(selected) => {
+								setSelectedPartners((prev) => ({
+									...prev,
+									partners: selected,
+									loading: false,
+								}));
+							}}
+							dropDownWidth={200}
+							selectionType="checkbox"
+							defaultSelected={partners.map((p) => p.id) || []}
+						/>
+					</div>
+				}
+			/>
+
+			<div className="content">
+				<div className="view-content">
+					<div className="daf-analysis-layout">
+						<div className="sections-cont w-pt">
+							<section>
+								<KeyIndicators
+									selectedPartners={selectedPartners}
+									partners={
+										informationSources > 0
+											? informationSources
+											: selectedPartners?.partners?.length > 0
+											? selectedPartners?.partners?.length
+											: 0
+									}
+                                    t={t}
+                                    goTo={goTo}
+                                    getRedirectLink={getRedirectLink}
+                                    theme={theme}
+								/>
+							</section>
+							<section>
+								<MineSites 
+                                    selectedPartners={selectedPartners} 
+                                    t={t}
+                                    goTo={goTo}
+                                    getRedirectLink={getRedirectLink}
+                                    theme={theme}
+                                    APP={APP}
+                                    options={options}
+                                />
+							</section>
+							<section>
+								<RisksWidget
+									selectedPartners={selectedPartners}
+                                    t={t}
+                                    goTo={goTo}
+                                    getRedirectLink={getRedirectLink}
+                                    theme={theme}
+                                    APP={APP}
+                                    options={options}
+								/>
+							</section>
+						</div>
+					</div>
+				</div>
+			</div>
+		</div>
+	);
+}
+

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

@@ -1,5 +1,7 @@
 import { useState, useEffect } from "react";
 import DashboardService from "../services/DashboardService.js";
+import { isErrorResponse, getErrorMessage } from "../../helpers/errorHandling.js";
+import { message } from "antd";
 
 // config: {
 //     stop: boolean,
@@ -25,6 +27,11 @@ export const useWidgetFetch = ({config, getData = DashboardService.getWidget, on
 		try {
 			const { data } = await getData(rest);
 			setData(data || defaultData);
+			if (isErrorResponse(data)) {
+				const errorMessage = getErrorMessage(data);
+				message.error(errorMessage);
+				return;
+			}
             onFetch()
 		} catch (err) {
 			console.log(err);

package/src/@daf/layouts/AppLayout/components/MobileDrawer/index.js

@@ -109,7 +109,7 @@ export default function MobileDrawer({
         { 
           type: 'link', 
           name: t('Settings'), 
-          path: `/app/${mod}/view/settings`, 
+          path: `/app/view/settings`, 
           isDashboard: true, 
           visible: canViewSettings 
         },

package/src/@daf/pages/Events/Testimonials/columns.js

@@ -50,7 +50,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
                 return <div className="daf-default-cell" />;
             }
 
-            const type = findOptions(title, data?.options?.testimonialsType);
+            const type = findOptions(title, options?.testimonialsType);
 
             return type ? <Tooltip title={type}>{type}</Tooltip> : '-';
         },

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

@@ -51,9 +51,8 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
         return <div className="daf-default-cell" />
       }
 
-      const type = findOptions(v, data?.options?.eventsType);
-
-      return type ? <Tooltip title={type}>{type}</Tooltip> : '-';
+      const type = findOptions(v, options?.eventType || options?.eventsType);
+      return <Tooltip title={type}>{type}</Tooltip>;
     },
   },
   {

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

@@ -43,7 +43,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
             return <div className="daf-default-cell" />
           }
 
-          const locationCategories = [...(data?.options?.locationCategories || []), ...(options?.productionSiteCategories || [])]
+          const locationCategories = [...(options?.locationCategories || []), ...(options?.productionSiteCategories || [])]
 
           const category = findOptions(v, locationCategories);
     

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

@@ -1,6 +1,8 @@
 import { useState, useMemo, useCallback, useEffect } from "react"
 import { debounce } from "lodash";
 import { StorageManager } from "../../../helpers/StorageManager.js";
+import { isErrorResponse, getErrorMessage } from "../../../helpers/errorHandling.js";
+import { message } from "antd";
 
 export const useSummary = ({
     getOne, 
@@ -131,32 +133,63 @@ export const useSummary = ({
 	  }, [debouncedSearch]);
 
       useEffect(() => {
-		if (_partners !== undefined) {
-			if ((params?.id !== null || (isPdf && id !== null)) && !hasSelect) {
-				getOne({ datastakeId: params?.id || id, sources: _partners });
-			}
-		}
+		// if (_partners !== undefined) {
+		// 	if ((params?.id !== null || (isPdf && id !== null)) && !hasSelect) {
+		// 		getOne({ datastakeId: params?.id || id, sources: _partners });
+		// 	}
+		// }
 		if (hasSelect && !params?.id) {
 			getMultiple(filters);
 		}
-	}, [params?.id, hasSelect, getOne, getMultiple, _partners, isPdf, id, filters]);
+	}, [hasSelect, params?.id, filters]);
 
-    	useEffect(() => {
-		if ((selectedItem || params?.id) && _partners !== undefined) {
-			const fetchSingleItem = async () => {
-				setLoading(true);
-				try {
-					const { data } = await service.getOne(selectedItem || params?.id, { sources: _partners });
-					setSingleItemData(data);
-				} catch (error) {
+	const activeId = useMemo(() => {
+		return selectedItem || params?.id;
+	}, [selectedItem, params?.id]);
+
+	const memoizedPartners = useMemo(() => {
+		return _partners;
+	}, [_partners]);
+
+	const memoizedService = useMemo(() => {
+		return service;
+	}, [service]);
+
+	useEffect(() => {
+		if (!activeId || memoizedPartners === undefined) return;
+		
+		let cancelled = false;
+		
+		const fetchSingleItem = async () => {
+			setLoading(true);
+			try {
+				const { data } = await memoizedService.getOne(activeId, { sources: memoizedPartners });
+				
+				if (cancelled) return;
+				
+				setSingleItemData(data);
+				if (isErrorResponse(data)) {
+					const errorMessage = getErrorMessage(data);
+					message.error(errorMessage);
+					return;
+				}
+			} catch (error) {
+				if (!cancelled) {
 					console.log(error);
-				} finally {
+				}
+			} finally {
+				if (!cancelled) {
 					setLoading(false);
 				}
-			};
-			fetchSingleItem();
-		}
-	}, [selectedItem, service, _partners, params?.id]);
+			}
+		};
+		
+		fetchSingleItem();
+		
+		return () => {
+			cancelled = true;
+		};
+	}, [activeId, memoizedPartners, memoizedService]);
 
     useEffect(() => {
 		_setPartners(selectedPartners?.partners);

package/src/@daf/services/DashboardService.js

@@ -24,6 +24,15 @@ class DashboardService extends BaseService {
         isUserManager: true,
       });
     }
+
+    // getWidgetConflictManagement({ url, params = {}, filters = {} }) {
+    //   return this.apiGet({
+    //     url: `/dashboard/conflict-management${url}`,
+    //     params: { ...params, ...filters },
+    //     isApp: true,
+    //   });
+    // }
+    
 }
 
 export default createLazyService(DashboardService);

package/src/@daf/services/MineSiteService.js

@@ -0,0 +1,104 @@
+import { BaseService } from "./BaseService.js";
+import { createLazyService } from "./helpers/LazyService.js";
+import { filterCreateData } from "../../helpers/Forms.js";
+
+class MineSiteService extends BaseService {
+	get(params) {
+		const { datastakeId, ...rest } = params;
+		if(datastakeId) {
+			return this.apiGet({
+				url: `/location/${datastakeId}`,
+				params: {...rest},
+				isApp: true,
+			});
+		}
+		return this.apiGet({
+			url: "/location",
+			params: {...rest},
+			isApp: true,
+		});
+	}
+
+	getOne(id, params) {
+		return this.apiGet({
+			url: `/location/${id}`,
+			params,
+			isApp: true,
+		});
+	}
+
+	getForm(scope = "create", language = "en") {
+		return this.apiGet({
+			url: `/forms/location`,
+			params: { scope, language },
+			isApp: true,
+		});
+	}
+
+	getAll(params, signal) {
+		return this.apiGet({
+			url: "/location",
+			params,
+			signal,
+			isApp: true,
+		});
+	}
+
+	getData(id, sourceId, source, version) {
+		return this.apiGet({
+			url: `/location/${id}`,
+			isApp: true,
+			params: { authorId: sourceId,  source, version },
+		});
+	}
+
+	submit(payload) {
+		if (payload.id) {
+			// eslint-disable-next-line no-unused-vars
+			const { namespace, ...data } = payload;
+			return this.apiPut({
+				url: `/location/${payload.id}`,
+				data: filterCreateData(data),
+				isApp: true,
+			});
+		}
+		if (payload?.form) {
+			delete payload.form;
+			return this.apiPost({
+				url: "/location",
+				data: filterCreateData(payload),
+				isApp: true,
+			});
+		}
+		return this.apiPost({
+			url: "/location",
+			data: filterCreateData(payload),
+			isApp: true,
+		});
+	}
+
+	submitStep(data, id) {
+		return this.apiPut({
+			isApp: true,
+			url: `/location/submit/${id}`,
+			data: filterCreateData(data),
+		});
+	}
+
+	remove(id, data) {
+		return this.apiDelete({
+			url: `/location/${id}/remove`,
+			data: data,
+			isApp: true,
+		});
+	}
+
+	getOptions(id = "countries,minerals") {
+		return this.apiGet({
+			isApp: true,
+			url: `/forms/options`,
+			params: { id },
+		});
+	}
+}
+export default createLazyService(MineSiteService);

package/src/constants/locales/en/translation.js

@@ -1,4 +1,5 @@
 const en = {
+  "conflict-management": "Conflict Management",
   "review-requests": "Review Requests",
   "create-account": "Create Account",
   "manage-users": "Manage Users",

package/src/helpers/user.js

@@ -146,7 +146,7 @@ export const userHasInterface = (user, app, intf) => {
 };
 
 export const userIsAdmin = (user) => {
-  return user?.role?.id === 'APP_ADMIN';
+  return user?.role?.id === 'APP_ADMIN' || user?.role?.id === 'SUPER_ADMIN';
 }
 
 export const createModule = (selectedModule, role = "user") => {
@@ -193,3 +193,18 @@ export function getRedirectPath(user, fallback = '', app, isDatastake) {
 
   return isDatastake ? `/${app}/app` : '/app';
 }
+
+
+export function mapUser(user) {
+  return {
+    ...user,
+    company: user.company,
+    verified: user.emailVerified,
+    companyId: user?.company?.id,
+    modules: Array.isArray(user.company?.modules) ?
+      user.company?.modules.reduce((all, item) => {
+        all[item.id] = item;
+        return all;
+      }, {}) : user.company?.modules || {},
+  };
+}

package/src/pages.js

@@ -20,4 +20,7 @@ export { default as UsersTable } from './@daf/core/components/Screens/Users/inde
 export { default as View } from './@daf/pages/View/index.jsx';
 
 // Edit
-export { default as Edit } from './@daf/pages/Edit/index.jsx';
+export { default as Edit } from './@daf/pages/Edit/index.jsx';
+
+// Conflict Management
+export { default as ConflictManagement } from './@daf/core/components/Screens/ConflictManagement/index.js';

package/src/services.js

@@ -20,4 +20,5 @@ export { default as LinkedSubjectsService } from './@daf/services/LinkedSubjects
 export { default as OperatorService } from './@daf/services/OperatorService.js';
 export { default as PartnerService } from './@daf/services/PartnerService.js';
 export { default as EventsService } from './@daf/services/EventsService.js';
-export { default as WorkersService } from './@daf/services/WorkersService.js';
+export { default as WorkersService } from './@daf/services/WorkersService.js';
+export { default as MineSiteService } from './@daf/services/MineSiteService.js';

package/src/utils.js

@@ -21,7 +21,7 @@ export { getOptionConfig, getOptionLabel } from './@daf/core/components/DynamicV
 
 export { defaultMapConfig } from './@daf/hooks/useMapHelper.js';
 
-export { getInterface, modules, isSuperAdmin, isModuleApproved, userHasInterface, userIsAdmin, createModule, mapModulesFromApps, getRedirectPath } from './helpers/user.js'
+export { getInterface, modules, isSuperAdmin, isModuleApproved, userHasInterface, userIsAdmin, createModule, mapModulesFromApps, getRedirectPath, mapUser } from './helpers/user.js'
 
 export { default as locales } from './constants/locales/index.js';