datastake-daf 0.6.754 → 0.6.756

package/src/@daf/core/components/Screens/Users/index.jsx

@@ -0,0 +1,173 @@
+import React, { useMemo, useState, useEffect } from 'react'
+import { Drawer } from 'antd'
+import { getColumns } from './columns.js';
+import { checkboxConfig, getFiltersConfig, filtersConfig, getFilterOptions } from './config.js';
+import { useGetQueryParams } from '../../../../hooks/useGetQueryParams.js';
+import UsersCreate from './create.jsx';
+import Header from '../../../../core/components/Header/index.jsx';
+import BaseScreen from '../BaseScreen/index.jsx';
+import { CREATE_DRAWER_WIDTH } from '../../../../../helpers/Forms.js';
+import DrawerHeader from '../../../../core/components/Header/DrawerHeader/index.jsx';
+
+const UsersTable = ({
+  t = () => {},
+  goTo = () => {},
+  user = {},
+  options = {},
+  getRedirectLink = () => {},
+  theme = {},
+  loading = false,
+  data = {},
+  isMobile,
+  APP,
+  location,
+  getData = () => {},
+  getApiBaseUrl = () => {},
+  getAppHeader = () => {},
+  onInviteUser = () => {},
+  onEditUser = () => {},
+  query = {},
+  ajaxForms = {},
+  changeAjaxForms = () => {},
+  ajaxOptions = {},
+  changeAjaxOptions = () => {},
+  extendingFilters = {},
+  userRoles = [],
+}) => {
+  const [selectOptions, setSelectOptions] = useState();
+  const params = new URLSearchParams(location?.search);
+  const [openCreateModal, setOpenCreateModal] = useState(params.has("create"));
+  const [userToEdit, setUserToEdit] = useState(null);
+
+  const columns = useMemo(() => getColumns({
+    t,
+    goTo,
+    user,
+    options,
+    getRedirectLink,
+    theme,
+    subject: 'user',
+    data,
+    setUserToEdit,
+  }), [t, goTo, user, options, getRedirectLink, theme, data]);
+
+  const breadCrumbs = [];
+
+  const { paginationQuery, searchParams, otherParams, sortBy, sortDir } = useGetQueryParams({ location });
+
+  const filters = useMemo(() => ({
+    ...otherParams,
+    ...extendingFilters,
+  }), [otherParams, extendingFilters]);
+
+  useEffect(() => {
+    getData({
+      pagination: paginationQuery,
+      ...(Object.keys(searchParams).length > 0 && { search: searchParams }),
+      ...otherParams,
+      sortBy: {
+        [sortBy || 'updatedAt']: sortDir ? (sortDir === 'ascend' ? 1 : -1) : -1,
+      },
+      ...extendingFilters,
+    }, 'users');
+  }, [location.search, JSON.stringify(extendingFilters)]);
+
+  const selectFiltersConfig = useMemo(() => getFiltersConfig({ t }), [t]);
+
+  useEffect(() => {
+    setSelectOptions((prev) => ({
+      ...prev,
+      ...getFilterOptions(options, t),
+    }));
+  }, [options, t]);
+
+  return (
+    <div className="semibold form-input-output daf-create-view">
+      <Header 
+        title={t("users")}
+        breadcrumbs={breadCrumbs}
+        actionButtons={[
+          {
+            type: "primary",
+            onClick: () => setOpenCreateModal(true),
+            tooltip: t("New"),
+            icon: "Add",
+          },
+        ]}
+        // onDownload={() => {
+        //   console.log("download");
+        // }}
+        // downloadDisabled={false}
+      />
+      <BaseScreen 
+        t={t}
+        checkboxConfig={checkboxConfig}
+        defaultTableFilters={{}}
+        columns={columns}
+        data={data}
+        loading={loading}
+        location={location}
+        goTo={goTo}
+        APP={APP}
+        getApiBaseUrl={getApiBaseUrl}
+        selectOptions={selectOptions}
+        selectFilters={selectFiltersConfig}
+        view="users"
+        getRedirectLink={getRedirectLink}
+        defaultUrlParams={{}}
+        module={APP}
+        filtersConfig={filtersConfig}
+        isMobile={isMobile}
+      />
+      {(openCreateModal || !!userToEdit) && (
+        <Drawer
+          destroyOnClose
+          title={
+            <DrawerHeader 
+              title={t(userToEdit ? "Edit User" : "New User")}
+            />
+          }
+          open={openCreateModal || !!userToEdit}
+          onClose={() => {
+            setOpenCreateModal(false);
+            setUserToEdit(null);
+          }}
+          width={CREATE_DRAWER_WIDTH}
+          bodyStyle={{ padding: 0 }}
+          maskClosable={false}
+        >
+          <UsersCreate
+            t={t}
+            goTo={goTo}
+            user={user}
+            APP={APP}
+            getApiBaseUrl={getApiBaseUrl}
+            getAppHeader={getAppHeader}
+            onSubmitted={(payload) => {
+              if (userToEdit) {
+                onEditUser(payload);
+              } else {
+                onInviteUser(payload);
+              }
+              setOpenCreateModal(false);
+              setUserToEdit(null);
+            }}
+            onCancel={() => {
+              setOpenCreateModal(false);
+              setUserToEdit(null);
+            }}
+            query={query}
+            ajaxForms={ajaxForms}
+            changeAjaxForms={changeAjaxForms}
+            ajaxOptions={ajaxOptions}
+            changeAjaxOptions={changeAjaxOptions}
+            userRoles={userRoles}
+            userToEdit={userToEdit}
+          />
+        </Drawer>
+      )}
+    </div>
+  );
+};
+
+export default UsersTable;

package/src/@daf/core/components/TableScreen/TablePageWithTabs/index.jsx

@@ -1,9 +1,9 @@
 import React, { useState, useEffect, useRef } from 'react'
 import { Tabs, Drawer } from 'antd'
-import Header from '../../../Header/index.jsx'
-import BaseScreen from '../../BaseScreen/index.jsx'
-import { CREATE_DRAWER_WIDTH } from '../../../../helpers/Forms.js'
-import DrawerHeader from '../../../Header/DrawerHeader/index.jsx'
+import Header from '../../../../core/components/Header/index.jsx'
+import BaseScreen from '../../../components/Screens/BaseScreen/index.jsx'
+import { CREATE_DRAWER_WIDTH } from '../../../../../helpers/Forms.js'
+import DrawerHeader from '../../../../core/components/Header/DrawerHeader/index.jsx'
 
 const TablePageWithTabs = ({
     t= () => {},

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

@@ -15,7 +15,7 @@ export const useFilters = ({
   doPagination = true,
   getRedirectLink,
 }) => {
-  const params = useMemo(() => new URLSearchParams(location.search), [location.search]);
+  const params = useMemo(() => new URLSearchParams(location?.search), [location?.search]);
   const [activeFilters, setActiveFilters] = useState(
     defaultActiveFilters || getDefaultActiveFilters(params, selectFiltersConfig, defaultPageSize, defaultUrlParams, doPagination)
   );
@@ -69,9 +69,9 @@ export const useFilters = ({
       if (typeof getRedirectLink === 'function') {
         goTo(getRedirectLink(
           view === 'mine-monitoring' 
-            ? (qs !== '' ? `${location.pathname}?${qs}`
-                : doPagination ? `${location.pathname}?page=${page}`
-                  : location.pathname)
+            ? (qs !== '' ? `${location?.pathname}?${qs}`
+                : doPagination ? `${location?.pathname}?page=${page}`
+                  : location?.pathname)
             : (qs !== '' ? `${`/app/${view}`}?${qs}`
                 : doPagination ? `${`/app/${view}`}?page=${page}`
                   : `${`/app/${view}`}`)
@@ -81,9 +81,9 @@ export const useFilters = ({
 
       if (view === 'mine-monitoring') {
         goTo(
-          qs !== '' ? `${location.pathname}?${qs}`
-            : doPagination ? `${location.pathname}?page=${page}`
-              : location.pathname);
+          qs !== '' ? `${location?.pathname}?${qs}`
+            : doPagination ? `${location?.pathname}?page=${page}`
+              : location?.pathname);
       } else {
         goTo(
           qs !== '' ? `${`/app/${module}/${view}`}?${qs}`
@@ -91,7 +91,7 @@ export const useFilters = ({
               : `${`/app/${module}/${view}`}`);
       }
     }
-  }, [module, view, location.pathname, goTo, getRedirectLink, doPagination]);
+  }, [module, view, location?.pathname, goTo, getRedirectLink, doPagination]);
 
   const defaultFilters = useMemo(() => {
     const def = {};
@@ -234,6 +234,8 @@ export const useFilters = ({
   const canGoPrev = useMemo(() => pagination.current !== 1, [pagination]);
   const canGoNext = useMemo(() => pagination.current !== totalPages && totalPages, [pagination, totalPages]);
 
+  console.log({totalPages, pagination})
+
   const goPrev = () => {
     if (!canGoPrev) {
       return;

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

@@ -16,9 +16,9 @@ export const useWidgetFetch = ({config, getData = DashboardService.getWidget, on
 
 
 	const fetchData = async () => {
-		// if (stop) {
-		// 	return;
-		// }
+		if (stop) {
+			return;
+		}
 
 		setLoading(true);
 

package/src/@daf/pages/Dashboards/helper.js

@@ -11,7 +11,7 @@ const individualIcon = <CustomIcon name="UserCircle" color="#6C737F" width={18}
 const csIcon = <CustomIcon name="CivilSociety" color="#6C737F" width={18} height={18} />;
 const leftIcon = (
 	<CustomIcon
-		name="NashirikiSmallLogo"
+		name="WaziDarkIcon"
 		color={theme.colorPrimary8}
 		width={16}
 		height={16}
@@ -19,14 +19,14 @@ const leftIcon = (
 );
 const middleIcon = (
 	<CustomIcon
-		name="NashirikiSmallLogo"
+		name="WaziDarkIcon"
 		color={theme.colorPrimary2}
 		width={16}
 		height={16}
 	/>
 );
 
-const rightIcon = <CustomIcon name="NashirikiSmallLogo" color="white" width={16} height={16} />;
+const rightIcon = <CustomIcon name="WaziDarkIcon" color="white" width={16} height={16} />;
 
 const mapIcon = (category) => {
 	switch (category) {

package/src/@daf/pages/Documents/columns.js

@@ -37,7 +37,6 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t("Date"),
     dataIndex: "date",
     key: "date",
-    width: 125,
     render: (date, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />;
@@ -58,19 +57,18 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
         return <div className="daf-default-cell" />;
       }
       if (!val || val?.length === 0) {
-        return "--";
+        return "-";
       }
 
       const sources = sourceAvatarConfig(val, user, applications);
 
-      return <AvatarGroup items={sources}></AvatarGroup>;
+      return <AvatarGroup items={sources} />;
     },
   },
   {
     title: t("Last Update"),
     dataIndex: "updatedAt",
     key: "updatedAt",
-    width: 125,
     render: (date, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />;

package/src/@daf/pages/Events/Activities/index.jsx

@@ -47,7 +47,7 @@ const ActivitiesTable = ({
         activeTab,
         getRedirectLink, 
         theme,
-        subject: 'correctiveActions',
+        subject: 'activities',
         data,
         applications,
     }), [t, goTo, user, options, activeTab, getRedirectLink, theme, data, applications]);

package/src/@daf/pages/Events/columns.js

@@ -96,7 +96,7 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
       })
 
       if (val?.length === 0) {
-        return "--";
+        return "-";
       }
 
       return <MoreTags values={val} />;
@@ -106,19 +106,19 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t("Date"),
     dataIndex: "date",
     key: "date",
-    testimonials: true,
-    incident: true,
-    correctiveActions: true,
+    // testimonials: true,
+    // incident: true,
+    // correctiveActions: true,
     show: true,
-    sorter: () => 0 + 0,
-    searchType: "date",
-    width: 125,
+    // sorter: () => 0 + 0,
+    // searchType: "date",
+    // width: 125,
     render: (date, all) => {
       if (all.empty) {
         return null;
       }
 
-      const title = date ? renderDateFormatted(date, "DD MMM YYYY") : "--";
+      const title = date ? renderDateFormatted(date, "DD MMM YYYY") : "-";
       return <Tooltip title={title}>{title}</Tooltip>;
     },
     ellipsis: true,
@@ -134,13 +134,13 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
       }
 
       if (!value) {
-        return "--";
+        return "-";
       }
 
       // Form the moment the intend of the if block is to be executed only in event table
       if (typeof value === "string") {
         if (all.navigationEventType === "other") {
-          return "--";
+          return "-";
         }
 
         const categoryOptions = (data?.options?.categoryOptions || []).map((c) => {
@@ -158,13 +158,13 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
           ...(data?.options?.testimonialsType || []),
         ];
 
-        const title = relaxantOptions.find((v) => v.value === value)?.label || "--";
+        const title = relaxantOptions.find((v) => v.value === value)?.label || "-";
 
         return <Tooltip title={title}>{title}</Tooltip>;
       }
 
       const val = value.map((v, i) => ({ label: v.name, value: `${v.name}-${i}` }));
-      return val.length ? <MoreTags values={val} /> : "--";
+      return val.length ? <MoreTags values={val} /> : "-";
     },
   },
   {
@@ -190,7 +190,6 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     correctiveActions: activeTab === "own",
     testimonials: activeTab === "own",
     incident: activeTab === "own",
-    width: 120,
     render: (value, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />;
@@ -209,7 +208,6 @@ export const getColumns = ({ t, goTo, user, options, activeTab, getRedirectLink,
     title: t("Last Update"),
     dataIndex: "updatedAt",
     key: "updatedAt",
-    width: 125,
     render: (date, all) => {
       if (all.empty) {
         return <div className="daf-default-cell" />;

package/src/@daf/pages/Locations/MineSite/columns.js

@@ -40,8 +40,8 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         },
     },    
     {
-        dataIndex: 'province',
-        title: t('Province'),
+        dataIndex: 'region',
+        title: t('Region'),
         ellipsis: true,
         show: true,
         render: (v, all) => {
@@ -49,13 +49,11 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
             return <div className="daf-default-cell" />
           }
 
-          const region = getLinkValue(all?.location?.administrativeLevel1, all?.location?.linking?.SCL);
+          const region = getLinkValue(all?.administrativeLevel1, all?.linking?.SCL);
 
           return region ? <Tooltip title={region}>{region}</Tooltip> : '-';
         },
     },   
-        
- 
     {
         dataIndex: 'territory',
         title: t('Territory'),
@@ -66,26 +64,25 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
             return <div className="daf-default-cell" />
           }
 
-          const district = getLinkValue(all?.location?.administrativeLevel2, all?.location?.linking?.SCL);
+          const district = getLinkValue(all?.administrativeLevel2, all?.linking?.SCL);
 
           return district ? <Tooltip title={district}>{district}</Tooltip> : '-';
         },
     },     
     {
-        title: t("Products"),
-        dataIndex: "products",
-        key: "products",
-        show: activeTab !== "own",
-        render: (val, all) => {
-            if (all.empty) {
-                return <div className="daf-default-cell" />;
-            }
-
-            console.log({val, all})
-
-            return <AvatarGroup items={val}></AvatarGroup>;
+        dataIndex: 'category',
+        title: t('Type'),
+        ellipsis: true,
+        show: true,
+        render: (v, all) => {
+          if (all.empty) {
+            return <div className="daf-default-cell" />
+          }
+          const category = findOptions(v, options?.locationCategories);
+    
+          return <Tooltip title={category}>{category}</Tooltip>;
         },
-    },
+    },    
     {
         dataIndex: 'operator',
         title: t('Operator'),

package/src/@daf/pages/Locations/columns.js

@@ -80,7 +80,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
             return <div className="daf-default-cell" />
           }
 
-          const province = getLinkValue(v, all?.linking?.SCL);
+          const province = getLinkValue(all?.administrativeLevel1, all?.linking?.SCL);
 
           return province ? <Tooltip title={province}>{province}</Tooltip> : '-';
         },
@@ -95,7 +95,7 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
             return <div className="daf-default-cell" />
           }
 
-          const territory = getLinkValue(v, all?.linking?.SCL);
+          const territory = getLinkValue(all?.administrativeLevel2, all?.linking?.SCL);
 
           return territory ? <Tooltip title={territory}>{territory}</Tooltip> : '-';
         },

package/src/@daf/pages/Stakeholders/Workers/columns.js

@@ -167,10 +167,20 @@ export const getColumns = ({t, goTo, user, options, activeTab, getRedirectLink,
         const link = `/app/view/${subject}/${all.datastakeId}`;
 
         return <div style={{ display: "flex", justifyContent: "center" }}>
-						<a href={getRedirectLink(link)}>
-							<CustomIcon name="Link" size={15} color={theme.baseGray70} />
-						</a>
-			</div>;
+            <button 
+                onClick={() => goTo(getRedirectLink(link))}
+                style={{ 
+                    cursor: 'pointer', 
+                    border: 'none', 
+                    background: 'transparent',
+                    padding: 0,
+                    display: 'flex',
+                    alignItems: 'center'
+                }}
+            >
+                <CustomIcon name="Link" size={15} color={theme.baseGray70} />
+            </button>
+        </div>;
       }
     }
 ].filter((column) => column.show !== false);

package/src/@daf/pages/Summary/Minesite/components/MineDetailsSection/index.js

@@ -16,7 +16,7 @@ const MineDetailsSection = ({
             basepath: "analytics",
             url: '/widgets/mine-site-details',
             defaultData: [],
-            stop: selectedPartners?.loading,
+            stop: !locationData?.datastakeId || selectedPartners?.loading,
             filters: {
                 datastakeId: locationData?.datastakeId,
                 sources: selectedPartners?.partners || [],

package/src/@daf/pages/Summary/Minesite/index.jsx

@@ -59,6 +59,7 @@ const MineSummary = ({
             theme,
             service,
             onIdChange,
+            type: "mine",
     });
 
     return (

package/src/@daf/pages/Summary/Operator/components/KeyInformation/config.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { Tag, Tooltip } from "antd";
 import CountryFlag from "../../../../../core/components/UI/CountryFlag/index.jsx";
-import {findOptions } from "../../../../../../helpers/StringHelper.js";
+import {findOptions, truncateString } from "../../../../../../helpers/StringHelper.js";
 
 export const getKeyIndicatorConfig = ({ t, data = {}, options = {} }) => [
 	{
@@ -36,6 +36,12 @@ export const getKeyIndicatorConfig = ({ t, data = {}, options = {} }) => [
 		label: t("Legal Form"),
 		render: () => {
             const subCategory = findOptions(data?.subCategory, options?.subCategoriesOptions);
+			if(subCategory?.length > 22) {
+				const _subCategory = truncateString(subCategory, 22);
+				return <Tooltip title={subCategory}>
+					<span style={{fontWeight: "normal", fontSize: 14}}>{_subCategory || "-"}</span>
+				</Tooltip>;
+			}
 			return <div>{subCategory || "-"}</div>;
 		},
 	},

package/src/@daf/pages/Summary/Operator/index.jsx

@@ -60,6 +60,7 @@ const OperatorSummary = ({
             theme,
             service,
             onIdChange,
+            type: "operator",
     });
     
     return (

package/src/@daf/pages/Summary/components/InformationAvailability/index.js

@@ -16,7 +16,7 @@ const InformationAvailability = ({
             basepath: subject === "stakeholder" ? "stakeholder" : "location",
 			url: `/completion/${id}`,
 			defaultData: [],
-			stop: selectedPartners?.loading,
+			stop: !id || selectedPartners?.loading,
 			filters: {
 				// datastakeId: id,
                 scope: subject === "stakeholder" ? "operatorInfo" : "locationInfo",

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

@@ -17,7 +17,8 @@ export const useSummary = ({
     t,
     theme = {},
     service,
-	onIdChange = () => {}
+	onIdChange = () => {},
+	type
 }) => {
     const [search, setSearch] = useState("");
 	const [debouncedSearch, setDebouncedSearch] = useState("");
@@ -110,10 +111,12 @@ export const useSummary = ({
 
       const filters = useMemo(() => {
 		return {
-		  pagination: { size: 20, page: 1 },
+		  pagination: { take: 20, skip: 1 },
 		  ...(debouncedSearch
 			? { search: { qs: debouncedSearch, fields: ["name","datastakeId","orgShortName"] } }
 			: {}),
+			...(type === 'operator' && { stakeholderType: 'operator'}),
+			...(type === 'mine' && { category: 'mineSite'}),
 		};
 	  }, [debouncedSearch]);
 

package/src/pages.js

@@ -11,7 +11,7 @@ export { default as ActivitiesTable } from './@daf/pages/Events/Activities/index
 
 export { default as IncidentsTable } from './@daf/pages/Events/Incidents/index.jsx';
 export { default as ProductionSitesTable } from './@daf/pages/Locations/MineSite/index.jsx';
-
+export { default as UsersTable } from './@daf/core/components/Screens/Users/index.jsx';
 
 // Summary
 export { default as OperatorSummary } from './@daf/pages/Summary/Operator/index.jsx';

package/src/styles/components/_dataLink.scss

@@ -1,4 +1,5 @@
 .data-link-cont {
+  max-width: 614px; //DATA LINK STRETCH
   .add-btn {
     min-width: 32px;
     width: 32px;