datastake-daf 0.6.250 → 0.6.252

package/dist/components/index.js

@@ -12655,7 +12655,7 @@ const {
   Paragraph: Paragraph$1
 } = antd.Typography;
 const checkHasActiveFilterValues = filtersConfig => {
-  if (!filtersConfig?.filtersConfig || !filtersConfig?.selectedFilters) return false;
+  if (!(filtersConfig !== null && filtersConfig !== void 0 && filtersConfig.filtersConfig) || !(filtersConfig !== null && filtersConfig !== void 0 && filtersConfig.selectedFilters)) return false;
   const filterConfigKeys = Object.keys(filtersConfig.filtersConfig);
   const selectedFilters = filtersConfig.selectedFilters;
   return filterConfigKeys.some(key => {
@@ -12663,27 +12663,28 @@ const checkHasActiveFilterValues = filtersConfig => {
     return value !== undefined && value !== null && value !== '';
   });
 };
-const useHeader = ({
-  title = '',
-  tooltip = '',
-  supportText = '',
-  tags = [],
-  actionButtons: _actionButtons = [],
-  titleTooltip,
-  className,
-  addedHeader = null,
-  addedHeaderFirst,
-  extraButtons: _extraButtons = [],
-  onDownload,
-  downloadDisabled,
-  goBackTo,
-  loading,
-  renderExtraComponents,
-  app = '',
-  isViewMode = false,
-  filtersConfig = {}
-}) => {
-  const hasActiveFilterValues = React.useMemo(() => checkHasActiveFilterValues(filtersConfig), [filtersConfig?.filtersConfig, filtersConfig?.selectedFilters]);
+const useHeader = _ref => {
+  let {
+    title = '',
+    tooltip = '',
+    supportText = '',
+    tags = [],
+    actionButtons: _actionButtons = [],
+    titleTooltip,
+    className,
+    addedHeader = null,
+    addedHeaderFirst,
+    extraButtons: _extraButtons = [],
+    onDownload,
+    downloadDisabled,
+    goBackTo,
+    loading,
+    renderExtraComponents,
+    app = '',
+    isViewMode = false,
+    filtersConfig = {}
+  } = _ref;
+  const hasActiveFilterValues = React.useMemo(() => checkHasActiveFilterValues(filtersConfig), [filtersConfig === null || filtersConfig === void 0 ? void 0 : filtersConfig.filtersConfig, filtersConfig === null || filtersConfig === void 0 ? void 0 : filtersConfig.selectedFilters]);
   const [showFilters, setShowFilters] = React.useState(() => checkHasActiveFilterValues(filtersConfig));
   const hasFilters = filtersConfig && Object.keys(filtersConfig).length > 0;
   React.useEffect(() => {
@@ -12725,9 +12726,9 @@ const useHeader = ({
   const buttonCont = React.useRef();
   const [mainContWidth, setMainContWidth] = React.useState(600);
   const [buttonContWidth, setButtonContWidth] = React.useState(0);
-  const hasSupportText = !!supportText?.length;
-  const hasTags = !!tags?.length;
-  const hasButtons = !!(actionButtons?.length || extraButtons?.length);
+  const hasSupportText = !!(supportText !== null && supportText !== void 0 && supportText.length);
+  const hasTags = !!(tags !== null && tags !== void 0 && tags.length);
+  const hasButtons = !!(actionButtons !== null && actionButtons !== void 0 && actionButtons.length || extraButtons !== null && extraButtons !== void 0 && extraButtons.length);
   React.useEffect(() => {
     const mainContObserver = new ResizeObserver(entries => {
       const _mainEntry = entries[0];
@@ -18407,7 +18408,7 @@ const useMap$1 = ({
         const pos = allData.map(m => Array.isArray(m.area) ? m.area : [Number(m.marker?.lat ?? 0), Number(m.marker?.lng ?? 0)]);
         const bounds = new L__namespace.LatLngBounds(pos);
         mapRef.fitBounds(bounds, {
-          padding: [20, 20]
+          padding: [10, 10]
         });
       }
     }
@@ -19698,6 +19699,39 @@ const useGlobe = ({
               }));
               roots.current.push(root);
             }
+          } else if (type === "project") {
+            // Handle project markers
+            const el = document.createElement('div');
+            el.className = 'mapboxgl-marker project-marker';
+            el.style.width = '30px';
+            el.style.height = '30px';
+            el.style.backgroundColor = '#52c41a'; // Green color for projects
+            el.style.borderRadius = '50%';
+            el.style.border = '3px solid white';
+            el.style.cursor = 'pointer';
+            el.style.boxShadow = '0px 3.45px 3.45px 0px #00000029';
+            el.style.display = 'flex';
+            el.style.alignItems = 'center';
+            el.style.justifyContent = 'center';
+            el.style.color = 'white';
+            el.style.fontWeight = 'bold';
+            el.style.fontSize = '12px';
+
+            // Add project icon (you can customize this)
+            el.innerHTML = '📋';
+            const div = document.createElement("div");
+            const root = client.createRoot(div);
+            root.render( /*#__PURE__*/jsxRuntime.jsx(jsxRuntime.Fragment, {
+              children: renderTooltipJsx({
+                title: d.name,
+                items: renderTooltip(d),
+                link,
+                total: d.sources,
+                onClickLink: () => onClickLink(d)
+              })
+            }));
+            roots.current.push(root);
+            marker = new mapboxgl.Marker(el).setLngLat([d.marker.lng, d.marker.lat]).setPopup(new mapboxgl.Popup().setDOMContent(div)).addTo(mapRef);
           } else {
             // Default marker for other types
             const el = document.createElement('div');
@@ -20543,16 +20577,13 @@ function DashboardLayout(_ref) {
   let {
     children,
     header,
-    footer,
-    isCollapsed
+    footer
   } = _ref;
   return /*#__PURE__*/jsxRuntime.jsxs("div", {
     className: "daf-analysis",
-    style: _objectSpread2({
+    style: {
       backgroundColor: "#F9FAFB"
-    }, isCollapsed === undefined ? {} : {
-      maxWidth: isCollapsed ? "calc(100vw - 70px)" : "calc(100vw - 250px)"
-    }),
+    },
     children: [header, /*#__PURE__*/jsxRuntime.jsx("div", {
       className: "content",
       children: /*#__PURE__*/jsxRuntime.jsx("div", {
@@ -21094,7 +21125,7 @@ function SdgList({
 }) {
   return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
     children: [/*#__PURE__*/jsxRuntime.jsx(Label, {
-      children: "SDGs"
+      children: "SDGs:"
     }), /*#__PURE__*/jsxRuntime.jsx(SDGIcons, {
       sdgList: sdgList,
       t: t
@@ -21177,8 +21208,7 @@ function ProjectWidget(_ref) {
     }), !hideSDGList && /*#__PURE__*/jsxRuntime.jsx("div", {
       style: {
         borderTop: "1px solid var(--base-gray-30)",
-        paddingTop: "10px",
-        minHeight: "61px"
+        paddingTop: "10px"
       },
       children: /*#__PURE__*/jsxRuntime.jsx(SdgList, {
         sdgList: sdgList,

package/dist/utils/index.js

@@ -3835,7 +3835,7 @@ function showHideForm(form, formsValue) {
 
 /* eslint-disable no-constant-condition */
 const getNkey = namespace => {
-  if (['location', 'scl', 'village', 'event', 'incidents', 'corrective-actions', 'testimonials', 'initiatives', 'victims', 'pictures', 'documents', 'lir', 'sp', 'im', 'sci', 'bpe', 'gm'].includes(namespace)) {
+  if (['location', 'scl', 'village', 'event', 'incidents', 'corrective-actions', 'testimonials', 'initiatives', 'victims', 'pictures', 'documents', 'lir', 'sp', 'im', 'sci', 'bpe', 'gm', 'project-readiness'].includes(namespace)) {
     return 'scoping';
   }
   return namespace;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "datastake-daf",
-	"version": "0.6.250",
+	"version": "0.6.252",
 	"dependencies": {
 		"@ant-design/icons": "^5.2.5",
 		"@antv/g2": "^5.1.1",

package/src/@daf/core/components/Dashboard/DashboardLayout/index.jsx

@@ -5,17 +5,12 @@
  *
  *	Every Widget inside the component (children)  must be wrapped by a section tag, because i say so and if you dont like it you can change the code in the entire codebase, included but not limited to the following projects: nashiriki, tazama, kustawi, sbg, cukura, kota, mmt, and wherever the daf library is used.
  */
-export default function DashboardLayout({ children, header, footer, isCollapsed }) {
+export default function DashboardLayout({ children, header, footer }) {
 	return (
 		<div
 			className="daf-analysis"
 			style={{
 				backgroundColor: `#F9FAFB`,
-				...(isCollapsed === undefined
-					? {}
-					: {
-							maxWidth: isCollapsed ? `calc(100vw - 70px)` : `calc(100vw - 250px)`,
-					  }),
 			}}
 		>
 			{header}

package/src/@daf/core/components/Dashboard/Globe/Globe.stories.js

@@ -64,3 +64,11 @@ export const LocationGlobe = {
 		type: "location",
 	},
 };
+
+export const ProjectGlobe = {
+	name: "Project Globe",
+	args: {
+		...configs.ProjectConfig,
+		type: "project",
+	},
+};

package/src/@daf/core/components/Dashboard/Globe/hook.js

@@ -264,6 +264,48 @@ export const useGlobe = ({
 
               roots.current.push(root);
             }
+          } else if (type === "project") {
+            // Handle project markers
+            const el = document.createElement('div');
+            el.className = 'mapboxgl-marker project-marker';
+            el.style.width = '30px';
+            el.style.height = '30px';
+            el.style.backgroundColor = '#52c41a'; // Green color for projects
+            el.style.borderRadius = '50%';
+            el.style.border = '3px solid white';
+            el.style.cursor = 'pointer';
+            el.style.boxShadow = '0px 3.45px 3.45px 0px #00000029';
+            el.style.display = 'flex';
+            el.style.alignItems = 'center';
+            el.style.justifyContent = 'center';
+            el.style.color = 'white';
+            el.style.fontWeight = 'bold';
+            el.style.fontSize = '12px';
+            
+            // Add project icon (you can customize this)
+            el.innerHTML = '📋';
+
+            const div = document.createElement("div");
+            const root = createRoot(div);
+
+            root.render(
+              <>
+                {renderTooltipJsx({
+                  title: d.name,
+                  items: renderTooltip(d),
+                  link,
+                  total: d.sources,
+                  onClickLink: () => onClickLink(d),
+                })}
+              </>,
+            );
+
+            roots.current.push(root);
+
+            marker = new mapboxgl.Marker(el)
+              .setLngLat([d.marker.lng, d.marker.lat])
+              .setPopup(new mapboxgl.Popup().setDOMContent(div))
+              .addTo(mapRef);
           } else {
             // Default marker for other types
             const el = document.createElement('div');

package/src/@daf/core/components/Dashboard/Map/hook.js

@@ -306,7 +306,7 @@ export const useMap = ({
 						: [Number(m.marker?.lat ?? 0), Number(m.marker?.lng ?? 0)],
 				);
 				const bounds = new L.LatLngBounds(pos);
-				mapRef.fitBounds(bounds, { padding: [20, 20] });
+				mapRef.fitBounds(bounds, { padding: [10, 10] });
 			}
 		}
 	}, [allData, mapRef]);

package/src/@daf/core/components/Dashboard/Map/storyConfig.js

@@ -3,5 +3,6 @@ import { storyConfig as DefaultMapConfig } from "./storyConfig2.js";
 import { storyConfig as TerritoryMapConfig } from "./storyConfig3.js";
 import { storyConfig as StakeholderMapConfig } from "./storyConfig4.js";
 import { storyConfig as ChainMapConfig } from "./storyConfig5.js";
+import { storyConfig as ProjectConfig } from "./storyConfig6.js";
 
-export { DefaultMapConfig, TerritoryMapConfig, StakeholderMapConfig, EventConfig, ChainMapConfig };
+export { DefaultMapConfig, TerritoryMapConfig, StakeholderMapConfig, EventConfig, ChainMapConfig, ProjectConfig };

package/src/@daf/core/components/Dashboard/Map/storyConfig6.js

@@ -0,0 +1,366 @@
+import { findCoordinatesByCountry } from "../Globe/globeHelpers";
+
+// Transform project data to match Globe component expectations
+const transformProjectsToGlobeData = (projects) => {
+  return projects.map(project => {
+    // Get coordinates from country code
+    const coordinates = findCoordinatesByCountry(project.country);
+    
+    return {
+      ...project,
+      marker: {
+        lat: coordinates[0],
+        lng: coordinates[1]
+      },
+      name: project.name || project.title,
+      description: project.projectDescription || "No description available",
+      total: 1, // Each project is a single marker
+      sources: 1,
+      type: "project",
+      // Add project-specific data for tooltip
+      projectData: {
+        datastakeId: project.datastakeId,
+        sectoralScope: project.sectoralScope,
+        percentageCompletion: project.percentageCompletion,
+        country: project.country,
+        author: project.author?.name,
+        createdAt: project.createdAt,
+        mainImage: project.mainImage?.[0]?.url
+      }
+    };
+  });
+};
+
+// Sample project data from the user
+const sampleProjects = [
+  {
+    "_id": "687a4d9a4cfa60f30db94c52",
+    "createdAt": "2025-07-18T00:00:00.000Z",
+    "updatedAt": "2025-07-18T00:00:00.000Z",
+    "form": "straatosProject",
+    "id": "3129457d-b787-4955-ba25-04d67fecfaaa",
+    "name": "ABC Mangrove Senegal",
+    "country": "SN",
+    "datastakeId": "PRJ-00000000103",
+    "title": "ABC Mangrove Senegal",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 11.76470588235294,
+    "projectDescription": "ABC Mangrove Senegal is an environmental and community-focused initiative dedicated to the restoration, preservation, and sustainable management of mangrove ecosystems in Senegal.",
+    "mainImage": [
+      {
+        "url": "https://cdn.straatos.io/dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09601/auth-bg_cropped-1754901830065.png",
+        "path": "dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09601/auth-bg_cropped-1754901830065.png",
+        "name": "auth-bg_cropped-1754901830065.png",
+        "size": 1693409,
+        "type": "image/png"
+      }
+    ],
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "687a57e24cfa60f30db954ca",
+    "createdAt": "2025-07-18T00:00:00.000Z",
+    "updatedAt": "2025-07-18T00:00:00.000Z",
+    "form": "project",
+    "id": "10e09c02-1986-4eb5-9069-355bffdfb93d",
+    "name": "Testing",
+    "country": "SN",
+    "datastakeId": "PRJ-00000000104",
+    "title": "Testing",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 28.57142857142857,
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "687e619d4cfa60f30db967ea",
+    "createdAt": "2025-07-21T15:49:49.431Z",
+    "updatedAt": "2025-07-21T15:49:49.431Z",
+    "form": "straatosProject",
+    "id": "51440c46-2d42-452d-8ea1-614002589d4c",
+    "name": "Pietra's Project",
+    "country": "BR",
+    "datastakeId": "PRJ-00000000105",
+    "title": "Pietra's Project",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "6883918729bcd5751e8dd579",
+    "createdAt": "2025-07-25T14:15:35.305Z",
+    "updatedAt": "2025-07-25T14:15:35.305Z",
+    "form": "straatosProject",
+    "id": "275acff8-c478-40a5-a23d-94968dca01d1",
+    "name": "efwefwe",
+    "country": "AX",
+    "datastakeId": "PRJ-00000000106",
+    "title": "efwefwe",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 100,
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "6883b50e29bcd5751e8dda3e",
+    "createdAt": "2025-07-25T00:00:00.000Z",
+    "updatedAt": "2025-07-25T00:00:00.000Z",
+    "form": "project",
+    "id": "3bac13f1-4ebc-4428-9230-af1dc6ab1ab9",
+    "name": "Geri Test",
+    "country": "AS",
+    "datastakeId": "PRJ-00000000107",
+    "title": "Geri Test",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 33.33333333333333,
+    "projectDescription": "ABC Mangrove Senegal is an environmental and community-focused initiative dedicated to the restoration, preservation, and sustainable management of mangrove ecosystems in Senegal.",
+    "mainImage": [
+      {
+        "url": "https://cdn.straatos.io/dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09600/screenshot-from-2024-11-11-09-29-22-1758200879648.png",
+        "path": "dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09600/screenshot-from-2024-11-11-09-29-22-1758200879648.png",
+        "name": "screenshot-from-2024-11-11-09-29-22-1758200879648.png",
+        "size": 414991,
+        "type": "image/png"
+      }
+    ],
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "688c66c62fb165d7a389fbf7",
+    "createdAt": "2025-08-01T07:03:34.501Z",
+    "updatedAt": "2025-08-01T07:03:34.501Z",
+    "form": "straatosProject",
+    "id": "39fd860e-412c-456f-9b70-a67d4dc82433",
+    "name": "test 777",
+    "country": "AL",
+    "datastakeId": "PRJ-00000000109",
+    "title": "test 777",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "68927b8d3c4650496ed9003f",
+    "createdAt": "2025-08-05T00:00:00.000Z",
+    "updatedAt": "2025-08-05T00:00:00.000Z",
+    "form": "straatosProject",
+    "id": "468204d2-28d6-4097-a362-ad12d642bf4f",
+    "name": "Current",
+    "country": "AL",
+    "datastakeId": "PRJ-00000000111",
+    "title": "Current",
+    "mainImage": [
+      {
+        "url": "https://cdn.straatos.io/dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09600/screenshot-from-2024-11-28-12-41-52-1754465225229.png",
+        "path": "dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09600/screenshot-from-2024-11-28-12-41-52-1754465225229.png",
+        "name": "screenshot-from-2024-11-28-12-41-52-1754465225229.png",
+        "size": 92090,
+        "type": "image/png"
+      }
+    ],
+    "sectoralScope": "energy",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 17.647058823529413,
+    "projectDescription": "testing testing testing",
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "68985abea7d389ab99d611e4",
+    "createdAt": "2025-08-10T00:00:00.000Z",
+    "updatedAt": "2025-08-10T00:00:00.000Z",
+    "form": "project",
+    "id": "c949c1a4-f83d-45fa-820f-0ee56bc023ba",
+    "name": "project 1",
+    "country": "AL",
+    "datastakeId": "PRJ-00000000112",
+    "title": "project 1",
+    "mainImage": [
+      {
+        "url": "https://cdn.straatos.io/dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09601/abcmangrove_allcot-10-1756470770827.jpg",
+        "path": "dev/company-df5378ae-704a-4a46-93b2-336cc5341456/user-e8d71443-339f-4b45-bbf5-22f0e5f09601/abcmangrove_allcot-10-1756470770827.jpg",
+        "name": "abcmangrove_allcot-10-1756470770827.jpg",
+        "size": 146120,
+        "type": "image/jpeg"
+      }
+    ],
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 25,
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "68c3e1817ce6a6d7d8c16250",
+    "createdAt": "2025-09-12T00:00:00.000Z",
+    "updatedAt": "2025-09-12T00:00:00.000Z",
+    "form": "project",
+    "id": "b7a6ce62-dda3-4ffd-8f5a-e9721e15fe9f",
+    "name": "test fran",
+    "country": "CL",
+    "datastakeId": "PRJ-00000000113",
+    "title": "test fran",
+    "sectoralScope": "agricultureForestryAndOtherLandUse",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 25,
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  },
+  {
+    "_id": "68cab88001892530c66c3079",
+    "createdAt": "2025-09-17T13:32:48.646Z",
+    "updatedAt": "2025-09-17T13:32:48.646Z",
+    "form": "project",
+    "id": "a64070b0-74bc-4694-8e29-8006f9de70f7",
+    "name": "Pietra's Project",
+    "country": "AL",
+    "datastakeId": "PRJ-00000000114",
+    "title": "Pietra's Project",
+    "sectoralScope": "fugitiveEmissionsFromIndustrialGases",
+    "sdgs": [],
+    "authorId": "df5378ae-704a-4a46-93b2-336cc5341456",
+    "percentageCompletion": 25,
+    "author": {
+      "name": "Geri SHPK",
+      "country": "AL",
+      "category": "civilSociety",
+      "subCategory": "internationalNGO"
+    }
+  }
+];
+
+export const storyConfig = {
+  data: transformProjectsToGlobeData(sampleProjects),
+  type: "project",
+  primaryLink: true,
+  showSider: true,
+  siderTitle: "Project Details",
+  renderTooltip: (project) => {
+    return [
+      { label: "Project ID", value: project.projectData?.datastakeId || "N/A" },
+      { label: "Sector", value: project.projectData?.sectoralScope || "N/A" },
+      { label: "Completion", value: `${Math.round(project.projectData?.percentageCompletion || 0)}%` },
+      { label: "Country", value: project.projectData?.country || "N/A" },
+      { label: "Author", value: project.projectData?.author || "N/A" },
+      { label: "Created", value: project.projectData?.createdAt ? new Date(project.projectData.createdAt).toLocaleDateString() : "N/A" }
+    ];
+  },
+  renderSider: (activeMarker) => {
+    const project = activeMarker.data;
+    const projectData = project.projectData;
+    
+    return (
+      <div className="project-sider">
+        {projectData?.mainImage && (
+          <div className="project-image mb-3">
+            <img 
+              src={projectData.mainImage} 
+              alt={project.name}
+              style={{ width: '100%', height: '200px', objectFit: 'cover', borderRadius: '8px' }}
+            />
+          </div>
+        )}
+        
+        <div className="project-details">
+          <div className="detail-row mb-2">
+            <span className="label">Project ID:</span>
+            <span className="value">{projectData?.datastakeId || "N/A"}</span>
+          </div>
+          
+          <div className="detail-row mb-2">
+            <span className="label">Sectoral Scope:</span>
+            <span className="value">{projectData?.sectoralScope || "N/A"}</span>
+          </div>
+          
+          <div className="detail-row mb-2">
+            <span className="label">Completion:</span>
+            <span className="value">{Math.round(projectData?.percentageCompletion || 0)}%</span>
+          </div>
+          
+          <div className="detail-row mb-2">
+            <span className="label">Country:</span>
+            <span className="value">{projectData?.country || "N/A"}</span>
+          </div>
+          
+          <div className="detail-row mb-2">
+            <span className="label">Author:</span>
+            <span className="value">{projectData?.author || "N/A"}</span>
+          </div>
+          
+          <div className="detail-row mb-2">
+            <span className="label">Created:</span>
+            <span className="value">
+              {projectData?.createdAt ? new Date(projectData.createdAt).toLocaleDateString() : "N/A"}
+            </span>
+          </div>
+          
+          {project.description && (
+            <div className="detail-row mt-3">
+              <span className="label">Description:</span>
+              <p className="value mt-1" style={{ fontSize: '14px', lineHeight: '1.4' }}>
+                {project.description}
+              </p>
+            </div>
+          )}
+        </div>
+      </div>
+    );
+  },
+  onClickLink: (project) => {
+    console.log('Project clicked:', project);
+    // You can add navigation logic here
+  }
+};

package/src/@daf/core/components/Dashboard/Widget/ProjectWidget/components/SdgList.jsx

@@ -1,10 +1,10 @@
 import { Label } from "../style";
 import SDGIcons from "../../../../UI/SDGIcon/index.jsx";
 export default function SdgList({ sdgList = [], t }) {
-	return (
-		<>
-			<Label>SDGs</Label>
-			<SDGIcons sdgList={sdgList} t={t} />
-		</>
-	);
+  return (
+    <>
+      <Label>SDGs:</Label>
+      <SDGIcons sdgList={sdgList} t={t} />
+    </>
+  );
 }

package/src/@daf/core/components/Dashboard/Widget/ProjectWidget/index.jsx

@@ -83,7 +83,6 @@ export default function ProjectWidget({
 					style={{
 						borderTop: "1px solid var(--base-gray-30)",
 						paddingTop: "10px",
-						minHeight: "61px",
 					}}
 				>
 					<SdgList sdgList={sdgList} t={t} />

package/src/@daf/core/components/ViewForm/helper.js

@@ -144,7 +144,7 @@ export const filterInputs = (form, data, repeatValues) => {
 }
 
 export const getNkey = (namespace) => {
-  if (['location', 'scl', 'village', 'event', 'incidents', 'corrective-actions', 'testimonials', 'initiatives', 'victims', 'pictures', 'documents', 'lir', 'sp', 'im', 'sci', 'bpe', 'gm'].includes(namespace)) {
+  if (['location', 'scl', 'village', 'event', 'incidents', 'corrective-actions', 'testimonials', 'initiatives', 'victims', 'pictures', 'documents', 'lir', 'sp', 'im', 'sci', 'bpe', 'gm', 'project-readiness'].includes(namespace)) {
     return 'scoping';
   }
 

package/.env

@@ -1,8 +0,0 @@
-REACT_APP_API_KEY=
-REACT_APP_AUTH_DOMAIN=
-REACT_APP_PROJECT_ID=
-REACT_APP_STORAGE_BUCKED=
-REACT_APP_SENDER_ID=
-REACT_APP_APP_ID=
-REACT_APP_MEASUREMENT_ID=
-REACT_APP_VAPID_KEY=

package/.vscode/settings.json

@@ -1,13 +0,0 @@
-{
-	"cSpell.words": ["cukura"],
-	"files.autoSave": "afterDelay",
-	"editor.wordWrap": "on",
-	"editor.autoClosingBrackets": "always",
-	"editor.autoClosingComments": "always",
-	"editor.autoClosingQuotes": "always",
-	"editor.defaultFormatter": "esbenp.prettier-vscode",
-	"editor.formatOnPaste": true,
-	"editor.formatOnSave": true,
-	"notebook.defaultFormatter": "esbenp.prettier-vscode",
-	"javascript.format.semicolons": "insert"
-}