datastake-daf 0.6.831 → 0.6.833

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/core/components/UI/SingleTruncatedLine/index.jsx

@@ -0,0 +1,25 @@
+import React from 'react'
+import { Tooltip } from 'antd';
+
+const SingleTruncatedLine = ({data = []}) => {
+    const displayText = data?.join(", ");
+    const tooltipText = data?.join("\n");
+    
+    return (
+        <Tooltip title={<div style={{ whiteSpace: "pre-line" }}>{tooltipText}</div>}>
+            <div
+                style={{
+                    fontWeight: "normal",
+                    overflow: "hidden",
+                    textOverflow: "ellipsis",
+                    whiteSpace: "nowrap",
+                    maxWidth: "100%"
+                }}
+            >
+                {displayText}
+            </div>
+        </Tooltip>
+    );
+}
+
+export default SingleTruncatedLine

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

@@ -137,6 +137,12 @@ const Edit = ({
         namespaceOverrides,
 	});
 
+	useEffect(() => {
+		if (data?.id && !canEdit) {
+			goTo(getViewLink());
+		}
+	}, [canEdit, goTo, getViewLink, namespace, data?.id]);
+
     const action = useMemo(() => actionMap?.[namespaceConfig?.action], [namespaceConfig?.action, actionMap]);
 
     const namespaceGet = {
@@ -237,7 +243,7 @@ const Edit = ({
 		{
 			tooltip: t("Save"),
 			onClick: () => onSubmitData(true),
-			disabled: !isChanged,
+			disabled: !isChanged || !canEdit,
 			type: "primary",
 			icon: "Save",
 		},

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

@@ -109,7 +109,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
           if (all.empty) {
             return <div className="daf-default-cell" />
           }
-
+          
           const eventCategory = findOptions(v, data?.options?.eventCategoryOptions || data?.options?.categoryOptions);
           const categoryValue = getEventCategoryBySubject(eventCategory, "correctiveActions", true);
           

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/Minesite/components/MineSiteDetails/config.js

@@ -1,6 +1,7 @@
 import React from "react";
 import { Tag, Tooltip } from "antd";
 import { getTagColor } from "../../../../../utils/productTag.js";
+import SingleTruncatedLine from "../../../../../core/components/UI/SingleTruncatedLine/index.jsx";
 
 export function getKeyIndicatorsConfig({ t, data }) {
 	return [
@@ -11,20 +12,8 @@ export function getKeyIndicatorsConfig({ t, data }) {
 				if (validExtractionPoints?.length === 0 || !validExtractionPoints) {
 					return "-";
 				}
-				return (
-					<div>
-						{validExtractionPoints?.map((method, index) => {
-							return (
-								<React.Fragment key={method}>
-									<Tooltip title={method}>
-										<span style={{ fontWeight: "normal"}}>{method}</span>
-									</Tooltip>
-									{index < validExtractionPoints.length - 1 && ", "}
-								</React.Fragment>
-							);
-						})}
-					</div>
-				);
+				
+				return <SingleTruncatedLine data={validExtractionPoints} />;
 			},
 		},
 		{
@@ -35,27 +24,7 @@ export function getKeyIndicatorsConfig({ t, data }) {
 					return "-";
 				}
 		
-				return (
-					<div>
-						{validProducts?.map((product, index) => {
-							return (
-								<React.Fragment key={product}>
-									<Tooltip title={product}>
-										<span 
-											style={{ 
-												fontWeight: "normal",
-												color: getTagColor(product)
-											}}
-										>
-											{product}
-										</span>
-									</Tooltip>
-									{index < validProducts.length - 1 && ", "}
-								</React.Fragment>
-							);
-						})}
-					</div>
-				);
+				return <SingleTruncatedLine data={validProducts} />
 			},
 		},
 		{

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/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/dataFetch.js

@@ -11,9 +11,9 @@ export const formatDataForTable = (data, options) => {
               
                 return { ...rest, children }; 
             }),
-            meta: dataObj.data,
+            meta: dataObj?.meta,
         },
-        ...(Object.keys(options)?.length > 0 && options),
-        totalItems: Array.isArray(dataObj?.meta) ? dataObj?.meta?.[0]?.total : dataObj?.meta?.total || 0,
+        options: options || {},
+        totalItems: dataObj?.meta?.total || dataObj?.data?.length || 0,
     }
 }

package/src/index.js

@@ -201,6 +201,7 @@ export { default as SDGIcons } from "./@daf/core/components/UI/SDGIcon/index.jsx
 export { default as CountryFlag } from "./@daf/core/components/UI/CountryFlag/index.jsx"
 export { default as KeyIndicatorNavigateLabel } from "./@daf/core/components/UI/KeyIndicatorNavigateLabel/index.jsx";
 export { default as MissingTagButton } from "./@daf/core/components/UI/MissingTagButton/index.jsx";
+export { default as SingleTruncatedLine } from "./@daf/core/components/UI/SingleTruncatedLine/index.jsx";
 
 //Settings
 export { default as Settings } from "./@daf/core/components/Screens/Settings/index.js";

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';