datastake-daf 0.6.746 → 0.6.747

package/dist/services/index.js

@@ -1188,7 +1188,7 @@ class SourceService extends BaseService {
     id
   }) {
     return this.apiGet({
-      url: `/${type}/sources-for-subject/${id}`
+      url: `/${type}/sources/${id}`
     });
   }
 }
@@ -1435,8 +1435,30 @@ var LinkedSubjects = createLazyService(LinkedSubjectsService);
 
 class OperatorService extends BaseService {
   get(params) {
+    const {
+      datastakeId,
+      ...rest
+    } = params;
+    if (datastakeId) {
+      return this.apiGet({
+        url: `/stakeholder/${datastakeId}`,
+        params: {
+          ...rest
+        },
+        isApp: true
+      });
+    }
     return this.apiGet({
       url: "/stakeholder",
+      params: {
+        ...rest
+      },
+      isApp: true
+    });
+  }
+  getOne(id, params) {
+    return this.apiGet({
+      url: `/stakeholder/${id}`,
       params,
       isApp: true
     });

package/package.json

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

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

@@ -82,7 +82,7 @@ export default function useSource({ user = {}, t = () => {}, getData = () => {},
 
 export const useSources = ({type, id, user, t = () => {}}) => {
 	function getData(params) {
-		if(id) {
+		if(id !== undefined && id !== null) {
 			return SourceService.getSources({type, id});
 		} else {
 			return SourceService.get(null, params);

package/src/@daf/pages/Summary/Minesite/components/LocationMap/index.js

@@ -0,0 +1,61 @@
+import React, { useMemo } from 'react'
+import Widget from '../../../../../core/components/Dashboard/Widget/index.jsx'
+import Map from '../../../../../core/components/Dashboard/Map/index.jsx'
+import { getLinkValue } from '../../../../../../helpers/StringHelper.js'
+
+const LocationMap = ({
+    selectedPartners = {},
+    t = () => {},
+    params,
+    locationData = {},
+    loading = false,
+}) => {
+    const data = useMemo(() => {
+		return {
+			gps: locationData?.gps || {},
+			name: locationData?.name || "",
+			admin_level_01:
+				locationData?.linking?.SCL?.[locationData?.administrativeLevel1]?.name || "",
+			admin_level_02:
+				locationData?.linking?.SCL?.[locationData?.administrativeLevel2]?.name || "",
+			country: locationData?.country,
+		};
+	}, [locationData]);
+
+
+    return (
+        <Widget
+			title={t("Location")}
+			className="no-px no-pb-body overflow-hidden"
+			loading={loading}
+		>
+            <Map 
+                showSider={false}
+                primaryLink={true}
+				mapConfig={{
+					maxZoom: 10,
+				}}
+				type={"location"}
+				data={[data]}
+                renderTooltip={() => {
+					const country = data?.country;
+					const adminLevel1Label = t("Province")
+					const adminLevel2Label = t("Territory");
+
+					return [
+						{
+							label: t(adminLevel1Label),
+							value: data?.admin_level_01 || "--",
+						},
+						{
+							label: t(adminLevel2Label),
+							value: data?.admin_level_02 || "--",
+						},
+					];
+				}}
+            />
+		</Widget>
+    )
+}
+
+export default LocationMap

package/src/@daf/pages/Summary/Minesite/components/MineSiteDetails/config.js

@@ -0,0 +1,77 @@
+import React from "react";
+import { Tag } from "antd";
+import { getTagColor } from "../../../../../utils/productTag.js";
+
+export function getKeyIndicatorsConfig({ t, data }) {
+	return [
+		{
+			label: t("Extraction Methods"),
+			render: () => {
+				if (!data?.extractionPoints?.length) {
+					return "-";
+				}
+				return (
+					<div
+						style={{
+							display: "flex",
+							flexWrap: "wrap",
+						}}
+					>
+						{data?.extractionPoints?.map((method) => {
+							return (
+								<Tag
+									key={method}
+									style={{
+										marginBottom: 8,
+									}}
+								>
+									{method}
+								</Tag>
+							);
+						})}
+					</div>
+				);
+			},
+		},
+		{
+			label: t("Products"),
+			render: () => {
+				if (data?.productsOfLocation?.length === 0) {
+					return "-";
+				}
+
+				return (
+					<div
+						style={{
+							display: "flex",
+							flexWrap: "wrap",
+						}}
+					>
+						{data?.productsOfLocation?.map((product) => {
+							return (
+								<Tag
+									key={product}
+									style={{
+										marginBottom: 8,
+									}}
+									color={getTagColor(product)}
+								>
+									{product}
+								</Tag>
+							);
+						})}
+					</div>
+				);
+			},
+		},
+		{
+			label: t("Number of Workers on Site"),
+			render: () => {
+				if (!data.workers) {
+					return "-";
+				}
+				return data.workers;
+			},
+		},
+	];
+}

package/src/@daf/pages/Summary/Minesite/components/MineSiteDetails/index.js

@@ -0,0 +1,47 @@
+import React, { useMemo } from 'react'
+import { getKeyIndicatorsConfig } from './config.js'
+import KeyIndicatorsWidget from '../../../../../core/components/Dashboard/Widget/KeyIndicators/index.jsx'
+
+const MineSiteDetails = ({
+    locationData = {},
+    loading = false,
+    t = () => {},
+    options = {}
+}) => {
+
+    const data = useMemo(() => {
+		return {
+			extractionPoints: (locationData?.extractionMethod || []).map((method) => {
+				const _method = options?.extractionMethodsOptions?.find(
+					(option) => option.value === method,
+				)?.label;
+
+				return _method;
+			}),
+			products: (
+				(locationData?.products || []).map((product) => product.typeOfProduct) || []
+			).map((product) => {
+				const _product = options?.minerals?.find(
+					(option) => option.value === product,
+				)?.label;
+
+				return _product;
+			}),
+			workers: locationData?.totalNumberOfWorkers || 0,
+		};
+	}, [locationData, options]);
+
+    const config = useMemo(() => getKeyIndicatorsConfig({ t, data }), [t, data]);
+
+    return (
+        <KeyIndicatorsWidget
+            title={t("Mine Site Details")}
+            className="value-center small-content row-content-col"
+            config={config}
+            loading={loading}
+            widgetClassName="custom-width-b"
+        />
+    )
+}
+
+export default MineSiteDetails

package/src/@daf/pages/Summary/Minesite/components/StakeholderMapping/config.js

@@ -0,0 +1,26 @@
+export const IconNodesConfig = {
+	operators: {
+		name: "nashiriki::Operators",
+		icon: "Worker",
+		order: 1,
+		emptyName: "no-operators",
+	},
+	traders: {
+		name: "nashiriki::Traders",
+		icon: "Handshake",
+		order: 2,
+		emptyName: "no-traders",
+	},
+	government: {
+		name: "nashiriki::Government",
+		icon: "KYC",
+		order: 3,
+		emptyName: "no-government",
+	},
+	other: {
+		name: "nashiriki::Other",
+		icon: "CivilSociety",
+		order: 4,
+		emptyName: "no-other",
+	},
+};

package/src/@daf/pages/Summary/Minesite/components/StakeholderMapping/helper.js

@@ -0,0 +1,64 @@
+import { IconNodesConfig } from './config.js';
+
+export const getStakeholderMappingData = ({data, locationData, id, options, t, goTo, selectedPartners}) => {
+    const _data = data;
+
+    return {
+        id: id,
+        name: locationData?.name || "",
+        country: {
+            label:
+                options?.countries?.find((country) => country.value === locationData?.country)
+                    ?.label || "",
+            value: (locationData?.country || "").toLowerCase() || "",
+        },
+        onClick: () => goTo(`/app/view/production-sites/${id}`),
+        totalSources: selectedPartners?.partners?.length || 0,
+        backgroundColor: "#FFD6E7",
+        iconColor: "#C41D7F",
+
+        icon: "DashboardLocations",
+        children: Object.keys(_data)?.map((key, index) => {
+            return {
+                id: key,
+                name: t(IconNodesConfig[key]?.name),
+                icon: IconNodesConfig[key]?.icon,
+                order: IconNodesConfig[key]?.order || index + 1,
+                activeColour: "#b6f5ec",
+                iconHoverColor: "#fff",
+                hoverColor: "#36cfca",
+                content: _data[key].length,
+                emptyName: IconNodesConfig[key]?.emptyName
+                    ? t(`nashiriki::${IconNodesConfig[key]?.emptyName}`)
+                    : undefined,
+                children: (_data[key] || [])?.map((child) => {
+                    return {
+                        id: child?.datastakeId || "",
+                        name: child?.name || "",
+                        country: {
+                            label:
+                                options?.countries?.find(
+                                    (country) => country.value === child?.country,
+                                )?.label || "",
+                            value: child?.country ? child?.country?.toLowerCase() : "",
+                        },
+
+                        icon: "DashboardStakeholder",
+                        onClick: () => {
+                            if (child?.type === "operator") {
+                                goTo(`/app/summary/operators/${child.datastakeId}`);
+                                return;
+                            }
+
+                            goTo(`/app/view/stakeholders/${child.datastakeId}`);
+                        },
+                        totalSources: child?.sources || 0,
+                        tooltipHeader: t("nashiriki::link-details"),
+                        tooltipLabel: t("nashiriki::sources-reporting"),
+                        value: child?.sources || 0,
+                    };
+                }),
+            };
+        }),
+    };
+}

package/src/@daf/pages/Summary/Minesite/components/StakeholderMapping/index.js

@@ -0,0 +1,56 @@
+import React, { useMemo } from 'react'
+import { useWidgetFetch } from '../../../../../hooks/useWidgetFetch.js';
+import { getStakeholderMappingData } from './helper.js';
+import Widget from '../../../../../core/components/Dashboard/Widget/index.jsx';
+import StakeholderMappings from '../../../../../core/components/Graphs/StakeholderMappings/index.jsx';
+
+const StakeholderMapping = ({
+    t = () => {},
+    id,
+    options = {},
+    goTo = () => {},
+    selectedPartners = {},
+    locationData = {},
+}) => {
+
+    const defaultFilter = useMemo(() => {
+		return {
+			basepath: "analytics",
+			url: "/widgets/information-map-graph",
+			defaultData: [],
+			stop: selectedPartners?.loading,
+			filters: {
+				datastakeId: id,
+				sources: selectedPartners?.partners || [],
+				coreSubject: "location",
+				filterBySources: false,
+				metrics: {
+					operator: ['operator'],
+					government: ['custom', 'governance'],
+					trader: ['trade'],
+					other: ['civilSociety', 'international'],
+				}
+			},
+		};
+	}, [selectedPartners, id]);
+
+    const { data, loading } = useWidgetFetch({config: defaultFilter});
+
+    const graphData = useMemo(() => {
+        return getStakeholderMappingData({data, locationData, id, options, t, goTo, selectedPartners});
+    }, [data, locationData, id, options, t, goTo, selectedPartners]);
+
+    return (
+		<Widget
+			loading={loading}
+			title={t("Stakeholder Mapping")}
+			className={"with-border-header no-px no-p-body"}
+		>
+			<div style={{ height: 600 }}>
+				<StakeholderMappings data={graphData} t={t} />
+			</div>
+		</Widget>
+    )
+}
+
+export default StakeholderMapping

package/src/@daf/pages/Summary/Minesite/index.jsx

@@ -0,0 +1,162 @@
+import React from 'react'
+import { useSummary } from '../hook.js'
+import DashboardLayout from '../../../core/components/Dashboard/DashboardLayout/index.jsx'
+import Header from '../../../core/components/Header/index.jsx'
+import Multiselect from '../../../core/components/Select/MultiSelect/index.jsx'
+import { Select, Spin } from 'antd'
+import MineSiteDetails from './components/MineSiteDetails/index.js'
+import LocationMap from './components/LocationMap/index.js'
+import InformationAvailability from '../components/InformationAvailability/index.js'
+import StakeholderMapping from './components/StakeholderMapping/index.js'
+
+const MineSummary = ({
+    hasSelect = false,
+    loading = false,
+    getSingleData = () => {},
+    getMultipleData = () => {},
+    data = [],
+    id = '',
+    storageKey = '',
+    isPdf = false,
+    params = {},
+    partners = [],
+    selectedPartners = {},
+    user = {},
+    t = () => {},
+    theme = {},
+    service,
+    options = {},
+    goTo = () => {},
+    getRedirectLink = () => {},
+    goBack = () => {},
+    onIdChange = () => {},
+}) => {
+    const { 
+        selectedItem, 
+        setSelectedItem, 
+        dataOptions,
+        search,
+        debouncedSearch,
+        onSearch,
+        setSearch,
+        setDebouncedSearch,
+        sourceOptions,
+        setSelectedPartners,
+        singleItemData,
+        loading: loadingData,
+    } = useSummary({
+            getOne: getSingleData,
+            getMultiple: getMultipleData, 
+            id, 
+            hasSelect, 
+            storageKey, 
+            data,
+            isPdf: false,
+            params,
+            partners,
+            selectedPartners,
+            user,
+            t,
+            theme,
+            service,
+            onIdChange,
+    });
+
+    return (
+        <DashboardLayout
+            header={
+                <Header 
+                    title={t('Mine Summary')}
+                    className="with-border-header h-w-btn-header no-px-body"
+                    goBackTo={!hasSelect && goBack}
+                    addedHeaderFirst
+					actionButtons={[
+                        {
+							tooltip: t("Details"),
+							icon: "FileEdit",
+							onClick: () => {
+								goTo(getRedirectLink(`/app/view/production-sites/${params?.id ? params?.id : selectedItem}`));
+							},
+						},
+						{
+							tooltip: t("Find Data"),
+							icon: "Search",
+							onClick: () => {},
+							disabled: true,
+						},
+					]}
+                    addedHeader={
+						<div className="flex flex-row gap-4" style={{ marginRight: 8 }}>
+							<Multiselect
+								options={[...sourceOptions]}
+								isAvatarGroup
+								selectionType="checkbox"
+								key={partners?.length}
+								canUnselectLast={false}
+								onChange={(selected) => {
+									setSelectedPartners((prev) => ({
+										...prev,
+										partners: selected,
+										loading: false,
+									}));
+								}}
+								dropDownWidth={200}
+								defaultSelected={(partners || []).map((p) => p.id) || []}
+							/>
+						</div>
+					}
+                />
+            }
+        >
+            {hasSelect && (
+				<section>
+					<Select
+						showSearch
+						debounceTimeout={300}
+						onSearch={onSearch}
+						isSingle
+						style={{ height: "40px", width: "100%" }}
+						value={selectedItem}
+						onChange={setSelectedItem}
+						options={dataOptions}
+						filterOption={false}
+						loading={loading}
+						notFoundContent={loading ? <Spin size="small" /> : null}
+					/>
+				</section>
+			)}
+            <section>
+                <MineSiteDetails
+                    locationData={hasSelect ? singleItemData : data}
+                    loading={loadingData}
+                    t={t}
+                    options={options}
+                />
+                <LocationMap
+                    selectedPartners={selectedPartners}
+                    t={t}
+                    params={params}
+                    locationData={hasSelect ? singleItemData : data}
+                    loading={loadingData}
+                />
+            </section>
+            <section>
+                <InformationAvailability
+                    selectedPartners={selectedPartners}
+                    t={t}
+                    id={params?.id || selectedItem}
+                />
+            </section>
+            <section>
+                <StakeholderMapping
+                    selectedPartners={selectedPartners}
+                    t={t}
+                    id={params?.id || selectedItem}
+                    locationData={hasSelect ? singleItemData : data}
+                />  
+            </section>
+        </DashboardLayout>
+    )
+}
+
+export default MineSummary

package/src/@daf/pages/Summary/Operator/components/Governance/config.js

@@ -0,0 +1,26 @@
+export const IconNodesConfig = {
+	beneficiaries: {
+		name: "nashiriki::beneficiaries",
+		icon: "CoinsHand",
+		order: 3,
+		emptyName: "no-beneficiaries",
+	},
+	boardMembers: {
+		name: "nashiriki::board-members",
+		icon: "Users",
+		order: 1,
+		emptyName: "no-board-members",
+	},
+	management: {
+		name: "nashiriki::management",
+		icon: "Filters",
+		order: 2,
+		emptyName: "no-management",
+	},
+	shareholders: {
+		name: "nashiriki::stakeholders",
+		icon: "PercentCircle",
+		order: 4,
+		emptyName: "no-stakeholders",
+	},
+};

package/src/@daf/pages/Summary/Operator/components/Governance/helper.js

@@ -0,0 +1,61 @@
+import { IconNodesConfig } from './config.js';
+
+export const getGovernanceData = ({data, operatorData, id, options, t, goTo, selectedPartners}) => {
+    const { sources, ...rest } = data;
+
+    const _data = rest;
+
+    return {
+        id: operatorData?.datastakeId || id,
+        name: t(operatorData?.name || ""),
+        country: {
+            label:
+                options?.countries?.find((country) => country.value === operatorData?.country)
+                    ?.label || "",
+            value: (operatorData?.country || "").toLowerCase() || "",
+        },
+        onClick: () => {
+        	goTo(`/app/view/operators/${operatorData?.datastakeId || id}`);
+        },
+        totalSources: selectedPartners?.partners?.length || 0,
+
+        children: Object.keys(_data)?.map((key, index) => {
+            return {
+                id: key,
+                name: t(IconNodesConfig[key]?.name),
+                icon: IconNodesConfig[key]?.icon,
+                order: IconNodesConfig[key]?.order || index + 1,
+                emptyName: t(`${IconNodesConfig[key]?.emptyName}`),
+                activeColour: "#b6f5ec",
+                iconHoverColor: "#fff",
+                hoverColor: "#36cfca",
+                content: _data[key].length,
+                children: _data[key]?.map((child) => {
+                    return {
+                        id: child?.datastakeId || "",
+                        name: child?.name || "",
+                        country: {
+                            label:
+                                options?.countries?.find(
+                                    (country) => country.value === child?.country,
+                                )?.label || "",
+                            value: (child?.country || "").toLowerCase() || "",
+                        },
+
+                        totalSources: child?.sources || 0,
+                        tooltipLabel: t("Holding"),
+                        onClick: () => {
+                            if (child?.type === "operator") {
+                                goTo(`/app/operator-summary/${child.datastakeId}`);
+                                return;
+                            }
+
+                            goTo(`/app/view/stakeholders/${child.datastakeId}`);
+                        },
+                        value: child?.holding || 0,
+                    };
+                }),
+            };
+        }),
+    };
+}