datastake-daf 0.6.767 → 0.6.768

package/src/@daf/pages/Stakeholders/Workers/index.jsx

@@ -1,11 +1,6 @@
-import React, { useMemo, useState, useEffect, useCallback } from 'react'
-import TablePageWithTabs from '../../../core/components/Screens/TableScreen/TablePageWithTabs/index.jsx'
+import React from 'react'
 import { getColumns } from './columns.js';
-import { checkboxConfig, getFiltersConfig, filtersConfig, getFilterOptions } from './config.js';
-import { useGetQueryParams } from '../../../hooks/useGetQueryParams.js';
-import StakeholdersCreate from './create.jsx';
-import { displayMessage } from '../../../../helpers/messages.js';
-import { useFetchData } from '../../hook.js';
+import TablePage from '../../TablePage/index.jsx';
 
 const WorkersTable = ({
     t = () => {},
@@ -38,105 +33,52 @@ const WorkersTable = ({
     applications = [],
     breadcrumbs = [],
 }) => {
-    const [selectOptions, setSelectOptions] = useState();
-    const [activeTab, setActiveTab] = useState('own');
-
-    const columns = useMemo(() => getColumns({
-        t, 
-        goTo, 
-        user,
-        options,
-        activeTab,
-        getRedirectLink, 
-        theme,
-        subject: 'workers',
-        data,
-        applications,
-    }), [t, goTo, user, options, activeTab, getRedirectLink, theme, data, applications]);
-
-    useFetchData({
-        location,
-        getData,
-        activeTab,
-        extendingFilters,
-        subject: 'workers',
-    })
-
-    const selectFiltersConfig = useMemo(() => {
-        return getFiltersConfig({t});
-    }, [t]);
-
-    useEffect(() => {
-        setSelectOptions((prev) => ({
-          ...prev,
-          ...getFilterOptions(options, t),
-        }))
-      }, [options, t])
-
-    const handleActiveTabChange = useCallback((value) => {
-        setActiveTab(value);
-    }, []);
-
     return (
-        <TablePageWithTabs 
-           t={t}
-           title={t("Workers")}
-           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="workers"
-           getActiveTab={handleActiveTabChange}
-           onDownload={() => {
-            console.log("download");
-           }}
-           drawerTitle={t("Create Worker")}
-        >
-            {({onDrawerClose}) => (
-                <StakeholdersCreate 
-                    defaultData={createDefaultValues}
-                    t={t}
-                    goTo={goTo}
-                    user={user}
-                    APP={APP}
-                    getApiBaseUrl={getApiBaseUrl}
-                    getAppHeader={getAppHeader}
-                    getData={getFormData}
-                    saveData={saveFormData}
-                    loading={formLoading}
-                    onSubmitted={(type, m, data) => {
-                        if (data.datastakeId) {
-                            displayMessage(
-                                type,
-                                t("affirmations::subject-created-successfully") || m,
-                            );
-                            // goTo(`/app/edit/stakeholders/${data.datastakeId}`);
-                            goTo(`/app/edit/workers/${data.datastakeId}`)
-                        }
-                    }}
-                    onCancel={onDrawerClose}
-                    query={query}
-                    ajaxForms={ajaxForms}
-                    changeAjaxForms={changeAjaxForms}
-                    ajaxOptions={ajaxOptions}
-                    changeAjaxOptions={changeAjaxOptions}
-                    formData={formData}
-                    formValue={formValue}
-                    form={form}
-                />
-            )}
-        </TablePageWithTabs>
+        <TablePage 
+            t={t}
+            goTo={goTo}
+            user={user}
+            options={options}
+            getRedirectLink={getRedirectLink}
+            theme={theme}
+            loading={loading}
+            data={data}
+            isMobile={isMobile}
+            APP={APP}
+            location={location}
+            applications={applications}
+
+            subject="workers"
+            getData={getData}
+            getApiBaseUrl={getApiBaseUrl}
+            getAppHeader={getAppHeader}
+            getColumns={getColumns}
+            viewConfig={{
+                title: "Workers",
+                breadcrumbs: breadcrumbs,
+                createTitle: "Create Worker",
+            }}
+            extendingFilters={extendingFilters}
+            formConfig={{
+                getFormData,
+                saveFormData,
+                formLoading,
+                query,
+                ajaxForms,
+                changeAjaxForms,
+                ajaxOptions,
+                changeAjaxOptions,
+                formData,
+                formValue,
+                form,
+                namespace: "WORKERS",
+                view: ['scoping', 'new'],
+                scope: 'global',
+                formType: 'worker',
+                defaultValues: createDefaultValues,
+            }}
+            onDownload={() => console.log("download")}
+        />
     )
 }
 

package/src/@daf/pages/Stakeholders/config.js

@@ -1,8 +1,3 @@
-export const checkboxConfig = {
-	name: 'Name',
-	datastakeId: 'ID'
-}
-
 export const getFiltersConfig = ({t}) => {
     return {
         country: {
@@ -25,17 +20,10 @@ export const getFiltersConfig = ({t}) => {
 	}
 }
 
-export const filtersConfig = {
-	name: '',
-	datastakeId: '',
-};
-
 export const getFilterOptions = (options, t) => {
-	const { countries = [], category = [] } = options || {};
-	const _default  = {
+	const { countries = [], category = [], categoriesOptions = [] } = options || {};
+	return {
 		country: countries,
-		category: category,
+		category: categoriesOptions || category,
 	}
-
-	return _default;
 }

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

@@ -1,12 +1,6 @@
-import React, { useMemo, useState, useEffect, useCallback } from 'react'
-import TablePageWithTabs from '../../core/components/Screens/TableScreen/TablePageWithTabs/index.jsx'
+import React from 'react'
 import { getColumns } from './columns.js';
-import { checkboxConfig, getFiltersConfig, filtersConfig, getFilterOptions } from './config.js';
-import { useGetQueryParams } from '../../hooks/useGetQueryParams.js';
-import StakeholdersCreate from './create.jsx';
-import { displayMessage } from '../../../helpers/messages.js';
-import DAFHeader from '../../core/components/Header/index.jsx';
-import { useFetchData } from '../hook.js';
+import TablePage from '../TablePage/index.jsx';
 
 const StakeholdersTable = ({
     t = () => {},
@@ -38,109 +32,59 @@ const StakeholdersTable = ({
     subjectClear = () => {},
     breadcrumbs = [],
     extendingFilters = {},
+    createDefaultValues = {},
 }) => {
-    const [selectOptions, setSelectOptions] = useState();
-    const [activeTab, setActiveTab] = useState("own");
-    const columns = useMemo(() => getColumns({
-        t, 
-        goTo, 
-        user,
-        options,
-        activeTab,
-        getRedirectLink, 
-        theme,
-        subject: 'stakeholders',
-        applications,
-    }), [t, goTo, user, options, activeTab, getRedirectLink, theme, applications]);
-
-    useFetchData({
-        location,
-        getData,
-        activeTab,
-        extendingFilters,
-        subject: 'stakeholders',
-    })
-
-    const selectFiltersConfig = useMemo(() => {
-        return getFiltersConfig({t});
-    }, [t]);
-
-    useEffect(() => {
-        setSelectOptions((prev) => ({
-          ...prev,
-          ...getFilterOptions(options, t),
-        }))
-      }, [options, t])
-
-    const handleActiveTabChange = useCallback((value) => {
-        setActiveTab(value);
-    }, []);
-
-    useEffect(
-		() => () => {
-			subjectClear();
-		},
-		[],
-	);
-
     return (
-        <TablePageWithTabs 
-           t={t}
-           title={t("Stakeholders")}
-           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="stakeholders"
-           getActiveTab={handleActiveTabChange}
-           onDownload={() => {
-            console.log("download");
-           }}
-           drawerTitle={t("Create Stakeholder")}
-        >
-            {({onDrawerClose}) => (
-                <StakeholdersCreate 
-                    t={t}
-                    goTo={goTo}
-                    user={user}
-                    APP={APP}
-                    getApiBaseUrl={getApiBaseUrl}
-                    getAppHeader={getAppHeader}
-                    getData={getFormData}
-                    saveData={saveFormData}
-                    loading={formLoading}
-                    onSubmitted={(type, m, data) => {
-                        if (data.datastakeId) {
-                            displayMessage(
-                                type,
-                                t("affirmations::subject-created-successfully") || m,
-                            );
-                            goTo(`/app/edit/stakeholders/${data.datastakeId}`);
-                        }
-                    }}
-                    onCancel={onDrawerClose}
-                    query={query}
-                    ajaxForms={ajaxForms}
-                    changeAjaxForms={changeAjaxForms}
-                    ajaxOptions={ajaxOptions}
-                    changeAjaxOptions={changeAjaxOptions}
-                    formData={formData}
-                    formValue={formValue}
-                    form={form}
-                />
-            )}
-        </TablePageWithTabs>
+        <TablePage
+            t={t}
+            goTo={goTo}
+            user={user}
+            options={options}
+            getRedirectLink={getRedirectLink}
+            theme={theme}
+            loading={loading}
+            data={data}
+            isMobile={isMobile}
+            APP={APP}
+            location={location}
+            applications={applications}
+            
+            subject="stakeholders"
+            getData={getData}
+            getApiBaseUrl={getApiBaseUrl}
+            getAppHeader={getAppHeader}
+            subjectClear={subjectClear}
+            getColumns={getColumns}
+            
+            viewConfig={{
+                title: "Stakeholders",
+                breadcrumbs: breadcrumbs,
+                createTitle: "Create Stakeholder",
+            }}
+            
+            extendingFilters={extendingFilters}
+            
+            formConfig={{
+                getFormData,
+                saveFormData,
+                formLoading,
+                query,
+                ajaxForms,
+                changeAjaxForms,
+                ajaxOptions,
+                changeAjaxOptions,
+                formData,
+                formValue,
+                form,
+                namespace: 'stakeholders',
+                view: 'scoping',
+                scope: 'create',
+                formType: 'stakeholder',
+                defaultValues: createDefaultValues,
+            }}
+            
+            onDownload={() => console.log("download")}
+        />
     )
 }
 

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

@@ -0,0 +1,78 @@
+import { getFiltersConfig as getFiltersConfigStakeholders, getFilterOptions as getFilterOptionsStakeholders } from '../Stakeholders/config';
+import { getFiltersConfig as getFiltersConfigOperators, getFilterOptions as getFilterOptionsOperators } from '../Stakeholders/Operators/config';
+import { getFiltersConfig as getFiltersConfigWorkers, getFilterOptions as getFilterOptionsWorkers } from '../Stakeholders/Workers/config';
+
+import { getFiltersConfig as getFiltersConfigEvents, getFilterOptions as getFilterOptionsEvents } from '../Events/config';
+import { getFiltersConfig as getFiltersConfigActivities, getFilterOptions as getFilterOptionsActivities } from '../Events/Activities/config';
+import { getFiltersConfig as getFiltersConfigIncidents, getFilterOptions as getFilterOptionsIncidents } from '../Events/Incidents/config';
+
+import { getFiltersConfig as getFiltersConfigLocations, getFilterOptions as getFilterOptionsLocations } from '../Locations/config';
+import { getFiltersConfig as getFiltersConfigProductionSites, getFilterOptions as getFilterOptionsProductionSites } from '../Locations/MineSite/config';
+
+import { getFiltersConfig as getFilterConfigDocuments, getFilterOptions as getFilterOptionsDocuments } from '../Documents/config';
+
+
+export const getCheckboxConfig = ({ subject }) => {
+  return {
+    name: 'Name',
+    datastakeId: 'ID'
+  }
+}
+
+export const getSelectFiltersConfig = ({ subject }) => {
+  return {
+    name: '',
+    datastakeId: '',
+  }
+};
+
+const FILTER_REGISTRY = {
+    stakeholders: {
+      config: getFiltersConfigStakeholders,
+      options: getFilterOptionsStakeholders,
+    },
+    workers: {
+      config: getFiltersConfigWorkers,
+      options: getFilterOptionsWorkers,
+    },
+    operators: {
+      config: getFiltersConfigOperators,
+      options: getFilterOptionsOperators,
+    },
+    events: {
+      config: getFiltersConfigEvents,
+      options: getFilterOptionsEvents,
+    },
+    activities: {
+      config: getFiltersConfigActivities,
+      options: getFilterOptionsActivities,
+    },
+    incidents: {
+      config: getFiltersConfigIncidents,
+      options: getFilterOptionsIncidents,
+    },
+    locations: {
+      config: getFiltersConfigLocations,
+      options: getFilterOptionsLocations,
+    },
+    'production-sites': {
+      config: getFiltersConfigProductionSites,
+      options: getFilterOptionsProductionSites,
+    },
+    documents: {
+      config: getFilterConfigDocuments,
+      options: getFilterOptionsDocuments,
+    },
+  };
+  
+  const DEFAULT_SUBJECT = 'stakeholders';
+  
+  export const getFiltersConfig = ({ t, subject }) => {
+    const registry = FILTER_REGISTRY[subject] || FILTER_REGISTRY[DEFAULT_SUBJECT];
+    return registry?.config({ t });
+  };
+  
+  export const getFilterOptions = ({ t, subject, options }) => {
+    const registry = FILTER_REGISTRY[subject] || FILTER_REGISTRY[DEFAULT_SUBJECT];
+    return registry.options(options, t);
+  };

package/src/@daf/{core/components/Screens/TableScreen/TableWithTabsAndCreate → pages/TablePage}/create.jsx

@@ -4,8 +4,8 @@ import { MessageTypes } from '../../../helpers/messages.js';
 import DynamicForm from '../../core/components/DynamicForm/index.jsx';
 
 const Create = ({
-    namespace = 'stakeholders',
-    view = 'scoping',
+    namespace,
+    view,
     edit = false,
     formData = {},
     loading = false, 
@@ -27,7 +27,8 @@ const Create = ({
     changeAjaxOptions = () => {}, 
     getAppHeader = () => {},
     getApiBaseUrl = () => {}, 
-    scope
+    scope,
+    formType
 }) => {
     let {
         form = {},
@@ -52,7 +53,7 @@ const Create = ({
         <div className="daf-create-form">
             <DynamicForm 
                 form={form}
-                data={data}
+                data={{...defaultData, ...data}}
                 showSaveAndNext={false}
                 module={APP}
                 onCancel={onCancel}
@@ -75,7 +76,7 @@ const Create = ({
                     const newPayload = {
                         ...defaultData,
                         ...payloadData,
-                        form: 'stakeholder'
+                        form: formType
                     };
 
                 

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

@@ -0,0 +1,123 @@
+import { useState, useEffect, useCallback, useMemo } from 'react';
+import { useGetQueryParams } from "../../hooks/useGetQueryParams.js";
+import { getFiltersConfig, getFilterOptions, getCheckboxConfig, getSelectFiltersConfig } from './config.js';
+
+export const useFetchData = ({
+    location,
+    getData,
+    activeTab,
+    extendingFilters,
+    subject,
+}) => {
+    const { paginationQuery, searchParams, otherParams, sortBy, sortDir, } = useGetQueryParams({location});
+    useEffect(() => {
+        const cleanSearchParams = Object.fromEntries(
+            Object.entries(searchParams).filter(([_, value]) => value != null && value !== '')
+        );
+
+        const hasPagination = paginationQuery.skip != null || paginationQuery.take != null;
+        
+        if (!hasPagination) {
+            return;
+        }
+
+        getData({
+            ...extendingFilters,
+            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,
+            },
+        }, subject)
+    }, [location.search, activeTab, JSON.stringify(extendingFilters)]);
+}
+
+export const useTablePage = ({
+    subject,
+    location,
+    getData,
+    getColumns,
+    extendingFilters,
+    options,
+    t,
+    goTo,
+    user,
+    getRedirectLink,
+    theme,
+    data,
+    applications,
+    subjectClear,
+}) => {
+    const [selectOptions, setSelectOptions] = useState();
+    const [activeTab, setActiveTab] = useState("own");
+
+    useFetchData({
+        location,
+        getData,
+        activeTab,
+        extendingFilters: extendingFilters,
+        subject,
+    });
+
+    const columns = useMemo(() => 
+        getColumns({
+            t, 
+            goTo, 
+            user,
+            options,
+            activeTab,
+            getRedirectLink, 
+            theme,
+            subject,
+            data,
+            applications,
+        }), 
+        [t, goTo, user, options, activeTab, getRedirectLink, theme, data, applications, subject, getColumns]
+    );
+
+    const selectFiltersConfig = useMemo(() => 
+        getFiltersConfig({ t, subject }), 
+        [t, subject, getFiltersConfig]
+    );
+
+    useEffect(() => {
+        setSelectOptions((prev) => ({
+            ...prev,
+            ...getFilterOptions({ t, subject, options }),
+        }));
+    }, [options, t, subject, getFilterOptions]);
+
+    const checkboxConfig = useMemo(() => 
+        getCheckboxConfig({ subject }), 
+        [subject, getCheckboxConfig]
+    );
+
+    const _filtersConfig = useMemo(() => {
+        return getSelectFiltersConfig({ subject });
+    }, [subject, getSelectFiltersConfig]);
+
+    const handleActiveTabChange = useCallback((value) => {
+        setActiveTab(value);
+    }, []);
+
+    useEffect(
+        () => () => {
+            if (subjectClear && typeof subjectClear === 'function') {
+                subjectClear();
+            }
+        },
+        [subjectClear]
+    );
+
+    return {
+        activeTab,
+        selectOptions,
+        columns,
+        selectFiltersConfig,
+        handleActiveTabChange,
+        checkboxConfig,
+        _filtersConfig,
+    };
+}