datastake-daf 0.6.846 → 0.6.848

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

@@ -2,8 +2,8 @@ import React, { useState, useMemo, useEffect, useCallback } from 'react'
 import { Modal } from 'antd';
 import { usePartnersActions } from './hook.js';
 import { getColumns } from './columns.js';
-import TablePageWithTabs from '../../core/components/Screens/TableScreen/TablePageWithTabs/index.jsx';
-import { checkboxConfig, selectFiltersConfig, filtersConfig } from './config.js';
+import TablePage from '../TablePage/index.jsx';
+import { checkboxConfig, filtersConfig, getSelectFiltersConfig, getFilterOptions } from './config.js';
 import Create from './create.jsx';
 import { useGetQueryParams } from '../../hooks/useGetQueryParams.js';
 import ModalHeader from '../../core/components/Header/ModalHeader/index.jsx';
@@ -37,47 +37,6 @@ const PartnersTable = ({
     const [pendingEditId, setPendingEditId] = useState(null);
     const [openModal, setOpenModal] = useState(false);
 
-    const tabs = useMemo(() => [
-            { label: t("List"), key: "partners" },
-            { label: (
-                <div className="tab-cont">
-                <div className="flex flex-column justify-content-center">
-                    {t('Requests')}
-                </div>
-                {typeof totalRequests === 'number' ? (
-                    <div className="flex flex-column justify-content-center">
-                    <div className="bubble">
-                        <div className="flex flex-column justify-content-center">
-                        {totalRequests}
-                        </div>
-                    </div>
-                    </div>
-                ) : null}
-                </div>
-            ), 
-            key: "requests" 
-        },
-    ], [t, totalRequests]);
-
-    const { paginationQuery, searchParams, otherParams, sortBy, sortDir, } = useGetQueryParams({location});
-
-    const filters = useMemo(() => {
-        const cleanSearchParams = Object.fromEntries(
-            Object.entries(searchParams).filter(([_, value]) => value != null && value !== '')
-        );
-
-        return {
-            pagination: paginationQuery,
-            ...(Object.keys(otherParams).length > 0 && otherParams ),
-            ...(Object.keys(cleanSearchParams).length > 0 && { search: cleanSearchParams }),
-            tab: activeTab,
-            sortBy: {
-                [sortBy || "updatedAt"]: sortDir ? (sortDir === "ascend" ? 1 : -1) : -1,
-            },
-            ...extendingFilters,
-        }
-    }, [location.search, activeTab, JSON.stringify(extendingFilters)]);
-
     const { 
         loading, 
         data, 
@@ -93,8 +52,6 @@ const PartnersTable = ({
         initFetchDone,
         setInitFetchDone,
     } = usePartnersActions({
-        activeTab,
-        filters,
         setTotalRequests,
         t,
     });
@@ -110,18 +67,8 @@ const PartnersTable = ({
         selectOptions,
         block,
         setOpen: setOpenModal,
-    }), [t, accept, decline, suspend, resendInvite, activate, activeTab, selectOptions, block, setOpenModal]);
-
-    const handleActiveTabChange = useCallback((value) => {
-        setActiveTab(value);
-    }, []);
-
-    useEffect(() => {
-		if (requestDataFetch) {
-			fetchData();
-			setRequestDataFetch(false);
-		}
-	}, [requestDataFetch, fetchData, setRequestDataFetch]);
+        options,
+    }), [t, accept, decline, suspend, resendInvite, activate, activeTab, selectOptions, block, setOpenModal, options]);
 
     useEffect(() => {
 		if (searchLocationParams.has("datastakeId") && !pendingEditId) {
@@ -139,97 +86,138 @@ const PartnersTable = ({
 		}
 	}, [data, pendingEditId]);
 
-    useEffect(() => {
-	    fetchData();
-	}, [filters]);
+    const tabs = useMemo(() => [
+        { label: t("List"), key: "partners" },
+        { 
+            label: (
+                <div className="tab-cont">
+                    <div className="flex flex-column justify-content-center">
+                        {t('Requests')}
+                    </div>
+                    {typeof totalRequests === 'number' ? (
+                        <div className="flex flex-column justify-content-center">
+                            <div className="bubble">
+                                <div className="flex flex-column justify-content-center">
+                                    {totalRequests}
+                                </div>
+                            </div>
+                        </div>
+                    ) : null}
+                </div>
+            ), 
+            key: "requests" 
+        },
+    ], [t, totalRequests]);
 
-    const headerTooltip = useMemo(() => ({
-        title: t("Partners"),
-        content: (
-            <div className="max-w-250">
-                {t(
-                    "Partners are organisations sharing their information with you, or receiving your information.",
-                )}
-                <br />
-                {t("Only authorised users can create partnerships.")}
-            </div>
-        ),
-    }), [t]);
-    
-    const drawerTooltip = useMemo(() => ({
-        content: (
-            <div className="max-w-250">
-                {t("Source: This partner will share information with you.")},
-                <br />
-                {t("Client: You will share information with this partner.")},
-                <br />
-                {t("Exchange: You will both share information with each other.")}
-            </div>
-        ),
+    const selectFiltersConfig = useMemo(() => {
+        return getSelectFiltersConfig({t});
+    }, [t]);
+
+    const filterOptions = useMemo(() => {
+        return getFilterOptions(options, t);
+    }, [options, t]);
+
+    const headerInfo = useMemo(() => ({
+        title: "Partners",
+        createTitle: "Create Partner",
+        tooltip: {
+            title: t("Partners"),
+            content: (
+                <div className="max-w-250">
+                    {t("Partners are organisations sharing their information with you, or receiving your information.")}
+                    <br />
+                    {t("Only authorised users can create partnerships.")}
+                </div>
+            ),
+        },
+        drawerTooltip: {
+            content: (
+                <div className="max-w-250">
+                    {t("Source: This partner will share information with you.")},
+                    <br />
+                    {t("Client: You will share information with this partner.")},
+                    <br />
+                    {t("Exchange: You will both share information with each other.")}
+                </div>
+            ),
+        },
     }), [t]);
-    
-    return (
+
+    const customCreate = useCallback(({ onDrawerClose }) => (
+        <Create
+            query={query}
+            goTo={goTo}
+            user={user}
+            t={t}
+            ajaxForms={ajaxForms}
+            changeAjaxForms={changeAjaxForms}
+            ajaxOptions={ajaxOptions}
+            changeAjaxOptions={changeAjaxOptions}
+            onClose={onDrawerClose}
+            fetchData={() => setRequestDataFetch(true)}
+            APP={APP}
+            getAppHeader={getAppHeader}
+            getApiBaseUrl={getApiBaseUrl}
+        />
+    ), [query, goTo, user, t, ajaxForms, changeAjaxForms, ajaxOptions, changeAjaxOptions, APP, getAppHeader, getApiBaseUrl, setRequestDataFetch]);
+
+    const customModal = useMemo(() => (
         <>
-            <TablePageWithTabs 
-                t={t}
-                tabs={tabs}
-                title={t("Partners")}
-                breadCrumbs={breadcrumbs}
-                location={location}
-                loading={loading}
-                goTo={goTo}
-                defaultActiveTab={"partners"}
-                columns={columns}
-                data={data}
-                checkboxConfig={checkboxConfig}
-                APP={APP}
-                getApiBaseUrl={getApiBaseUrl}
-                selectOptions={selectOptions}
-                selectFiltersConfig={selectFiltersConfig}
-                getRedirectLink={getRedirectLink}
-                filtersConfig={filtersConfig}
-                isMobile={isMobile}
-                view="partners"
-                getActiveTab={handleActiveTabChange}
-                headerTooltip={headerTooltip}
-                drawerTitle={t("Create Partner")}
-                drawerTooltip={drawerTooltip}
+            <Modal
+                open={!!openModal}
+                onCancel={() => setOpenModal(false)}
+                footer={null}
+                title={<ModalHeader title={t("Edit Settings")} />}
             >
-                {({onDrawerClose}) => (
-                    <Create
-                        query={query}
-                        goTo={goTo}
-                        user={user}
-                        t={t}
-                        ajaxForms={ajaxForms}
-                        changeAjaxForms={changeAjaxForms}
-                        ajaxOptions={ajaxOptions}
-                        changeAjaxOptions={changeAjaxOptions}
-                        onClose={onDrawerClose}
+                {openModal ? (
+                    <Edit
+                        partner={openModal}
                         fetchData={() => setRequestDataFetch(true)}
-                        APP={APP}
-                        getAppHeader={getAppHeader}
-                        getApiBaseUrl={getApiBaseUrl}
-                    />
-                )}
-            </TablePageWithTabs>
-            <Modal
-				open={!!openModal}
-				onCancel={() => setOpenModal(false)}
-				footer={null}
-				title={<ModalHeader title={t("Edit Settings")} />}
-			>
-				{openModal ? (
-					<Edit
-						partner={openModal}
-						fetchData={() => setRequestDataFetch(true)}
-						onClose={() => setOpenModal(false)}
+                        onClose={() => setOpenModal(false)}
                         t={t}
-					/>
-				) : null}
-			</Modal>
+                    />
+                ) : null}
+            </Modal>
             <input id="myInput" hidden />
         </>
+    ), [openModal, t, setRequestDataFetch]);
+
+    const handleActiveTabChange = useCallback((value) => {
+        setActiveTab(value);
+    }, []);
+    
+    return (
+        <TablePage
+            t={t}
+            goTo={goTo}
+            user={user}
+            options={filterOptions}
+            getRedirectLink={getRedirectLink}
+            theme={theme}
+            loading={loading}
+            data={data}
+            isMobile={isMobile}
+            APP={APP}
+            location={location}
+            headerInfo={headerInfo}
+            extendingFilters={extendingFilters}
+            getData={fetchData}
+            getApiBaseUrl={getApiBaseUrl}
+            getAppHeader={getAppHeader}
+            applications={applications}
+            subject="partners"
+            breadcrumbs={breadcrumbs}
+            customCreate={customCreate}
+            customModal={customModal}
+            customTabs={tabs}
+            defaultActiveTab="partners"
+            customColumns={columns}
+            customCheckboxConfig={checkboxConfig}
+            customFiltersConfig={filtersConfig}
+            customSelectFiltersConfig={selectFiltersConfig}
+            getActiveTab={handleActiveTabChange}
+            refetchTrigger={requestDataFetch}
+        />
     )
 }
 

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

@@ -1,7 +1,6 @@
 import React from "react";
-import DafButton from "../../../Button/index.jsx";
-import Loading from "../../../Loading/index.jsx";
-import AuthForm from "../../../AuthForm/index.jsx";
+import DafButton from "../../core/components/Button/index.jsx";
+import AuthForm from "../../core/components/AuthForm/index.jsx";
 
 const step = 1;
 

package/src/@daf/pages/SelfAssesment/components/OrgInformationTable/columns.js

@@ -29,11 +29,12 @@ const cols = [
             }
 
             const title = all?.published
-                ? t("general-information")
-                : t("registration");
+                ? `${t("general-information")}-KYC`
+                : `${t("registration")}-KYC`;
 
             return <Tooltip title={title}>{title}</Tooltip>;
         },
+        
     },
     {
         dataIndex: "completion",

package/src/@daf/pages/TablePage/hook.js

@@ -9,53 +9,54 @@ import {
     getViewConfig
 } from './config.js';
 import { getColumns } from './columns.js';
-
-export const useFetchData = ({
-    location,
-    getData,
-    activeTab,
-    extendingFilters,
-    subject,
-}) => {
-    const { paginationQuery, searchParams, otherParams, sortBy, sortDir, } = useGetQueryParams({location});
+import { useFetchData } from '../hook.js';
+
+// export const useFetchData = ({
+//     location,
+//     getData,
+//     activeTab,
+//     extendingFilters,
+//     subject,
+// }) => {
+//     const { paginationQuery, searchParams, otherParams, sortBy, sortDir, } = useGetQueryParams({location});
     
-    const prevParamsRef = useRef();
+//     const prevParamsRef = useRef();
         
-    useEffect(() => {
-        const cleanSearchParams = Object.fromEntries(
-            Object.entries(searchParams).filter(([_, value]) => value != null && value !== '')
-        );
+//     useEffect(() => {
+//         const cleanSearchParams = Object.fromEntries(
+//             Object.entries(searchParams).filter(([_, value]) => value != null && value !== '')
+//         );
 
-        const hasPagination = paginationQuery.skip != null || paginationQuery.take != null;
+//         const hasPagination = paginationQuery.skip != null || paginationQuery.take != null;
         
-        if (!hasPagination) {
-            return;
-        }
-
-        const extendingSortKey = extendingFilters?.sortBy ? Object.keys(extendingFilters.sortBy)[0] : null;
-        const extendingSortDir = extendingFilters?.sortBy && extendingSortKey ? extendingFilters.sortBy[extendingSortKey] : null;
-
-        const currentParams = {
-            ...extendingFilters,
-            pagination: paginationQuery,
-            ...(Object.keys(otherParams).length > 0 && otherParams ),
-            ...(Object.keys(cleanSearchParams).length > 0 && { search: cleanSearchParams }),
-            tab: activeTab,
-            sortBy: {
-                [sortBy || extendingSortKey || "updatedAt"]: sortDir ? (sortDir === "ascend" ? 1 : -1) : (extendingSortDir || -1),
-            },
-        };
-
-        const currentParamsString = JSON.stringify(currentParams);
-        if (prevParamsRef.current === currentParamsString) {
-            return;
-        }
+//         if (!hasPagination) {
+//             return;
+//         }
+
+//         const extendingSortKey = extendingFilters?.sortBy ? Object.keys(extendingFilters.sortBy)[0] : null;
+//         const extendingSortDir = extendingFilters?.sortBy && extendingSortKey ? extendingFilters.sortBy[extendingSortKey] : null;
+
+//         const currentParams = {
+//             ...extendingFilters,
+//             pagination: paginationQuery,
+//             ...(Object.keys(otherParams).length > 0 && otherParams ),
+//             ...(Object.keys(cleanSearchParams).length > 0 && { search: cleanSearchParams }),
+//             tab: activeTab,
+//             sortBy: {
+//                 [sortBy || extendingSortKey || "updatedAt"]: sortDir ? (sortDir === "ascend" ? 1 : -1) : (extendingSortDir || -1),
+//             },
+//         };
+
+//         const currentParamsString = JSON.stringify(currentParams);
+//         if (prevParamsRef.current === currentParamsString) {
+//             return;
+//         }
         
-        prevParamsRef.current = currentParamsString;
+//         prevParamsRef.current = currentParamsString;
 
-        getData(currentParams, subject);
-    }, [location.search, JSON.stringify(extendingFilters), activeTab]);
-}
+//         getData(currentParams, subject);
+//     }, [location.search, JSON.stringify(extendingFilters), activeTab]);
+// }
 
 export const useTablePage = ({
     subject,
@@ -72,9 +73,13 @@ export const useTablePage = ({
     applications,
     subjectClear,
     APP,
+    defaultActiveTab = "own",
+    getActiveTab,
+    refetchTrigger,
+    noTabs = false,
 }) => {
     const [selectOptions, setSelectOptions] = useState();
-    const [activeTab, setActiveTab] = useState("own");
+    const [activeTab, setActiveTab] = useState(noTabs ? null : defaultActiveTab);
 
     useFetchData({
         location,
@@ -82,6 +87,7 @@ export const useTablePage = ({
         activeTab,
         extendingFilters: extendingFilters,
         subject,
+        refetchTrigger,
     });
 
     const columns = useMemo(() => 
@@ -133,6 +139,9 @@ export const useTablePage = ({
     );
     const handleActiveTabChange = useCallback((value) => {
         setActiveTab(value);
+        if (getActiveTab && typeof getActiveTab === 'function' && !noTabs) {
+            getActiveTab(value);
+        }
     }, []);
 
     useEffect(

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

@@ -1,5 +1,6 @@
 import React, { useMemo } from 'react';
 import TablePageWithTabs from '../../core/components/Screens/TableScreen/TablePageWithTabs/index.jsx';
+import StandardTablePage from '../../core/components/Screens/TableScreen/StandardTablePage/index.jsx';
 import Create from './create.jsx';
 import { displayMessage } from '../../../helpers/messages.js';
 import { useTablePage } from './hook.js';
@@ -40,8 +41,19 @@ const TablePage = ({
     subject,
     breadcrumbs = [],
     onDownload,
+    customCreate,
+    customModal,
+    customTabs,
+    defaultActiveTab = "own",
+    customColumns,
+    customCheckboxConfig,
+    customFiltersConfig,
+    customSelectFiltersConfig,
+    getActiveTab,
+    noTabs = false,
+    refetchTrigger,
+    externalOpenDrawer = false,
 }) => {
-    
     const {
         activeTab,
         selectOptions,
@@ -53,6 +65,7 @@ const TablePage = ({
         formInfo,
         viewConfig,
     } = useTablePage({
+        defaultActiveTab,
         subject,
         location,
         getData,
@@ -67,69 +80,90 @@ const TablePage = ({
         applications,
         subjectClear,
         APP,
+        getActiveTab,
+        refetchTrigger,
     });
 
+    const TableComponent = noTabs ? StandardTablePage : TablePageWithTabs;
+    
+    const commonProps = {
+        t,
+        title: t(headerInfo?.title || viewConfig?.title || ""),
+        breadCrumbs: breadcrumbs,
+        location,
+        loading,
+        goTo,
+        columns: customColumns || columns,
+        data,
+        checkboxConfig: customCheckboxConfig || checkboxConfig,
+        APP,
+        getApiBaseUrl,
+        selectOptions,
+        selectFiltersConfig: customSelectFiltersConfig || selectFiltersConfig,
+        getRedirectLink,
+        filtersConfig: customFiltersConfig || _filtersConfig,
+        isMobile,
+        view: subject,
+        onDownload: onDownload && typeof onDownload === 'function' ? onDownload : undefined,
+        drawerTitle: t(headerInfo?.createTitle || viewConfig?.createTitle || ""),
+        headerTooltip: headerInfo?.tooltip,
+        drawerTooltip: headerInfo?.drawerTooltip,
+        externalOpenDrawer,
+    };
+
+    const tabsOnlyProps = noTabs ? {} : {
+        tabs: customTabs,
+        defaultActiveTab,
+        getActiveTab: handleActiveTabChange,
+    };
+
     return (
-        <TablePageWithTabs
-            t={t}
-            title={t(headerInfo?.title || viewConfig?.title || "")}
-            breadCrumbs={breadcrumbs}
-            location={location}
-            loading={loading}
-            goTo={goTo}
-            defaultActiveTab={"own"}
-            columns={columns}
-            data={data}
-            checkboxConfig={checkboxConfig}
-            APP={APP}
-            getApiBaseUrl={getApiBaseUrl}
-            selectOptions={selectOptions}
-            selectFiltersConfig={selectFiltersConfig}
-            getRedirectLink={getRedirectLink}
-            filtersConfig={_filtersConfig}
-            isMobile={isMobile}
-            view={subject}
-            getActiveTab={handleActiveTabChange}
-            onDownload={onDownload && typeof onDownload === 'function' ? onDownload : undefined}
-            drawerTitle={t(headerInfo?.createTitle || viewConfig?.createTitle || "")}
-        >
-            {({onDrawerClose}) => (
-                <Create 
-                    t={t}
-                    goTo={goTo}
-                    user={user}
-                    APP={APP}
-                    getApiBaseUrl={getApiBaseUrl}
-                    getAppHeader={getAppHeader}
-                    getData={formConfig.getFormData}
-                    saveData={formConfig.saveFormData}
-                    loading={formConfig.formLoading}
-                    onSubmitted={(type, m, data) => {
-                        if (data.datastakeId) {
-                            displayMessage(
-                                type,
-                                t("affirmations::subject-created-successfully") || m,
-                            );
-                            goTo(`/app/edit/${subject}/${data.datastakeId}`);
-                        }
-                    }}
-                    onCancel={onDrawerClose}
-                    query={formConfig.query}
-                    ajaxForms={formConfig.ajaxForms}
-                    changeAjaxForms={formConfig.changeAjaxForms}
-                    ajaxOptions={formConfig.ajaxOptions}
-                    changeAjaxOptions={formConfig.changeAjaxOptions}
-                    formData={formConfig.formData}
-                    formValue={formConfig.formValue}
-                    form={formConfig.form}
-                    namespace={formConfig?.namespace || formInfo?.namespace}
-                    view={formConfig?.view || formInfo.view}
-                    scope={formConfig?.scope || formInfo.scope}
-                    formType={formConfig?.formType || formInfo.formType}
-                    defaultData={defaultValues}
-                />
-            )}
-        </TablePageWithTabs>
+        <>
+            <TableComponent
+                {...commonProps}
+                {...tabsOnlyProps}
+            >
+                {({onDrawerClose, setOpenCreateDrawer}) => 
+                    customCreate ? customCreate({ onDrawerClose, setOpenCreateDrawer }) : (
+                        <Create 
+                            t={t}
+                            goTo={goTo}
+                            user={user}
+                            APP={APP}
+                            getApiBaseUrl={getApiBaseUrl}
+                            getAppHeader={getAppHeader}
+                            getData={formConfig.getFormData}
+                            saveData={formConfig.saveFormData}
+                            loading={formConfig.formLoading}
+                            onSubmitted={(type, m, data) => {
+                                if (data.datastakeId) {
+                                    displayMessage(
+                                        type,
+                                        t("affirmations::subject-created-successfully") || m,
+                                    );
+                                    goTo(`/app/edit/${subject}/${data.datastakeId}`);
+                                }
+                            }}
+                            onCancel={onDrawerClose}
+                            query={formConfig.query}
+                            ajaxForms={formConfig.ajaxForms}
+                            changeAjaxForms={formConfig.changeAjaxForms}
+                            ajaxOptions={formConfig.ajaxOptions}
+                            changeAjaxOptions={formConfig.changeAjaxOptions}
+                            formData={formConfig.formData}
+                            formValue={formConfig.formValue}
+                            form={formConfig.form}
+                            namespace={formConfig?.namespace || formInfo?.namespace}
+                            view={formConfig?.view || formInfo.view}
+                            scope={formConfig?.scope || formInfo.scope}
+                            formType={formConfig?.formType || formInfo.formType}
+                            defaultData={defaultValues}
+                        />
+                    )
+                }
+            </TableComponent>
+            {customModal}
+        </>
     );
 };