datastake-daf 0.6.787 → 0.6.788

package/dist/services/index.js

@@ -765,7 +765,7 @@ class AdminService extends BaseService {
     params
   }) {
     return this.apiGet({
-      url: `/management/subjects/${subject}`,
+      url: `${subject}`,
       params
     });
   }
@@ -778,15 +778,6 @@ class AdminService extends BaseService {
       data
     });
   }
-  getUserGrowth(activeFilter) {
-    return this.apiGet({
-      url: `/accounts/dashboard/user-growth`,
-      isUserManager: true,
-      params: {
-        activeFilter
-      }
-    });
-  }
 }
 var AdminService$1 = createLazyService(AdminService);
 

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

@@ -0,0 +1,330 @@
+/* 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;
+}

package/dist/utils/index.js

@@ -7506,6 +7506,7 @@ const getDefaultActiveFilters = (params, selectFiltersConfig, defaultPageSize, d
   });
   return o;
 };
+const NEW_PAGINATION_APPS = ["nashiriki"];
 const filterParams = (value, module) => {
   const {
     activeFilters,
@@ -7521,12 +7522,10 @@ const filterParams = (value, module) => {
     ...filters
   } = activeFilters || {};
   const params = {};
-  // Use skip and take inside pagination object
-  // Calculate skip from page number (page 1 = skip 1, page 2 = skip 21, etc.)
-  params.pagination = {
-    skip: page ? (page - 1) * (pageSize || 20) + 1 : 1,
-    take: pageSize || 20
-  };
+  params.pagination = JSON.stringify({
+    [NEW_PAGINATION_APPS.includes(module) ? "skip" : "page"]: page,
+    [NEW_PAGINATION_APPS.includes(module) ? "take" : "pageSize"]: pageSize
+  });
   if (search && searchParams) {
     params.search = JSON.stringify({
       qs: search,
@@ -7541,24 +7540,12 @@ const filterParams = (value, module) => {
   }
   if (Object.keys(filters).length) {
     if (value.sourceId && value.sourceId === "overview") {
-      const {
-        activeTab,
-        ...restFilters
-      } = filters;
-      Object.assign(params, restFilters);
-      if (activeTab !== undefined) {
-        params.tab = activeTab;
-      }
+      params.filters = JSON.stringify(filters);
     } else {
-      const {
-        authorId,
-        activeTab,
-        ...restFilters
-      } = filters;
-      Object.assign(params, restFilters);
-      if (activeTab !== undefined) {
-        params.tab = activeTab;
-      }
+      params.filters = JSON.stringify({
+        ...filters,
+        authorId: undefined
+      });
     }
   }
   return {
@@ -7765,9 +7752,6 @@ function getRedirectPath(user, fallback = '', app, isDatastake) {
 }
 
 const en = {
-  "sbg-admin::remove-user-title": "Remove User Title",
-  "sbg-admin::remove-user-body": "Remove User Body",
-  "add-account": "Add Account",
   "Site": "Site",
   "Production Sites": "Production Sites",
   "Type of account": "Type of account",
@@ -9467,7 +9451,7 @@ const fr = {
   Documentation: "Documents",
   "Edit project": "Modifier le projet",
   Name: "Nom",
-  Type: "Type",
+  Type: "Tapez",
   type: "Type",
   Province: "Province",
   Territory: "Territoire",
@@ -11278,7 +11262,7 @@ const sp = {
   "Documentation": "Documentos",
   "Edit project": "Modificar proyecto",
   "Name": "Nombre",
-  "Type": "Tipo",
+  "Type": "Escribe",
   "type": "Tipo",
   "Province": "Provincia",
   "Territory": "Territorio",

package/package.json

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

package/src/@daf/core/components/Dashboard/Widget/ActivityIndicators/ActivityIndicators.stories.js

@@ -250,3 +250,27 @@ export const NoMinWidth = {
 		);
 	},
 };
+
+export const SingleColumn = {
+	name: "Single Column Layout",
+	args: {
+		className: "single-column",
+	},
+	render: (args) => {
+		const config = [
+			{ icon: "Package", label: "Aid kit availability", type: "compliant" },
+			{ icon: "SchoolHat", label: "H&S training delivery", type: "compliant" },
+			{ icon: "UsersCheck", label: "Workers safe pairing", type: "notCompliant" },
+			{ icon: "User", label: "Children presence", type: "compliant" },
+			{ icon: "Lock", label: "Security presence", type: "empty" },
+			{ icon: "Refresh05", label: "Relay presence", type: "compliant" },
+		];
+		
+		return (
+			<ActivityIndicators
+				{...args}
+				config={config}
+			/>
+		);
+	},
+};

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

@@ -27,6 +27,7 @@ import styled from "styled-components";
  * @param {ReactNode} children - Additional content to render
  * @param {boolean} noTitle - Hide the widget title
  * @param {string} filterMode - Filter indicators by type: "all" | "compliant" | "notCompliant" | "empty"
+ * @param {string} className - Additional CSS classes. Use "single-column" to force single-column layout
  */
 export default function ActivityIndicatorsWidget({
 	t = (s) => s,

package/src/@daf/core/components/Dashboard/Widget/ActivityIndicators/style.js

@@ -99,6 +99,40 @@ const Style = styled.div`
 			}
 		}
 	}
+
+	&.single-column {
+		grid-template-columns: 1fr;
+
+		.indicator-item {
+			/* Remove the 2-column specific separators first */
+			&:nth-child(1),
+			&:nth-child(2),
+			&:nth-child(3),
+			&:nth-child(4) {
+				&::after {
+					display: none !important;
+				}
+			}
+
+			/* On single column, all items except last get separator */
+			&:not(:last-child) {
+				&::after {
+					content: '' !important;
+					position: absolute;
+					bottom: 0;
+					left: var(--size-lg);
+					right: var(--size-lg);
+					height: 1px;
+					background-color: var(--border-color, #E5E7EB);
+					display: block !important;
+				}
+			}
+			
+			&:last-child::after {
+				display: none !important;
+			}
+		}
+	}
 `;
 
 export const NoMinWidth = styled.div`

package/src/@daf/core/components/Dashboard/Widget/KeyIndicators/KeyIndicators.stories.js

@@ -120,3 +120,42 @@ export const NoMinWidth = {
 		],
 	},
 };
+
+export const SiteConditions = {
+	name: "SiteConditions",
+	args: {
+		title: "Site Conditions",
+		className: "small-content",
+		config: [
+			{
+				label: "Season",
+				icon: "Tree",
+				render: () => <div>Rainy</div>
+			},
+			{
+				label: "Weather conditions",
+				icon: "Globe",
+				render: () => <div>Cloudy</div>
+			},
+			{
+				label: "Tide level",
+				icon: "WaterDrop",
+				render: () => <div>Medium</div>
+			},
+			{
+				label: "Disturbances",
+				icon: "Lightning",
+				render: () => <div>None</div>
+			},
+		],
+	},
+	render: (args) => {
+		return (
+			<DashboardLayout>
+				<section>
+					<KeyIndicators {...args} />
+				</section>
+			</DashboardLayout>
+		);
+	},
+};

package/src/@daf/core/components/Dashboard/Widget/KeyIndicators/LabelWithIcon.jsx

@@ -0,0 +1,38 @@
+import React from 'react';
+import PropTypes from 'prop-types';
+import CustomIcon from '../../../Icon/CustomIcon.jsx';
+
+const LabelWithIcon = ({ t, name, icon, iconColor = "#028788", iconWidth = 16, iconHeight = 16 }) => {
+  // name is expected to be already translated (string) or a translation key
+  // If it's a string that looks like a translation key (contains '::'), translate it
+  // Otherwise, use it as-is (already translated)
+  const displayText = (typeof name === 'string' && name.includes('::') && t && typeof t === 'function')
+    ? t(name)
+    : name;
+  
+  return (
+    <div className="flex items-center" style={{ gap: 8 }}>
+      {icon && <CustomIcon name={icon} color={iconColor} width={iconWidth} height={iconHeight} />}
+      <span style={{
+        fontSize: '14px',
+        fontWeight: 500,
+        lineHeight: '26px',
+        letterSpacing: '0%',
+        color: 'var(--base-gray-70)',
+        fontFamily: 'SF UI Display, -apple-system, BlinkMacSystemFont, sans-serif'
+      }}>{displayText}</span>
+    </div>
+  );
+};
+
+LabelWithIcon.propTypes = {
+  t: PropTypes.func,
+  name: PropTypes.string.isRequired,
+  icon: PropTypes.string,
+  iconColor: PropTypes.string,
+  iconWidth: PropTypes.number,
+  iconHeight: PropTypes.number,
+};
+
+export default LabelWithIcon;
+

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

@@ -2,6 +2,7 @@ import Style, { NoMinWidth } from "./style";
 import Widget from "../index.jsx";
 import { formatClassname } from "../../../../../../helpers/ClassesHelper";
 import { Tooltip } from "antd";
+import LabelWithIcon from "./LabelWithIcon.jsx";
 
 export default function KeyIndicatorsWidget({
 	t = (s) => s,
@@ -25,8 +26,8 @@ export default function KeyIndicatorsWidget({
 			{children}
 			<Style className={formatClassname(["flex", className])}>
 				{config.map((c, i) => (
-					<div className="row-item" key={`key-indicators-${i}`}>
-						<Label label={c.label} withTooltip={withTooltip} />
+					<div className={`row-item ${c.icon ? 'row-item-with-icon' : ''}`} key={`key-indicators-${i}`}>
+						<Label label={c.label} icon={c.icon} withTooltip={withTooltip} t={t} />
 						<div className="flex">{c.render()}</div>
 					</div>
 				))}
@@ -40,7 +41,19 @@ export default function KeyIndicatorsWidget({
 	return component;
 }
 
-function Label({ label, withTooltip }) {
+function Label({ label, icon, withTooltip, t }) {
+	if (icon) {
+		const labelContent = <LabelWithIcon t={t} name={label} icon={icon} />;
+		if (withTooltip) {
+			return (
+				<Tooltip title={label} placement="topLeft">
+					<h4>{labelContent}</h4>
+				</Tooltip>
+			);
+		}
+		return <h4>{labelContent}</h4>;
+	}
+	
 	if (withTooltip) {
 		return (
 			<Tooltip title={label} placement="topLeft">

package/src/@daf/core/components/Dashboard/Widget/KeyIndicators/style.js

@@ -59,12 +59,45 @@ const Style = styled.div`
 				margin-top: 14px;
 			}
 		}
+
+		&.row-item-with-icon {
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			gap: 8px;
+
+			h4 {
+				margin-bottom: 0;
+				flex: 0 0 auto;
+			}
+
+			.flex {
+				flex: 0 0 auto;
+				display: flex;
+				align-items: center;
+				font-size: 16px;
+				font-weight: 500;
+				line-height: 38px;
+				letter-spacing: 0;
+				color: var(--base-gray-90);
+				font-family: 'SF UI Display', -apple-system, BlinkMacSystemFont, sans-serif;
+			}
+		}
 	}
 
 	&.small-content {
 		span {
 			font-size: 16px;
 		}
+
+		.row-item-with-icon {
+			.flex {
+				font-size: 16px;
+				line-height: 38px;
+				font-weight: 500;
+				color: var(--base-gray-90);
+			}
+		}
 	}
 
 	.ant-tag {

package/src/@daf/core/components/Screens/Admin/AdminDashboard/components/UserStatistics/TopContributors/hook.js

@@ -10,6 +10,7 @@ const { useToken } = theme;
 export default function useTopContributors({ container, data = [], t }) {
 	const [mainGraph, setMainGraph] = useState(null);
 	const { token } = useToken();
+
 	useEffect(() => {
 		if (container.current) {
 			if (mainGraph) {