datastake-daf 0.6.350 → 0.6.352

package/dist/components/index.js

@@ -12252,7 +12252,7 @@ GoToSelect.propTypes = {
 
 const _excluded$s = ["options", "defaultSelected", "onChange", "textWhenMultiple", "withCount", "oneAlwaysSelected", "canUnselectLast", "isAvatarGroup", "maxAvatarCount", "dropDownWidth", "topAvatarValue", "isSingle", "selectionType"];
 const {
-  useToken: useToken$l
+  useToken: useToken$n
 } = antd.theme;
 
 /**
@@ -12346,7 +12346,7 @@ function Multiselect(_ref) {
     restProps = _objectWithoutProperties(_ref, _excluded$s);
   const {
     token
-  } = useToken$l();
+  } = useToken$n();
   const [selectValue, setSelectValue] = React.useState(Array.isArray(defaultSelected) ? defaultSelected.length > 0 ? defaultSelected : [] : [defaultSelected]);
   function onSelectChange(value) {
     if (!canUnselectLast && value.length === 0) {
@@ -12899,7 +12899,7 @@ const useHeader = _ref => {
 };
 
 const {
-  useToken: useToken$k
+  useToken: useToken$m
 } = antd.theme;
 function BreadCrumbs({
   breadcrumbs = [],
@@ -12908,7 +12908,7 @@ function BreadCrumbs({
   const [splitIndex, setSplitIndex] = React.useState(0);
   const {
     token
-  } = useToken$k();
+  } = useToken$m();
   const _renderBreadcrumb = (b, i, isLast, noOnClickLast = false) => {
     return /*#__PURE__*/jsxRuntime.jsxs("div", {
       className: "flex breadcrumb-item",
@@ -21940,7 +21940,7 @@ const {
   Meta
 } = antd.Card;
 const {
-  useToken: useToken$j
+  useToken: useToken$l
 } = antd.theme;
 function ProjectWidget(_ref) {
   let {
@@ -21959,7 +21959,7 @@ function ProjectWidget(_ref) {
   const [isHovered, setIsHovered] = React__default["default"].useState(false);
   const {
     token
-  } = useToken$j();
+  } = useToken$l();
   return /*#__PURE__*/jsxRuntime.jsxs(antd.Card, _objectSpread2(_objectSpread2({
     style: {
       // flex: 1,
@@ -22063,7 +22063,7 @@ const Style$x = dt.div`
 `;
 
 const {
-  useToken: useToken$i
+  useToken: useToken$k
 } = antd.theme;
 const WidgetCard = _ref => {
   let {
@@ -22082,7 +22082,7 @@ const WidgetCard = _ref => {
     width,
     t = () => {}
   } = _ref;
-  useToken$i();
+  useToken$k();
   return /*#__PURE__*/jsxRuntime.jsx(Style$x, {
     backgroundColor: backgroundColor,
     backgroundBorderColor: backgroundBorderColor,
@@ -22795,12 +22795,12 @@ function GroupInfos({
 }
 
 const {
-  useToken: useToken$h
+  useToken: useToken$j
 } = antd.theme;
 function Smart() {
   const {
     token
-  } = useToken$h();
+  } = useToken$j();
   const [isOpen, setIsOpen] = React.useState(false);
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     style: {
@@ -22884,7 +22884,7 @@ function SmartWidget({
 }) {
   const {
     token
-  } = useToken$h();
+  } = useToken$j();
   return /*#__PURE__*/jsxRuntime.jsx(Widget, {
     noTitle: true,
     className: "no-p-body p-xs",
@@ -23823,7 +23823,7 @@ function DataLink$1({
 }
 
 const {
-  useToken: useToken$g
+  useToken: useToken$i
 } = antd.theme;
 const disabledTypes = ["dataLink"];
 function Versions({
@@ -23836,7 +23836,7 @@ function Versions({
 }) {
   const {
     token
-  } = useToken$g();
+  } = useToken$i();
   const dataSource = React.useMemo(() => {
     if (!versionsDatapoints) {
       return [];
@@ -49273,7 +49273,7 @@ StyledTabs.propTypes = {
 };
 
 const {
-  useToken: useToken$f
+  useToken: useToken$h
 } = antd.theme;
 const MAX_LENGTH = 3;
 function AvatarGroup(_ref) {
@@ -49285,7 +49285,7 @@ function AvatarGroup(_ref) {
   const count = items.length === maxLength + 1 ? items.length : maxLength;
   const {
     token
-  } = useToken$f();
+  } = useToken$h();
   return /*#__PURE__*/jsxRuntime.jsx(antd.Avatar.Group, {
     max: {
       count: count,
@@ -49383,7 +49383,7 @@ const Container$1 = dt.div`
 
 const _excluded$7 = ["data", "xFieldKey", "yFieldKey", "renderTooltipContent", "tooltipConfig", "animated", "isStack", "isGroup", "isPercentage", "seriesField", "formattedYAxis", "formattedXAxis", "color", "height", "t", "isPdf", "extraLegendConfig", "width"];
 const {
-  useToken: useToken$e
+  useToken: useToken$g
 } = antd.theme;
 
 /**
@@ -49475,7 +49475,7 @@ function BarChart(_ref) {
   const chartRef = React__default["default"].useRef(null);
   const {
     token
-  } = useToken$e();
+  } = useToken$g();
   const hasLegendConfig = Object.keys(extraLegendConfig).length > 0;
   React__default["default"].useEffect(() => {
     if (!containerRef.current) {
@@ -49546,7 +49546,7 @@ function BarChart(_ref) {
 
 const _excluded$6 = ["data", "xFieldKey", "yFieldKey", "renderTooltipContent", "tooltipConfig", "animated", "isSmooth", "seriesField", "isArea", "formattedYAxis", "formattedXAxis", "color", "isPercentage", "height", "autoHideXLabel", "t", "isPdf", "extraLegendConfig", "width"];
 const {
-  useToken: useToken$d
+  useToken: useToken$f
 } = antd.theme;
 
 /**
@@ -49636,7 +49636,7 @@ function LineChart(_ref) {
   const chartRef = React__default["default"].useRef(null);
   const {
     token
-  } = useToken$d();
+  } = useToken$f();
   const hasLegendConfig = Object.keys(extraLegendConfig).length > 0;
   React__default["default"].useEffect(() => {
     if (!containerRef.current) {
@@ -49719,7 +49719,7 @@ function LineChart(_ref) {
 
 const _excluded$5 = ["data", "xFieldKey", "yFieldKey", "renderTooltipContent", "tooltipConfig", "animated", "isStack", "isGroup", "seriesField", "isPercentage", "showBackground", "formattedYAxis", "formattedXAxis", "color", "height", "groupField", "t", "isPdf", "extraLegendConfig", "shouldSeperateLegendName", "width"];
 const {
-  useToken: useToken$c
+  useToken: useToken$e
 } = antd.theme;
 
 /**
@@ -49813,7 +49813,7 @@ function ColumnChart(_ref) {
   const chartRef = React__default["default"].useRef(null);
   const {
     token
-  } = useToken$c();
+  } = useToken$e();
   const hasLegendConfig = Object.keys(extraLegendConfig).length > 0;
   React__default["default"].useEffect(() => {
     if (!containerRef.current) {
@@ -49893,7 +49893,7 @@ function ColumnChart(_ref) {
 }
 
 const {
-  useToken: useToken$b
+  useToken: useToken$d
 } = antd.theme;
 /**
  * RadialBarChart Component
@@ -49953,7 +49953,7 @@ function RadialBarChart(_ref) {
   const chartRef = React__default["default"].useRef(null);
   const {
     token
-  } = useToken$b();
+  } = useToken$d();
   const formattedData = React.useMemo(() => {
     return data.map(item => _objectSpread2(_objectSpread2({}, item), {}, {
       originalValue: item[yFieldKey],
@@ -50049,7 +50049,7 @@ function RadialBarChart(_ref) {
 
 const _excluded$4 = ["data", "angleField", "colorField", "color", "height", "innerRadius", "radius", "legend", "label", "statistic", "tooltip", "renderTooltipContent", "tooltipConfig", "meta", "animation", "t", "isPdf", "extraLegendConfig"];
 const {
-  useToken: useToken$a
+  useToken: useToken$c
 } = antd.theme;
 
 /**
@@ -50127,7 +50127,7 @@ function DonutPie(_ref) {
   const chartRef = React.useRef(null);
   const {
     token
-  } = useToken$a();
+  } = useToken$c();
   const hasLegendConfig = Object.keys(extraLegendConfig).length > 0;
 
   // Memoize processed data for progress mode
@@ -50372,7 +50372,7 @@ dt.div`
 `;
 
 const {
-  useToken: useToken$9
+  useToken: useToken$b
 } = antd.theme;
 /**
  * StackChart Component
@@ -50460,7 +50460,7 @@ function StackChart(_ref) {
   const ref = React__default["default"].useRef();
   const {
     token
-  } = useToken$9();
+  } = useToken$b();
   const isEmpty = !data.length;
   const [mouseY, setMouseY] = React__default["default"].useState(0);
   const [mouseX, setMouseX] = React__default["default"].useState(0);
@@ -50634,7 +50634,7 @@ function StackChart(_ref) {
 
 const _excluded$3 = ["data", "xFieldKey", "yFieldKey", "seriesField", "renderTooltipContent", "tooltipConfig", "animated", "color", "formattedYAxis", "formattedXAxis", "fillOpacity", "height", "t", "isPdf", "extraLegendConfig", "width"];
 const {
-  useToken: useToken$8
+  useToken: useToken$a
 } = antd.theme;
 
 /**
@@ -50714,7 +50714,7 @@ const AreaChart = _ref => {
   const chartRef = React.useRef(null);
   const {
     token
-  } = useToken$8();
+  } = useToken$a();
   const hasLegendConfig = Object.keys(extraLegendConfig).length > 0;
   React.useEffect(() => {
     if (!containerRef.current) {
@@ -50789,7 +50789,7 @@ const AreaChart = _ref => {
 
 const _excluded$2 = ["data", "xFieldKey", "yFieldKey", "seriesField", "renderTooltipContent", "tooltipConfig", "animated", "color", "formattedYAxis", "formattedXAxis", "score", "height"];
 const {
-  useToken: useToken$7
+  useToken: useToken$9
 } = antd.theme;
 const RadarChart = _ref => {
   let {
@@ -50815,7 +50815,7 @@ const RadarChart = _ref => {
   const chartRef = React.useRef(null);
   const {
     token
-  } = useToken$7();
+  } = useToken$9();
   React.useEffect(() => {
     if (!containerRef.current) {
       return;
@@ -50913,7 +50913,7 @@ const RadarChart = _ref => {
 };
 
 const {
-  useToken: useToken$6
+  useToken: useToken$8
 } = antd.theme;
 function DualAxesChart(_ref) {
   let {
@@ -50933,7 +50933,7 @@ function DualAxesChart(_ref) {
   const chartRef = React__default["default"].useRef(null);
   const {
     token
-  } = useToken$6();
+  } = useToken$8();
   const _colours = React.useMemo(() => {
     const defaultColours = [token.colorPrimary7, token.colorPrimary6, token.colorPrimary8];
     if (color) {
@@ -51369,14 +51369,14 @@ const Style$e = dt.div`
 
 const NAME_CARD_WIDTH = 315;
 const {
-  useToken: useToken$5
+  useToken: useToken$7
 } = antd.theme;
 function NameNode({
   data
 }) {
   const {
     token
-  } = useToken$5();
+  } = useToken$7();
   const translateFN = typeof data?.t === "function" ? data.t : key => key;
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx(react.Handle, {
@@ -53422,7 +53422,7 @@ const getRangeOfTicks = max => {
 };
 
 const {
-  useToken: useToken$4
+  useToken: useToken$6
 } = antd.theme;
 function useUserGrowth({
   container,
@@ -53434,7 +53434,7 @@ function useUserGrowth({
   const [data, setData] = React.useState([]);
   const {
     token
-  } = useToken$4();
+  } = useToken$6();
   const fetchData = () => {
     const {
       dates = []
@@ -53608,7 +53608,7 @@ function UserGrowth({
 }
 
 const {
-  useToken: useToken$3
+  useToken: useToken$5
 } = antd.theme;
 function useTopContributors({
   container,
@@ -53618,7 +53618,7 @@ function useTopContributors({
   const [mainGraph, setMainGraph] = React.useState(null);
   const {
     token
-  } = useToken$3();
+  } = useToken$5();
   React.useEffect(() => {
     if (container.current) {
       if (mainGraph) {
@@ -54094,7 +54094,7 @@ const renderTypeTag = ({
   });
 };
 
-const getColumns$5 = ({
+const getColumns$6 = ({
   t,
   show = "show",
   selectOptions,
@@ -54578,7 +54578,7 @@ function UserTable(_ref) {
       role: config.userRoles.filter(c => !c.isForAppAdmin)
     };
   }, [config.userRoles, config.accountTypes, accounts]);
-  const columns = React.useMemo(() => getColumns$5({
+  const columns = React.useMemo(() => getColumns$6({
     t,
     show: activeTab,
     selectOptions,
@@ -54674,7 +54674,7 @@ function UserTable(_ref) {
   });
 }
 
-const getColumns$4 = ({
+const getColumns$5 = ({
   t,
   goTo,
   show = "show",
@@ -55027,7 +55027,7 @@ const getTabs$1 = ({
   label: t("Suspended")
 }];
 
-const getColumns$3 = ({
+const getColumns$4 = ({
   t,
   selectOptions,
   module
@@ -55134,7 +55134,7 @@ const Container = dt.div`
 `;
 
 const {
-  useToken: useToken$2
+  useToken: useToken$4
 } = antd.theme;
 function CombineAccountModal({
   isOpen,
@@ -55147,10 +55147,10 @@ function CombineAccountModal({
 }) {
   const {
     token
-  } = useToken$2();
+  } = useToken$4();
   const [MainForm] = antd.Form.useForm();
   const columns = React.useMemo(() => {
-    return getColumns$3({
+    return getColumns$4({
       t,
       selectOptions,
       module
@@ -55453,7 +55453,7 @@ function AccountTable(_ref) {
       onCancel: () => {}
     });
   }, [t, fetchData, fetchPendingAccounts]);
-  const columns = React.useMemo(() => getColumns$4({
+  const columns = React.useMemo(() => getColumns$5({
     t,
     show: activeTab,
     selectOptions,
@@ -55628,14 +55628,15 @@ const getNameByLevel = (data, level) => {
   const entry = Object.values(data || {}).find(item => item.level === level);
   return entry;
 };
-const getColumns$2 = ({
+
+const getColumns$3 = ({
   t,
   goTo = () => {},
   show = "show",
   getRedirectLink = () => {},
   token,
-  selectedLocations,
-  setSelectedLocations,
+  selectedSubjects,
+  setSelectedSubjects,
   selectOptions,
   entity
 }) => {
@@ -55652,15 +55653,15 @@ const getColumns$2 = ({
         });
       }
       return /*#__PURE__*/jsxRuntime.jsx(antd.Checkbox, {
-        onChange: () => setSelectedLocations(prev => {
+        onChange: () => setSelectedSubjects(prev => {
           const isSelected = prev.some(p => p.id === all.id);
           if (isSelected) {
             return prev.filter(p => p.id !== all.id);
           }
           return [...prev, all];
         }),
-        checked: selectedLocations.some(p => p.id === all.id),
-        disabled: selectedLocations?.length >= 3 && !selectedLocations.some(p => p.id === all.id)
+        checked: selectedSubjects.some(p => p.id === all.id),
+        disabled: selectedSubjects?.length >= 3 && !selectedSubjects.some(p => p.id === all.id)
       });
     }
   }, {
@@ -55849,7 +55850,7 @@ const getColumns$2 = ({
   return cols.filter(c => c[show]);
 };
 
-const getColumns$1 = ({
+const getColumns$2 = ({
   t,
   selectOptions,
   module,
@@ -55940,7 +55941,7 @@ const getColumns$1 = ({
 };
 
 const {
-  useToken: useToken$1
+  useToken: useToken$3
 } = antd.theme;
 function CombineLocationModal({
   isOpen,
@@ -55954,11 +55955,11 @@ function CombineLocationModal({
 }) {
   const {
     token
-  } = useToken$1();
+  } = useToken$3();
   const [MainForm] = antd.Form.useForm();
   const [isDisabled, setIsDisabled] = React.useState(true);
   const columns = React.useMemo(() => {
-    return getColumns$1({
+    return getColumns$2({
       t,
       selectOptions,
       module,
@@ -56108,7 +56109,7 @@ function CombineLocationModal({
 }
 
 const {
-  useToken
+  useToken: useToken$2
 } = antd.theme;
 function LocationTable(_ref) {
   let {
@@ -56132,7 +56133,7 @@ function LocationTable(_ref) {
   const [selectedLocations, setSelectedLocations] = React.useState([]);
   const {
     token
-  } = useToken();
+  } = useToken$2();
   const [combineLocationVisible, setCombineLocationVisible] = React.useState(false);
   const {
     filter,
@@ -56167,7 +56168,7 @@ function LocationTable(_ref) {
     };
   }, [config.options]);
   const columns = React.useMemo(() => {
-    return getColumns$2({
+    return getColumns$3({
       t,
       goTo,
       token,
@@ -56261,6 +56262,418 @@ function LocationTable(_ref) {
   });
 }
 
+const mapToSelectOptions = (items, valueKey, selectOptions, optionKey, customMapper = null) => {
+  return items.map(item => {
+    if (customMapper) {
+      return customMapper(item);
+    }
+    const value = item?.[valueKey] || "-";
+    const optionsList = selectOptions?.[optionKey] || [];
+    const foundOption = optionsList.find(option => option.value === value);
+    return {
+      label: foundOption?.label || value,
+      value: value
+    };
+  }).filter((option, index, self) => index === self.findIndex(o => o.value === option.value));
+};
+
+const getColumns$1 = ({
+  t,
+  selectOptions,
+  module,
+  entity
+}) => {
+  return [{
+    title: t("admin::organisation_id"),
+    dataIndex: "datastakeId",
+    key: "datastakeId",
+    show: true,
+    render: (value, all) => {
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: value,
+        children: value
+      });
+    }
+  }, {
+    title: t("Name"),
+    dataIndex: "name",
+    key: "name",
+    show: true,
+    render: (value, all) => {
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: value,
+        children: value
+      });
+    }
+  }, {
+    title: t("Category"),
+    dataIndex: "category",
+    key: "category",
+    show: true,
+    render: (value, all) => {
+      const label = findOptions(value, selectOptions?.category);
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: label,
+        children: label
+      });
+    }
+  }, {
+    title: t("Country"),
+    dataIndex: "country",
+    key: "country",
+    show: true,
+    render: (value, all) => {
+      const label = findOptions(value, selectOptions?.country);
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: label,
+        children: label
+      });
+    }
+  }, {
+    title: t("Province"),
+    dataIndex: "administrativeLevel1",
+    key: "administrativeLevel1",
+    ellipsis: true,
+    show: entity.includes("locations"),
+    render: (value, all) => {
+      let label;
+      if (all?.administrativeLevel1 && value === all?.administrativeLevel1) {
+        label = all?.linking?.SCL?.[value]?.name;
+      } else {
+        label = getNameByLevel(all?.linking?.SCL, "level_1")?.name;
+      }
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: label || '-',
+        children: label || '-'
+      });
+    }
+  }, {
+    title: t("Territory"),
+    dataIndex: "administrativeLevel2",
+    key: "administrativeLevel2",
+    show: entity.includes("locations"),
+    render: (value, all) => {
+      let label;
+      if (all?.administrativeLevel2 && value === all?.administrativeLevel2) {
+        label = all?.linking?.SCL?.[value]?.name;
+      } else {
+        label = getNameByLevel(all?.linking?.SCL, "level_2")?.name;
+      }
+      return /*#__PURE__*/jsxRuntime.jsx(antd.Tooltip, {
+        title: label || '-',
+        children: label || '-'
+      });
+    }
+  }].filter(c => c?.show);
+};
+
+const {
+  useToken: useToken$1
+} = antd.theme;
+function CombineSubjectsModal({
+  isOpen,
+  t,
+  onClose,
+  onSuccess,
+  selectedSubjects,
+  selectOptions,
+  module,
+  entity
+}) {
+  const {
+    token
+  } = useToken$1();
+  const [MainForm] = antd.Form.useForm();
+  const [isDisabled, setIsDisabled] = React.useState(true);
+  const columns = React.useMemo(() => {
+    return getColumns$1({
+      t,
+      selectOptions,
+      module,
+      selectedSubjects,
+      entity
+    });
+  }, [selectedSubjects, t, selectOptions, module, entity]);
+  const onSubmit = () => {
+    MainForm.validateFields().then(data => {
+      const ids = selectedSubjects.map(subject => subject._id);
+      onSuccess({
+        ids,
+        data
+      });
+    });
+  };
+  return /*#__PURE__*/jsxRuntime.jsxs(Modal, {
+    open: isOpen,
+    title: t("admin::merge"),
+    onClose: onClose,
+    onSuccess: onSubmit,
+    withModalFormWrapper: false,
+    width: 1100,
+    disabled: isDisabled,
+    destroyOnClose: true,
+    onValuesChange: () => {
+      setIsDisabled(() => {
+        const values = MainForm.getFieldsValue();
+        const requiredFields = entity === "location" ? ["id", "name", "category", "country", "administrativeLevel1", "administrativeLevel2"] : ["id", "name", "category", "country"];
+        return requiredFields.some(field => values[field] === undefined);
+      });
+    },
+    children: [/*#__PURE__*/jsxRuntime.jsxs(Container, {
+      children: [/*#__PURE__*/jsxRuntime.jsxs("div", {
+        className: "daf-table-wrapper no-pagination",
+        children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+          className: "merge-modal-section-text",
+          style: {
+            color: token.baseGray90
+          },
+          children: t("admin::current_subjects")
+        }), /*#__PURE__*/jsxRuntime.jsx(DAFTable, {
+          columns: columns,
+          data: selectedSubjects,
+          pagination: false,
+          loading: false,
+          rowKey: "userId"
+        })]
+      }), /*#__PURE__*/jsxRuntime.jsx("span", {
+        className: "merge-modal-section-text",
+        style: {
+          color: token.baseGray90,
+          marginTop: 14
+        },
+        children: t("admin::merged_output")
+      }), /*#__PURE__*/jsxRuntime.jsxs(antd.Form, {
+        form: MainForm,
+        clearOnDestroy: true,
+        className: "select-container",
+        onValuesChange: () => {
+          setIsDisabled(prev => {
+            const values = MainForm.getFieldsValue();
+            return Object.keys(values).some(key => values[key] === undefined);
+          });
+        },
+        style: {
+          borderColor: token.baseGray50
+        },
+        children: [/*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+          className: "flex-1",
+          name: "id",
+          children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+            options: mapToSelectOptions(selectedSubjects, "datastakeId", selectOptions, null),
+            placeholder: t("ID")
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+          className: "flex-1",
+          name: "name",
+          children: /*#__PURE__*/jsxRuntime.jsx(antd.Input, {
+            placeholder: t("Name")
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+          className: "flex-1",
+          name: "category",
+          children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+            options: mapToSelectOptions(selectedSubjects, "category", selectOptions, "category"),
+            placeholder: t("Category")
+          })
+        }), /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+          className: "flex-1",
+          name: "country",
+          children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+            options: mapToSelectOptions(selectedSubjects, "country", selectOptions, "country"),
+            placeholder: t("admin::country")
+          })
+        }), entity.includes("locations") && /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+          children: [/*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+            className: "flex-1",
+            name: "administrativeLevel1",
+            children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+              placeholder: t("Province"),
+              options: mapToSelectOptions(selectedSubjects, null, selectOptions, null, subject => {
+                const _data = getNameByLevel(subject?.linking?.SCL, "level_1");
+                return {
+                  label: _data?.name || "-",
+                  value: _data?.id || "-"
+                };
+              })
+            })
+          }), /*#__PURE__*/jsxRuntime.jsx(antd.Form.Item, {
+            className: "flex-1",
+            name: "administrativeLevel2",
+            children: /*#__PURE__*/jsxRuntime.jsx(antd.Select, {
+              placeholder: t("Territory"),
+              options: mapToSelectOptions(selectedSubjects, null, selectOptions, null, subject => {
+                const _data = getNameByLevel(subject?.linking?.SCL, "level_2");
+                return {
+                  label: _data?.name || "-",
+                  value: _data?.id || "-"
+                };
+              })
+            })
+          })]
+        })]
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx("div", {
+      style: {
+        height: 57
+      }
+    })]
+  });
+}
+
+const {
+  useToken
+} = antd.theme;
+function SubjectsTable(_ref) {
+  let {
+    t = text => text,
+    isMobile,
+    goTo,
+    getRedirectLink,
+    location,
+    getData,
+    module,
+    config,
+    defaultPageSize = 20,
+    view,
+    headerTitle,
+    breadcrumbs,
+    mergeSubjectsFunction,
+    refetchTrigger
+  } = _ref;
+  const [showFilters, setShowFilters] = React.useState(false);
+  const [hasError, setHasError] = React.useState(false);
+  const [selectedSubjects, setSelectedSubjects] = React.useState([]);
+  const {
+    token
+  } = useToken();
+  const [isCombineModalOpen, setIsModalOpen] = React.useState(false);
+  const {
+    filter,
+    activeTab,
+    canClearSearch,
+    totalPending,
+    data,
+    loading,
+    initFetchDone,
+    fetchData,
+    fetchPendingAccounts,
+    setLoading
+  } = useAdminTable({
+    goTo,
+    location,
+    selectFiltersConfig: selectFiltersConfig$8,
+    view,
+    defaultUrlParams: defaultUrlParams$1,
+    module,
+    defaultPageSize,
+    filtersConfig: filtersConfig$8,
+    getRedirectLink,
+    getData,
+    refetchTrigger
+  });
+  const selectOptions = React.useMemo(() => {
+    var _config$options, _config$options2;
+    return {
+      category: (_config$options = config.options) === null || _config$options === void 0 ? void 0 : _config$options.category,
+      country: (_config$options2 = config.options) === null || _config$options2 === void 0 ? void 0 : _config$options2.countries,
+      sources: [] //TODO: add sources logic and make sure you only show unique sources only once
+    };
+  }, [config.options]);
+  const columns = React.useMemo(() => {
+    return getColumns$3({
+      t,
+      goTo,
+      token,
+      module,
+      selectedSubjects,
+      setSelectedSubjects,
+      getRedirectLink,
+      selectOptions,
+      entity: headerTitle
+    });
+  }, [t, goTo, module, token, selectedSubjects, getRedirectLink, selectOptions, headerTitle]);
+  return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
+    children: [/*#__PURE__*/jsxRuntime.jsxs(AdminTable, {
+      filters: filter,
+      t: t,
+      headerTitle: headerTitle,
+      actionButton: [{
+        icon: "Merge",
+        onClick: () => setIsModalOpen(true),
+        tooltip: t("admin::merge-subjects"),
+        disabled: selectedSubjects.length < 2
+      }],
+      tabs: getTabs({
+        t
+      }),
+      isMobile: isMobile,
+      activeTab: activeTab,
+      showFilters: showFilters,
+      setShowFilters: setShowFilters,
+      hasError: hasError,
+      setHasError: setHasError,
+      canClearSearch: canClearSearch,
+      selectOptions: selectOptions,
+      checkboxConfig: checkboxConfig$8,
+      defaultTableFilters: {},
+      breadcrumbs: breadcrumbs,
+      children: [selectedSubjects.length > 0 && /*#__PURE__*/jsxRuntime.jsx("div", {
+        className: "flex flex-row  ml-6 mt-5",
+        style: {
+          flexWrap: "wrap",
+          gap: "8px"
+        },
+        children: selectedSubjects.map(account => /*#__PURE__*/jsxRuntime.jsxs(antd.Tag, {
+          className: "flex flex-row gap-2 items-center",
+          onClick: () => setSelectedSubjects(prev => prev.filter(a => a.datastakeId !== account.datastakeId)),
+          style: {
+            cursor: "pointer"
+          },
+          children: [/*#__PURE__*/jsxRuntime.jsx("span", {
+            children: account.datastakeId
+          }), /*#__PURE__*/jsxRuntime.jsx(CustomIcon, {
+            name: "Close",
+            size: 10
+          })]
+        }, account.userId))
+      }), /*#__PURE__*/jsxRuntime.jsx(DAFTable, {
+        columns: columns,
+        data: data,
+        loading: loading,
+        hideOnLoading: false,
+        pagination: filter.pagination,
+        rowKey: "id",
+        selectOptions: selectOptions,
+        doEmptyRows: true,
+        setShowFilters: setShowFilters,
+        filtersConfig: selectFiltersConfig$8,
+        onFilterChange: filter.onFiltersChange,
+        showFilters: showFilters,
+        defaultFilters: filter.defaultFilters,
+        onChange: filter.onTableChange
+      })]
+    }), /*#__PURE__*/jsxRuntime.jsx(CombineSubjectsModal, {
+      isOpen: isCombineModalOpen,
+      t: t,
+      onClose: () => {
+        setIsModalOpen(false);
+      },
+      onSuccess: data => {
+        setIsModalOpen(false);
+        setLoading(true);
+        if (typeof mergeSubjectsFunction === 'function') {
+          mergeSubjectsFunction(data);
+          setSelectedSubjects([]);
+        }
+      },
+      selectedSubjects: selectedSubjects,
+      selectOptions: selectOptions || {},
+      module: module,
+      entity: headerTitle
+    })]
+  });
+}
+
 const config$1 = [{
   label: "Details",
   key: "details",
@@ -62422,6 +62835,7 @@ exports.Steps = DAFSteps;
 exports.StickyTable = StickyTable;
 exports.StoreProvider = StoreProvider;
 exports.StyledTabs = StyledTabs;
+exports.SubjectsTable = SubjectsTable;
 exports.Table = DAFTable;
 exports.TableFilters = TableFilters;
 exports.Tabs = Tabs;