datastake-daf 0.6.765 → 0.6.767

package/src/@daf/core/components/Screens/Admin/AdminScreens/Subjects.jsx

@@ -0,0 +1,96 @@
+import React, { useCallback } from "react";
+import { message } from "antd";
+import SubjectsTable from "../AdminTables/SubjectsTable/index.jsx";
+
+/**
+ * Admin Subjects Screen Wrapper
+ * This is a ready-to-use route component that can be configured per application
+ * 
+ * @param {Object} config - Application configuration
+ * @param {string} config.appName - Application name
+ * @param {string} config.module - Module identifier (APP constant)
+ * @param {Function} config.goTo - Navigation function
+ * @param {Function} config.t - Translation function
+ * @param {Object} config.location - Router location object
+ * @param {boolean} config.isMobile - Is mobile viewport
+ * @param {Function} config.getRedirectLink - Function to get redirect links
+ * @param {Object} config.AdminService - Admin service with methods
+ * @param {Object} config.options - Options object with categories, countries, etc.
+ * @param {Function} config.handleError - Error handling function
+ * @param {number} config.defaultPageSize - Default pagination page size
+ * @param {string} config.view - View identifier
+ * @param {string} config.headerTitle - Header title for the table
+ * @param {Array} config.breadcrumbs - Breadcrumbs configuration
+ * @param {any} config.refetchTrigger - Trigger to refetch data
+ * @param {Function} config.getData - Optional custom getData function
+ */
+export default function AdminSubjectsScreen({ config }) {
+	const {
+		appName = "app",
+		module,
+		goTo,
+		t,
+		location,
+		isMobile,
+		getRedirectLink,
+		AdminService,
+		options,
+		handleError,
+		defaultPageSize = 20,
+		view,
+		headerTitle = "subjects",
+		breadcrumbs,
+		refetchTrigger,
+		getData,
+	} = config;
+
+	const handleMergeSubjects = useCallback(
+		async (mergeData) => {
+			try {
+				if (AdminService.mergeSubjects) {
+					await AdminService.mergeSubjects(mergeData);
+					message.success(t("Subjects merged successfully"));
+				} else {
+					console.warn("AdminService.mergeSubjects is not implemented");
+					message.success(t("Subjects merged successfully"));
+				}
+			} catch (err) {
+				handleError?.(err);
+			}
+		},
+		[AdminService, t, handleError]
+	);
+
+	// Use custom getData if provided, otherwise use default AdminService.getSubjects
+	const getSubjects = useCallback((params) => {
+		if (getData) {
+			return getData(params);
+		}
+		return AdminService.getSubjects(params);
+	}, [getData, AdminService]);
+
+	return (
+		<SubjectsTable
+			t={t}
+			goTo={goTo}
+			getRedirectLink={getRedirectLink}
+			location={location}
+			module={module}
+			headerTitle={headerTitle}
+			getData={getSubjects}
+			isMobile={isMobile}
+			defaultPageSize={defaultPageSize}
+			view={view}
+			breadcrumbs={breadcrumbs}
+			mergeSubjectsFunction={handleMergeSubjects}
+			refetchTrigger={refetchTrigger}
+			config={{
+				options: {
+					category: options?.category,
+					countries: options?.countries,
+				},
+			}}
+		/>
+	);
+}
+

package/src/@daf/core/components/Screens/Admin/AdminScreens/index.js

@@ -8,4 +8,5 @@ export { default as AdminDashboardScreen } from "./Dashboard.jsx";
 export { default as AdminUsersScreen } from "./Users.jsx";
 export { default as AdminAccountsScreen } from "./Accounts.jsx";
 export { default as AdminAccountsViewScreen } from "./AccountsView.jsx";
-
+export { default as AdminSubjectsScreen } from "./Subjects.jsx";
+export { default as AdminLocationScreen } from "./Location.jsx";

package/src/@daf/core/components/Screens/Admin/adminRoutes.js

@@ -3,102 +3,129 @@ import AdminDashboardScreen from "./AdminScreens/Dashboard.jsx";
 import AdminUsersScreen from "./AdminScreens/Users.jsx";
 import AdminAccountsScreen from "./AdminScreens/Accounts.jsx";
 import AdminAccountsViewScreen from "./AdminScreens/AccountsView.jsx";
+import AdminSubjectsScreen from "./AdminScreens/Subjects.jsx";
+import AdminLocationScreen from "./AdminScreens/Location.jsx";
 
-/**
- * Generate Admin Routes for any application
- * 
- * This function returns a complete set of admin routes that can be used directly
- * in  application's route configuration. Just provide the configuration and
- * you get back ready-to-use routes.
- * 
- * @param {Object} config - Application-specific configuration
- * @param {string} config.appName - Application name (e.g., "wazi", "tazama")
- * @param {Function} config.useAdminDashboardConfig - Hook that returns dashboard config
- * @param {Function} config.useAdminUsersConfig - Hook that returns users config
- * @param {Function} config.useAdminAccountsConfig - Hook that returns accounts config
- * @param {Function} config.useAdminAccountsViewConfig - Hook that returns accounts view config
- * @param {Function} config.userIsAdmin - Function to check if user is admin
- * 
- * @returns {Array} Array of route objects ready to be used with React Router
- * 
- * @example
- * ```javascript
- * import { getAdminRoutes } from "datastake-daf/dist/admin";
- * 
- * const routes = getAdminRoutes({
- *   appName: "wazi",
- *   useAdminDashboardConfig,
- *   useAdminUsersConfig,
- *   useAdminAccountsConfig,
- *   useAdminAccountsViewConfig,
- *   userIsAdmin: (user) => user?.role === 'admin'
- * });
- * 
- * export default routes;
- * ```
- */
 export function getAdminRoutes(config) {
-	const {
-		appName,
-		useAdminDashboardConfig,
-		useAdminUsersConfig,
-		useAdminAccountsConfig,
-		useAdminAccountsViewConfig,
-		userIsAdmin,
-	} = config;
+  const {
+    appName,
+    useAdminDashboardConfig,
+    useAdminUsersConfig,
+    useAdminAccountsConfig,
+    useAdminAccountsViewConfig,
+    useAdminSubjectsConfig,
+    useAdminLocationConfig,
+    userIsAdmin,
+  } = config;
 
-	const APP_PREFIX = `APP_${appName.toUpperCase()}`;
+  const APP_PREFIX = `APP_${appName.toUpperCase()}`;
 
-	// Wrapper components that use the configuration hooks
-	function DashboardWrapper() {
-		const dashboardConfig = useAdminDashboardConfig();
-		return <AdminDashboardScreen config={dashboardConfig} />;
-	}
+  function DashboardWrapper() {
+    const dashboardConfig = useAdminDashboardConfig();
+    return <AdminDashboardScreen config={dashboardConfig} />;
+  }
 
-	function UsersWrapper() {
-		const usersConfig = useAdminUsersConfig();
-		return <AdminUsersScreen config={usersConfig} />;
-	}
+  function UsersWrapper() {
+    const usersConfig = useAdminUsersConfig();
+    return <AdminUsersScreen config={usersConfig} />;
+  }
 
-	function AccountsWrapper() {
-		const accountsConfig = useAdminAccountsConfig();
-		return <AdminAccountsScreen config={accountsConfig} />;
-	}
+  function AccountsWrapper() {
+    const accountsConfig = useAdminAccountsConfig();
+    return <AdminAccountsScreen config={accountsConfig} />;
+  }
 
-	function AccountsViewWrapper() {
-		const accountsViewConfig = useAdminAccountsViewConfig();
-		return <AdminAccountsViewScreen config={accountsViewConfig} />;
-	}
+  function AccountsViewWrapper() {
+    const accountsViewConfig = useAdminAccountsViewConfig();
+    return <AdminAccountsViewScreen config={accountsViewConfig} />;
+  }
 
-	return [
-		{
-			path: "",
-			key: `${APP_PREFIX}_DASHBOARD`,
-			exact: true,
-			visible: () => true,
-			component: <DashboardWrapper />,
-		},
-		{
-			path: "accounts",
-			key: `${APP_PREFIX}_ACCOUNTS`,
-			exact: true,
-			visible: (user) => userIsAdmin(user),
-			component: <AccountsWrapper />,
-		},
-		{
-			path: "admin-users",
-			key: `${APP_PREFIX}_ADMIN_USERS`,
-			exact: true,
-			visible: (user) => userIsAdmin(user),
-			component: <UsersWrapper />,
-		},
-		{
-			path: "accounts/:mode/:id/:group",
-			key: `${APP_PREFIX}_ADMIN_VIEW`,
-			exact: true,
-			visible: (user) => userIsAdmin(user),
-			component: <AccountsViewWrapper />,
-		},
-	];
+  function SubjectsWrapper() {
+    const subjectsConfig =
+      typeof useAdminSubjectsConfig === "function"
+        ? useAdminSubjectsConfig()
+        : undefined;
+    return <AdminSubjectsScreen config={subjectsConfig} />;
+  }
+
+  function LocationWrapper() {
+    const locationConfig =
+      typeof useAdminLocationConfig === "function"
+        ? useAdminLocationConfig()
+        : undefined;
+    return <AdminLocationScreen config={locationConfig} />;
+  }
+
+  const subjectsIndexComponent =
+    typeof useAdminLocationConfig === "function"
+      ? <LocationWrapper />
+      : typeof useAdminSubjectsConfig === "function"
+      ? <SubjectsWrapper />
+      : <div />;
+
+  const routes = [
+    {
+      path: "",
+      key: `${APP_PREFIX}_DASHBOARD`,
+      exact: true,
+      visible: (user) => userIsAdmin(user),
+      component: <DashboardWrapper />,
+    },
+    {
+      path: "accounts",
+      key: `${APP_PREFIX}_ACCOUNTS`,
+      exact: true,
+      visible: (user) => userIsAdmin(user),
+      component: <AccountsWrapper />,
+    },
+    {
+      path: "admin-users",
+      key: `${APP_PREFIX}_ADMIN_USERS`,
+      exact: true,
+      visible: (user) => userIsAdmin(user),
+      component: <UsersWrapper />,
+    },
+    {
+      path: "accounts/:mode/:id/:group",
+      key: `${APP_PREFIX}_ADMIN_VIEW`,
+      exact: true,
+      visible: (user) => userIsAdmin(user),
+      component: <AccountsViewWrapper />,
+    },
+
+    {
+      path: "subjects",
+      key: `${APP_PREFIX}_SUBJECTS_INDEX`,
+      exact: true,
+      visible: (user) => userIsAdmin(user),
+      component: subjectsIndexComponent,
+    },
+
+    ...(typeof useAdminLocationConfig === "function"
+      ? [
+          {
+            path: "subjects/location",
+            key: `${APP_PREFIX}_ADMIN_SUBJECTS_LOCATIONS`,
+            exact: true,
+            visible: (user) => userIsAdmin(user),
+            component: <LocationWrapper />,
+          },
+        ]
+      : []),
+    ...(typeof useAdminSubjectsConfig === "function"
+      ? [
+          {
+            path: "subjects/stakeholder",
+            key: `${APP_PREFIX}_ADMIN_SUBJECTS_STAKEHOLDERS`,
+            exact: true,
+            visible: (user) => userIsAdmin(user),
+            component: <SubjectsWrapper />,
+          },
+        ]
+      : []),
+  ];
+
+  return routes;
 }
 
+export default getAdminRoutes;

package/src/@daf/core/components/Screens/TableScreen/TableWithTabsAndCreate/create.jsx

@@ -0,0 +1,106 @@
+import React, { useEffect} from 'react'
+import { message } from 'antd';
+import { MessageTypes } from '../../../helpers/messages.js';
+import DynamicForm from '../../core/components/DynamicForm/index.jsx';
+
+const Create = ({
+    namespace = 'stakeholders',
+    view = 'scoping',
+    edit = false,
+    formData = {},
+    loading = false, 
+    onSubmitted = () => {}, 
+    onCancel = () => {}, 
+    getData = () => {}, 
+    saveData = () => {}, 
+    form: formConfig = {},
+    formValue = {},
+    defaultData = {}, 
+    user = {}, 
+    APP, 
+    query, 
+    goTo = () => {}, 
+    t = () => {}, 
+    ajaxForms = {}, 
+    changeAjaxForms = () => {}, 
+    ajaxOptions = {}, 
+    changeAjaxOptions = () => {}, 
+    getAppHeader = () => {},
+    getApiBaseUrl = () => {}, 
+    scope
+}) => {
+    let {
+        form = {},
+        data = defaultData || {},
+      } = !edit ? (formData[`${APP}-${view}`] || {}) : {
+        form: formConfig,
+        data: formValue
+    };
+
+    useEffect(() => {
+        if (Object.keys(form).length === 0 && !formData[`${APP}-${view}`]) {
+          if (!edit) {
+            getData({ namespace, module: APP, view, scope });
+          } else {
+            form = formConfig;
+            data = formValue;
+          }
+        }
+    }, [edit, user?.language, scope]);
+
+    return (
+        <div className="daf-create-form">
+            <DynamicForm 
+                form={form}
+                data={data}
+                showSaveAndNext={false}
+                module={APP}
+                onCancel={onCancel}
+                isCreate
+                t={t}
+                excludedKeys={["title"]}
+                user={user}
+                ajaxForms={ajaxForms}
+                ajaxOptions={ajaxOptions}
+                getAppHeader={getAppHeader}
+                getApiBaseUrl={getApiBaseUrl}
+                changeAjaxOptions={changeAjaxOptions}
+                app={APP}
+                query={query}
+                goTo={goTo}
+                changeAjaxForms={changeAjaxForms}
+                submit={(payload, setSelectedFormNext) => {
+                    const payloadData = { ...payload, module: APP, namespace };
+                
+                    const newPayload = {
+                        ...defaultData,
+                        ...payloadData,
+                        form: 'stakeholder'
+                    };
+
+                
+                    const callback = (type, m, data) => {
+                        if (setSelectedFormNext) {
+                            setSelectedFormNext();
+                        }
+                        if (type === MessageTypes.SUCCESS) {
+                            if (onSubmitted) onSubmitted(type, m, data);
+                        } else {
+                            message.error(m);
+                        }
+                    };
+                    
+                    saveData(
+                        !data && !data.id ? newPayload : Object.assign(newPayload, { id: data.id }),
+                        callback,
+                    );
+                }}
+                isFormDisabled={() => {
+                    return !data || !data.typeOfEvent;
+                }}
+            />
+        </div>
+    )
+}
+
+export default Create

package/src/@daf/core/components/Screens/TableScreen/TableWithTabsAndCreate/index.jsx

@@ -0,0 +1,115 @@
+import React, { useState, useEffect, useCallback } from 'react';
+import { useFetchData } from '../../../../../pages/hook.js';
+import TablePageWithTabs from '../TablePageWithTabs/index.jsx';
+
+const TableWithTabsAndCreate = ({
+    t = () => {},
+    goTo = () => {},
+    user = {},
+    options = {},
+    getRedirectLink = () => {},
+    theme = {},
+    loading = false,
+    data = {},
+    isMobile,
+    APP,
+    location,
+    formConfig = {
+        getFormData: () => {},
+        saveFormData: () => {},
+        formLoading: false,
+        query: {},
+        ajaxForms: {},
+        changeAjaxForms: () => {},
+        ajaxOptions: {},
+        changeAjaxOptions: () => {},
+        formData: {},
+        formValue: {},
+        form: {},
+        namespace: '',
+        view: '',
+        scope: '',
+    },
+    filtersConfig = {
+        getFiltersConfig: () => {},
+        getFilterOptions: () => {},
+        extendingFilters: {},
+        checkboxConfig: {},
+        selectOptions: {},
+        selectFiltersConfig: {},
+    },
+    getData = () => {},
+    getApiBaseUrl = () => {},
+    getAppHeader = () => {},
+    applications = [],
+    subjectClear,
+    subject,
+    columns,
+    viewConfig = {
+        title: '',
+        breadcrumbs: [],
+        createTitle: '',
+    },
+    onDownload,
+}) => {
+    const [selectOptions, setSelectOptions] = useState();
+    const [activeTab, setActiveTab] = useState("own");
+
+    useFetchData({
+        location,
+        getData,
+        activeTab,
+        extendingFilters: filtersConfig.extendingFilters,
+        subject,
+    })
+
+    useEffect(() => {
+        setSelectOptions((prev) => ({
+          ...prev,
+          ...filtersConfig.getFilterOptions(options, t),
+        }))
+      }, [options, t])
+
+    const handleActiveTabChange = useCallback((value) => {
+        setActiveTab(value);
+    }, []);
+
+    useEffect(
+		() => () => {
+			if(subjectClear && typeof subjectClear === 'function') {
+				subjectClear();
+			}
+		},
+		[],
+	);
+
+    return (
+        <TablePageWithTabs
+            t={t}
+            title={t(viewConfig.title || "")}
+            breadCrumbs={viewConfig.breadcrumbs}
+            location={location}
+            loading={loading}
+            goTo={goTo}
+            defaultActiveTab={"own"}
+            columns={columns}
+            data={data}
+            checkboxConfig={filtersConfig.checkboxConfig}
+            APP={APP}
+            getApiBaseUrl={getApiBaseUrl}
+            selectOptions={selectOptions}
+            selectFiltersConfig={filtersConfig.selectFiltersConfig}
+            getRedirectLink={getRedirectLink}
+            filtersConfig={filtersConfig}
+            isMobile={isMobile}
+            view={subject}
+            getActiveTab={handleActiveTabChange}
+            onDownload={onDownload && typeof onDownload === 'function' ? onDownload : undefined}
+            drawerTitle={t(viewConfig.createTitle || "")}
+        >
+
+        </TablePageWithTabs>
+    );
+};
+
+export default TableWithTabsAndCreate;

package/src/@daf/core/components/Table/MoreTags/index.jsx

@@ -9,6 +9,9 @@ export default function MoreTags({
 	maxWidthCont = 120,
 	maxTextCont = 100,
 	diff = 30,
+	style = {},
+	tagColor,
+	limit,
 }) {
 	const ref = useRef();
 	const [width, setWidth] = useState(0);
@@ -27,6 +30,12 @@ export default function MoreTags({
 	}, []);
 
 	const _calculate = () => {
+		// If limit prop is provided and valid, use it instead of calculating
+		if (typeof limit === 'number' && limit > 0) {
+			setIndexToReturn(Math.min(limit - 1, values.length - 1));
+			return;
+		}
+
 		const tabs = ref.current.querySelectorAll(".check-tabs");
 		let filled = 0;
 		let indexToReturn;
@@ -60,7 +69,7 @@ export default function MoreTags({
 
 	useEffect(() => {
 		_calculate();
-	}, [width, values]);
+	}, [width, values, limit]);
 
 	return (
 		<div className="daf-more-tags">
@@ -76,8 +85,9 @@ export default function MoreTags({
 								overflow: "hidden",
 								textOverflow: "ellipsis",
 								whiteSpace: "nowrap",
+								...style,
 							}}
-							color={ac.color}
+							color={tagColor || ac.color}
 						>
 							<Tooltip title={typeof ac === "object" ? ac.label : ac}>
 								<span
@@ -86,6 +96,7 @@ export default function MoreTags({
 										overflow: "hidden",
 										textOverflow: "ellipsis",
 										whiteSpace: "nowrap",
+										...style,
 									}}
 								>
 									{typeof ac === "object" ? ac.label : ac}
@@ -100,7 +111,7 @@ export default function MoreTags({
 							.map((ac) => (typeof ac === "object" ? ac.label : ac))
 							.join(", ")}
 					>
-						<Tag>+{other.length}</Tag>
+						<Tag color={tagColor || 'default'} style={style}>+{other.length}</Tag>
 					</Tooltip>
 				) : null}
 			</div>
@@ -110,10 +121,10 @@ export default function MoreTags({
 						ac.renderTag("check-tabs")
 					) : (
 						<Tag
-							color={ac.color}
+							color={tagColor || ac.color}
 							key={`${ac}-${i}`}
 							className="check-tabs"
-							style={{ maxWidth: _maxWidthCont }}
+							style={{ maxWidth: _maxWidthCont, ...style }}
 						>
 							<Text
 								ellipsis={{ tooltip: typeof ac === "object" ? ac.label : ac }}
@@ -134,4 +145,5 @@ MoreTags.propTypes = {
 	maxWidthCont: PropTypes.number,
 	maxTextCont: PropTypes.number,
 	diff: PropTypes.number,
+	limit: PropTypes.number,
 };

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

@@ -9,6 +9,11 @@ export const defaultMapConfig = {
   preferCanvas: true,
   zoomControl: false,
   maxBounds: maxBounds,
+  zoomSnap: 0.5,
+  zoomDelta: 0.5, 
+  wheelPxPerZoomLevel: 150,
+  zoomAnimation: true, 
+  zoomAnimationThreshold: 10,
 };
 
 export const filterValidGPS = (data) => {

package/src/@daf/layouts/AuthLayout/components/Navbar/index.jsx

@@ -23,7 +23,6 @@ const AuthNavbar = ({
   defaultValue = StorageManager.get('datastakeLng') || 'en',
   onClose
 }) => {
-  console.log({navbarDefaultValue: defaultValue})
   return (
     <Style className={formatClassname([typeof onClose === 'function' && 'bordered'])}>
     <div className="d-navbar flex-c jus-c">

package/src/@daf/pages/Dashboards/SupplyChain/components/ChartsContainer/components/Identification/hook.js

@@ -1,4 +1,5 @@
 import { useEffect, useState, useMemo } from "react";
+import { findOptions } from '../../../../../../../../helpers/StringHelper.js';
 
 
 export function useIdentification({ data, theme = {}, options = {} }) {
@@ -58,16 +59,15 @@ export function useIdentification({ data, theme = {}, options = {} }) {
 					const values = graphData.filter((d) => d.date === title);
 					return {
 						title: "Products",
-						items: values.map((val) => ({
-							label:
-								options?.minerals?.find(
-									(mineral) => mineral.value === val.typeOfProduct,
-								)?.label || val.typeOfProduct,
-							color: colors[
-								allSeenProducts.indexOf(val.typeOfProduct) % colors.length
-							],
-							value: val.value.toLocaleString(),
-						})),
+						items: values.map((val) => {
+							return{
+								label: findOptions(val.typeOfProduct, options?.mineralOptions) || val.typeOfProduct,
+								color: colors[
+									allSeenProducts.indexOf(val.typeOfProduct) % colors.length
+								],
+								value: val.value.toLocaleString(),
+							}
+						}),
 					};
 				}
 				return { title: "", items: [] };