datastake-daf 0.6.773 → 0.6.774

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

@@ -0,0 +1,84 @@
+import { useState, useEffect, useMemo } from "react";
+
+export const useViewFormUrlParams = ({
+    params,
+    pathname,
+    search,
+    searchParams,
+    setSearchParams,
+    push,
+}) => {
+    const [namespace, setNamespace] = useState(params.namespace);
+    const [id, setId] = useState(params.id);
+    const [group, setGroup] = useState(params.group);
+    const [subsection, setSubsection] = useState(params.subsection);
+    const [source, setSource] = useState(searchParams.get("source") || null);
+    const [version, setVersion] = useState(searchParams.get("version") || null);
+
+    useEffect(() => {
+        if (
+          (id && params.id !== id) ||
+          (namespace && namespace !== params.namespace)
+        ) {
+          setGroup(undefined);
+          setSubsection(undefined);
+        } else {
+          setGroup(params.group);
+          setSubsection(params.subsection);
+        }
+        setNamespace(params.namespace);
+        setId(params.id);
+    }, [params, id, namespace]);
+
+    useEffect(() => {
+        if (source && version) {
+            const newParams = new URLSearchParams(searchParams);
+            newParams.set("source", source);
+            newParams.set("version", version);
+            setSearchParams(newParams);
+        }
+	}, [source, version]);
+
+    const updateSourceAndVersion = (newSource, newVersion) => {
+        const newParams = new URLSearchParams(searchParams);
+        if (newSource && newVersion) {
+          newParams.set("source", newSource);
+          newParams.set("version", newVersion);
+        } else {
+          newParams.delete("source");
+          newParams.delete("version");
+        }
+        setSearchParams(newParams);
+        setSource(newSource);
+        setVersion(newVersion);
+      };
+    
+    const clearSourceAndVersion = () => {
+        updateSourceAndVersion(null, null);
+    };
+
+    const match = useMemo(
+		() => ({
+			params,
+			path: pathname,
+		}),
+		[params, pathname],
+	);
+    
+    return {
+        namespace,
+        id,
+        group,
+        subsection,
+        source,
+        version,
+        params,
+        searchParams,
+        setSource,
+        setVersion,
+        updateSourceAndVersion,
+        clearSourceAndVersion,
+        match,
+        search,
+      };
+}

package/src/@daf/pages/Summary/Activities/PlantingCycle/components/AssociatedInformation/index.jsx

@@ -1,151 +1,40 @@
-import React, { useState, useMemo, useEffect, useCallback } from 'react';
-import { Widget, StickyTable, SearchFilters } from '../../../../../../../../src/index.js';
-import { useWidgetFetch } from '../../../../../../hooks/useWidgetFetch.js';
-import { getColumns } from './config.js';
-import { getRedirectLink } from '../../../../../../../utils.js';
+import React, { useState } from 'react';
+import { Widget } from '../../../../../../../../src/index.js';
 
-// Constants
-export const ACTIVITIES_TAB = 'activities';
-export const PARTNERS_TAB = 'partners';
-export const INCIDENTS_TAB = 'incidents';
+const ACTIVITIES_TAB = 'activities';
+const PARTNERS_TAB = 'partners';
+const INCIDENTS_TAB = 'incidents';
 
-export const DEFAULT_SEARCH_FIELDS = ["name", "datastakeId"];
-const URL_PATTERN = /\/summary\/[^/]+\/(.+)/;
 
-// Configuration
-export const TABS_CONFIG = [
-    { label: "straatos::activities", value: ACTIVITIES_TAB },
-    { label: "straatos::partners", value: PARTNERS_TAB },
-    { label: "straatos::incidents", value: INCIDENTS_TAB, disabled: true },
-];
-
-// Helper functions
-export const getSearchFields = (activeTab) => DEFAULT_SEARCH_FIELDS;
-
-export const buildSearchFilter = (search, fields) => 
-    search ? { search: { qs: search, fields } } : {};
-
-export const extractTypeFromUrl = (url) => {
-    const match = url.match(URL_PATTERN);
-    if (!match) {
-        throw new Error(`Invalid URL format: ${url}`);
-    }
-    return match[1];
-};
-
-export const ensureArray = (data) => Array.isArray(data) ? data : [];
-
-const AssociatedInformation = ({
-    id,
-    navigate,
-    getSummaryDetail,
-    loading = false,
-    projectId,
-    basepath = "planting-cycle",
-    endpoint = "associated-information",
-    tabsConfig = TABS_CONFIG,
-    searchFieldsMap = getSearchFields,
-    t = (s) => s
+const AssociatedInformation = ({ 
+    activityData, 
+    loading = false, 
+    t = (s) => s 
 }) => {
     const [activeTab, setActiveTab] = useState(ACTIVITIES_TAB);
-    const [search, setSearch] = useState('');
-    
-    const searchFields = useMemo(() => searchFieldsMap(activeTab), [activeTab, searchFieldsMap]);
-    
-    const filters = useMemo(() => ({
-        type: activeTab,
-        ...buildSearchFilter(search, searchFields)
-    }), [activeTab, search, searchFields]);
-
-    const defaultConfig = useMemo(() => ({
-        basepath,
-        url: `/summary/${id}/${endpoint}`,
-        filters,
-        stop: !id,
-    }), [id, filters, basepath, endpoint]);
-
-    const customGetData = useMemo(() => {
-        if (!getSummaryDetail || !id) return undefined;
-        
-        return (rest) => {
-            const { url, filters: restFilters } = rest;
-            const type = extractTypeFromUrl(url);
-            const params = {
-                ...(restFilters || {}),
-                type: restFilters?.type || activeTab
-            };
-            return getSummaryDetail(id, type, params);
-        };
-    }, [getSummaryDetail, id, activeTab]);
-
-    const { loading: associatedInformationLoading, data: associatedInformationData, setData } = useWidgetFetch({
-        config: defaultConfig,
-        getData: customGetData
-    });
-
-    // Reset data and search when tab changes
-    useEffect(() => {
-        setData([]);
-        setSearch('');
-    }, [activeTab, setData]);
-
-    const handleSearch = useCallback((activeFilter, searchValue) => {
-        setSearch(searchValue || '');
-    }, []);
-
-    const handleTabChange = useCallback((value) => {
-        setActiveTab(value);
-    }, []);
-
-    const columns = useMemo(() => getColumns({
-        t,
-        activeTab,
-        view: activeTab,
-        projectId,
-        navigate,
-        getRedirectLink,
-    }), [t, activeTab, projectId, navigate]);
-
-    const tableDataSource = useMemo(() => 
-        ensureArray(associatedInformationData), 
-        [associatedInformationData]
-    );
-
-    const translatedTabs = useMemo(() => 
-        tabsConfig.map(tab => ({ ...tab, label: t(tab.label) })),
-        [tabsConfig, t]
-    );
 
     return (
         <section>
-            <Widget
-                className="v2-widget no-px no-p-body h-w-btn-header with-border-header"
+
+              <Widget 
+                className="v2-widget no-px h-w-btn-header no-p-body"
                 title={t("Associated Information")}
                 tabsConfig={{
-                    tabs: translatedTabs,
+                    tabs: [
+                        { label: t("straatos::activities"), value: ACTIVITIES_TAB },
+                        { label: t("straatos::partners"), value: PARTNERS_TAB },
+                        { label: t("straatos::incidents"), value: INCIDENTS_TAB },
+                    ],
                     value: activeTab,
-                    onChange: handleTabChange,
+                    onChange: (value) => {
+                        setActiveTab(value);
+                        // setData([]);
+                    },
                 }}
             >
-                <div className='mt-6 ml-6 mr-6'>
-                    <SearchFilters
-                        t={t}
-                        showFilter={false}
-                        hasError={false}
-                        canClear={true}
-                        setHasError={() => {}}
-                        onSearch={handleSearch}
-                        activeFilters={{ search }}
-                    />
-                </div>
-                <div className='mb-6'>
-                    <StickyTable
-                        columns={columns}
-                        dataSource={tableDataSource}
-                        loading={associatedInformationLoading || loading}
-                    />
-                </div>
-            </Widget>
+            <div>
+            </div>
+        </Widget>
         </section>
     );
 };

package/src/@daf/pages/Summary/Activities/PlantingCycle/components/CommunityParticipation/JobsTimeline/index.jsx

@@ -8,6 +8,7 @@ const JobsTimeline = ({
     t = (s) => s
 }) => {
 
+    console.log('dayJobsTimeline', dayJobsTimeline);
     const jobsData = Array.isArray(dayJobsTimeline) 
         ? dayJobsTimeline 
         : (dayJobsTimeline?.jobsTimeline || dayJobsTimeline?.jobs || dayJobsTimeline?.timeline || []);

package/src/@daf/pages/Summary/Activities/PlantingCycle/index.jsx

@@ -6,12 +6,13 @@ import CommunityParticipation from './components/CommunityParticipation/index.js
 import AssociatedInformation from './components/AssociatedInformation/index.jsx';
 import KeyInformation from './components/KeyInformation/index.jsx';
 
-const PlantingCycleSummary = ({ header, activityData, loading = false, id, projectId, t = () => { }, getSummaryDetail, navigate }) => {
+const PlantingCycleSummary = ({ header, activityData, loading = false, id, t = () => { }, getSummaryDetail }) => {
+
     return (
         <DashboardLayout
             header={
                 <Header
-                    title={header?.title + ' Summary' || ''}
+                    title={header?.title || ''}
                     supportText={header?.supportText || ''}
                     onDownload={header?.onDownload}
                     downloadDisabled={header?.downloadDisabled}
@@ -27,7 +28,7 @@ const PlantingCycleSummary = ({ header, activityData, loading = false, id, proje
             <CycleOutcomes id={id} getSummaryDetail={getSummaryDetail}  loading={loading} t={t} />
             <CycleIndicators id={id} getSummaryDetail={getSummaryDetail} loading={loading} t={t} />
             <CommunityParticipation id={id} getSummaryDetail={getSummaryDetail} loading={loading} t={t} />
-            <AssociatedInformation id={id} projectId={projectId} getSummaryDetail={getSummaryDetail} loading={loading} t={t} navigate={navigate} />
+            <AssociatedInformation id={id} getSummaryDetail={getSummaryDetail} loading={loading} t={t} />
         </DashboardLayout>
     )
 }

package/src/@daf/utils/object.js

@@ -61,4 +61,6 @@ export const removeKeysFromObject = (obj = {}, keys = []) => {
         }
     }
     return result;
-}
+}
+
+export const hasKeyInObject = (obj, key) => Object.keys(obj || {}).includes(key);

package/src/hooks.js

@@ -13,4 +13,5 @@ export { useFirebase } from "./@daf/hooks/useFirebase.js"
 export { useIsDatastake } from "./@daf/hooks/useIsDatastake.js"
 export { useWidgetFetch } from "./@daf/hooks/useWidgetFetch.js"
 export { useAdminDashboard } from "./@daf/hooks/useAdminDashboard.js"
-export { useGetQueryParams } from "./@daf/hooks/useGetQueryParams.js"
+export { useGetQueryParams } from "./@daf/hooks/useGetQueryParams.js"
+export { useViewFormUrlParams } from "./@daf/hooks/useViewFormUrlParams.js"

package/src/utils.js

@@ -27,7 +27,7 @@ export { default as locales } from './constants/locales/index.js';
 
 export { getTagColor } from "./@daf/utils/productTag.js";
 
-export { convertUndefinedToNull } from './@daf/utils/object'
+export { convertUndefinedToNull, hasKeyInObject, removeKeysFromObject } from './@daf/utils/object'
 
 export { default as ErrorFormat, formatErrors } from './helpers/ErrorFormater'
 

package/dist/style/datastake/mapbox-gl.css

@@ -1,330 +0,0 @@
-/* Isolated Mapbox GL CSS - Scoped to prevent Leaflet conflicts */
-
-/* Mapbox GL Core Styles - Scoped with .mapbox-gl-scope */
-.mapbox-gl-scope .mapboxgl-map {
-  font: 12px/20px Helvetica Neue, Arial, Helvetica, sans-serif;
-  overflow: hidden;
-  position: relative;
-  -webkit-tap-highlight-color: rgb(0 0 0/0);
-}
-
-.mapbox-gl-scope .mapboxgl-canvas {
-  left: 0;
-  position: absolute;
-  top: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-map:-webkit-full-screen {
-  height: 100%;
-  width: 100%;
-}
-
-.mapbox-gl-scope .mapboxgl-canary {
-  background-color: salmon;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-interactive,
-.mapbox-gl-scope .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass {
-  cursor: grab;
-  -webkit-user-select: none;
-  user-select: none;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-interactive.mapboxgl-track-pointer {
-  cursor: pointer;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-interactive:active,
-.mapbox-gl-scope .mapboxgl-ctrl-group button.mapboxgl-ctrl-compass:active {
-  cursor: grabbing;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate,
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate .mapboxgl-canvas {
-  touch-action: pan-x pan-y;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-drag-pan,
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-drag-pan .mapboxgl-canvas {
-  touch-action: pinch-zoom;
-}
-
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan,
-.mapbox-gl-scope .mapboxgl-canvas-container.mapboxgl-touch-zoom-rotate.mapboxgl-touch-drag-pan .mapboxgl-canvas {
-  touch-action: none;
-}
-
-/* Control positioning */
-.mapbox-gl-scope .mapboxgl-ctrl-bottom,
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-left,
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-right,
-.mapbox-gl-scope .mapboxgl-ctrl-left,
-.mapbox-gl-scope .mapboxgl-ctrl-right,
-.mapbox-gl-scope .mapboxgl-ctrl-top,
-.mapbox-gl-scope .mapboxgl-ctrl-top-left,
-.mapbox-gl-scope .mapboxgl-ctrl-top-right {
-  pointer-events: none;
-  position: absolute;
-  z-index: 2;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top-left {
-  left: 0;
-  top: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top {
-  left: 50%;
-  top: 0;
-  transform: translateX(-50%);
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top-right {
-  right: 0;
-  top: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-right {
-  right: 0;
-  top: 50%;
-  transform: translateY(-50%);
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-right {
-  bottom: 0;
-  right: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom {
-  bottom: 0;
-  left: 50%;
-  transform: translateX(-50%);
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-left {
-  bottom: 0;
-  left: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-left {
-  left: 0;
-  top: 50%;
-  transform: translateY(-50%);
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl {
-  clear: both;
-  pointer-events: auto;
-  transform: translate(0);
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top-left .mapboxgl-ctrl {
-  float: left;
-  margin: 10px 0 0 10px;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top .mapboxgl-ctrl {
-  float: left;
-  margin: 10px 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
-  float: right;
-  margin: 10px 10px 0 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-right .mapboxgl-ctrl,
-.mapbox-gl-scope .mapboxgl-ctrl-right .mapboxgl-ctrl {
-  float: right;
-  margin: 0 10px 10px 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom .mapboxgl-ctrl {
-  float: left;
-  margin: 10px 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-bottom-left .mapboxgl-ctrl,
-.mapbox-gl-scope .mapboxgl-ctrl-left .mapboxgl-ctrl {
-  float: left;
-  margin: 0 0 10px 10px;
-}
-
-/* Control group styling */
-.mapbox-gl-scope .mapboxgl-ctrl-group {
-  background: #fff;
-  border-radius: 4px;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group:not(:empty) {
-  box-shadow: 0 0 0 2px #0000001a;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group button {
-  background-color: initial;
-  border: 0;
-  box-sizing: border-box;
-  cursor: pointer;
-  display: block;
-  height: 29px;
-  outline: none;
-  overflow: hidden;
-  padding: 0;
-  width: 29px;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group button+button {
-  border-top: 1px solid #ddd;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl button .mapboxgl-ctrl-icon {
-  background-position: 50%;
-  background-repeat: no-repeat;
-  display: block;
-  height: 100%;
-  width: 100%;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-attrib-button:focus,
-.mapbox-gl-scope .mapboxgl-ctrl-group button:focus {
-  box-shadow: 0 0 2px 2px #0096ff;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl button:disabled {
-  cursor: not-allowed;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl button:disabled .mapboxgl-ctrl-icon {
-  opacity: .25;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group button:first-child {
-  border-radius: 4px 4px 0 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group button:last-child {
-  border-radius: 0 0 4px 4px;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-group button:only-child {
-  border-radius: inherit;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl button:not(:disabled):hover {
-  background-color: #0000000d;
-}
-
-/* Marker styles */
-.mapbox-gl-scope .mapboxgl-marker {
-  position: absolute;
-  z-index: 1;
-}
-
-.mapbox-gl-scope .mapboxgl-marker svg {
-  display: block;
-}
-
-/* Popup styles */
-.mapbox-gl-scope .mapboxgl-popup {
-  position: absolute;
-  text-align: center;
-  margin-bottom: 20px;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-content-wrapper {
-  padding: 1px;
-  text-align: left;
-  border-radius: 12px;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-content {
-  margin: 13px 24px 13px 20px;
-  line-height: 1.3;
-  font-size: 13px;
-  min-height: 1px;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-content p {
-  margin: 17px 0;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-tip-container {
-  width: 40px;
-  height: 20px;
-  position: absolute;
-  left: 50%;
-  margin-top: -1px;
-  margin-left: -20px;
-  overflow: hidden;
-  pointer-events: none;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-tip {
-  width: 17px;
-  height: 17px;
-  padding: 1px;
-  margin: -10px auto 0;
-  pointer-events: auto;
-  -webkit-transform: rotate(45deg);
-  -moz-transform: rotate(45deg);
-  -ms-transform: rotate(45deg);
-  transform: rotate(45deg);
-}
-
-.mapbox-gl-scope .mapboxgl-popup-content-wrapper,
-.mapbox-gl-scope .mapboxgl-popup-tip {
-  background: white;
-  color: #333;
-  box-shadow: 0 3px 14px rgba(0, 0, 0, 0.4);
-}
-
-.mapbox-gl-scope .mapboxgl-popup-close-button {
-  position: absolute;
-  top: 0;
-  right: 0;
-  border: none;
-  text-align: center;
-  width: 24px;
-  height: 24px;
-  font: 16px/24px Tahoma, Verdana, sans-serif;
-  color: #757575;
-  text-decoration: none;
-  background: transparent;
-}
-
-.mapbox-gl-scope .mapboxgl-popup-close-button:hover,
-.mapbox-gl-scope .mapboxgl-popup-close-button:focus {
-  color: #585858;
-}
-
-/* Attribution */
-.mapbox-gl-scope .mapboxgl-ctrl-attribution {
-  background: #fff;
-  background: rgba(255, 255, 255, 0.8);
-  margin: 0;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-attribution,
-.mapbox-gl-scope .mapboxgl-ctrl-scale-line {
-  padding: 0 5px;
-  color: #333;
-  line-height: 1.4;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-attribution a {
-  text-decoration: none;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-attribution a:hover,
-.mapbox-gl-scope .mapboxgl-ctrl-attribution a:focus {
-  text-decoration: underline;
-}
-
-/* Hide attribution by default */
-.mapbox-gl-scope .mapboxgl-ctrl-attribution {
-  display: none !important;
-}
-
-.mapbox-gl-scope .mapboxgl-ctrl-logo {
-  display: none !important;
-}