datastake-daf 0.6.783 → 0.6.785

package/dist/pages/index.js

@@ -6192,6 +6192,17 @@ DAFHeader.propTypes = {
   filtersConfig: PropTypes__default["default"].any
 };
 
+const MultiSelectStyled = styled__default["default"](antd.Select)`
+  &.ant-select-single {
+    .ant-select-selector {
+        padding-inline-end: 24px !important;
+        padding: 0 !important;
+        max-width: 56px !important;
+        width: 56px !important;
+    }
+  }
+`;
+
 const {
   useToken: useToken$8
 } = antd.theme;
@@ -6330,7 +6341,7 @@ function Multiselect({
       });
     }
   };
-  return /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+  return /*#__PURE__*/jsxRuntime.jsx(MultiSelectStyled, {
     mode: isSingle ? undefined : "multiple",
     value: selectValue,
     onChange: onSelectChange,
@@ -6387,7 +6398,8 @@ function Multiselect({
                 border: `1px solid ${token.baseGray40}`,
                 display: "flex",
                 alignItems: "center",
-                justifyContent: "center"
+                justifyContent: "center",
+                padding: 0
               },
               children: option?.avatar || getFirstChar(option?.label)
             }, value);
@@ -8348,11 +8360,11 @@ function getStakeholderPosition({
     angleDeg
   };
 }
-function applyAnimationDirect(el, isShortLink) {
+function applyAnimationDirect(el, isShortLink, lineFlow = "downstream") {
   if (!(el instanceof SVGElement) || isShortLink) return;
   el.style.strokeDasharray = "10, 10";
   el.style.strokeDashoffset = "0";
-  el.style.animation = "dash-flow 1.2s linear infinite";
+  el.style.animation = `dash-flow 1.2s linear infinite ${lineFlow === "upstream" && "reverse"}`;
   el.classList.add('animated-polyline');
 }
 function removeAnimationFromElement(element) {
@@ -14306,7 +14318,7 @@ function BarChart({
             return Array.from(new Array(11), (v, i) => i * 10);
           }
         } : {}),
-        ...xAxisConfig,
+        ...(Object.keys(xAxisConfig).length > 0 ? xAxisConfig : {}),
         label: {
           formatter: isPercentage ? v => `${v}`.replace(/\d{1,3}(?=(\d{3})+$)/g, s => `${s},`) + " %" : formattedXAxis,
           ...xAxisConfig?.label
@@ -14436,6 +14448,10 @@ const useContributionsGraph = ({
     });
   }, [data, t]);
   const isEmpty = React.useMemo(() => _data?.length === 0, [_data]);
+  console.log({
+    _data,
+    isEmpty
+  });
   const chartConfig = React.useMemo(() => {
     return {
       data: _data,
@@ -14443,13 +14459,11 @@ 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,
@@ -14505,10 +14519,11 @@ function ContributionsGraph({
     loading: loading,
     title: t("Contributions"),
     className: "with-border-header h-w-btn-header no-px-body",
-    children: /*#__PURE__*/jsxRuntime.jsx(BarChart, {
+    children: /*#__PURE__*/React.createElement(BarChart, {
       ...chartConfig,
       height: "400px",
-      t: t
+      t: t,
+      key: data?.length
     })
   });
 }
@@ -15296,6 +15311,8 @@ const getColumns$d = ({
   title: t('ID'),
   ellipsis: true,
   show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -15312,6 +15329,8 @@ const getColumns$d = ({
   title: t('Name'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -15345,6 +15364,8 @@ const getColumns$d = ({
   title: t('Legal Form'),
   ellipsis: true,
   show: true,
+  key: "subCategory",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -16346,6 +16367,7 @@ const BaseScreen = ({
           showFilters: showFilters,
           defaultFilters: defaultFilters,
           onChange: onTableChange,
+          t: t,
           ...rest
         }), /*#__PURE__*/jsxRuntime.jsx(Pagination, {
           t: t,
@@ -30163,7 +30185,9 @@ const useGetQueryParams = ({
       },
       otherParams: {
         ...rest
-      }
+      },
+      sortBy,
+      sortDir
     };
   }, [queryParams]);
   return params;
@@ -30411,7 +30435,7 @@ const getFiltersConfig$9 = ({
     country: {
       type: 'select',
       label: 'Country',
-      placeholder: t => `${t('Filter by')} ${t('Country').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Country').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30444,7 +30468,7 @@ const getFiltersConfig$9 = ({
         }
         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'
@@ -30488,7 +30512,7 @@ const getFiltersConfig$9 = ({
         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',
@@ -30511,7 +30535,7 @@ const getFiltersConfig$9 = ({
     subCategory: {
       type: 'select',
       label: 'Sub Category',
-      placeholder: t => `${t('Filter by')} ${t('Sub Category').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Sub Category').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30547,7 +30571,7 @@ const getFiltersConfig$9 = ({
     positionInTheMineralSupplyChain: {
       type: 'select',
       label: 'Position',
-      placeholder: t => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30560,7 +30584,7 @@ const getFiltersConfig$9 = ({
     status: {
       type: "select",
       label: "Status",
-      placeholder: t => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+      placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30592,10 +30616,10 @@ const getFilterOptions$9 = (options, t) => {
     subCategory: subCategoriesOptions,
     status: [{
       value: "submitted",
-      label: "Submitted"
+      label: t("Submitted")
     }, {
       value: "private",
-      label: "Private"
+      label: t("Private")
     }]
   };
   return _default;
@@ -30618,7 +30642,7 @@ const getFiltersConfig$8 = ({
     country: {
       type: 'select',
       label: 'Country',
-      placeholder: t => `${t('Filter by')} ${t('Country').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Country').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30651,7 +30675,7 @@ const getFiltersConfig$8 = ({
         }
         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'
@@ -30695,7 +30719,7 @@ const getFiltersConfig$8 = ({
         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',
@@ -30718,7 +30742,7 @@ const getFiltersConfig$8 = ({
     activity: {
       type: 'select',
       label: 'Activity',
-      placeholder: t => `${t('Filter by')} ${t('Activity').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Activity').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30726,35 +30750,12 @@ const getFiltersConfig$8 = ({
         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;
-      }
+      getValue: option => option.value
     },
     positionInTheMineralSupplyChain: {
       type: 'select',
       label: 'Position',
-      placeholder: t => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30767,7 +30768,7 @@ const getFiltersConfig$8 = ({
     status: {
       type: "select",
       label: "Status",
-      placeholder: t => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+      placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -30796,10 +30797,10 @@ const getFilterOptions$8 = (options, t) => {
   const _default = {
     status: [{
       value: "submitted",
-      label: "Submitted"
+      label: t("Submitted")
     }, {
       value: "private",
-      label: "Private"
+      label: t("Private")
     }],
     category: stakeholderCategoryOptions || categoryOptions,
     country: countries,
@@ -30833,25 +30834,31 @@ const getColumns$b = ({
   subject,
   data,
   applications
-}) => [
-// {
-//     dataIndex: 'datastakeId',
-//     title: t('ID'),
-//     ellipsis: true,
-//     show: true,
-//     render: (v, all) => {
-//       if (all.empty) {
-//         return <div className="daf-default-cell" />
-//       }
-
-//       return <Tooltip title={v}>{v}</Tooltip>;
-//     },
-// },
-{
+}) => [{
+  dataIndex: 'datastakeId',
+  title: t('Title'),
+  ellipsis: true,
+  show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
+  render: (v, all) => {
+    if (all.empty) {
+      return /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "daf-default-cell"
+      });
+    }
+    return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+      title: v,
+      children: v
+    });
+  }
+}, {
   dataIndex: 'name',
   title: t('Name'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -30865,9 +30872,11 @@ const getColumns$b = ({
   }
 }, {
   dataIndex: 'mineSite',
-  title: t('Position'),
+  title: t('Site'),
   ellipsis: true,
   show: true,
+  key: "mineSite",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31112,30 +31121,7 @@ const getFiltersConfig$7 = ({
         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;
-      }
+      getValue: option => option.value
     },
     category: {
       type: 'select',
@@ -31340,6 +31326,8 @@ const getColumns$a = ({
   title: t('ID'),
   ellipsis: true,
   show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31356,6 +31344,8 @@ const getColumns$a = ({
   title: t('Title'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31372,6 +31362,8 @@ const getColumns$a = ({
   title: t('Type'),
   ellipsis: true,
   show: true,
+  key: "typeOfEvent",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31559,12 +31551,13 @@ const getFiltersConfig$6 = ({
       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
       },
@@ -31597,7 +31590,7 @@ const getFiltersConfig$6 = ({
         }
         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'
@@ -31641,7 +31634,7 @@ const getFiltersConfig$6 = ({
         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',
@@ -31664,7 +31657,7 @@ const getFiltersConfig$6 = ({
     category: {
       type: 'select',
       label: 'Category',
-      placeholder: t => `${t('Filter by')} ${t('Category').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Category').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -31700,7 +31693,7 @@ const getFiltersConfig$6 = ({
     positionInTheMineralSupplyChain: {
       type: 'select',
       label: 'Position',
-      placeholder: t => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -31713,7 +31706,7 @@ const getFiltersConfig$6 = ({
     status: {
       type: "select",
       label: "Status",
-      placeholder: t => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+      placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -31738,18 +31731,23 @@ const getFilterOptions$6 = (options, t) => {
     administrativeLevel1,
     administrativeLevel2,
     positionInMineralSupplyChainOptions,
-    subCategoriesOptions
+    subCategoriesOptions,
+    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,
@@ -31795,6 +31793,8 @@ const getColumns$9 = ({
   title: t('ID'),
   ellipsis: true,
   show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31811,6 +31811,8 @@ const getColumns$9 = ({
   title: t('Title'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -31826,6 +31828,7 @@ const getColumns$9 = ({
   title: t("Date"),
   dataIndex: "date",
   key: "date",
+  sorter: () => 0 + 0,
   render: (date, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32172,18 +32175,23 @@ const getFilterOptions$5 = (options, t) => {
     administrativeLevel1,
     administrativeLevel2,
     positionInMineralSupplyChainOptions,
-    subCategoriesOptions
+    subCategoriesOptions,
+    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,
@@ -32220,6 +32228,8 @@ const getColumns$8 = ({
   title: t('ID'),
   ellipsis: true,
   show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32236,6 +32246,8 @@ const getColumns$8 = ({
   title: t('Title'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32251,6 +32263,7 @@ const getColumns$8 = ({
   title: t("Date"),
   dataIndex: "date",
   key: "date",
+  sorter: () => 0 + 0,
   render: (date, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32638,7 +32651,7 @@ const getFiltersConfig$3 = ({
     country: {
       type: 'select',
       label: 'Country',
-      placeholder: t => `${t('Filter by')} ${t('Country').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Country').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -32671,7 +32684,7 @@ const getFiltersConfig$3 = ({
         }
         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'
@@ -32715,7 +32728,7 @@ const getFiltersConfig$3 = ({
         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',
@@ -32738,7 +32751,7 @@ const getFiltersConfig$3 = ({
     product: {
       type: 'select',
       label: 'Product',
-      placeholder: t => `${t('Filter by')} ${t('Product').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Product').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -32746,35 +32759,25 @@ const getFiltersConfig$3 = ({
         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;
-      }
+      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
     },
     positionInTheMineralSupplyChain: {
       type: 'select',
       label: 'Position',
-      placeholder: t => `${t('Filter by')} ${t('Position').toLowerCase()}`,
+      placeholder: () => `${t('Filter by')} ${t('Position').toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -32787,7 +32790,7 @@ const getFiltersConfig$3 = ({
     status: {
       type: "select",
       label: "Status",
-      placeholder: t => `${t("Filter by")} ${t("Status").toLowerCase()}`,
+      placeholder: () => `${t("Filter by")} ${t("Status").toLowerCase()}`,
       style: {
         flex: 1
       },
@@ -32810,21 +32813,24 @@ const getFilterOptions$3 = (options, t) => {
     stakeholderCategoryOptions,
     stakeholderSubCategoriesOptions,
     administrativeLevel1,
-    administrativeLevel2
+    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")
     }]
   };
   return _default;
@@ -32892,6 +32898,8 @@ const getColumns$6 = ({
   title: t('ID'),
   ellipsis: true,
   show: true,
+  key: "datastakeId",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32908,6 +32916,8 @@ const getColumns$6 = ({
   title: t('Name'),
   ellipsis: true,
   show: true,
+  key: "name",
+  sorter: () => 0 + 0,
   render: (v, all) => {
     if (all.empty) {
       return /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -32955,7 +32965,7 @@ const getColumns$6 = ({
   }
 }, {
   dataIndex: 'category',
-  title: t('Type'),
+  title: t('type'),
   ellipsis: true,
   show: true,
   render: (v, all) => {
@@ -33528,6 +33538,12 @@ const TablePage = ({
   breadcrumbs = [],
   onDownload
 }) => {
+  const _options = React.useMemo(() => {
+    return {
+      ...options,
+      ...data?.options
+    };
+  }, [options, data?.options]);
   const {
     activeTab,
     selectOptions,
@@ -33543,7 +33559,7 @@ const TablePage = ({
     location,
     getData,
     extendingFilters,
-    options,
+    options: _options,
     t,
     goTo,
     user,
@@ -35083,23 +35099,27 @@ const checkboxConfig = {
   name: "Name",
   datastakeId: "ID"
 };
-const partnerTypes = [{
-  label: "Individual",
-  value: "individual"
-}, {
-  label: "Organisation",
-  value: "organisation"
-}];
-const partnershipTypes = [{
-  label: "Source",
-  value: "source"
-}, {
-  label: "Client",
-  value: "client"
-}, {
-  label: "Exchange",
-  value: "exchange"
-}];
+const getPartnerTypes = t => {
+  return [{
+    label: t("Individual"),
+    value: "individual"
+  }, {
+    label: t("Organisation"),
+    value: "organisation"
+  }];
+};
+const getPartnershipTypes = t => {
+  return [{
+    label: t("Source"),
+    value: "source"
+  }, {
+    label: t("Client"),
+    value: "client"
+  }, {
+    label: t("Exchange"),
+    value: "exchange"
+  }];
+};
 
 const getColumns$2 = ({
   t,
@@ -35152,6 +35172,7 @@ const getColumns$2 = ({
         className: "daf-default-cell"
       });
     }
+    const partnershipTypes = getPartnershipTypes(t);
     return partnershipTypes.find(v => v.value === val)?.label || val || "-";
   }
 }, {
@@ -35168,6 +35189,7 @@ const getColumns$2 = ({
         className: "daf-default-cell"
       });
     }
+    const partnerTypes = getPartnerTypes(t);
     return partnerTypes.find(v => v.value === val)?.label || val || "-";
   }
 }, {
@@ -35473,6 +35495,8 @@ const Create = ({
   getAppHeader = () => {},
   getApiBaseUrl = () => {}
 }) => {
+  const partnerTypes = React.useMemo(() => getPartnerTypes(t), [t]);
+  const partnershipTypes = React.useMemo(() => getPartnershipTypes(t), [t]);
   const form = React.useMemo(() => ({
     identification: {
       partnershipType: {
@@ -35679,6 +35703,8 @@ const Edit = ({
 }) => {
   const [MainForm] = antd.Form.useForm();
   const [loading, setLoading] = React.useState(false);
+  React.useMemo(() => getPartnerTypes(t), [t]);
+  const partnershipTypes = React.useMemo(() => getPartnershipTypes(t), [t]);
   React.useEffect(() => {
     MainForm.setFieldsValue({
       ...partner,
@@ -36263,7 +36289,7 @@ const getKeyIndicatorConfig = ({
   }
 }];
 
-const KeyInformation$1 = ({
+const KeyInformation$2 = ({
   options = {},
   selectedPartners = {},
   t = () => {},
@@ -37235,6 +37261,9 @@ const TradeRelationships = ({
     operatorData,
     APP
   });
+  console.log({
+    graphData
+  });
   React.useEffect(() => {
     const defaultProduct = filterConfig?.[0]?.options?.[0]?.value;
     if (!filters.products && defaultProduct) {
@@ -37914,12 +37943,12 @@ const OperatorSummary = ({
   });
   return /*#__PURE__*/jsxRuntime.jsxs(DashboardLayout, {
     header: /*#__PURE__*/jsxRuntime.jsx(DAFHeader, {
-      title: hasSelect ? t("Operator Review") : (singleItemData?.name || "") + " " + t("Summary"),
+      title: hasSelect ? t("Operator Review") : `${singleItemData?.name || ""} ${singleItemData?.name ? t("Summary") : ""}`,
       className: "with-border-header h-w-btn-header no-px-body",
       goBackTo: !hasSelect && goBack,
       breadcrumbs: breadcrumbs,
       addedHeaderFirst: true,
-      actionButtons: [{
+      actionButtons: hasSelect ? [] : [{
         tooltip: t("Details"),
         icon: "FileEdit",
         onClick: () => {
@@ -37933,9 +37962,6 @@ const OperatorSummary = ({
       }],
       addedHeader: /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "flex flex-row gap-4",
-        style: {
-          marginRight: 8
-        },
         children: /*#__PURE__*/jsxRuntime.jsx(Multiselect, {
           options: [...sourceOptions],
           isAvatarGroup: true,
@@ -37951,7 +37977,10 @@ const OperatorSummary = ({
           dropDownWidth: 200,
           defaultSelected: (partners || []).map(p => p.id) || []
         }, partners?.length)
-      })
+      }),
+      onDownload: () => {
+        console.log("onDownload");
+      }
     }),
     children: [hasSelect && /*#__PURE__*/jsxRuntime.jsx("section", {
       children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
@@ -37972,7 +38001,7 @@ const OperatorSummary = ({
           size: "small"
         }) : null
       })
-    }), /*#__PURE__*/jsxRuntime.jsx(KeyInformation$1, {
+    }), /*#__PURE__*/jsxRuntime.jsx(KeyInformation$2, {
       options: options,
       selectedPartners: selectedPartners,
       t: t,
@@ -42091,6 +42120,63 @@ const renderNumber = (val, doubleDigit = false) => {
   return _string;
 };
 
+/**
+ * Calculates stat change object for StatCard component based on current and previous values
+ * @param {Object} data - Object with current and previous values
+ * @param {number} data.current - Current value
+ * @param {number} data.previous - Previous value
+ * @param {Object} options - Optional configuration
+ * @param {string} options.tooltipText - Custom tooltip text
+ * @param {string} options.format - Format type: 'percentage' (default) or 'absolute'
+ * @param {number} options.decimalPlaces - Number of decimal places for percentage (default: 1)
+ * @returns {Object|null} Change object for StatCard or null if data is invalid
+ */
+const calculateStatChange = (data, options = {}) => {
+  if (!data || typeof data !== 'object') {
+    return null;
+  }
+  const {
+    current,
+    previous
+  } = data;
+
+  // Validate that both values are numbers
+  if (typeof current !== 'number' || typeof previous !== 'number') {
+    return null;
+  }
+
+  // If previous is 0, we can't calculate percentage change
+  if (previous === 0) {
+    return null;
+  }
+  const {
+    tooltipText,
+    format = 'percentage',
+    decimalPlaces = 1
+  } = options;
+
+  // Calculate the difference
+  const difference = current - previous;
+  const isPositive = difference >= 0;
+  const direction = isPositive ? 'up' : 'down';
+
+  // Format the value
+  let value;
+  if (format === 'absolute') {
+    // Show absolute difference
+    value = Math.abs(difference).toLocaleString();
+  } else {
+    // Show percentage change
+    const percentageChange = Math.abs(difference) / previous * 100;
+    value = `${percentageChange.toFixed(decimalPlaces)}%`;
+  }
+  return {
+    value,
+    direction,
+    tooltipText: tooltipText || undefined
+  };
+};
+
 styled__default["default"].div`
 	height: 333px;
 	width: calc(100% - 48px);
@@ -43245,7 +43331,7 @@ styled__default["default"].div`
   flex: 1;
 `;
 
-const getKeyIndicatorsRowConfig$1 = ({
+const getKeyIndicatorsRowConfig$2 = ({
   t,
   data = {}
 }) => [{
@@ -43904,7 +43990,7 @@ const RestorationActivitySummary = ({
   loading,
   t = () => {}
 }) => {
-  const keyIndicatorsConfig = React.useMemo(() => getKeyIndicatorsRowConfig$1({
+  const keyIndicatorsConfig = React.useMemo(() => getKeyIndicatorsRowConfig$2({
     t,
     data: activityData
   }), [t, activityData]);
@@ -44114,63 +44200,6 @@ const PlantingLocations = ({
   });
 };
 
-/**
- * Calculates stat change object for StatCard component based on current and previous values
- * @param {Object} data - Object with current and previous values
- * @param {number} data.current - Current value
- * @param {number} data.previous - Previous value
- * @param {Object} options - Optional configuration
- * @param {string} options.tooltipText - Custom tooltip text
- * @param {string} options.format - Format type: 'percentage' (default) or 'absolute'
- * @param {number} options.decimalPlaces - Number of decimal places for percentage (default: 1)
- * @returns {Object|null} Change object for StatCard or null if data is invalid
- */
-const calculateStatChange = (data, options = {}) => {
-  if (!data || typeof data !== 'object') {
-    return null;
-  }
-  const {
-    current,
-    previous
-  } = data;
-
-  // Validate that both values are numbers
-  if (typeof current !== 'number' || typeof previous !== 'number') {
-    return null;
-  }
-
-  // If previous is 0, we can't calculate percentage change
-  if (previous === 0) {
-    return null;
-  }
-  const {
-    tooltipText,
-    format = 'percentage',
-    decimalPlaces = 1
-  } = options;
-
-  // Calculate the difference
-  const difference = current - previous;
-  const isPositive = difference >= 0;
-  const direction = isPositive ? 'up' : 'down';
-
-  // Format the value
-  let value;
-  if (format === 'absolute') {
-    // Show absolute difference
-    value = Math.abs(difference).toLocaleString();
-  } else {
-    // Show percentage change
-    const percentageChange = Math.abs(difference) / previous * 100;
-    value = `${percentageChange.toFixed(decimalPlaces)}%`;
-  }
-  return {
-    value,
-    direction,
-    tooltipText: tooltipText || undefined
-  };
-};
-
 /**
  * Formats a date based on the time filter
  * @param {dayjs.Dayjs} date - The date to format
@@ -46528,7 +46557,7 @@ const AssociatedInformation = ({
   });
 };
 
-const getKeyIndicatorsRowConfig = ({
+const getKeyIndicatorsRowConfig$1 = ({
   t,
   data = {}
 }) => [{
@@ -46568,7 +46597,7 @@ const getKeyIndicatorsRowConfig = ({
   }
 }];
 
-const KeyInformation = ({
+const KeyInformation$1 = ({
   id,
   t = () => {},
   getSummaryDetail,
@@ -46602,7 +46631,7 @@ const KeyInformation = ({
     config: defaultConfig,
     getData: customGetData
   });
-  const keyIndicatorsConfig = React.useMemo(() => getKeyIndicatorsRowConfig({
+  const keyIndicatorsConfig = React.useMemo(() => getKeyIndicatorsRowConfig$1({
     t,
     data: keyInformationData
   }), [t, keyInformationData]);
@@ -46637,7 +46666,7 @@ const PlantingCycleSummary = ({
       goBackTo: header?.goBackTo,
       loading: header?.loading
     }),
-    children: [/*#__PURE__*/jsxRuntime.jsx(KeyInformation, {
+    children: [/*#__PURE__*/jsxRuntime.jsx(KeyInformation$1, {
       id: id,
       t: t,
       getSummaryDetail: getSummaryDetail,
@@ -46674,6 +46703,786 @@ const PlantingCycleSummary = ({
   });
 };
 
+const getKeyIndicatorsRowConfig = ({
+  t,
+  data = {}
+}) => [{
+  label: t('Region'),
+  render: () => {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      children: data?.region || '-'
+    });
+  }
+}, {
+  label: t('Associated Plots'),
+  render: () => {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      children: data?.associatedPlotsCount || '0'
+    });
+  }
+}, {
+  label: t('Implementation Partners'),
+  render: () => {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      children: data?.partnersCount || '0'
+    });
+  }
+}, {
+  label: t('Total Activities'),
+  render: () => {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      children: data?.activitiesCount || '0'
+    });
+  }
+}, {
+  label: t('Information Sources'),
+  render: () => {
+    return /*#__PURE__*/jsxRuntime.jsx("div", {
+      children: data?.informationSourcesCount || '0'
+    });
+  }
+}];
+
+const KeyInformation = ({
+  id,
+  t = () => {},
+  getSummaryDetail,
+  loading = false
+}) => {
+  const defaultConfig = React.useMemo(() => ({
+    basepath: "events/monitoring-campaign",
+    url: `/summary/${id}/key-information`,
+    stop: !id
+  }), [id]);
+  const customGetData = React.useMemo(() => {
+    if (getSummaryDetail && id) {
+      return ({
+        url,
+        params = {}
+      }) => {
+        const match = url.match(/\/summary\/[^/]+\/(.+)/);
+        if (match) {
+          const [, type] = match;
+          return getSummaryDetail(id, type, params);
+        }
+        throw new Error(`Invalid URL format: ${url}`);
+      };
+    }
+    return undefined;
+  }, [getSummaryDetail, id]);
+  const {
+    loading: keyInformationLoading,
+    data: keyInformationData
+  } = useWidgetFetch({
+    config: defaultConfig,
+    getData: customGetData
+  });
+  const keyIndicatorsConfig = React.useMemo(() => getKeyIndicatorsRowConfig({
+    t,
+    data: keyInformationData
+  }), [t, keyInformationData]);
+  return /*#__PURE__*/jsxRuntime.jsx("section", {
+    children: /*#__PURE__*/jsxRuntime.jsx(KeyIndicatorsWidget, {
+      title: t("Key Information"),
+      config: keyIndicatorsConfig,
+      loading: loading || keyInformationLoading
+    })
+  });
+};
+
+const VISITS_TAB = "visits";
+const GROWTH_AND_SURVIVAL_TAB = "growthAndSurvival";
+const FAUNA_SIGHTINGS_TAB = "faunaSightings";
+const INVASIVE_SPECIES_TAB = "invasiveSpecies";
+const SYMPTOM_HOTSPOTS_TAB = "symptomHotspots";
+const SOIL_TAB = "soil";
+const MonitoringScopeAndFindings = ({
+  id,
+  getSummaryDetail,
+  loading = false,
+  t = s => s
+}) => {
+  const [activeTab, setActiveTab] = React.useState(VISITS_TAB);
+  const defaultConfig = React.useMemo(() => ({
+    basepath: "events/monitoring-campaign",
+    url: `/summary/${id}/monitoring-scope`,
+    stop: !id
+  }), [id]);
+  const customGetData = React.useMemo(() => {
+    if (getSummaryDetail && id) {
+      return ({
+        url,
+        params = {}
+      }) => {
+        const match = url.match(/\/summary\/[^/]+\/(.+)/);
+        if (match) {
+          const [, type] = match;
+          return getSummaryDetail(id, type, {
+            ...params,
+            tab: activeTab
+          });
+        }
+        throw new Error(`Invalid URL format: ${url}`);
+      };
+    }
+    return undefined;
+  }, [getSummaryDetail, id, activeTab]);
+  const {
+    loading: monitoringScopeLoading,
+    data: monitoringScopeData
+  } = useWidgetFetch({
+    config: defaultConfig,
+    getData: customGetData
+  });
+  const filtersConfig = React.useMemo(() => {
+    switch (activeTab) {
+      case GROWTH_AND_SURVIVAL_TAB:
+        return [{
+          label: t("Mangrove Survival Rate"),
+          placeholder: t("Select"),
+          key: "mangroveSurvivalRate",
+          type: "slider"
+        }, {
+          label: t("Planting Density"),
+          placeholder: t("Select"),
+          key: "plantingDensity",
+          type: "select"
+        }];
+      case FAUNA_SIGHTINGS_TAB:
+        return [{
+          label: t("Fauna Observed"),
+          placeholder: t("Select"),
+          key: "faunaSightings",
+          type: "select",
+          options: [{
+            label: t("Birds"),
+            value: "birds"
+          }, {
+            label: t("Crabs"),
+            value: "crabs"
+          }, {
+            label: t("Fish"),
+            value: "fish"
+          }, {
+            label: t("Molluscs"),
+            value: "molluscs"
+          }, {
+            label: t("Oysters"),
+            value: "oysters"
+          }]
+        }];
+      case INVASIVE_SPECIES_TAB:
+        return [{
+          label: t("Fauna Observed"),
+          placeholder: t("Select"),
+          key: "invasiveSpecies",
+          type: "select",
+          options: [{
+            label: t("Spiders"),
+            value: "spiders"
+          }, {
+            label: t("Scale insects"),
+            value: "scaleInsects"
+          }, {
+            label: t("Caterpillars"),
+            value: "caterpillars"
+          }, {
+            label: t("Unidentified pests"),
+            value: "unidentifiedPests"
+          }, {
+            label: t("Other"),
+            value: "other"
+          }]
+        }];
+      case SYMPTOM_HOTSPOTS_TAB:
+        return [{
+          label: t("Symptom Hotspots"),
+          placeholder: t("Select"),
+          key: "symptomHotspots",
+          type: "select",
+          options: [{
+            label: t("Reddish spots on leaves"),
+            value: "reddishSpotsOnLeaves"
+          }, {
+            label: t("Black spots on leaves"),
+            value: "blackSpotsOnLeaves"
+          }, {
+            label: t("Yellowing of leaves"),
+            value: "yellowingOfLeaves"
+          }, {
+            label: t("Presence of mosaic"),
+            value: "presenceOfMosaic"
+          }]
+        }];
+      case SOIL_TAB:
+        return [{
+          label: t("Soil"),
+          placeholder: t("Select"),
+          key: "soil",
+          type: "select",
+          options: [{
+            label: t("Sandy"),
+            value: "sandy"
+          }, {
+            label: t("Clay"),
+            value: "clay"
+          }, {
+            label: t("Muddy"),
+            value: "muddy"
+          }, {
+            label: t("Loamy"),
+            value: "loamy"
+          }, {
+            label: t("Mixed"),
+            value: "mixed"
+          }]
+        }];
+      default:
+        return [];
+    }
+  }, [activeTab, t]);
+  const mappedData = React.useMemo(() => {
+    if (!monitoringScopeData || !monitoringScopeData.plots) {
+      return [];
+    }
+    const {
+      plots = [],
+      monitoringActivities = []
+    } = monitoringScopeData;
+    if (activeTab === VISITS_TAB) {
+      return plots.map((plot, index) => {
+        const area = plot?.perimeter ? plot.perimeter.map(coord => Array.isArray(coord) && coord.length >= 2 ? [coord[1], coord[0]] : coord) : null;
+        const validArea = area && Array.isArray(area) && area.length >= 3 ? area : null;
+        const matchingActivity = monitoringActivities?.find(activity => activity.plotId === plot.id || activity.plotId === plot._id);
+        const gps = matchingActivity?.locationCheckArrival ? {
+          latitude: matchingActivity.locationCheckArrival.latitude,
+          longitude: matchingActivity.locationCheckArrival.longitude
+        } : null;
+        return {
+          _id: plot._id || {},
+          area: validArea,
+          color: "#15FFFFB2",
+          datastakeId: plot.datastakeId || `PLOT-${String(index + 1).padStart(9, '0')}`,
+          gps: gps,
+          id: plot.id || plot._id || `plot-${index}`,
+          name: plot.name || t("Plot"),
+          date: matchingActivity?.date,
+          subTitle: matchingActivity?.date ? renderDateFormatted(matchingActivity.date, "DD MMM YY") : plot.name,
+          plotName: plot.name,
+          territoryTitle: plot.name,
+          type: plot.type || 'Operational Plot',
+          lastVisit: matchingActivity?.date,
+          implementer: matchingActivity?.implementer,
+          areaHa: plot.area
+        };
+      });
+    }
+    return plots.map((plot, index) => {
+      const area = plot?.perimeter ? plot.perimeter.map(coord => Array.isArray(coord) && coord.length >= 2 ? [coord[1], coord[0]] : coord) : null;
+      const validArea = area && Array.isArray(area) && area.length >= 3 ? area : null;
+      return {
+        _id: plot._id || {},
+        area: validArea,
+        color: "#15FFFFB2",
+        datastakeId: plot.datastakeId || `PLOT-${String(index + 1).padStart(9, '0')}`,
+        id: plot.id || plot._id || `plot-${index}`,
+        name: plot.name || t("Plot"),
+        plotName: plot.name,
+        territoryTitle: plot.name,
+        type: plot.type || 'Operational Plot'
+      };
+    });
+  }, [monitoringScopeData, activeTab, t]);
+  return /*#__PURE__*/jsxRuntime.jsx("section", {
+    children: /*#__PURE__*/jsxRuntime.jsx(Widget, {
+      title: t("Monitoring Scope & Findings"),
+      className: "v2-widget no-px no-p-body h-w-btn-header with-border-header",
+      style: {
+        height: '100%',
+        display: 'flex',
+        flexDirection: 'column'
+      },
+      tabsConfig: {
+        tabs: [{
+          label: t("Visits"),
+          value: VISITS_TAB
+        }, {
+          label: t("Growth & Survival"),
+          value: GROWTH_AND_SURVIVAL_TAB
+        }, {
+          label: t("Fauna Sightings"),
+          value: FAUNA_SIGHTINGS_TAB
+        }, {
+          label: t("Invasive Species"),
+          value: INVASIVE_SPECIES_TAB
+        }, {
+          label: t("Symptom Hotspots"),
+          value: SYMPTOM_HOTSPOTS_TAB
+        }, {
+          label: t("Soil"),
+          value: SOIL_TAB
+        }],
+        value: activeTab,
+        onChange: setActiveTab
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(Map$1, {
+        data: mappedData,
+        link: false,
+        style: {
+          height: '100%',
+          width: '100%'
+        },
+        maxZoom: 18,
+        isSatellite: true,
+        onClickLink: () => {},
+        onFilterChange: () => {},
+        primaryLink: true,
+        showSider: false,
+        filtersConfig: filtersConfig,
+        renderTooltipForLocation: data => {
+          if (activeTab === VISITS_TAB && data.gps) {
+            const coordinates = data.gps?.latitude && data.gps?.longitude ? convertDMS(data.gps.latitude, data.gps.longitude) : null;
+            if (!coordinates) {
+              return [];
+            }
+            const iconColor = "#016C6E";
+            const tooltipItems = [{
+              label: t("Coordinates"),
+              value: /*#__PURE__*/jsxRuntime.jsxs("div", {
+                style: {
+                  display: 'flex',
+                  alignItems: 'center',
+                  gap: '6px',
+                  flexWrap: 'nowrap'
+                },
+                children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+                  style: {
+                    display: 'flex',
+                    alignItems: 'center'
+                  },
+                  children: [/*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
+                    name: "SpacingHeight",
+                    width: 14,
+                    height: 14,
+                    color: iconColor
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    style: {
+                      fontWeight: 600,
+                      marginLeft: '4px'
+                    },
+                    children: coordinates[0]
+                  })]
+                }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+                  style: {
+                    display: 'flex',
+                    alignItems: 'center'
+                  },
+                  children: [/*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
+                    name: "SpacingWidth",
+                    width: 14,
+                    height: 14,
+                    color: iconColor
+                  }), /*#__PURE__*/jsxRuntime.jsx("span", {
+                    style: {
+                      fontWeight: 600,
+                      marginLeft: '4px'
+                    },
+                    children: coordinates[1]
+                  })]
+                })]
+              })
+            }];
+            if (data.date) {
+              tooltipItems.push({
+                label: t("Date"),
+                value: renderDateFormatted(data.date, "DD MMM YY")
+              });
+            }
+            if (data.implementer) {
+              tooltipItems.push({
+                label: t("Implementer"),
+                value: data.implementer
+              });
+            }
+            return tooltipItems;
+          }
+          return [];
+        },
+        renderTooltipForTerritory: data => {
+          const items = [{
+            label: t("Plot Name"),
+            value: data.plotName || data.name || "--"
+          }];
+          if (activeTab === VISITS_TAB && data.lastVisit) {
+            items.push({
+              label: t("Last visit"),
+              value: renderDateFormatted(data.lastVisit, "DD MMM YY")
+            });
+          }
+          if (activeTab === VISITS_TAB && data.areaHa) {
+            items.push({
+              label: t("Area"),
+              value: `${data.areaHa} ha`
+            });
+          }
+          return items;
+        },
+        renderTooltipTags: () => {},
+        type: "location-territory",
+        loading: loading || monitoringScopeLoading
+      })
+    })
+  });
+};
+
+const COLORS$1 = ['#016C6E', '#F5C2AC', '#F0A888', '#DF571E', '#C04B19', '#9B3D14', '#7A2F0F'];
+const VegetationHealth = ({
+  vegetationHealthChart,
+  t = s => s
+}) => {
+  const pieData = React.useMemo(() => {
+    const data = vegetationHealthChart || [];
+    const total = data.reduce((sum, item) => sum + (Number(item?.value) || 0), 0);
+    return data.map((item, index) => ({
+      value: Number(item?.value) || 0,
+      percent: total > 0 ? (Number(item?.value) || 0) / total : 0,
+      color: COLORS$1[index % COLORS$1.length],
+      label: item?.type || '',
+      key: item?.type || `item-${index}`
+    }));
+  }, [vegetationHealthChart]);
+  const isEmpty = React.useMemo(() => {
+    return !vegetationHealthChart || vegetationHealthChart.length === 0 || vegetationHealthChart.every(item => !item?.value || Number(item.value) === 0);
+  }, [vegetationHealthChart]);
+  const getTooltipChildren = React.useCallback(item => {
+    if (isEmpty) {
+      return null;
+    }
+    return renderTooltipJsx({
+      title: t("Vegetation Health"),
+      items: [{
+        color: item.color,
+        label: item.label || '',
+        value: `${item.value || 0}%`
+      }]
+    });
+  }, [t, isEmpty]);
+  return /*#__PURE__*/jsxRuntime.jsx(Widget, {
+    title: t("Vegetation Health"),
+    className: "with-border-header h-w-btn-header",
+    children: /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex flex-1 flex-column justify-content-center",
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex justify-content-center w-full",
+        children: /*#__PURE__*/jsxRuntime.jsx(Chart, {
+          data: pieData,
+          isPie: true,
+          isEmpty: isEmpty,
+          getTooltipChildren: getTooltipChildren,
+          mouseXOffset: 10,
+          mouseYOffset: 10,
+          changeOpacityOnHover: false,
+          doConstraints: false
+        })
+      })
+    })
+  });
+};
+
+const SeedlingsHeight = ({
+  seedlingsHeightChart,
+  t = s => s
+}) => {
+  return /*#__PURE__*/jsxRuntime.jsx(Widget, {
+    title: t("Seedlings Height"),
+    className: "with-border-header h-w-btn-header",
+    children: /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex flex-1 flex-column justify-content-center",
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex justify-content-center w-full",
+        children: /*#__PURE__*/jsxRuntime.jsx(ColumnChart, {
+          data: seedlingsHeightChart || [],
+          xFieldKey: "label",
+          yFieldKey: "value",
+          animated: true,
+          height: 200,
+          color: "#016C6E",
+          renderTooltipContent: (title, data) => {
+            if (!data || data.length === 0) return {};
+            const item = data[0]?.data || data[0];
+            return {
+              title: t("Seedlings Height"),
+              subTitle: title,
+              items: [{
+                label: t("Count"),
+                value: item?.value || 0
+              }]
+            };
+          }
+        })
+      })
+    })
+  });
+};
+
+const COLORS = ['#016C6E', '#F5C2AC', '#F0A888', '#DF571E', '#C04B19', '#9B3D14', '#7A2F0F'];
+const PlantedSpecies = ({
+  plantedSpeciesChart,
+  t = s => s
+}) => {
+  const pieData = React.useMemo(() => {
+    const data = plantedSpeciesChart || [];
+    const total = data.reduce((sum, item) => sum + (Number(item?.value) || 0), 0);
+    return data.map((item, index) => ({
+      value: Number(item?.value) || 0,
+      percent: total > 0 ? (Number(item?.value) || 0) / total : 0,
+      color: COLORS[index % COLORS.length],
+      label: item?.type || '',
+      key: item?.type || `item-${index}`
+    }));
+  }, [plantedSpeciesChart]);
+  const isEmpty = React.useMemo(() => {
+    return !plantedSpeciesChart || plantedSpeciesChart.length === 0 || plantedSpeciesChart.every(item => !item?.value || Number(item.value) === 0);
+  }, [plantedSpeciesChart]);
+  const getTooltipChildren = React.useCallback(item => {
+    if (isEmpty) {
+      return null;
+    }
+    return renderTooltipJsx({
+      title: t("Planted Species"),
+      items: [{
+        color: item.color,
+        label: item.label || '',
+        value: item.value || 0
+      }]
+    });
+  }, [t, isEmpty]);
+  return /*#__PURE__*/jsxRuntime.jsx(Widget, {
+    title: t("Planted Species"),
+    className: "with-border-header h-w-btn-header",
+    children: /*#__PURE__*/jsxRuntime.jsx("div", {
+      className: "flex flex-1 flex-column justify-content-center",
+      children: /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex justify-content-center w-full",
+        children: /*#__PURE__*/jsxRuntime.jsx(Chart, {
+          data: pieData,
+          isPie: true,
+          isEmpty: isEmpty,
+          getTooltipChildren: getTooltipChildren,
+          mouseXOffset: 10,
+          mouseYOffset: 10,
+          changeOpacityOnHover: false,
+          doConstraints: false
+        })
+      })
+    })
+  });
+};
+
+const Stats = ({
+  survivalRate,
+  averageHeight,
+  averageDiameter,
+  t = s => s
+}) => {
+  const survivalRateChange = React.useMemo(() => {
+    if (!survivalRate) return null;
+    return calculateStatChange({
+      current: Number(survivalRate.current) || 0,
+      previous: Number(survivalRate.previous) || 0
+    }, {
+      tooltipText: t("In comparison to last period"),
+      format: 'absolute'
+    });
+  }, [survivalRate, t]);
+  const averageHeightChange = React.useMemo(() => {
+    if (!averageHeight) return null;
+    return calculateStatChange({
+      current: Number(averageHeight.current) || 0,
+      previous: Number(averageHeight.previous) || 0
+    }, {
+      tooltipText: t("In comparison to last period"),
+      format: 'absolute'
+    });
+  }, [averageHeight, t]);
+  const averageDiameterChange = React.useMemo(() => {
+    if (!averageDiameter) return null;
+    return calculateStatChange({
+      current: Number(averageDiameter.current) || 0,
+      previous: Number(averageDiameter.previous) || 0
+    }, {
+      tooltipText: t("In comparison to last period"),
+      format: 'absolute'
+    });
+  }, [averageDiameter, t]);
+  return /*#__PURE__*/jsxRuntime.jsxs("div", {
+    style: {
+      display: "flex",
+      gap: "24px",
+      marginBottom: "24px"
+    },
+    children: [/*#__PURE__*/jsxRuntime.jsx("section", {
+      style: {
+        flex: 1
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(StatCard, {
+        title: t("Survival Rate"),
+        value: survivalRate ? Number(survivalRate.current).toLocaleString() : "0",
+        icon: "EventCalendar",
+        change: survivalRateChange
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx("section", {
+      style: {
+        flex: 1
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(StatCard, {
+        title: t("Average Height"),
+        value: averageHeight ? Number(averageHeight.current).toLocaleString() + " cm" : "0 cm",
+        icon: "ProjectLocation",
+        change: averageHeightChange
+      })
+    }), /*#__PURE__*/jsxRuntime.jsx("section", {
+      style: {
+        flex: 1
+      },
+      children: /*#__PURE__*/jsxRuntime.jsx(StatCard, {
+        title: t("Average Diameter"),
+        value: averageDiameter ? Number(averageDiameter.current).toLocaleString() + " mm" : "0 mm",
+        icon: "Activity",
+        change: averageDiameterChange
+      })
+    })]
+  });
+};
+
+const MangroveGrowth = ({
+  id,
+  getSummaryDetail,
+  loading = false,
+  t = s => s
+}) => {
+  const defaultConfig = React.useMemo(() => ({
+    basepath: "events/monitoring-campaign",
+    url: `/summary/${id}/outcomes`,
+    stop: !id
+  }), [id]);
+  const customGetData = React.useMemo(() => {
+    if (getSummaryDetail && id) {
+      return ({
+        url,
+        params = {}
+      }) => {
+        const match = url.match(/\/summary\/[^/]+\/(.+)/);
+        if (match) {
+          const [, type] = match;
+          return getSummaryDetail(id, type, params);
+        }
+        throw new Error(`Invalid URL format: ${url}`);
+      };
+    }
+    return undefined;
+  }, [getSummaryDetail, id]);
+  const {
+    loading: outcomesLoading,
+    data: outcomesData
+  } = useWidgetFetch({
+    config: defaultConfig,
+    getData: customGetData
+  });
+  const {
+    survivalRate,
+    averageHeight,
+    averageDiameter,
+    vegetationHealthChart,
+    seedlingsHeightChart,
+    plantedSpeciesChart
+  } = outcomesData || {};
+  return /*#__PURE__*/jsxRuntime.jsx("section", {
+    children: /*#__PURE__*/jsxRuntime.jsxs(Widget, {
+      title: t("Mangrove Growth"),
+      loading: loading || outcomesLoading,
+      className: "with-border-header h-w-btn-header",
+      children: [/*#__PURE__*/jsxRuntime.jsx(Stats, {
+        survivalRate: survivalRate,
+        averageHeight: averageHeight,
+        averageDiameter: averageDiameter,
+        t: t
+      }), /*#__PURE__*/jsxRuntime.jsxs("div", {
+        style: {
+          display: "flex",
+          gap: "24px"
+        },
+        children: [/*#__PURE__*/jsxRuntime.jsx("section", {
+          style: {
+            flex: 1
+          },
+          children: /*#__PURE__*/jsxRuntime.jsx(VegetationHealth, {
+            vegetationHealthChart: vegetationHealthChart,
+            t: t
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx("section", {
+          style: {
+            flex: 1
+          },
+          children: /*#__PURE__*/jsxRuntime.jsx(SeedlingsHeight, {
+            seedlingsHeightChart: seedlingsHeightChart,
+            t: t
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx("section", {
+          style: {
+            flex: 1
+          },
+          children: /*#__PURE__*/jsxRuntime.jsx(PlantedSpecies, {
+            plantedSpeciesChart: plantedSpeciesChart,
+            t: t
+          })
+        })]
+      })]
+    })
+  });
+};
+
+const MonitoringCampaignSummary = ({
+  header,
+  activityData,
+  loading = false,
+  id,
+  projectId,
+  t = () => {},
+  getSummaryDetail,
+  navigate,
+  selectOptions
+}) => {
+  return /*#__PURE__*/jsxRuntime.jsxs(DashboardLayout, {
+    header: /*#__PURE__*/jsxRuntime.jsx(DAFHeader, {
+      title: header?.title + ' Summary' || '',
+      supportText: header?.supportText || '',
+      onDownload: header?.onDownload,
+      downloadDisabled: header?.downloadDisabled,
+      actionButtons: header?.actionButtons,
+      breadcrumbs: header?.breadcrumbs,
+      goBackTo: header?.goBackTo,
+      loading: header?.loading
+    }),
+    children: [/*#__PURE__*/jsxRuntime.jsx(KeyInformation, {
+      id: id,
+      t: t,
+      getSummaryDetail: getSummaryDetail,
+      loading: loading
+    }), /*#__PURE__*/jsxRuntime.jsx(MonitoringScopeAndFindings, {
+      id: id,
+      t: t,
+      getSummaryDetail: getSummaryDetail,
+      loading: loading
+    }), /*#__PURE__*/jsxRuntime.jsx(MangroveGrowth, {
+      id: id,
+      t: t,
+      getSummaryDetail: getSummaryDetail,
+      loading: loading
+    })]
+  });
+};
+
 const IconNodesConfig = {
   operator: {
     name: "Operators",
@@ -47063,13 +47872,12 @@ const MineSummary = ({
   });
   return /*#__PURE__*/jsxRuntime.jsxs(DashboardLayout, {
     header: /*#__PURE__*/jsxRuntime.jsx(DAFHeader, {
-      title: hasSelect ? t("Mine Review") : (singleItemData?.name || "") + " " + t("Summary"),
+      title: hasSelect ? t("Mine Review") : `${singleItemData?.name || ""} ${singleItemData?.name ? t("Summary") : ""}`,
       className: "with-border-header h-w-btn-header no-px-body",
       goBackTo: !hasSelect && goBack,
-      loading: loading,
       breadcrumbs: breadcrumbs,
       addedHeaderFirst: true,
-      actionButtons: [{
+      actionButtons: hasSelect ? [] : [{
         tooltip: t("Details"),
         icon: "FileEdit",
         onClick: () => {
@@ -47083,9 +47891,6 @@ const MineSummary = ({
       }],
       addedHeader: /*#__PURE__*/jsxRuntime.jsx("div", {
         className: "flex flex-row gap-4",
-        style: {
-          marginRight: 8
-        },
         children: /*#__PURE__*/jsxRuntime.jsx(Multiselect, {
           options: [...sourceOptions],
           isAvatarGroup: true,
@@ -47101,7 +47906,10 @@ const MineSummary = ({
           dropDownWidth: 200,
           defaultSelected: (partners || []).map(p => p.id) || []
         }, partners?.length)
-      })
+      }),
+      onDownload: () => {
+        console.log("onDownload");
+      }
     }),
     children: [hasSelect && /*#__PURE__*/jsxRuntime.jsx("section", {
       children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
@@ -47258,19 +48066,19 @@ const usePrepareForm = ({
         linkingForms = {}
       } = JSON.parse(JSON.stringify(allData[dKey][nKey] || {}));
       if (data.datastakeId === id || id === "user") {
-        if (viewConfig.linkingSubjects.includes(namespace)) {
-          setForm({
-            ...form,
-            linking: {
-              position: 100,
-              excludeFromEdit: true,
-              label: t("Linked Subjects"),
-              template: "linkingSubjects"
-            }
-          });
-        } else {
-          setForm(form);
-        }
+        //   if (viewConfig.linkingSubjects.includes(namespace)) {
+        setForm({
+          ...form,
+          linking: {
+            position: 100,
+            excludeFromEdit: true,
+            label: t("Linked Subjects"),
+            template: "linkingSubjects"
+          }
+        });
+        //   } else {
+        //       setForm(form);
+        //   }
         setData(data);
         setGroups(config.groups || {});
         setLinkingForms(linkingForms);
@@ -47577,6 +48385,18 @@ const renderType = ({
   }
   return "--";
 };
+const namespaceMap = {
+  locations: "location",
+  documents: "document",
+  stakeholders: "stakeholder",
+  events: "event",
+  incidents: "event",
+  correctiveActions: "event",
+  "production-sites": "location",
+  operators: "stakeholder",
+  workers: "stakeholder",
+  activities: "event"
+};
 
 const getColumns = ({
   t,
@@ -47831,10 +48651,11 @@ const LinkingTemplate = ({
   }), [conf]);
   const id = conf.allData.id;
   const dataSource = conf?.linkingTemplateContextData?.[id];
+  const _namespace = namespaceMap[namespace];
   const changeData = async () => {
     try {
       const _data = await LinkedSubjectsService$1.getLinkedSubjects({
-        namespace,
+        namespace: _namespace,
         id,
         mod: conf.mod
       });
@@ -47920,18 +48741,10 @@ function Template({
   conf,
   namespace
 }) {
-  switch (namespace) {
-    case 'locations':
-    case 'documents':
-    case 'stakeholders':
-    case 'events':
-      return /*#__PURE__*/jsxRuntime.jsx(LinkingTemplate, {
-        conf: conf,
-        namespace: namespace
-      });
-    default:
-      return null;
-  }
+  return /*#__PURE__*/jsxRuntime.jsx(LinkingTemplate, {
+    conf: conf,
+    namespace: namespace
+  });
 }
 
 const View = ({
@@ -48145,14 +48958,12 @@ const View = ({
         addedHeaderFirst: true,
         addedHeader: /*#__PURE__*/jsxRuntime.jsx("div", {
           className: "flex flex-row gap-4",
-          style: {
-            marginRight: 8
-          },
           children: /*#__PURE__*/jsxRuntime.jsx(Multiselect, {
             options: [...sourceOptions],
             isAvatarGroup: true,
             selectionType: "checkbox",
             canUnselectLast: false,
+            isSingle: true,
             onChange: selected => {
               setSelectedPartners(prev => ({
                 ...prev,
@@ -48239,6 +49050,7 @@ exports.EventsTable = EventsTable;
 exports.IncidentsTable = IncidentsTable;
 exports.LocationsTable = LocationsTable;
 exports.MineSummary = MineSummary;
+exports.MonitoringCampaignSummary = MonitoringCampaignSummary;
 exports.OperatorSummary = OperatorSummary;
 exports.OperatorsTable = OperatorsTable;
 exports.PartnersTable = PartnersTable;