datastake-daf 0.6.797 → 0.6.799

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

@@ -5,6 +5,7 @@ import AdminAccountsScreen from "./AdminScreens/Accounts.jsx";
 import AdminAccountsViewScreen from "./AdminScreens/AccountsView.jsx";
 import AdminSubjectsScreen from "./AdminScreens/Subjects.jsx";
 import AdminLocationScreen from "./AdminScreens/Location.jsx";
+import AdminSubjectsViewScreen from "./AdminScreens/SubjectsView.jsx";
 
 export function getAdminRoutes(config) {
   const {
@@ -15,6 +16,8 @@ export function getAdminRoutes(config) {
     useAdminAccountsViewConfig,
     useAdminSubjectsConfig,
     useAdminLocationConfig,
+    useAdminSubjectsViewConfig,
+    useAdminLocationViewConfig,
     userIsAdmin,
   } = config;
 
@@ -56,6 +59,38 @@ export function getAdminRoutes(config) {
     return <AdminLocationScreen config={locationConfig} />;
   }
 
+  function LocationViewWrapper() {
+    const locationViewConfig =
+      typeof useAdminLocationViewConfig === "function"
+        ? useAdminLocationViewConfig()
+        : undefined;
+    return <AdminSubjectsViewScreen config={{ ...locationViewConfig, subject: "location" }} />;
+  }
+
+  function StakeholderViewWrapper() {
+    const stakeholderViewConfig =
+      typeof useAdminSubjectsViewConfig === "function"
+        ? useAdminSubjectsViewConfig()
+        : undefined;
+    return <AdminSubjectsViewScreen config={{ ...stakeholderViewConfig, subject: "stakeholder" }} />;
+  }
+
+  function LocationEditWrapper() {
+    const locationViewConfig =
+      typeof useAdminLocationViewConfig === "function"
+        ? useAdminLocationViewConfig()
+        : undefined;
+    return <AdminSubjectsViewScreen config={{ ...locationViewConfig, subject: "location", mode: "edit" }} />;
+  }
+
+  function StakeholderEditWrapper() {
+    const stakeholderViewConfig =
+      typeof useAdminSubjectsViewConfig === "function"
+        ? useAdminSubjectsViewConfig()
+        : undefined;
+    return <AdminSubjectsViewScreen config={{ ...stakeholderViewConfig, subject: "stakeholder", mode: "edit" }} />;
+  }
+
   const subjectsIndexComponent =
     typeof useAdminLocationConfig === "function"
       ? <LocationWrapper />
@@ -104,7 +139,7 @@ export function getAdminRoutes(config) {
     ...(typeof useAdminLocationConfig === "function"
       ? [
           {
-            path: "subjects/location",
+            path: "management/subjects/location",
             key: `${APP_PREFIX}_ADMIN_SUBJECTS_LOCATIONS`,
             exact: true,
             visible: (user) => userIsAdmin(user),
@@ -115,7 +150,7 @@ export function getAdminRoutes(config) {
     ...(typeof useAdminSubjectsConfig === "function"
       ? [
           {
-            path: "subjects/stakeholder",
+            path: "management/subjects/stakeholder",
             key: `${APP_PREFIX}_ADMIN_SUBJECTS_STAKEHOLDERS`,
             exact: true,
             visible: (user) => userIsAdmin(user),
@@ -123,6 +158,50 @@ export function getAdminRoutes(config) {
           },
         ]
       : []),
+    ...(typeof useAdminLocationViewConfig === "function"
+      ? [
+          // {
+          //   path: "view/management-location/:id",
+          //   key: `${APP_PREFIX}_ADMIN_LOCATION_VIEW`,
+          //   exact: true,
+          //   visible: (user) => userIsAdmin(user),
+          //   component: <LocationViewWrapper />,
+          // },
+        ]
+      : []),
+    ...(typeof useAdminSubjectsViewConfig === "function"
+      ? [
+          {
+            path: "view/management-stakeholder/:id",
+            key: `${APP_PREFIX}_ADMIN_STAKEHOLDER_VIEW`,
+            exact: true,
+            visible: (user) => userIsAdmin(user),
+            component: <StakeholderViewWrapper />,
+          },
+        ]
+      : []),
+    ...(typeof useAdminLocationViewConfig === "function"
+      ? [
+          {
+            path: "edit/management-location/:id",
+            key: `${APP_PREFIX}_ADMIN_LOCATION_EDIT`,
+            exact: true,
+            visible: (user) => userIsAdmin(user),
+            component: <LocationEditWrapper />,
+          },
+        ]
+      : []),
+    ...(typeof useAdminSubjectsViewConfig === "function"
+      ? [
+          {
+            path: "edit/management-stakeholder/:id",
+            key: `${APP_PREFIX}_ADMIN_STAKEHOLDER_EDIT`,
+            exact: true,
+            visible: (user) => userIsAdmin(user),
+            component: <StakeholderEditWrapper />,
+          },
+        ]
+      : []),
   ];
 
   return routes;

package/src/@daf/layouts/AppLayout/index.jsx

@@ -360,7 +360,6 @@ function AppLayout({
                 >
                   <div className="notification-icon">
                     <BellOutlined />
-                    {/* Add notification count badge if needed */}
                   </div>
                 </Dropdown>
               </NotificationsHistoryProvider>

package/src/@daf/pages/Edit/hooks/usePrepareForm.js

@@ -0,0 +1,178 @@
+import { useState, useEffect } from "react";
+import { hasKeyInObject } from "../../../utils/object.js"
+import { mapFormGroup } from "../../../core/components/EditForm/helper.js"
+import { changeInputMeta as  changeInputMetaDaf, hasNotChanged} from "../../../../helpers/Forms.js"
+
+export const usePrepareForm = ({
+    isSupported,
+    namespaceConfig,
+    APP,
+    allData,
+    id,
+    MainForm,
+    namespace,
+    setIsChanged,
+    changedPath,
+    setChangedPath,
+}) => {
+    const [form, setForm] = useState({});
+    const [data, setData] = useState({});
+    const [groups, setGroups] = useState({});
+    const [linkingForms, setLinkingForms] = useState({});
+    const [loading, setLoading] = useState(true);
+    const [notFound, setNotFound] = useState(false);
+    const [editValues, setEditValues] = useState({});
+    const [inputsMeta, setInputsMeta] = useState({});
+    const [originalData, setOriginalData] = useState({});
+
+    const prepareForm = (setExtra = true) => {
+		if (isSupported) {
+			const dKey = namespaceConfig?.dataKey;
+			const nKey = `${APP}-${namespaceConfig?.view}`;
+			if (hasKeyInObject(allData, dKey) && hasKeyInObject(allData[dKey], nKey)) {
+				const d = JSON.parse(JSON.stringify(allData[dKey][nKey].data || {}));
+				Object.keys(d).forEach((k) => {
+					if (d[k] === null) {
+						d[k] = undefined;
+					}
+				});
+				if (d.datastakeId === id || d.applicationId === id || id === "user") {
+					const formG = mapFormGroup(allData[dKey][nKey].form || {}, d);
+					setForm(formG);
+
+					if (setExtra) {
+						if (
+							(d || {}).risk &&
+							Array.isArray(formG) &&
+							formG.find((r) => r.id === "risk")
+						) {
+							const form = formG.find((r) => r.id === "risk");
+							if (form && form.options && form.template === "risk") {
+								const newData = Object.keys(d.risk).reduce((all, key) => {
+									const forms = form.options[key].forms;
+									const formsKeys = Object.keys(forms);
+									const formData = formsKeys.map((k) => {
+										const foundValue = d.risk[key].find(
+											(v) => v.subCategory === k,
+										);
+										return (
+											foundValue || {
+												id: k,
+												components: {},
+												config: [],
+												connectedEvents: {},
+												category: key,
+												score: 0,
+												subCategory: k,
+											}
+										);
+									});
+									all[key] = formData;
+									return all;
+								}, {});
+								setData({ ...d, risk: newData });
+								MainForm.resetFields();
+								setEditValues({ ...d });
+								setInputsMeta(d?.meta?.inputs || {});
+								setOriginalData({ ...d });
+								setLinkingForms(allData[dKey][nKey].linkingForms);
+								setLoading(false);
+								return;
+							}
+						}
+						setData({ ...d });
+						MainForm.resetFields();
+						setEditValues({ ...d });
+						setInputsMeta(d?.meta?.inputs || {});
+						setOriginalData({ ...d });
+						setLinkingForms(allData[dKey][nKey].linkingForms);
+						setLoading(false);
+					}
+				}
+			}
+		}
+	};
+    const getCertainData = allData?.[namespaceConfig?.dataKey];
+  
+    useEffect(() => {
+        if(namespace && namespaceConfig) {
+            prepareForm(namespaceConfig?.view);
+        }
+    }, [getCertainData, namespaceConfig]);
+
+    const changeLinking = ({ key, linkingKey, value }) => {
+		const _val = {
+			linking: {
+				...(data?.linking || {}),
+				[key]: {
+					...((data?.linking || {})[key] || {}),
+					[linkingKey]: value,
+				},
+			},
+		};
+
+		const _all = { ...data, ..._val };
+
+		setData(_all);
+	};
+
+    const onValuesChange = (val, all) => {
+		setEditValues(all);
+		const keys = val && typeof val === "object" ? Object.keys(val) : [];
+		if (keys.length === 1) {
+			const changedKey = keys[0];
+			const ogData = originalData[changedKey];
+			const newData = all[changedKey];
+			let changePath = JSON.parse(JSON.stringify(changedPath));
+			if (!hasNotChanged({ [changedKey]: ogData }, { [changedKey]: newData })) {
+				if (!changePath.includes(changedKey)) {
+					changePath.push(changedKey);
+				}
+			} else {
+				changePath = changePath.filter((k) => k !== changedKey);
+			}
+			setChangedPath([...changePath]);
+			setIsChanged(changePath.length > 0 || newData ? true : false);
+		} else {
+			setIsChanged(true);
+		}
+		prepareForm(false);
+	};
+
+    const changeInputMeta = ({ key, type, value, otherValues = {} }) => {
+		return changeInputMetaDaf({
+			key,
+			type,
+			value,
+			otherValues,
+			setInputsMeta,
+			editValues,
+			MainForm,
+			setData,
+			onValuesChange,
+		});
+	};
+
+    return {
+        form,
+        data,
+        groups,
+        linkingForms,
+        loading,
+        notFound,
+        editValues,
+        inputsMeta,
+        originalData,
+        setGroups,
+        setNotFound,
+        setLinkingForms,
+        prepareForm,
+        setInputsMeta,
+        setData,
+        setLoading,
+        setEditValues,
+        changeLinking,
+        changeInputMeta,
+        onValuesChange,
+    }
+}

package/src/@daf/pages/Edit/index.jsx

@@ -0,0 +1,356 @@
+import React, { useMemo, useState, useCallback, useEffect } from 'react'
+import { Form, message } from 'antd';
+import { useViewUrlParams } from '../View/hooks/useViewUrlParams';
+import { usePrepareForm } from './hooks/usePrepareForm';
+import { useViewPermissions } from '../View/hooks/useViewPermissions';
+import { useCallToGetData } from '../View/hooks/useCallToGetData';
+import { MessageTypes } from '../../../helpers/messages.js';
+import { editErrorHandler } from "../../core/components/EditForm/helper.js"
+import { transformPayload } from "../../../helpers/Forms.js"
+import Loading from "../../../@daf/core/components/Loading/index.jsx"
+import NotFound from "../../core/components/Screens/NotFound/index.jsx"
+import Header from "../../core/components/Header/index.jsx"
+import MissingTagButton from "../../core/components/UI/MissingTagButton/index.jsx"
+import { Sections as EditFormSections} from "../../core/components/EditForm/sections.jsx"
+import { EditForm } from "../../core/components/EditForm/form.jsx"
+
+
+const Edit = ({
+    goTo = () => {},
+    allData = {},
+    query,
+    push,
+    searchParams,
+    setSearchParams,
+    setNotificationMode,
+    changeNotificationState,
+    addCheck,
+    removeCheck,
+    ajaxForms,
+    changeAjaxForms,
+    ajaxOptions,
+    changeAjaxOptions,
+    params,
+    clear,
+    getRedirectLink,
+    pathname,
+    search,
+    viewConfig,
+    APP,
+    namespaceConfiguration,
+    user,
+    t,
+    actionMap,
+    submitCall,
+    notificationMode,
+    breadcrumbs,
+    generatePath,
+    getAppHeader,
+    getApiBaseUrl,
+    namespaceOverrides,
+    getSubjectsDetails,
+
+    excludedKeys = [],
+	disabledInputs = [],
+	checkDuplicates = true,
+
+}) => {
+    const [MainForm] = Form.useForm();
+    const [isChanged, setIsChanged] = useState(false);
+    const [highlightMandatory, setHighlightMandatory] = useState(false);
+	const [hasMissing, setHasMissing] = useState(false);
+	const [selectedForm, setSelectedForm] = useState({});
+    const [errors, setErrors] = useState({});
+	const changeErrors = useCallback((key, val) => {
+		setErrors((p) => ({ ...p, [key]: val }));
+	}, []);
+    const {
+		namespace,
+		id,
+		group,
+		subsection,
+		match,
+		subgroup,
+		formId,
+		getViewLink,
+		changedPath,
+		setChangedPath,
+	} = useViewUrlParams({
+		params,
+		push,
+		pathname,
+		search,
+		searchParams,
+		setSearchParams,
+		getRedirectLink,
+	})
+
+    const isSupported = viewConfig?.supportedNamespaces?.[APP] && viewConfig?.supportedNamespaces?.[APP]?.includes(namespace);
+    const getNamespaceConfig = (namespace) => namespaceConfiguration?.[namespace] || {};
+	const namespaceConfig = useMemo(() => getNamespaceConfig(namespace), [namespace]);
+
+    const {
+		form,
+		data,
+		linkingForms,
+		loading,
+		editValues,
+		inputsMeta,
+		setLoading,
+		changeLinking,
+		changeInputMeta,
+		onValuesChange,
+	} = usePrepareForm({
+		isSupported,
+		namespaceConfig,
+		APP,
+		allData,
+		id,
+		MainForm,
+		namespace,
+		setIsChanged,
+		changedPath,
+		setChangedPath,
+	})
+
+    useEffect(() => {
+        if(namespace && id && namespaceConfig && typeof getSubjectsDetails === 'function') {
+            getSubjectsDetails({
+                namespace,
+                id,
+                namespaceConfig,
+            })
+        }
+    }, [namespace, id, namespaceConfig])
+
+
+	const { canEdit } = useViewPermissions({
+		data,
+		id,
+		namespace,
+		user,
+		push,
+		getRedirectLink,
+        namespaceConfig: namespaceConfiguration,
+        APP,
+        viewConfig: viewConfig,
+        namespaceOverrides,
+	});
+
+    const action = useMemo(() => actionMap?.[namespaceConfig?.action], [namespaceConfig?.action, actionMap]);
+
+    const namespaceGet = {
+		[namespace]: () => {
+			return action?.({
+				namespace: namespaceConfig?.namespace,
+				module: APP,
+				view: namespaceConfig?.view,
+				...(namespaceConfig?.scope && { scope: namespaceConfig.scope }),
+				datastakeId: id ? id : 'user',
+			})
+		}
+	}
+
+    useCallToGetData({
+		namespaceConfig,
+		namespace,
+		allData,
+		id,
+		isSupported,
+		namespaceGet,
+		source: null,
+		version: null,
+		user,
+		setLoading,
+		APP,
+	})
+
+    const callback = (type, m) => {
+		localStorage.removeItem(`${id}-loading`);
+		localStorage.setItem(`${id}-updated`, true);
+		if (type === MessageTypes.SUCCESS) {
+			message.success(m);
+			setIsChanged(false);
+		} else {
+			message.error(m);
+		}
+		localStorage.removeItem(`${id}-updated`);
+		setLoading(false);
+	};
+
+    const onSubmitData = () => {
+		clear();
+	
+		// Validate custom errors
+		const _errors = Object.keys(errors)
+			.filter((k) => !!errors[k])
+			.map((k) => ({ name: [k] }));
+	
+		if (_errors.length) {
+			editErrorHandler({ errorFields: _errors, t });
+			return;
+		}
+	
+		// Validate and submit form
+		MainForm.validateFields()
+			.then(() => {
+				// Build base payload
+				const { _id, ..._payloadData } = {
+					...editValues,
+					form: subsection || group,
+					module: APP,
+					view: namespaceConfig?.view,
+					namespace,
+				};
+	
+				// Transform payload (process files, clean arrays)
+				const finalPayload = transformPayload(_payloadData);
+	
+				// Setup UI state
+				setIsChanged(false);
+				setNotificationMode(notificationMode.EMPTY);
+				setLoading(true);
+				localStorage.setItem(`${id}-loading`, true);
+		
+				// Submit
+				submitCall[namespace](
+					!editValues?.id 
+						? finalPayload
+						: Object.assign(finalPayload, { id: data.id }),
+					callback,
+				);
+			})
+			.catch((e) => {
+				console.log(e);
+				editErrorHandler({ errorFields: e.errorFields, t });
+			});
+	};
+
+    useEffect(
+		() => () => {
+			clear();
+		},
+		[],
+	);
+
+    const pageActions = [
+		{
+			tooltip: t("Save"),
+			onClick: () => onSubmitData(true),
+			disabled: !isChanged,
+			type: "primary",
+			icon: "Save",
+		},
+		{
+			icon: "Close",
+			tooltip: t("Back"),
+			onClick: () => {
+				changeNotificationState({ onYes: () => goTo(getViewLink()) });
+			},
+		},
+	];
+
+	useEffect(() => {
+		if (isChanged) {
+			addCheck(() => {
+				goTo(`/app/view/${namespace}/${id}/${group}`);
+			});
+		} else {
+			removeCheck();
+		}
+	}, [isChanged, addCheck, removeCheck]);
+
+    if (!data.id && namespace !== 'kyc') {
+		return <Loading />;
+	}
+
+    if(!isSupported && !canEdit) {
+        return <NotFound t={t} />
+    }
+
+    return (
+        <div className="daf-edit-form">
+            <React.Fragment>
+                <Header 
+                    breadcrumbs={breadcrumbs}
+                    title={(namespace === 'kyc' ? "KYC" : data?.name) || ""}
+                    actionButtons={pageActions}
+                    renderExtraComponents={
+                        () => {
+                            return <MissingTagButton hasMissing={hasMissing} highlightMandatory={highlightMandatory} setHighlightMandatory={setHighlightMandatory} t={t} />
+                        }
+                    }
+                />
+                <div className="view-content">
+                    <EditFormSections
+						t={t}
+						data={editValues}
+						MainForm={MainForm}
+						getRedirectLink={getRedirectLink}
+						highlightMandatory={highlightMandatory}
+						search={search}
+						setHasMissing={setHasMissing}
+						mod={APP}
+						formConf={form}
+						values={data}
+						errors={errors}
+						onChangeForm={(sForm) => {
+							setSelectedForm(sForm);
+						}}
+						match={match}
+						group={group}
+						subsection={subsection}
+						subgroup={subgroup}
+						formid={formId}
+						user={user}
+						{...{
+							goTo,
+							pathname,
+							generatePath,
+						}}
+					/>
+                    					<div className="form-edit">
+						{loading ? (
+							<div style={{ minHeight: 10000 }}>
+								<Loading background="white" />
+							</div>
+						) : (
+							<EditForm
+								errors={errors}
+								changeErrors={changeErrors}
+								highlightMandatory={highlightMandatory}
+								MainForm={MainForm}
+								onValuesChange={onValuesChange}
+								disabledInputs={disabledInputs}
+								checkDuplicates={checkDuplicates}
+								inputsMeta={inputsMeta}
+								changeInputMeta={changeInputMeta}
+								changeLinking={changeLinking}
+								excludedKeys={excludedKeys}
+								hasSections={[]}
+								linkingForms={linkingForms}
+								form={selectedForm}
+								data={data}
+								{...{
+									t,
+									user,
+									ajaxForms,
+									ajaxOptions,
+									getAppHeader,
+									getApiBaseUrl,
+									changeAjaxOptions,
+									app: APP,
+									query,
+									goTo,
+									changeAjaxForms,
+								}}
+							/>
+						)}
+					</div>
+                </div>
+            </React.Fragment>
+        </div>
+    )
+}
+
+export default Edit