1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[6248],{85663:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.r(__webpack_exports__),__webpack_require__.d(__webpack_exports__,{default:function(){return zones_ZoneMapView}});var jsx_runtime=__webpack_require__(85893),react=__webpack_require__(67294),client=__webpack_require__(20745),i18next=__webpack_require__(66304),exports_maplibre=__webpack_require__(24808);__webpack_require__(95616);var mapbox_gl_draw=__webpack_require__(47185);__webpack_require__(82793);var dist_maplibre_gl=__webpack_require__(24613),es=__webpack_require__(73730),useTheme=__webpack_require__(13255),Box=__webpack_require__(9258),Typography=__webpack_require__(77046),Paper=__webpack_require__(72178),Tooltip=__webpack_require__(71395),IconButton=__webpack_require__(41266),Divider=__webpack_require__(17318),Modal=__webpack_require__(49513),Edit=__webpack_require__(86866),Delete=__webpack_require__(21959),InsightsOutlined=__webpack_require__(32212),CircleOutlined=__webpack_require__(13697),LayersOutlined=(0,__webpack_require__(15295).Z)((0,jsx_runtime.jsx)("path",{d:"m11.99 18.54-7.37-5.73L3 14.07l9 7 9-7-1.63-1.27zM12 16l7.36-5.73L21 9l-9-7-9 7 1.63 1.27zm0-11.47L17.74 9 12 13.47 6.26 9z"}),"LayersOutlined"),SiteContext=__webpack_require__(64984),awsMap=__webpack_require__(87217),isoUtils=__webpack_require__(86014),map=__webpack_require__(38742),helpers=__webpack_require__(54614),dist_es=__webpack_require__(67421),useMutation=__webpack_require__(50319),useSubscription=__webpack_require__(46171),CircularProgress=__webpack_require__(53020),Dialog=__webpack_require__(1889),DialogTitle=__webpack_require__(61722),DialogContent=__webpack_require__(84697),DialogContentText=__webpack_require__(54356),DialogActions=__webpack_require__(80199),Button=__webpack_require__(67398),Map=__webpack_require__(97613),mutations=__webpack_require__(89727),_tagged_template_literal=__webpack_require__(7297),lib=__webpack_require__(68806);function _templateObject(){let data=(0,_tagged_template_literal.Z)(["\n subscription BackgroundTaskProgress($taskType: String!) {\n backgroundTaskProgress(taskType: $taskType) {\n taskType\n processed\n total\n status\n updatedCount\n }\n }\n"]);return _templateObject=function(){return data},data}let BACKGROUND_TASK_PROGRESS_SUBSCRIPTION=(0,lib.Ps)(_templateObject());var SnackAlertContext=__webpack_require__(3250),graphqlErrors=__webpack_require__(19570);let BulkMapAddressesButton=()=>{let{t}=(0,dist_es.$G)(),{pushAlert}=(0,SnackAlertContext.I)(),[confirmOpen,setConfirmOpen]=(0,react.useState)(!1),[mapping,setMapping]=(0,react.useState)(!1),timeoutRef=(0,react.useRef)(null),resetMappingState=(0,react.useCallback)(()=>{setMapping(!1),timeoutRef.current&&(clearTimeout(timeoutRef.current),timeoutRef.current=null)},[]);(0,react.useEffect)(()=>()=>{timeoutRef.current&&clearTimeout(timeoutRef.current)},[]);let startTimeout=(0,react.useCallback)(()=>{timeoutRef.current&&clearTimeout(timeoutRef.current),timeoutRef.current=setTimeout(()=>{resetMappingState(),pushAlert({message:t("zones.bulkMapping.failed"),severity:"error"})},12e4)},[pushAlert,resetMappingState,t]),[bulkMap]=(0,useMutation.D)(mutations.G0);(0,useSubscription.m)(BACKGROUND_TASK_PROGRESS_SUBSCRIPTION,{skip:!mapping,variables:{taskType:"zones.bulkMapping"},onData(param){var ref;let{data}=param,progressData=null==data?void 0:null===(ref=data.data)||void 0===ref?void 0:ref.backgroundTaskProgress;if(progressData){if(startTimeout(),"completed"===progressData.status){resetMappingState();let noChanges=0===progressData.updatedCount;pushAlert({message:t(noChanges?"zones.bulkMapping.alreadyMapped":"zones.bulkMapping.success"),severity:noChanges?"info":"success"})}else"failed"===progressData.status&&(resetMappingState(),pushAlert({message:t("zones.bulkMapping.failed"),severity:"error"}))}}});let handleConfirm=(0,react.useCallback)(async()=>{setConfirmOpen(!1),setMapping(!0),startTimeout();try{await bulkMap()}catch(error){resetMappingState(),pushAlert({message:t((0,graphqlErrors.yp)(error)?"zones.bulkMapping.insufficientCredits":"zones.bulkMapping.failed"),severity:"error"})}},[bulkMap,pushAlert,resetMappingState,startTimeout,t]);return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsxs)(Box.Z,{display:"flex",justifyContent:"space-between",alignItems:"center",gap:2,onClick:()=>!mapping&&setConfirmOpen(!0),sx:{cursor:mapping?"default":"pointer"},children:[(0,jsx_runtime.jsx)(Typography.Z,{variant:"caption",children:t("zones.bulkMapping.button")}),(0,jsx_runtime.jsx)(Tooltip.Z,{title:t("zones.bulkMapping.button"),placement:"right",children:(0,jsx_runtime.jsx)("span",{children:(0,jsx_runtime.jsx)(IconButton.Z,{disabled:ma
1pping,size:"small",children:mapping?(0,jsx_runtime.jsx)(CircularProgress.Z,{size:18}):(0,jsx_runtime.jsx)(Map.Z,{})})})})]}),(0,jsx_runtime.jsxs)(Dialog.Z,{open:confirmOpen,onClose:()=>setConfirmOpen(!1),maxWidth:"sm",fullWidth:!0,children:[(0,jsx_runtime.jsx)(DialogTitle.Z,{children:t("zones.bulkMapping.title")}),(0,jsx_runtime.jsx)(DialogContent.Z,{children:(0,jsx_runtime.jsx)(DialogContentText.Z,{children:t("zones.bulkMapping.message")})}),(0,jsx_runtime.jsxs)(DialogActions.Z,{children:[(0,jsx_runtime.jsx)(Button.Z,{onClick:()=>setConfirmOpen(!1),children:t("common.cancel")}),(0,jsx_runtime.jsx)(Button.Z,{onClick:handleConfirm,variant:"contained",color:"primary",children:t("zones.bulkMapping.confirm")})]})]})]})},DEFAULT_ZONE_COLOR="#1976d2",DRAWING_PREVIEW_COLOR="#F57C00",CIRCLE_DRAW_UNITS="meters",ZoneMapView=param=>{var ref,ref1,ref2;let{zones,selectedZoneId,fitBoundsToken,pendingGeometry,hiddenZoneTypeIds,onZoneTypeToggle,onZoneSelect,onDrawComplete,onZoneGeometryUpdate,onEditZone,onDeleteZone,onInvalidGeometry}=param,siteContext=(0,react.useContext)(SiteContext.ZP),theme=(0,useTheme.Z)(),mapRef=(0,react.useRef)(null),drawRef=(0,react.useRef)(null),popupRef=(0,react.useRef)(null),popupRootRef=(0,react.useRef)(null),[mapLoaded,setMapLoaded]=(0,react.useState)(!1),[drawInitialized,setDrawInitialized]=(0,react.useState)(!1),[highlightPolygon,setHighlightPolygon]=(0,react.useState)(!1),[highlightCircle,setHighlightCircle]=(0,react.useState)(!1),featureCollectionRef=(0,react.useRef)({type:"FeatureCollection",features:[]}),pendingFeatureIdRef=(0,react.useRef)(null),zonesRef=(0,react.useRef)(zones);zonesRef.current=zones;let onEditZoneRef=(0,react.useRef)(onEditZone);onEditZoneRef.current=onEditZone;let onDeleteZoneRef=(0,react.useRef)(onDeleteZone);onDeleteZoneRef.current=onDeleteZone;let onInvalidGeometryRef=(0,react.useRef)(onInvalidGeometry);onInvalidGeometryRef.current=onInvalidGeometry;let pendingGeometryUpdateRef=(0,react.useRef)(null),onZoneGeometryUpdateRef=(0,react.useRef)(onZoneGeometryUpdate);onZoneGeometryUpdateRef.current=onZoneGeometryUpdate;let circleEventHandlersRef=(0,react.useRef)({}),polygonEventHandlersRef=(0,react.useRef)({}),defaultCoords=(0,isoUtils.e)(null==siteContext?void 0:null===(ref=siteContext.site)||void 0===ref?void 0:null===(ref1=ref.settings)||void 0===ref1?void 0:null===(ref2=ref1.general)||void 0===ref2?void 0:ref2.country),mapStyle=awsMap.M.streetView,zoneTypes=(0,react.useMemo)(()=>(0,helpers.u3)(zones),[zones]);(0,react.useEffect)(()=>{document.documentElement.style.setProperty("--popup-background",theme.palette.background.paper),document.documentElement.style.setProperty("--popup-content-color",theme.palette.text.primary)},[theme]);let featureCollection=(0,react.useMemo)(()=>{let fc={type:"FeatureCollection",features:zones.filter(z=>{var ref;if(!(null===(ref=z.geometry)||void 0===ref?void 0:ref.coordinates))return!1;let ztName=(0,helpers.yx)(z);return!hiddenZoneTypeIds.has(ztName)}).map(zone=>({type:"Feature",id:zone._id,properties:{zoneId:zone._id,name:zone.name,color:(0,helpers.tm)(zone)||DEFAULT_ZONE_COLOR,selected:zone._id===selectedZoneId},geometry:{type:zone.geometry.type,coordinates:zone.geometry.coordinates}}))};return featureCollectionRef.current=fc,fc},[zones,selectedZoneId,hiddenZoneTypeIds]);(0,react.useEffect)(()=>{var ref;let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();if(!map||!mapLoaded)return;drawRef.current=new mapbox_gl_draw.Z({displayControlsDefault:!1,controls:{trash:!1},defaultMode:"simple_select",userProperties:!0,styles:[{id:"gl-draw-polygon-fill-inactive",type:"fill",filter:["all",["==","$type","Polygon"],["!=","mode","static"],["==","active","false"]],paint:{"fill-color":["coalesce",["get","user_color"],DEFAULT_ZONE_COLOR],"fill-opacity":.35}},{id:"gl-draw-polygon-fill-active",type:"fill",filter:["all",["==","$type","Polygon"],["==","active","true"]],paint:{"fill-color":["coalesce",["get","user_color"],DRAWING_PREVIEW_COLOR],"fill-opacity":.4}},{id:"gl-draw-polygon-stroke-inactive",type:"line",filter:["all",["==","$type","Polygon"],["!=","mode","static"],["==","active","false"]],layout:{"line-cap":"round","line-join":"round"},paint:{"line-color":["coalesce",["get","user_color"],DEFAULT_ZONE_COLOR],"line-width":2}},{id:"gl-draw-polygon-stroke-active",type:"line",filter:["all",["==","$type","Polygon"],["==","active","true"]],layout:{"line-cap":"round","line-join":"round"},paint:{"line-color":["coalesce",["get","user_color"],DRAWING_PREVIEW_COLOR],"line-width":1,"line-opacity":.6}},{id:"gl-draw-polygon-midpoint",type:"circle",filter:["all",["==","$type","Point"],["==","meta","midpoint"]],paint:{"circle-radius":4,"circle-color":DRAWING_PREVIEW_COLOR}},{id:"gl-draw-point-active",type:"circle",filter:["all",["==","$type","Point"],["==","meta","vertex"],["==","active","true"]],paint:{"circle-radius":6,"cir
1cle-color":DRAWING_PREVIEW_COLOR}},{id:"gl-draw-point-inactive",type:"circle",filter:["all",["==","$type","Point"],["==","meta","vertex"],["==","active","false"]],paint:{"circle-radius":4,"circle-color":DRAWING_PREVIEW_COLOR}},{id:"gl-draw-line-inactive",type:"line",filter:["all",["==","$type","LineString"],["==","active","false"]],layout:{"line-cap":"round","line-join":"round"},paint:{"line-color":DRAWING_PREVIEW_COLOR,"line-width":1,"line-opacity":.5}},{id:"gl-draw-line-active",type:"line",filter:["all",["==","$type","LineString"],["==","active","true"]],layout:{"line-cap":"round","line-join":"round"},paint:{"line-color":DRAWING_PREVIEW_COLOR,"line-width":1,"line-opacity":.5}}]}),map.addControl(drawRef.current,"top-left"),setDrawInitialized(!0),popupRef.current=new dist_maplibre_gl.Popup({closeButton:!1,closeOnClick:!1});let handleSelect=e=>{var ref,ref1,ref2,ref3,ref4;if(pendingGeometryUpdateRef.current){let{zoneId,geometry}=pendingGeometryUpdateRef.current;pendingGeometryUpdateRef.current=null,onZoneGeometryUpdateRef.current(zoneId,geometry)}let feature=e.features[0];if(feature){let zoneId1=(null===(ref=feature.properties)||void 0===ref?void 0:ref.zoneId)||feature.id,zone=zonesRef.current.find(z=>z._id===zoneId1);if(zone){onZoneSelect(zone);let center=(0,es.Scw)(feature.geometry),coords=center.geometry.coordinates,container=document.createElement("div");null===(ref1=popupRootRef.current)||void 0===ref1||ref1.unmount(),popupRootRef.current=(0,client.createRoot)(container),popupRootRef.current.render((0,jsx_runtime.jsxs)(Box.Z,{display:"flex",alignItems:"center",gap:.5,sx:{maxWidth:220,whiteSpace:"nowrap"},children:[(0,jsx_runtime.jsx)(Typography.Z,{component:"span",noWrap:!0,sx:{overflow:"hidden",textOverflow:"ellipsis",flexShrink:1,minWidth:0},children:zone.name}),(0,jsx_runtime.jsx)(Edit.Z,{sx:{cursor:"pointer",fontSize:20,color:"#4492c6",flexShrink:0},onClick(){var ref;let freshZone=zonesRef.current.find(z=>z._id===zoneId1);freshZone&&onEditZoneRef.current(freshZone),null===(ref=popupRef.current)||void 0===ref||ref.remove()}}),(0,jsx_runtime.jsx)(Delete.Z,{sx:{cursor:"pointer",fontSize:20,color:"#f57c00",flexShrink:0},onClick(){var ref;let freshZone=zonesRef.current.find(z=>z._id===zoneId1);freshZone&&onDeleteZoneRef.current(freshZone),null===(ref=popupRef.current)||void 0===ref||ref.remove()}})]})),null===(ref2=popupRef.current)||void 0===ref2||ref2.setLngLat(coords).setDOMContent(container).addTo(map)}}else onZoneSelect(null),null===(ref3=popupRootRef.current)||void 0===ref3||ref3.unmount(),popupRootRef.current=null,null===(ref4=popupRef.current)||void 0===ref4||ref4.remove()},handleUpdate=e=>{let feature=e.features[0];if(null==feature?void 0:feature.geometry){var ref,ref1;if("Polygon"===feature.geometry.type){let ring=feature.geometry.coordinates[0],revertFeature=()=>{var ref;let originalFeature=featureCollectionRef.current.features.find(f=>{var ref,ref1;return f.id===feature.id||(null===(ref=f.properties)||void 0===ref?void 0:ref.zoneId)===(null===(ref1=feature.properties)||void 0===ref1?void 0:ref1.zoneId)});originalFeature&&drawRef.current&&(drawRef.current.delete(feature.id),drawRef.current.add(originalFeature),drawRef.current.changeMode("simple_select")),null===(ref=onInvalidGeometryRef.current)||void 0===ref||ref.call(onInvalidGeometryRef)};if(!ring||ring.length<4){revertFeature();return}let selfIntersections=(0,es.BbJ)(feature.geometry);if(selfIntersections.features.length>0){revertFeature();return}}let zoneId=(null===(ref=feature.properties)||void 0===ref?void 0:ref.zoneId)||feature.id;zoneId&&(pendingGeometryUpdateRef.current={zoneId,geometry:feature.geometry});let center=(0,es.Scw)(feature.geometry),coords=center.geometry.coordinates;null===(ref1=popupRef.current)||void 0===ref1||ref1.setLngLat(coords)}};map.on("draw.selectionchange",handleSelect),map.on("draw.update",handleUpdate);let handleMapClick=_e=>{if(!drawRef.current)return;let selected=drawRef.current.getSelected();if(!selected||0===selected.features.length){var ref,ref1;onZoneSelect(null),null===(ref=popupRootRef.current)||void 0===ref||ref.unmount(),popupRootRef.current=null,null===(ref1=popupRef.current)||void 0===ref1||ref1.remove()}},handleMapClickDelayed=_e=>{setTimeout(()=>handleMapClick(_e),0)};map.on("click",handleMapClickDelayed),featureCollectionRef.current.features.length>0&&drawRef.current.add(featureCollectionRef.current);let handleWindowMouseUp=()=>{var ref;(null===(ref=drawRef.current)||void 0===ref?void 0:ref.getMode())==="direct_select"&&map.dragPan.enable()};return window.addEventListener("mouseup",handleWindowMouseUp),()=>{var ref,ref1;if(pendingGeometryUpdateRef.current){let{zoneId,geometry}=pendingGeometryUpdateRef.current;
1pendingGeometryUpdateRef.current=null,onZoneGeometryUpdateRef.current(zoneId,geometry)}map.off("draw.selectionchange",handleSelect),map.off("draw.update",handleUpdate),map.off("click",handleMapClickDelayed),window.removeEventListener("mouseup",handleWindowMouseUp),null===(ref=popupRootRef.current)||void 0===ref||ref.unmount(),popupRootRef.current=null,null===(ref1=popupRef.current)||void 0===ref1||ref1.remove(),map&&drawRef.current&&map.hasControl(drawRef.current)&&map.removeControl(drawRef.current)}},[mapLoaded]),(0,react.useEffect)(()=>{var ref;if(!drawInitialized||!drawRef.current||"direct_select"===drawRef.current.getMode())return;drawRef.current.changeMode("simple_select"),drawRef.current.deleteAll(),featureCollectionRef.current.features.length>0&&drawRef.current.add(featureCollectionRef.current);let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();(null==map?void 0:map.getLayer("tempCircleLayer"))&&map.removeLayer("tempCircleLayer"),(null==map?void 0:map.getSource("tempCircle"))&&map.removeSource("tempCircle"),(null==map?void 0:map.getLayer("tempPolygonLayer"))&&map.removeLayer("tempPolygonLayer"),(null==map?void 0:map.getSource("tempPolygon"))&&map.removeSource("tempPolygon"),pendingFeatureIdRef.current=null},[drawInitialized,featureCollection]),(0,react.useEffect)(()=>{var ref;if(null!==pendingGeometry)return;let pendingId=pendingFeatureIdRef.current;if(!pendingId)return;let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();"__pendingCircle"===pendingId?((null==map?void 0:map.getLayer("tempCircleLayer"))&&map.removeLayer("tempCircleLayer"),(null==map?void 0:map.getSource("tempCircle"))&&map.removeSource("tempCircle")):"__pendingPolygon"===pendingId?((null==map?void 0:map.getLayer("tempPolygonLayer"))&&map.removeLayer("tempPolygonLayer"),(null==map?void 0:map.getSource("tempPolygon"))&&map.removeSource("tempPolygon")):drawRef.current&&(drawRef.current.delete(pendingId),drawRef.current.changeMode("simple_select")),pendingFeatureIdRef.current=null},[pendingGeometry]),(0,react.useEffect)(()=>{if(!selectedZoneId||!popupRef.current||!popupRootRef.current)return;let zone=zones.find(z=>z._id===selectedZoneId);if(!zone)return;let container=document.createElement("div");popupRootRef.current.unmount(),popupRootRef.current=(0,client.createRoot)(container),popupRootRef.current.render((0,jsx_runtime.jsxs)(Box.Z,{display:"flex",alignItems:"center",gap:.5,sx:{maxWidth:220,whiteSpace:"nowrap"},children:[(0,jsx_runtime.jsx)(Typography.Z,{component:"span",noWrap:!0,sx:{overflow:"hidden",textOverflow:"ellipsis",flexShrink:1,minWidth:0},children:zone.name}),(0,jsx_runtime.jsx)(Edit.Z,{sx:{cursor:"pointer",fontSize:20,color:"#4492c6",flexShrink:0},onClick(){var ref;let freshZone=zonesRef.current.find(z=>z._id===selectedZoneId);freshZone&&onEditZoneRef.current(freshZone),null===(ref=popupRef.current)||void 0===ref||ref.remove()}}),(0,jsx_runtime.jsx)(Delete.Z,{sx:{cursor:"pointer",fontSize:20,color:"#f57c00",flexShrink:0},onClick(){var ref;let freshZone=zonesRef.current.find(z=>z._id===selectedZoneId);freshZone&&onDeleteZoneRef.current(freshZone),null===(ref=popupRef.current)||void 0===ref||ref.remove()}})]})),popupRef.current.setDOMContent(container)},[zones,selectedZoneId]),(0,react.useEffect)(()=>()=>{cleanupPolygonDrawing(),cleanupCircleDrawing()},[]);let cleanupPolygonDrawing=(0,react.useCallback)(()=>{var ref;let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();map&&(polygonEventHandlersRef.current.handleCreate&&map.off("draw.create",polygonEventHandlersRef.current.handleCreate),polygonEventHandlersRef.current.onContextMenu&&(map.getCanvas().oncontextmenu=null),drawRef.current&&drawRef.current.changeMode("simple_select"),map.getCanvas().style.cursor="",setHighlightPolygon(!1),polygonEventHandlersRef.current={})},[]),cleanupCircleDrawing=(0,react.useCallback)(()=>{var ref;let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();map&&(circleEventHandlersRef.current.onClick&&map.off("click",circleEventHandlersRef.current.onClick),circleEventHandlersRef.current.onMouseMove&&map.off("mousemove",circleEventHandlersRef.current.onMouseMove),circleEventHandlersRef.current.onContextMenu&&window.removeEventListener("contextmenu",cir
1cleEventHandlersRef.current.onContextMenu),map.getLayer("tempCircleLayer")&&map.removeLayer("tempCircleLayer"),map.getSource("tempCircle")&&map.removeSource("tempCircle"),map.getCanvas().style.cursor="",setHighlightCircle(!1),circleEventHandlersRef.current={})},[]),drawAPolygon=(0,react.useCallback)(()=>{var ref;cleanupCircleDrawing(),cleanupPolygonDrawing();let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();if(!map||!drawRef.current)return;setHighlightPolygon(!0),setHighlightCircle(!1);let handleCreate=e=>{let feature=e.features[0];(null==feature?void 0:feature.geometry)&&(drawRef.current&&feature.id&&drawRef.current.delete(feature.id),map&&(map.getLayer("tempPolygonLayer")&&map.removeLayer("tempPolygonLayer"),map.getSource("tempPolygon")&&map.removeSource("tempPolygon"),map.addSource("tempPolygon",{type:"geojson",data:{type:"Feature",geometry:feature.geometry,properties:{}}}),map.addLayer({id:"tempPolygonLayer",type:"fill",source:"tempPolygon",paint:{"fill-color":"#F57C00","fill-opacity":.4}})),pendingFeatureIdRef.current="__pendingPolygon",onDrawComplete(feature.geometry)),map&&(map.off("draw.create",handleCreate),map.getCanvas().style.cursor="",setHighlightPolygon(!1))};polygonEventHandlersRef.current.handleCreate=handleCreate;let onContextMenu=()=>{var ref;null===(ref=drawRef.current)||void 0===ref||ref.changeMode("simple_select"),map&&(map.getCanvas().style.cursor="",setHighlightPolygon(!1),map.getCanvas().oncontextmenu=null,map.off("draw.create",handleCreate))};polygonEventHandlersRef.current.onContextMenu=onContextMenu,drawRef.current.changeMode("draw_polygon"),map.getCanvas().style.cursor="crosshair",map.getCanvas().oncontextmenu=onContextMenu,map.on("draw.create",handleCreate)},[cleanupCircleDrawing,cleanupPolygonDrawing,onDrawComplete]),drawACircle=(0,react.useCallback)(()=>{var ref;cleanupPolygonDrawing(),cleanupCircleDrawing();let map=null===(ref=mapRef.current)||void 0===ref?void 0:ref.getMap();if(!map||!drawRef.current)return;drawRef.current.changeMode("simple_select"),setHighlightCircle(!0),setHighlightPolygon(!1);let center=null,isDrawing=!1,onContextMenu=()=>{map&&(map.off("mousemove",onMouseMove),map.off("click",onClick),map.getCanvas().style.cursor="",map.getLayer("tempCircleLayer")&&map.removeLayer("tempCircleLayer"),map.getSource("tempCircle")&&map.removeSource("tempCircle"),setHighlightCircle(!1)),isDrawing=!1,window.removeEventListener("contextmenu",onContextMenu)};circleEventHandlersRef.current.onContextMenu=onContextMenu,window.addEventListener("contextmenu",onContextMenu);let onMouseMove=e=>{if(!isDrawing||!center)return;let endPoint=[e.lngLat.lng,e.lngLat.lat],radius=(0,es.TE$)((0,es.xmu)(center),(0,es.xmu)(endPoint),{units:CIRCLE_DRAW_UNITS}),tempCircle=(0,es.Xwo)(center,radius,{steps:36,units:CIRCLE_DRAW_UNITS,properties:{}});if(map){let tempCircleSource=map.getSource("tempCircle");tempCircleSource?tempCircleSource.setData(tempCircle):(map.addSource("tempCircle",{type:"geojson",data:tempCircle}),map.addLayer({id:"tempCircleLayer",type:"fill",source:"tempCircle",paint:{"fill-color":"#F57C00","fill-opacity":.4}}))}},onClick=e=>{if(isDrawing){isDrawing=!1,map.off("mousemove",onMouseMove);let endPoint=[e.lngLat.lng,e.lngLat.lat],radius=(0,es.TE$)((0,es.xmu)(center),(0,es.xmu)(endPoint),{units:CIRCLE_DRAW_UNITS});if(radius>0){let circleFeature=(0,es.Xwo)(center,radius,{steps:36,units:CIRCLE_DRAW_UNITS,properties:{}});pendingFeatureIdRef.current="__pendingCircle",onDrawComplete(circleFeature.geometry)}else map.getLayer("tempCircleLayer")&&map.removeLayer("tempCircleLayer"),map.getSource("tempCircle")&&map.removeSource("tempCircle");map.getCanvas().style.cursor="",map.off("click",onClick),setHighlightCircle(!1),window.removeEventListener("contextmenu",onContextMenu)}else center=[e.lngLat.lng,e.lngLat.lat],isDrawing=!0,map.on("mousemove",onMouseMove)};circleEventHandlersRef.current.onMouseMove=onMouseMove,circleEventHandlersRef.current.onClick=onClick,map.getCanvas().style.cursor="crosshair",map.on("click",onClick)},[cleanupPolygonDrawing,cleanupCircleDrawing,onDrawComplete]);return(0,react.useEffect)(()=>{var ref;if(!selectedZoneId||!mapRef.current)return;let zone=zones.find(z=>z._id===selectedZoneId);if(!(null==zone?void 0:null===(ref=zone.geometry)||void 0===ref?void 0:ref.coordinates))return;let ring=zone.geometry.coordinates[0];if(!ring)return;let minLng=1/0,maxLng=-1/0,minLat=1/0,maxLat=-1/0;for(let coord of ring){let[lng,lat]=coord;lng<minLng&&(minLng=lng),lng>maxLng&&(maxLng=lng),lat<minLat&&(minLat=lat),lat>maxLat&&(maxLat=lat)}mapRef.current.fitBounds([[minLng,minLat],[maxLng,maxLat]],{padding:80,duration:500})},[selectedZoneId,fitBoundsToken,zones]),(0,react.useEffect)(()=>
1{if(!selectedZoneId){var ref;null===(ref=popupRef.current)||void 0===ref||ref.remove()}},[selectedZoneId]),(0,jsx_runtime.jsxs)(Box.Z,{sx:{position:"relative",width:"100%",height:"calc(100vh - 68px)"},children:[(0,jsx_runtime.jsx)(exports_maplibre.ZP,{ref:mapRef,initialViewState:{longitude:defaultCoords[1],latitude:defaultCoords[0],zoom:map.V},style:{width:"100%",height:"100%"},mapStyle:mapStyle,onLoad:()=>setMapLoaded(!0),children:(0,jsx_runtime.jsx)(exports_maplibre.Pv,{position:"top-right"})}),(0,jsx_runtime.jsx)(Box.Z,{component:Paper.Z,sx:{position:"absolute",top:10,left:10,zIndex:10},children:(0,jsx_runtime.jsxs)(Box.Z,{display:"flex",flexDirection:"column",gap:1,pl:1.5,children:[(0,jsx_runtime.jsxs)(Box.Z,{display:"flex",justifyContent:"space-between",alignItems:"center",gap:2,children:[(0,jsx_runtime.jsx)(Typography.Z,{variant:"caption",children:(0,i18next.t)("tracker.details.createPolygon")}),(0,jsx_runtime.jsx)(Tooltip.Z,{title:(0,i18next.t)("tracker.details.drawAPolygon"),placement:"right",children:(0,jsx_runtime.jsx)(IconButton.Z,{onClick:drawAPolygon,sx:{backgroundColor:highlightPolygon?"primary.main":"transparent",color:highlightPolygon?"primary.contrastText":"inherit","&:hover":{backgroundColor:highlightPolygon?"primary.dark":void 0}},children:(0,jsx_runtime.jsx)(InsightsOutlined.Z,{})})})]}),(0,jsx_runtime.jsxs)(Box.Z,{display:"flex",justifyContent:"space-between",alignItems:"center",gap:2,children:[(0,jsx_runtime.jsx)(Typography.Z,{variant:"caption",children:(0,i18next.t)("tracker.details.createCircle")}),(0,jsx_runtime.jsx)(Tooltip.Z,{title:(0,i18next.t)("tracker.details.drawACircle"),placement:"right",children:(0,jsx_runtime.jsx)(IconButton.Z,{onClick:drawACircle,sx:{backgroundColor:highlightCircle?"primary.main":"transparent",color:highlightCircle?"primary.contrastText":"inherit","&:hover":{backgroundColor:highlightCircle?"primary.dark":void 0}},children:(0,jsx_runtime.jsx)(CircleOutlined.Z,{})})})]}),(0,jsx_runtime.jsx)(Divider.Z,{sx:{my:.5}}),(0,jsx_runtime.jsx)(BulkMapAddressesButton,{})]})}),zoneTypes.length>0&&(0,jsx_runtime.jsx)(ZoneTypeLayers,{zoneTypes:zoneTypes,hiddenZoneTypeIds:hiddenZoneTypeIds,onZoneTypeToggle:onZoneTypeToggle})]})},ZoneTypeLayers=param=>{let{zoneTypes,hiddenZoneTypeIds,onZoneTypeToggle}=param,[expanded,setExpanded]=(0,react.useState)(!1),[moreOpen,setMoreOpen]=(0,react.useState)(!1),[visibleCount,setVisibleCount]=(0,react.useState)(10),visibleTypes=zoneTypes.slice(0,4),hasMore=zoneTypes.length>4,handleOpenMore=()=>{setVisibleCount(10),setMoreOpen(!0)},handleScroll=e=>{let el=e.currentTarget;el.scrollTop+el.clientHeight>=el.scrollHeight-10&&setVisibleCount(prev=>Math.min(prev+10,zoneTypes.length))};return(0,jsx_runtime.jsxs)(jsx_runtime.Fragment,{children:[(0,jsx_runtime.jsx)(Box.Z,{component:Paper.Z,elevation:2,onMouseEnter:()=>setExpanded(!0),onMouseLeave:()=>setExpanded(!1),sx:{position:"absolute",bottom:10,left:10,zIndex:10,borderRadius:2,overflow:"hidden",transition:"all 0.3s ease"},children:expanded?(0,jsx_runtime.jsxs)(Box.Z,{display:"flex",alignItems:"center",gap:.5,px:1,py:.75,children:[visibleTypes.map(zt=>{let isVisible=!hiddenZoneTypeIds.has(zt.name),color=zt.color||DEFAULT_ZONE_COLOR;return(0,jsx_runtime.jsxs)(Box.Z,{onClick:()=>onZoneTypeToggle(zt.name),sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:.5,cursor:"pointer",px:1,py:.5,borderRadius:1.5,border:isVisible?"2px solid ".concat(color):"2px solid transparent",bgcolor:isVisible?"".concat(color,"15"):"transparent",transition:"all 0.2s","&:hover":{bgcolor:"".concat(color,"25")},minWidth:56},children:[(0,jsx_runtime.jsx)(Box.Z,{sx:{width:20,height:20,borderRadius:"50%",bgcolor:isVisible?color:"transparent",border:"2px solid ".concat(color),transition:"background-color 0.2s"}}),(0,jsx_runtime.jsx)(Typography.Z,{variant:"caption",sx:{fontSize:"0.65rem",opacity:isVisible?1:.5,userSelect:"none",whiteSpace:"nowrap",maxWidth:60,overflow:"hidden",textOverflow:"ellipsis",color:"text.primary"},children:zt.name})]},zt.name)}),hasMore&&(0,jsx_runtime.jsx)(Box.Z,{onClick:handleOpenMore,sx:{display:"flex",flexDirection:"column",alignItems:"center",gap:.5,cursor:"pointer",px:1,py:.5,borderRadius:1.5,"&:hover":{bgcolor:"action.hover"},minWidth:56},children:(0,jsx_runtime.jsx)(Typography.Z,{variant:"caption",fontWeight:600,children:(0,i18next.t)("common.more")})})]}):(0,jsx_runtime.jsx)(Box.Z,{sx:{width:48,height:48,display:"flex",alignItems:"center",justifyContent:"center",cursor:"pointer"},children:(0,jsx_runtime.jsx)(LayersOutlined,{})})}),(0,jsx_runtime.jsx)(Modal.Z,{open:moreOpen,onClose:()=>setMoreOpen(!1),children:(0,jsx_runtime.jsxs)(Box.Z,{sx:{position:"absolute",bottom:60,left:10,bgcolor:"background.paper",borderRadius:2,boxShadow:24,p:1.5,minWidth:220},children:[(0,jsx_runtime.jsx)(Typography.Z,{variant:"subtitle2",sx:{px:1,pb:1,color:"text.primary"},children:(0,i18next.t)("zones.formLabels.zoneTypes")}),(0,jsx_runtime.jsx)(Box.Z,{onScroll:handleScroll,sx:{maxHeight:400,overflowY:"auto"},children:zoneTypes.slice(0,visibleCount).map(zt=>{let isVisible=!hiddenZoneTypeIds.has(zt.name),color=zt.color||DEFAULT_ZONE_COLOR;return(0,jsx_runtime.jsxs)(Box.Z,{onClick:()=>onZoneTypeToggle(zt.name),sx:{display:"flex",alignItems:"center",gap:1.5,px:1,py:.75,cursor:"pointer",borderRadius:1,border:isVisible?"2px solid ".concat(color):"2px solid transparent",bgcolor:isVisible?"".concat(color,"15"):"transparent",transition:"all 0.2s","&:hover":{bgcolor:"".concat(color,"25")},mb:.5},children:[(0,jsx_runtime.jsx)(Box.Z,{sx:{width:24,height:24,borderRadius:"50%",bgcolor:isVisible?color:"transparent",border:"2px s
1olid ".concat(color),flexShrink:0,transition:"background-color 0.2s"}}),(0,jsx_runtime.jsx)(Typography.Z,{variant:"body2",sx:{opacity:isVisible?1:.5,userSelect:"none",color:"text.primary"},children:zt.name})]},zt.name)})})]})})]})};var zones_ZoneMapView=ZoneMapView},38742:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{V:function(){return DEFAULT_MAP_ZOOM_LEVEL}});let DEFAULT_MAP_ZOOM_LEVEL=13},87217:function(__unused_webpack_module,__webpack_exports__,__webpack_require__){__webpack_require__.d(__webpack_exports__,{M:function(){return MAP_STYLES},q:function(){return apiKey}});var _envConfig__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__(56173);let apiKey=_envConfig__WEBPACK_IMPORTED_MODULE_0__.O.amazonLocationServicesApiKey,MAP_STYLES={streetView:"https://maps.geo.ap-southeast-2.amazonaws.com/maps/v0/maps/allotrac-truck-map-vector/style-descriptor?key=".concat(apiKey),satelliteView:"https://maps.geo.ap-southeast-2.amazonaws.com/maps/v0/maps/allotrac-hybrid-map/style-descriptor?key=".concat(apiKey)}},97613:function(__unused_webpack___webpack_module__,__webpack_exports__,__webpack_require__){var _utils_createSvgIcon_js__WEBPACK_IMPORTED_MODULE_1__=__webpack_require__(15295),react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__=__webpack_require__(85893);__webpack_exports__.Z=(0,_utils_createSvgIcon_js__WEBPACK_IMPORTED_MODULE_1__.Z)((0,react_jsx_runtime__WEBPACK_IMPORTED_MODULE_0__.jsx)("path",{d:"m20.5 3-.16.03L15 5.1 9 3 3.36 4.9c-.21.07-.36.25-.36.48V20.5c0 .28.22.5.5.5l.16-.03L9 18.9l6 2.1 5.64-1.9c.21-.07.36-.25.36-.48V3.5c0-.28-.22-.5-.5-.5M15 19l-6-2.11V5l6 2.11z"}),"Map")}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.