datastake-daf 0.6.782 → 0.6.784

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

@@ -7,6 +7,8 @@ const Style = styled.div`
   width: 100%;
   height: 472px;
 
+  
+
   .filter-cont {
     position: absolute; 
     top: 24px;
@@ -109,11 +111,24 @@ const Style = styled.div`
       align-items: center;
     }
 
-	.marker-chain {
-		display: flex;
-		align-items: center;
-		justify-content: center;
-	}
+    .marker-chain {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+    .animated-polyline {
+      stroke-dasharray: 10 10;
+      animation: dash-flow 1.5s linear infinite;
+      stroke-linecap: round;
+    }
+
+    @keyframes dash-flow {
+      to {
+        stroke-dashoffset: -20;
+      }
+    }
+
     
   }
 

package/src/@daf/core/components/Screens/BaseScreen/index.jsx

@@ -150,6 +150,7 @@ const BaseScreen = ({
 						showFilters={showFilters}
 						defaultFilters={defaultFilters}
 						onChange={onTableChange}
+						t={t}
 						{...rest}
 					/>
 					<Pagination

package/src/@daf/core/components/Select/MultiSelect/index.jsx

@@ -4,6 +4,7 @@ import PropTypes from "prop-types";
 import { Avatar, Checkbox } from "antd";
 import { theme } from "antd";
 import React from "react";
+import MultiSelectStyled from "./style";
 const { useToken } = theme;
 
 /**
@@ -163,7 +164,7 @@ export default function Multiselect({
 	};
 
 	return (
-		<Select
+		<MultiSelectStyled
 			mode={isSingle ? undefined : "multiple"}
 			value={selectValue}
 			onChange={onSelectChange}
@@ -231,6 +232,7 @@ export default function Multiselect({
 											display: "flex",
 											alignItems: "center",
 											justifyContent: "center",
+											padding: 0,
 										}}
 									>
 										{option?.avatar || getFirstChar(option?.label)}
@@ -289,7 +291,7 @@ export default function Multiselect({
 				}
 			}}
 			{...restProps}
-		></Select>
+		></MultiSelectStyled>
 	);
 }
 

package/src/@daf/core/components/Select/MultiSelect/style.js

@@ -0,0 +1,15 @@
+import styled from 'styled-components';
+import { Select } from 'antd';
+
+const MultiSelectStyled = styled(Select)`
+  &.ant-select-single {
+    .ant-select-selector {
+        padding-inline-end: 24px !important;
+        padding: 0 !important;
+        max-width: 56px !important;
+        width: 56px !important;
+    }
+  }
+`;
+
+export default MultiSelectStyled;

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

@@ -18,7 +18,9 @@ export const useGetQueryParams = ({location}) => {
           },
           otherParams: {
             ...rest,
-          }
+          },
+          sortBy,
+          sortDir,
         };
       }, [queryParams]);
 

package/src/@daf/pages/Dashboards/UserDashboard/components/ContributionsGraph/hook.js

@@ -12,6 +12,7 @@ export const useContributionsGraph = ({
 	}, [data, t]);
 
     const isEmpty = useMemo(() => _data?.length === 0, [_data]);
+    console.log({_data, isEmpty})
 
     const chartConfig = useMemo(() => {
         return {
@@ -20,13 +21,11 @@ export const useContributionsGraph = ({
             yFieldKey: "category",
             seriesField: "type",
             isGroup: true,
-            ...(isEmpty && {
-                xAxisConfig: {
-                    min: 0,
-                    max: 10,
-                    tickCount: 5,
-                }
-            }),
+            xAxisConfig: isEmpty ? {
+                min: 0,
+                max: 10,
+                tickCount: 5,
+            } : {},
             renderTooltipContent: (title, items) => {
 				const tooltipItems = items.map((item) => ({
 					label: item.name,

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

@@ -41,7 +41,7 @@ function ContributionsGraph({
             title={t("Contributions")}
             className="with-border-header h-w-btn-header no-px-body"
         >
-            <BarChart {...chartConfig} height="400px" t={t} />
+            <BarChart {...chartConfig} height="400px" t={t} key={data?.length} />
         </Widget>
     )
 }

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

@@ -1,10 +1,10 @@
 export const getFiltersConfig = ({t}) => {
     return {
-   timeframe: {
-		type: "timeframe",
-		label: "Timeframe",
-		style: { flex: 1 },
-	},
+		timeframe: {
+			type: "timeframe",
+			label: "Timeframe",
+			style: { flex: 1 },
+		},
     }
 }
 

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

@@ -14,6 +14,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('ID'),
         ellipsis: true,
         show: true,
+        key: "datastakeId",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -27,6 +29,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('Title'),
         ellipsis: true,
         show: true,
+        key: "name",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -39,6 +43,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
       title: t("Date"),
       dataIndex: "date",
       key: "date",
+      sorter: () => 0 + 0,
       render: (date, all) => {
           if (all.empty) {
               return <div className="daf-default-cell" />;

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

@@ -1,16 +1,15 @@
 export const getFiltersConfig = ({t}) => {
     return {
-
-		
-timeframe: {
-	type: "timeframe",
-	label: "Timeframe",
-	style: { flex: 1 },
+		timeframe: {
+			type: "timeframe",
+			label: "Timeframe",
+			style: { flex: 1 },
+			t: t,
 		},
 		country: {
 			type: 'select',
 			label: 'Country',
-			placeholder: (t) => `${t('Filter by')} ${t('Country').toLowerCase()}`,
+			placeholder: () => `${t('Filter by')} ${t('Country').toLowerCase()}`,
 			style: { flex: 1 },
 			labelStyle: { flex: 1 },
 			getLabel: (option) => option.label,
@@ -34,7 +33,7 @@ timeframe: {
 	  
 			return t('Province');
 		  },
-		  placeholder: (t) => `${t('Filter by')} ${t('Province').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Province').toLowerCase()}`,
 		  filters: (data) => ({
 			country: data.country,
 			level: 'level_1',
@@ -66,7 +65,7 @@ timeframe: {
 			return t('Province');
 		  },
 		  show: (data) => !(data.country && data.administrativeLevel1),
-		  placeholder: (t) => `${t('Filter by')} ${t('Territory').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Territory').toLowerCase()}`,
 		  filters: (data) => ({
 			country: data.country,
 			level: 'level_2',
@@ -82,7 +81,7 @@ timeframe: {
 		category: {
 		  type: 'select',
 		  label: 'Category',
-		  placeholder: (t) => `${t('Filter by')} ${t('Category').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Category').toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
@@ -106,7 +105,7 @@ timeframe: {
 		positionInTheMineralSupplyChain: {
 		  type: 'select',
 		  label: 'Position',
-		  placeholder: (t) => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
@@ -115,7 +114,7 @@ timeframe: {
 		status: {
 		  type: "select",
 		  label: "Status",
-		  placeholder: (t) => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+		  placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { fley: 1 },
 		  getLabel: (option) => option.label,
@@ -127,7 +126,6 @@ timeframe: {
 export const getFilterOptions = (options, t) => {
 	const {
 		timeframe = [],
-
 		statusOptions = [],
 		categoryOptions = [],
 		countries = [],
@@ -139,21 +137,27 @@ export const getFilterOptions = (options, t) => {
 		administrativeLevel2,
 		positionInMineralSupplyChainOptions,
 		subCategoriesOptions,
-	  } = options || {};
+		eventCategoryOptions = [],
+	} = options || {};
+
+	const _categoryOptions = eventCategoryOptions?.map((item) => ({
+		value: item.value,
+		label: typeof item.label === 'object' ? Object.values(item.label)[1] : item.label,
+	}))
 
 	const _default  = {
 		timeframe: timeframe,
 		status: [
 			{
 				value: "submitted",
-				label: "Submitted",
+				label: t("Submitted"),
 			},
 			{
 				value: "private",
-				label: "Private",
+				label: t("Private"),
 			},
 		],
-		category: stakeholderCategoryOptions || categoryOptions,
+		category: _categoryOptions,
 		country: countries,
 		subCategory: subCategoriesOptions,
 		// category: category,

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

@@ -14,6 +14,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('ID'),
         ellipsis: true,
         show: true,
+        key: "datastakeId",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -27,6 +29,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('Title'),
         ellipsis: true,
         show: true,
+        key: "name",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -39,6 +43,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
       title: t("Date"),
       dataIndex: "date",
       key: "date",
+      sorter: () => 0 + 0,
       render: (date, all) => {
           if (all.empty) {
               return <div className="daf-default-cell" />;

package/src/@daf/pages/Events/Incidents/config.js

@@ -1,11 +1,9 @@
 export const getFiltersConfig = ({t}) => {
     return {
-
-		
-timeframe: {
-	type: "timeframe",
-	label: "Timeframe",
-	style: { flex: 1 },
+		timeframe: {
+			type: "timeframe",
+			label: "Timeframe",
+			style: { flex: 1 },
 		},
 		country: {
 			type: 'select',
@@ -127,7 +125,6 @@ timeframe: {
 export const getFilterOptions = (options, t) => {
 	const {
 		timeframe = [],
-
 		statusOptions = [],
 		categoryOptions = [],
 		countries = [],
@@ -139,21 +136,27 @@ export const getFilterOptions = (options, t) => {
 		administrativeLevel2,
 		positionInMineralSupplyChainOptions,
 		subCategoriesOptions,
-	  } = options || {};
+		eventCategoryOptions = [],
+	} = options || {};
+
+	const _categoryOptions = eventCategoryOptions?.map((item) => ({
+		value: item.value,
+		label: typeof item.label === 'object' ? Object.values(item.label)[0] : item.label,
+	}))
 
 	const _default  = {
 		timeframe: timeframe,
 		status: [
 			{
 				value: "submitted",
-				label: "Submitted",
+				label: t("Submitted"),
 			},
 			{
 				value: "private",
-				label: "Private",
+				label: t("Private"),
 			},
 		],
-		category: stakeholderCategoryOptions || categoryOptions,
+		category: _categoryOptions,
 		country: countries,
 		subCategory: subCategoriesOptions,
 		// category: category,

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

@@ -14,6 +14,8 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t('ID'),
     ellipsis: true,
     show: true,
+    key: "datastakeId",
+    sorter: () => 0 + 0,
     render: (v, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />
@@ -27,6 +29,8 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t('Title'),
     ellipsis: true,
     show: true,
+    key: "name",
+    sorter: () => 0 + 0,
     render: (v, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />
@@ -40,6 +44,8 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t('Type'),
     ellipsis: true,
     show: true,
+    key: "typeOfEvent",
+    sorter: () => 0 + 0,
     render: (v, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />

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

@@ -1,6 +1,5 @@
 export const getFiltersConfig = ({t}) => {
     return {
-
         timeframe: {
             type: "timeframe",
             label: "Timeframe",
@@ -86,21 +85,6 @@ export const getFiltersConfig = ({t}) => {
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
 		  getValue: (option) => option.value,
-		  filterOptions: (val) => {
-			if (val) {
-			  const { option, filters } = val
-			  if (filters && option) {
-				const { filters: optionFilters } = option;
-				if (Array.isArray(optionFilters) && optionFilters.length) {
-				  const { value, condition } = optionFilters[0];
-				  if (condition === 'includes') {
-					return value.includes('corporation');
-				  }
-				}
-			  }
-			}
-			return true;
-		  },
 		},
 		category:{
 			type: 'select',

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

@@ -15,6 +15,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('ID'),
         ellipsis: true,
         show: true,
+        key: "datastakeId",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -28,6 +30,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         title: t('Name'),
         ellipsis: true,
         show: true,
+        key: "name",
+        sorter: () => 0 + 0,
         render: (v, all) => {
           if (all.empty) {
             return <div className="daf-default-cell" />
@@ -68,7 +72,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
     },     
     {
         dataIndex: 'category',
-        title: t('Type'),
+        title: t('type'),
         ellipsis: true,
         show: true,
         render: (v, all) => {

package/src/@daf/pages/Locations/MineSite/config.js

@@ -3,7 +3,7 @@ export const getFiltersConfig = ({t}) => {
 		country: {
 		  type: 'select',
 		  label: 'Country',
-		  placeholder: (t) => `${t('Filter by')} ${t('Country').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Country').toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
@@ -27,7 +27,7 @@ export const getFiltersConfig = ({t}) => {
 	  
 			return t('Province');
 		  },
-		  placeholder: (t) => `${t('Filter by')} ${t('Province').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Province').toLowerCase()}`,
 		  filters: (data) => ({
 			country: data.country,
 			level: 'level_1',
@@ -59,7 +59,7 @@ export const getFiltersConfig = ({t}) => {
 			return t('Province');
 		  },
 		  show: (data) => !(data.country && data.administrativeLevel1),
-		  placeholder: (t) => `${t('Filter by')} ${t('Territory').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Territory').toLowerCase()}`,
 		  filters: (data) => ({
 			country: data.country,
 			level: 'level_2',
@@ -75,31 +75,25 @@ export const getFiltersConfig = ({t}) => {
 		product: {
 		  type: 'select',
 		  label: 'Product',
-		  placeholder: (t) => `${t('Filter by')} ${t('Product').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Product').toLowerCase()}`,
+		  style: { flex: 1 },
+		  labelStyle: { flex: 1 },
+		  getLabel: (option) => option.label,
+		  getValue: (option) => option.value,
+		},		
+		type: {
+		  type: 'select',
+		  label: 'Type',
+		  placeholder: () => `${t('Filter by')} ${t('Type').toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
 		  getValue: (option) => option.value,
-		  filterOptions: (val) => {
-			if (val) {
-			  const { option, filters } = val
-			  if (filters && option) {
-				const { filters: optionFilters } = option;
-				if (Array.isArray(optionFilters) && optionFilters.length) {
-				  const { value, condition } = optionFilters[0];
-				  if (condition === 'includes') {
-					return value.includes('corporation');
-				  }
-				}
-			  }
-			}
-			return true;
-		  },
 		},
 		positionInTheMineralSupplyChain: {
 		  type: 'select',
 		  label: 'Position',
-		  placeholder: (t) => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+		  placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { flex: 1 },
 		  getLabel: (option) => option.label,
@@ -108,7 +102,7 @@ export const getFiltersConfig = ({t}) => {
 		status: {
 		  type: "select",
 		  label: "Status",
-		  placeholder: (t) => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+		  placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
 		  style: { flex: 1 },
 		  labelStyle: { fley: 1 },
 		  getLabel: (option) => option.label,
@@ -129,23 +123,26 @@ export const getFilterOptions = (options, t) => {
 		stakeholderSubCategoriesOptions,
 		administrativeLevel1,
 		administrativeLevel2,
+		mineralOptions,
+		locationCategories = [],
 	  } = options || {};
 
 	const _default  = {
 		category: stakeholderCategoryOptions || categoryOptions,
 		country: countries,
-		product: product,
+		product: mineralOptions,
+		type: locationCategories,
 		administrativeLevel1,
 		administrativeLevel2,
 		subCategory: subCategoriesOptions,
 		status: [
 			{
 				value: "submitted",
-				label: "Submitted",
+				label: t("Submitted"),
 			},
 			{
 				value: "private",
-				label: "Private",
+				label: t("Private"),
 			},
 		],
 	}

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

@@ -4,7 +4,7 @@ import MoreMenu from '../../core/components/Table/MoreMenu/index.jsx';
 import TooltipIcon from '../../core/components/Icon/TooltipIcon.jsx';
 import { findOptions, camelCaseToTitle } from '../../../helpers/StringHelper.js';
 import { copyToClipboard } from '../../../helpers/copyToClipboard.js';
-import { partnershipTypes, partnerTypes } from './config.js';
+import { getPartnershipTypes, getPartnerTypes } from './config.js';
 
 export const getColumns = ({
 	t,
@@ -63,6 +63,7 @@ export const getColumns = ({
 				return <div className="daf-default-cell" />;
 			}
 
+			const partnershipTypes = getPartnershipTypes(t);
 			return partnershipTypes.find((v) => v.value === val)?.label || val || "-";
 		},
 	},
@@ -76,6 +77,7 @@ export const getColumns = ({
 				return <div className="daf-default-cell" />;
 			}
 
+			const partnerTypes = getPartnerTypes(t);
 			return partnerTypes.find((v) => v.value === val)?.label || val || "-";
 		},
 	},

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

@@ -20,13 +20,17 @@ export const checkboxConfig = {
 	datastakeId: "ID",
 };
 
-export const partnerTypes = [
-	{ label: "Individual", value: "individual" },
-	{ label: "Organisation", value: "organisation" },
-];
+export const getPartnerTypes = (t) => {
+	return [	
+		{ label: t("Individual"), value: "individual" },
+		{ label: t("Organisation"), value: "organisation" },
+	]
+}
 
-export const partnershipTypes = [
-	{ label: "Source", value: "source" },
-	{ label: "Client", value: "client" },
-	{ label: "Exchange", value: "exchange" },
-];
+export const getPartnershipTypes = (t) => {
+	return [
+		{ label: t("Source"), value: "source" },
+		{ label: t("Client"), value: "client" },
+		{ label: t("Exchange"), value: "exchange" },
+	]
+}

package/src/@daf/pages/Partners/create.jsx

@@ -2,7 +2,7 @@ import React, { useMemo } from 'react'
 import { message } from 'antd';
 import PartnerService from '../../services/PartnerService.js';
 import DynamicForm from '../../core/components/DynamicForm/index.jsx';
-import { partnershipTypes, partnerTypes } from './config.js';
+import { getPartnerTypes, getPartnershipTypes } from './config.js';
 
 const data = {};
 
@@ -22,6 +22,9 @@ const Create = ({
     getApiBaseUrl = () => {},
 }) => {
 
+	const partnerTypes = useMemo(() => getPartnerTypes(t), [t]);
+	const partnershipTypes = useMemo(() => getPartnershipTypes(t), [t]);
+
     const form = useMemo(
 		() => ({
 			identification: {
@@ -49,7 +52,7 @@ const Create = ({
 					dataId: "partnerType",
 					options: partnerTypes.map((o) => ({ ...o, label: t(o.label) })),
 					rules: [{ required: true, message: "errors::field is required" }],
-				},
+				},				
 				nickName: {
 					label: {
 						"partnerType is individual": t("Person name"),

package/src/@daf/pages/Partners/edit.jsx

@@ -1,9 +1,9 @@
-import React, { useState, useEffect } from 'react'
+import React, { useState, useEffect, useMemo } from 'react'
 import { Form, Input, Select } from "antd";
 import PartnerService from '../../services/PartnerService.js';
 import Loading from '../../core/components/Loading/index.jsx';
 import ProjectVisualisationFooter from '../../core/components/ProjectVisualisation/Footer.js';
-import { partnershipTypes } from './config.js';
+import { getPartnerTypes, getPartnershipTypes } from './config.js';
 import { licensingOptions } from '../../core/components/DataStore/components/Settings/config.js';
 
 const Edit = ({
@@ -14,6 +14,8 @@ const Edit = ({
 }) => {
     const [MainForm] = Form.useForm();
     const [loading, setLoading] = useState(false);
+    const partnerTypes = useMemo(() => getPartnerTypes(t), [t]);
+    const partnershipTypes = useMemo(() => getPartnershipTypes(t), [t]);
 
     useEffect(() => {
         MainForm.setFieldsValue({ ...partner, licensing: 'no_citation' });