@m4l/gclick 0.2.0 → 0.2.3-beta.0

package/components/maps/components/GpsMapTools/subcomponents/{TabsGpsTools → GeofencesTool}/subcomponents/GeofenceAddEdit/hooks/useDrawing.js

@@ -1,10 +1,12 @@
-import { useState, useRef, useEffect, useCallback } from "react";
+import { useState, useRef, useEffect, useCallback, useMemo } from "react";
 import { useFormContext, useWatch } from "react-hook-form";
 import { useModuleDictionary } from "@m4l/core";
 import { useMap } from "react-leaflet";
+import * as L from "leaflet";
 import { g as getLayerFromGeometry } from "../helpers.js";
 import { useFormReadyForUpdate } from "@m4l/components";
 import { M as MAP_GPSTOOLS_DICCTIONARY } from "../../../../../dictionary.js";
+import { g as getStyleFromProperties } from "../../../helpers.js";
 function useDrawing() {
   const { getLabel } = useModuleDictionary();
   const readyToUpdate = useFormReadyForUpdate();
@@ -13,7 +15,7 @@ function useDrawing() {
   const fieldsWatch = useWatch({
     control,
     name: [
-      "geofenceType",
+      "geofenceTypeId",
       "inEdition",
       "properties.strokeColor",
       "properties.strokeOpacity",
@@ -22,31 +24,46 @@ function useDrawing() {
       "properties.fillColor",
       "properties.fillOpacity",
       "geometry",
-      "properties.radius"
+      "properties.radius",
+      "statusLoad"
     ]
   });
-  const geofenceTypeId = fieldsWatch[0]?.id;
+  const geofenceTypeId = fieldsWatch[0];
   const inEdition = fieldsWatch[1];
   const strokeColor = fieldsWatch[2];
-  const strokeOpacity = fieldsWatch[3].value;
-  const strokeWeight = fieldsWatch[4].value;
-  const strokeDashArray = fieldsWatch[5].value;
+  const strokeOpacity = fieldsWatch[3];
+  const strokeWeight = fieldsWatch[4];
+  const strokeDashArray = fieldsWatch[5];
   const fillColor = fieldsWatch[6];
-  const fillOpacity = fieldsWatch[7].value;
+  const fillOpacity = fieldsWatch[7];
   const geometry = fieldsWatch[8];
   const radius = fieldsWatch[9];
-  const [drawing, setDrawing] = useState(false);
+  const [isDrawing, setIsDrawing] = useState(false);
   const currentLayer = useRef(null);
-  const [geometrTypeIdCached, setgeofenceTypeIdCached] = useState(geofenceTypeId);
+  const refProperties = useRef(getStyleFromProperties({
+    strokeColor,
+    strokeOpacity,
+    strokeWeight,
+    strokeDashArray,
+    fillColor,
+    fillOpacity
+  }));
+  refProperties.current = getStyleFromProperties({
+    strokeColor,
+    strokeOpacity,
+    strokeWeight,
+    strokeDashArray,
+    fillColor,
+    fillOpacity
+  });
+  const [geometrTypeIdCached, setGeofenceTypeIdCached] = useState(geofenceTypeId);
   useEffect(() => {
+    if (!readyToUpdate) {
+      return;
+    }
     if (geometry) {
       currentLayer.current = getLayerFromGeometry(geometry, geofenceTypeId, radius, {
-        color: strokeColor,
-        opacity: strokeOpacity,
-        weight: strokeWeight,
-        dashArray: strokeDashArray,
-        fillColor,
-        fillOpacity
+        ...refProperties.current
       });
       if (currentLayer.current) {
         map.addLayer(currentLayer.current);
@@ -58,43 +75,63 @@ function useDrawing() {
         currentLayer.current.remove();
       }
     };
-  }, [map]);
+  }, [map, readyToUpdate]);
+  useEffect(() => {
+    if (!readyToUpdate) {
+      if (geometrTypeIdCached !== geofenceTypeId) {
+        setGeofenceTypeIdCached(geofenceTypeId);
+      }
+      return;
+    }
+    if (geofenceTypeId !== geometrTypeIdCached) {
+      setGeofenceTypeIdCached(geofenceTypeId);
+      if (geometrTypeIdCached !== "gt_circle") {
+        setValue("properties.radius", null, { shouldDirty: true });
+        setValue("lat", null, { shouldDirty: true });
+        setValue("lng", null, { shouldDirty: true });
+      }
+      setValue("geometry", null, { shouldDirty: true });
+      if (currentLayer.current) {
+        currentLayer.current.remove();
+        currentLayer.current = null;
+      }
+    }
+  }, [readyToUpdate, geofenceTypeId]);
   useEffect(() => {
     if (currentLayer.current) {
-      currentLayer.current.setStyle({
-        color: strokeColor,
-        opacity: strokeOpacity,
-        weight: strokeWeight,
-        dashArray: strokeDashArray,
-        fillColor,
-        fillOpacity
-      });
+      currentLayer.current.setStyle(refProperties.current);
     }
   }, [strokeColor, strokeOpacity, strokeWeight, strokeDashArray, fillColor, fillOpacity]);
   useEffect(() => {
     map.pm.setLang("en", {
       tooltips: {
         placeMarker: void 0,
-        firstVertex: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_FIRST_VERTEX),
-        continueLine: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_CONTINUE_LINE),
-        finishLine: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_FINISH_LINE),
-        finishPoly: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_FINISH_POLY),
-        finishRect: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_FINISH_RECT),
-        startCircle: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_START_CIRCLE),
-        finishCircle: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_FINISH_CIRCLE),
-        placeCircleMarker: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_PLACE_CIRCLE_MARKER)
+        firstVertex: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_FIRST_VERTEX),
+        continueLine: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_CONTINUE_LINE),
+        finishLine: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_FINISH_LINE),
+        finishPoly: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_FINISH_POLYLINE),
+        finishRect: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_FINISH_RECT),
+        startCircle: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_START_CIRCLE),
+        finishCircle: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_FINISH_CIRCLE),
+        placeCircleMarker: getLabel(MAP_GPSTOOLS_DICCTIONARY.LABEL_GEOMAN_PLACE_CIRCLE_MARKER)
       }
     });
   }, [map, getLabel]);
   useEffect(() => {
     if (map) {
       let shape = "Circle";
+      let pmShape = "Circle";
       if (geometrTypeIdCached === "gt_polygon") {
         shape = "Polygon";
+        pmShape = "Polygon";
+      } else if (geometrTypeIdCached === "gt_multipolygon") {
+        shape = "MultiPolygon";
+        pmShape = "Polygon";
       } else if (geometrTypeIdCached === "gt_rectangle") {
         shape = "Rectangle";
+        pmShape = "Rectangle";
       }
-      if (drawing) {
+      if (isDrawing) {
         if (!currentLayer.current) {
           setValue("inEdition", true);
           if (shape === "Circle") {
@@ -117,38 +154,44 @@ function useDrawing() {
               });
             });
             setValue("properties.subType", shape);
-          } else if (shape === "Polygon") {
+          } else if (shape === "Polygon" || shape === "MultiPolygon") {
             map.on("pm:drawstart", ({ workingLayer }) => {
               workingLayer.on("pm:vertexadded", (e) => {
                 const layer = e.workingLayer;
-                layer.setStyle({
-                  color: strokeColor,
-                  opacity: strokeOpacity,
-                  weight: strokeWeight,
-                  dashArray: strokeDashArray,
-                  fillColor,
-                  fillOpacity
-                });
+                layer.setStyle(refProperties.current);
               });
             });
           }
-          map.pm.enableDraw(shape);
-          map.pm.setPathOptions({
-            color: strokeColor,
-            opacity: strokeOpacity,
-            weight: strokeWeight,
-            dashArray: strokeDashArray,
-            fillColor,
-            fillOpacity
-          });
+          map.pm.enableDraw(pmShape);
+          map.pm.setPathOptions(refProperties.current);
           map.on("pm:create", (e) => {
-            currentLayer.current = e.layer;
-            setValue("geometry", currentLayer.current.toGeoJSON()?.geometry, {
-              shouldTouch: false,
-              shouldValidate: true
-            });
+            const layer = e.layer;
+            const geoJSONgeometry = layer.toGeoJSON()?.geometry;
+            if (shape === "MultiPolygon" && geoJSONgeometry?.type === "Polygon") {
+              const multiPolygonGeometry = {
+                type: "MultiPolygon",
+                coordinates: [geoJSONgeometry.coordinates]
+              };
+              map.removeLayer(layer);
+              currentLayer.current = L.geoJSON(multiPolygonGeometry, {
+                style: refProperties.current
+              });
+              map.addLayer(currentLayer.current);
+              setValue("geometry", multiPolygonGeometry, {
+                shouldTouch: true,
+                shouldValidate: true,
+                shouldDirty: true
+              });
+            } else {
+              currentLayer.current = layer;
+              setValue("geometry", geoJSONgeometry, {
+                shouldTouch: true,
+                shouldValidate: true,
+                shouldDirty: true
+              });
+            }
             setValue("inEdition", false);
-            setDrawing(false);
+            setIsDrawing(false);
           });
         } else {
           currentLayer.current.pm.enable();
@@ -156,11 +199,12 @@ function useDrawing() {
           currentLayer.current.on("pm:disable", (e) => {
             currentLayer.current = e.layer;
             setValue("geometry", currentLayer.current.toGeoJSON()?.geometry, {
-              shouldTouch: false,
-              shouldValidate: true
+              shouldTouch: true,
+              shouldValidate: true,
+              shouldDirty: true
             });
             setValue("inEdition", false);
-            setDrawing(false);
+            setIsDrawing(false);
           });
           if (shape === "Circle") {
             currentLayer.current.on("pm:change", (e) => {
@@ -179,37 +223,16 @@ function useDrawing() {
         map.off("pm:drawstart");
       }
     }
-  }, [map, drawing]);
+  }, [map, isDrawing]);
   const handleDraw = useCallback(() => {
-    setDrawing(true);
+    setIsDrawing(true);
   }, []);
   const handleFinish = useCallback(() => {
     if (currentLayer.current) {
       currentLayer.current.pm.disable();
-      currentLayer.current.setStyle({ color: "#ff0000", fillColor: "#ff0000" });
     }
   }, []);
-  useEffect(() => {
-    if (!readyToUpdate) {
-      return;
-    }
-    if (geofenceTypeId) {
-      if (geofenceTypeId !== geometrTypeIdCached) {
-        setgeofenceTypeIdCached(geofenceTypeId);
-        if (geometrTypeIdCached !== "gt_circle") {
-          setValue("properties.radius", null);
-          setValue("lat", null);
-          setValue("lng", null);
-        }
-        setValue("geometry", null);
-        if (currentLayer.current) {
-          currentLayer.current.remove();
-          currentLayer.current = null;
-        }
-      }
-    }
-  }, [geofenceTypeId]);
-  return { inEdition, handleDraw, handleFinish, geometrTypeIdCached };
+  return useMemo(() => ({ inEdition, handleDraw, handleFinish, geometrTypeIdCached }), [inEdition, handleDraw, handleFinish, geometrTypeIdCached]);
 }
 export {
   useDrawing as u

package/components/maps/components/GpsMapTools/subcomponents/GeofencesTool/subcomponents/GeofenceAddEdit/hooks/useForm.d.ts

@@ -0,0 +1,10 @@
+import { FormAddEditValues, GeofenceAddEditProps } from '../types';
+/**
+ * useForm hook is responsible for managing the form of the account contract parts
+ */
+declare const useForm: (props: GeofenceAddEditProps) => {
+    steps: import('@m4l/components').TypeStep[];
+    formValues: FormAddEditValues;
+    statusLoad: import('@m4l/components').FormStatusLoad;
+};
+export default useForm;

package/components/maps/components/GpsMapTools/subcomponents/GeofencesTool/subcomponents/GeofenceAddEdit/hooks/useForm.js

@@ -0,0 +1,98 @@
+import { useEffect, useMemo } from "react";
+import { useWindowToolsMF, deepShallow, getStepsAndValidationSchema } from "@m4l/components";
+import { useModuleDictionary, useEnvironment } from "@m4l/core";
+import { useFormAddEdit } from "@m4l/layouts";
+import { u as useGpsMapToolsStore } from "../../../../../hooks/useGpsMapToolsStore/index.js";
+import { f as formatDataEndpoint } from "../helpers.js";
+import { E as ENDPOINT_GEOFENCES_GET } from "../../../constants.js";
+import { i as initialValues } from "../constants.js";
+import { M as MAP_GPSTOOLS_DICCTIONARY } from "../../../../../dictionary.js";
+import { G as GeneralDataValidation } from "../subcomponents/GeneralData/validations.js";
+import { M as MAP_GPSTOOLS_ICONS } from "../../../../../icons.js";
+import { G as GPS_TOOLS_COMPONENT_PATH_ID } from "../../../../../constants.js";
+import { shallow } from "zustand/shallow";
+const useForm = (props) => {
+  const { geofenceId } = props;
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  const { startProgress, stopProgress } = useWindowToolsMF();
+  const { addOrReplaceGeofence } = useGpsMapToolsStore((state) => state.geofenceActions, shallow);
+  const [finalInitalValues, omitCallEnpoint] = useGpsMapToolsStore((state) => {
+    if (geofenceId === void 0) {
+      return [initialValues, false];
+    }
+    const geofence = state.geofenceState.hashGeofences[geofenceId];
+    if (geofence?.geometry) {
+      const emulateResponse = {
+        data: {
+          type: geofence.type,
+          name: geofence.name,
+          id: geofence.id,
+          active: false,
+          geometry: geofence.geometry,
+          properties: geofence.properties,
+          createdAt: geofence.createdAt,
+          updatedAt: geofence.updatedAt,
+          timeMinInSeconds: geofence.timeMinInSeconds,
+          timeMinOutSeconds: geofence.timeMinOutSeconds,
+          bounds: geofence.bounds,
+          alias: geofence.alias,
+          customerId: geofence.customerId
+        }
+      };
+      return [formatDataEndpoint(emulateResponse), true];
+    } else {
+      return [initialValues, false];
+    }
+  }, deepShallow);
+  const { formValues, statusLoad } = useFormAddEdit({
+    objectId: geofenceId,
+    formatDataEndpoint,
+    initialValues: finalInitalValues,
+    networkProps: {
+      endPoint: `${ENDPOINT_GEOFENCES_GET}/${geofenceId}`,
+      responseToCamelCase: true,
+      method: "GET",
+      options: {
+        startProgress,
+        stopProgress
+      }
+    },
+    omitCallEnpoint
+  });
+  useEffect(() => {
+    if (statusLoad === "ready" && geofenceId && formValues.createdAt) {
+      addOrReplaceGeofence(geofenceId, formValues);
+    }
+  }, [statusLoad, geofenceId, formValues]);
+  const { steps } = useMemo(() => getStepsAndValidationSchema({
+    visibilityData: void 0,
+    steps: [
+      {
+        key: "basic-information",
+        title: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_BASIC_INFORMATION),
+        description: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_BASIC_INFORMATION_DESCRIPTION),
+        icon: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_PAPER_GENERAL}`,
+        validationFunction: () => GeneralDataValidation(getLabel)
+      },
+      {
+        key: "style-information",
+        title: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_STYLE),
+        description: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_STYLE_DESCRIPTION),
+        icon: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_PAPER_STYLE}`,
+        validationFunction: void 0
+      }
+      // {
+      //   key: 'allocation',
+      //   title: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_ASSIGNMENT),
+      //   description: getLabel(MAP_GPSTOOLS_DICCTIONARY.STEP_ASSIGNMENT_DESCRIPTION),
+      //   icon: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_PAPER_ASSIGNMENT}`,
+      //   validationFunction: undefined,
+      // },
+    ]
+  }), [getLabel, host_static_assets, environment_assets]);
+  return { steps, formValues, statusLoad };
+};
+export {
+  useForm as u
+};

package/components/maps/components/GpsMapTools/subcomponents/{TabsGpsTools → GeofencesTool}/subcomponents/GeofenceAddEdit/hooks/useSubmit.d.ts

@@ -1,8 +1,6 @@
 import { FieldValues } from 'react-hook-form';
 import { FormAddEditValues, GeofenceAddEditProps } from '../types';
-export interface UseSubmitProps extends Pick<GeofenceAddEditProps, 'fullRefresh'> {
-    objectId?: number;
-}
+export type UseSubmitProps = Pick<GeofenceAddEditProps, 'fullRefresh' | 'geofenceId'>;
 /**
  * TODO: Documentar
  */

package/components/maps/components/GpsMapTools/subcomponents/{TabsGpsTools → GeofencesTool}/subcomponents/GeofenceAddEdit/hooks/useSubmit.js

@@ -1,21 +1,22 @@
 import { useHostTools, useNetwork } from "@m4l/core";
-import { E as ENDPOINT_GEOFENCE_NEW_EDIT } from "../../constants.js";
+import { b as ENDPOINT_GEOFENCES_NEW_EDIT, c as GEOFENCES_TOOL_LIST_POPUP_ID } from "../../../constants.js";
+import { u as useGpsMapToolsStore } from "../../../../../hooks/useGpsMapToolsStore/index.js";
 import { usePopupsStore } from "@m4l/components";
 import { shallow } from "zustand/shallow";
-import { u as useGpsMapToolsStore } from "../../../../../hooks/useGpsMapToolsStore/index.js";
+import { G as GEOFENCES_TOOL_ADD_EDIT_POPUP_ID } from "../constants.js";
+import { useCallback } from "react";
 const getSummitData = (values, geofenceId) => {
   const newEditObj = {
     name: values.name,
-    typeId: values.geofenceType.id,
+    typeId: values.geofenceTypeId,
     geometry: values.geometry,
     properties: {
-      subType: values.properties.subType,
-      strokeColor: values.properties.fillColor,
-      strokeOpacity: values.properties.strokeOpacity.value,
-      strokeWeight: values.properties.strokeWeight.value,
-      strokeDashArray: values.properties.strokeDashArray.value,
+      strokeColor: values.properties.strokeColor,
+      strokeOpacity: values.properties.strokeOpacity,
+      strokeWeight: values.properties.strokeWeight,
+      strokeDashArray: values.properties.strokeDashArray,
       fillColor: values.properties.fillColor,
-      fillOpacity: values.properties.fillOpacity.value
+      fillOpacity: values.properties.fillOpacity
     },
     timeMinInSeconds: values.timeMinInSeconds,
     timeMinOutSeconds: values.timeMinOutSeconds,
@@ -23,39 +24,37 @@ const getSummitData = (values, geofenceId) => {
     customerId: values.customerId,
     ...geofenceId ? { geofenceId } : {}
   };
-  if (values.geofenceType.id === "gt_circle") {
+  if (values.geofenceTypeId === "gt_circle") {
     newEditObj.properties.radius = values.properties.radius;
   }
   return newEditObj;
 };
 function useSubmit(props) {
-  const { objectId, fullRefresh } = props;
+  const { geofenceId, fullRefresh } = props;
   const { toast } = useHostTools();
   const { networkOperation } = useNetwork();
   const { close, show } = usePopupsStore((state) => state.popupActions);
-  const { addCheckedGeofence } = useGpsMapToolsStore((state) => state.geofenceActions, shallow);
-  const onSubmit = async (data) => {
+  const { addCheckedGeofence, addOrReplaceGeofence } = useGpsMapToolsStore((state) => state.geofenceActions, shallow);
+  const onSubmit = useCallback(async (data) => {
     await networkOperation({
-      method: objectId ? "PUT" : "POST",
-      endPoint: `${ENDPOINT_GEOFENCE_NEW_EDIT}${objectId ? `/${objectId}` : ""}`,
-      data: getSummitData(data, objectId),
+      method: geofenceId ? "PUT" : "POST",
+      endPoint: `${ENDPOINT_GEOFENCES_NEW_EDIT}${geofenceId ? `/${geofenceId}` : ""}`,
+      data: getSummitData(data, geofenceId),
       toastError: true,
       toastSuccess: false,
       bodyToSnakeCase: true,
-      isRemote: false
+      responseToCamelCase: true
     }).then((response) => {
-      toast({ title: response.message }, { type: "success" });
-      close("geofencesAddEdit");
-      show("gpsTools");
-      if (objectId !== void 0) {
-        addCheckedGeofence(objectId);
-      }
+      addOrReplaceGeofence(response.data.id, response.data, true);
       if (fullRefresh) {
         fullRefresh();
       }
+      toast({ title: response.message }, { type: "success" });
+      close(GEOFENCES_TOOL_ADD_EDIT_POPUP_ID, false);
+      show(GEOFENCES_TOOL_LIST_POPUP_ID);
     }).catch(() => {
     });
-  };
+  }, [geofenceId, fullRefresh, toast, close, show, addCheckedGeofence, networkOperation]);
   return { onSubmit };
 }
 export {

package/components/maps/components/GpsMapTools/subcomponents/{TabsGpsTools → GeofencesTool}/subcomponents/GeofenceAddEdit/hooks/useValidation.d.ts

@@ -7,19 +7,22 @@ export declare function useValidation(): {
         timeMinInSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         timeMinOutSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         name: import('yup/lib/string').RequiredStringSchema<string | undefined, import('yup/lib/types').AnyObject>;
+        inEdition: Yup.BooleanSchema<boolean | undefined, import('yup/lib/types').AnyObject, boolean | undefined>;
         geometry: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
-        geofenceType: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
+        geofenceTypeId: import('yup/lib/string').RequiredStringSchema<string | null | undefined, import('yup/lib/types').AnyObject>;
     }>, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').Assign<import('yup/lib/object').ObjectShape, {
         timeMinInSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         timeMinOutSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         name: import('yup/lib/string').RequiredStringSchema<string | undefined, import('yup/lib/types').AnyObject>;
+        inEdition: Yup.BooleanSchema<boolean | undefined, import('yup/lib/types').AnyObject, boolean | undefined>;
         geometry: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
-        geofenceType: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
+        geofenceTypeId: import('yup/lib/string').RequiredStringSchema<string | null | undefined, import('yup/lib/types').AnyObject>;
     }>>, import('yup/lib/object').AssertsShape<import('yup/lib/object').Assign<import('yup/lib/object').ObjectShape, {
         timeMinInSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         timeMinOutSeconds: import('yup/lib/number').RequiredNumberSchema<number | null | undefined, import('yup/lib/types').AnyObject>;
         name: import('yup/lib/string').RequiredStringSchema<string | undefined, import('yup/lib/types').AnyObject>;
+        inEdition: Yup.BooleanSchema<boolean | undefined, import('yup/lib/types').AnyObject, boolean | undefined>;
         geometry: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
-        geofenceType: import('yup/lib/object').RequiredObjectSchema<import('yup/lib/object').ObjectShape, import('yup/lib/object').AnyObject, import('yup/lib/object').TypeOfShape<import('yup/lib/object').ObjectShape> | null>;
+        geofenceTypeId: import('yup/lib/string').RequiredStringSchema<string | null | undefined, import('yup/lib/types').AnyObject>;
     }>>>;
 };

package/components/maps/components/GpsMapTools/subcomponents/GeofencesTool/subcomponents/GeofenceAddEdit/subcomponents/ConfigData/index.js

@@ -0,0 +1,67 @@
+import { jsxs, jsx } from "react/jsx-runtime";
+import { useModuleDictionary, useEnvironment } from "@m4l/core";
+import { PaperForm, RHFTextField, RHFNumberInput, Typography, Icon } from "@m4l/components";
+import { M as MAP_GPSTOOLS_DICCTIONARY } from "../../../../../../dictionary.js";
+import { M as MAP_GPSTOOLS_ICONS } from "../../../../../../icons.js";
+import { G as GPS_TOOLS_COMPONENT_PATH_ID } from "../../../../../../constants.js";
+function ConfigData() {
+  const { getLabel } = useModuleDictionary();
+  const { host_static_assets, environment_assets } = useEnvironment();
+  return /* @__PURE__ */ jsxs(PaperForm, { urlIcon: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_CONFIG}`, title: getLabel(MAP_GPSTOOLS_DICCTIONARY.PAPER_CONFIG), isForm: true, variant: "text", children: [
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "alias",
+        disabled: false,
+        type: "text",
+        label: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_ALIAS}`)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFTextField,
+      {
+        name: "customerId",
+        disabled: false,
+        type: "text",
+        label: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_CUSTOMER_ID}`)
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFNumberInput,
+      {
+        name: "timeMinInSeconds",
+        disabled: false,
+        withDecimal: false,
+        startAdornment: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            src: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_TIME_MIN_IN}`
+          }
+        ),
+        endAdornment: /* @__PURE__ */ jsx(Typography, { children: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_TIME_UNIT_SECONDS}`) }),
+        label: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_TIME_MIN_IN}`),
+        min: 0
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      RHFNumberInput,
+      {
+        name: "timeMinOutSeconds",
+        startAdornment: /* @__PURE__ */ jsx(
+          Icon,
+          {
+            src: `${host_static_assets}/${environment_assets}/frontend/components/${GPS_TOOLS_COMPONENT_PATH_ID}/assets/icons/${MAP_GPSTOOLS_ICONS.GEOFENCES_TIME_MIN_OUT}`
+          }
+        ),
+        endAdornment: /* @__PURE__ */ jsx(Typography, { children: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_TIME_UNIT_SECONDS}`) }),
+        disabled: false,
+        withDecimal: false,
+        label: getLabel(`${MAP_GPSTOOLS_DICCTIONARY.LABEL_TIME_MIN_OUT}`),
+        min: 0
+      }
+    )
+  ] });
+}
+export {
+  ConfigData as C
+};