@opengeoweb/warnings 14.2.2 → 14.3.0

package/index.esm.js

@@ -2,7 +2,7 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useDispatch, useSelector } from 'react-redux';
 import { Polygons, ExitDomain, Share, Edit, Delete, CoastalEvent, TemperatureLow, TemperatureHigh, Rain, Snow, Lightning, Fog, Wind, Thunderstorm, SevereMountainWaves, VulcanicEruption, Haze, FreezingPrecipitation, ModerateAircraftIcing, SevereAircraftIcing, ModerateTurbulence, SevereTurbulence, SandStorm, RadioactiveMaterials, DrawPolygon, Visibility, Add, ArrowUpCompact, ArrowDownCompact, breakpoints, DragHandle, Info, Copy, Update, Cancel, Success, Expire, Remove, Options, ChevronDown, ChevronUp, Close, Clock } from '@opengeoweb/theme';
 import { uiTypes, uiActions, getSingularDrawtoolDrawLayerId, drawingToolSelectors, layerSelectors, uiSelectors, drawingToolActions, layerActions, mapListener, layersListener, drawingToolListener, syncGroupsListener, openlayersListener, syncGroupsReducer, drawingToolReducer, uiReducer, layerReducer, mapReducer, useSetupDialog, genericSelectors, useUpdateSharedData, genericActions, selectorMemoizationOptions } from '@opengeoweb/store';
-import { defaultPolygon, emptyGeoJSON, MapControlButton, getIcon, rewindGeometry, getGeoJSONPropertyValue, currentlySupportedDrawModes, defaultLayers, viewUtils, OpenLayersMapView, MapControls, OpenLayersZoomControl, OpenLayersLayer, OpenLayersFeatureLayer, genericOpenLayersFeatureStyle } from '@opengeoweb/webmap-react';
+import { defaultPolygon, getDrawModeIdFromSelectionType, currentlySupportedDrawModes, emptyGeoJSON, MapControlButton, defaultSmoothLine, defaultOval, defaultBox, defaultLocation, getIcon, defaultCircle, defaultSquare, defaultLineString, defaultPoint, rewindGeometry, getGeoJSONPropertyValue, defaultLayers, viewUtils, OpenLayersMapView, MapControls, OpenLayersZoomControl, OpenLayersLayer, OpenLayersFeatureLayer, genericOpenLayersFeatureStyle, FEATURE_DRAW_FILL_COLOR, FEATURE_DRAW_SECONDARY_FILL_COLOR } from '@opengeoweb/webmap-react';
 import { SHARED_NAMESPACE, useConfirmationDialog, dateUtils, ToggleMenu, calculateStartSize, ToolContainerDraggable, AlertBanner, sessionStorageProvider, ConfirmationDialog, usePrevious, CustomIconButton, usePreventBrowserClose, CustomTooltip, Avatar, getInitials, SwitchButton, FilterChip, TooltipSelect, LastUpdateTime, CustomToggleButton, Filter, StatusTag, FilterOption, getAxiosErrorMessage, CustomDialog, ConfirmationButtons, ErrorBoundary } from '@opengeoweb/shared';
 import { createEntityAdapter, createSlice, createSelector, createListenerMiddleware, current, combineReducers, configureStore } from '@reduxjs/toolkit';
 import { defaultBbox } from '@opengeoweb/core';
@@ -1565,7 +1565,7 @@ var useObjectDrawDialogAction = function useObjectDrawDialogAction(_ref5) {
       geoJSONLayerId: currentDrawLayerId
     }));
     // activate default draw mode
-    if (!drawDialogActiveDrawModeId && !isDrawDialogOpen) {
+    if (!drawDialogActiveDrawModeId && !isDrawDialogOpen && !newGeoJSON) {
       dispatch(drawingToolActions.changeDrawToolMode({
         drawToolId: drawingDialogType,
         drawModeId: defaultPolygon.drawModeId
@@ -1596,10 +1596,18 @@ var useObjectDrawDialogAction = function useObjectDrawDialogAction(_ref5) {
       }));
     }
     if (newGeoJSON) {
+      var _newGeoJSON$features$;
       dispatch(layerActions.layerChangeGeojson({
         layerId: currentDrawLayerId,
         geojson: newGeoJSON
       }));
+      // select correct drawTool for selected object
+      var type = (_newGeoJSON$features$ = newGeoJSON.features[0].properties) == null ? void 0 : _newGeoJSON$features$.selectionType;
+      var drawModeId = getDrawModeIdFromSelectionType(type, currentlySupportedDrawModes);
+      dispatch(drawingToolActions.changeDrawToolMode({
+        drawToolId: drawingDialogType,
+        drawModeId: drawModeId
+      }));
     }
   };
   var _useCloseDrawDialog = useCloseDrawDialog({
@@ -3839,7 +3847,7 @@ var DEFAULT_DRAW_TOOL_POSITION = {
   left: 50
 };
 var DEFAULT_DRAW_TOOL_MIN_SIZE = {
-  width: 160,
+  width: 312,
   height: 300
 };
 var DrawingTool = function DrawingTool(_ref) {
@@ -3960,7 +3968,39 @@ var useFormDirty = function useFormDirty(_ref) {
 };
 
 var opacityOptions = [100, 90, 80, 70, 60, 50, 40, 30, 20, 10, 0];
+var secondaryDrawToolKeys = [defaultSmoothLine.drawModeId, defaultOval.drawModeId, defaultBox.drawModeId, defaultLocation.drawModeId];
+// Utility to determine if the secondary draw mode button should be shown
+var getButtonStyle = function getButtonStyle(mode, activeDrawModeId, geoJSONDrawMode) {
+  if (mode.drawModeId === defaultOval.drawModeId && (activeDrawModeId === defaultCircle.drawModeId || activeDrawModeId === defaultOval.drawModeId || geoJSONDrawMode === defaultOval.drawModeId)) {
+    return {
+      display: 'inline-flex',
+      marginLeft: 15
+    };
+  }
+  if (mode.drawModeId === defaultBox.drawModeId && (activeDrawModeId === defaultSquare.drawModeId || activeDrawModeId === defaultBox.drawModeId || geoJSONDrawMode === defaultBox.drawModeId)) {
+    return {
+      display: 'inline-flex',
+      marginLeft: 20
+    };
+  }
+  if (mode.drawModeId === defaultSmoothLine.drawModeId && (activeDrawModeId === defaultLineString.drawModeId || activeDrawModeId === defaultSmoothLine.drawModeId || geoJSONDrawMode === defaultSmoothLine.drawModeId)) {
+    return {
+      display: 'inline-flex',
+      marginLeft: 5
+    };
+  }
+  if (mode.drawModeId === defaultLocation.drawModeId && (activeDrawModeId === defaultPoint.drawModeId || activeDrawModeId === defaultLocation.drawModeId || geoJSONDrawMode === defaultLocation.drawModeId)) {
+    return {
+      display: 'inline-flex',
+      marginLeft: 25
+    };
+  }
+  return {
+    display: 'none'
+  };
+};
 var DrawingToolFormContentsNoMemo = function DrawingToolFormContentsNoMemo(_ref) {
+  var _geoJSON$features;
   var isLoading = _ref.isLoading,
     dialogError = _ref.dialogError,
     id = _ref.id,
@@ -3973,10 +4013,18 @@ var DrawingToolFormContentsNoMemo = function DrawingToolFormContentsNoMemo(_ref)
     onChangeOpacity = _ref.onChangeOpacity,
     onBlurName = _ref.onBlurName,
     opacity = _ref.opacity,
-    onSubmit = _ref.onSubmit;
+    onSubmit = _ref.onSubmit,
+    geoJSON = _ref.geoJSON;
   var _useWarningsTranslati = useWarningsTranslation(),
     t = _useWarningsTranslati.t;
   var hasErrors = Object.keys(errors).length > 0;
+  var drawModesPrimary = drawModes.filter(function (mode) {
+    return !secondaryDrawToolKeys.includes(mode.drawModeId);
+  });
+  var drawModesSecondary = drawModes.filter(function (mode) {
+    return secondaryDrawToolKeys.includes(mode.drawModeId);
+  });
+  var geoJSONDrawMode = getDrawModeIdFromSelectionType(geoJSON == null || (_geoJSON$features = geoJSON.features) == null || (_geoJSON$features = _geoJSON$features[0]) == null || (_geoJSON$features = _geoJSON$features.properties) == null ? void 0 : _geoJSON$features.selectionType, drawModes);
   return jsxs(Fragment, {
     children: [jsxs(Box, {
       sx: {
@@ -4005,7 +4053,7 @@ var DrawingToolFormContentsNoMemo = function DrawingToolFormContentsNoMemo(_ref)
         }), jsx(Grid, {
           container: true,
           children: jsxs(Grid, {
-            children: [drawModes.map(function (mode) {
+            children: [drawModesPrimary.map(function (mode) {
               return jsx(CustomIconButton, {
                 variant: "tool",
                 tooltipTitle: mode.title,
@@ -4022,6 +4070,25 @@ var DrawingToolFormContentsNoMemo = function DrawingToolFormContentsNoMemo(_ref)
                 size: "medium",
                 children: getIcon(mode.selectionType)
               }, mode.drawModeId);
+            }), drawModesSecondary.length > 0 && jsx(Box, {
+              children: drawModesSecondary.map(function (mode) {
+                return jsx(CustomIconButton, {
+                  variant: "tool",
+                  tooltipTitle: mode.title,
+                  isSelected: mode.isSelectable && activeDrawModeId === mode.drawModeId,
+                  onClick: function onClick() {
+                    return onChangeDrawMode(mode);
+                  },
+                  sx: Object.assign({
+                    marginRight: 1,
+                    marginBottom: 1
+                  }, getButtonStyle(mode, activeDrawModeId, geoJSONDrawMode)),
+                  "data-testid": mode.drawModeId,
+                  disabled: isLoading,
+                  size: "medium",
+                  children: getIcon(mode.selectionType)
+                }, mode.drawModeId);
+              })
             }), isInEditMode && jsx(Typography, {
               component: "span",
               sx: {
@@ -4230,7 +4297,8 @@ var DrawingToolForm = function DrawingToolForm(_ref) {
     onChangeOpacity: onChangeOpacity,
     onBlurName: onBlurName,
     opacity: opacity,
-    onSubmit: handleSubmit(onSubmit)
+    onSubmit: handleSubmit(onSubmit),
+    geoJSON: geoJSON
   });
 };
 var Wrapper = function Wrapper(props) {
@@ -8259,9 +8327,9 @@ isAviationWarning) {
         var _feature$properties$i, _feature$properties;
         var isStartGeometry = (_feature$properties$i = (_feature$properties = feature.properties) == null ? void 0 : _feature$properties.isStartGeometry) != null ? _feature$properties$i : false;
         colors = {
-          color: isStartGeometry ? '#E27000' : '#800080',
+          color: isStartGeometry ? FEATURE_DRAW_FILL_COLOR : FEATURE_DRAW_SECONDARY_FILL_COLOR,
           // Orange for start, purple for end
-          borderColor: isStartGeometry ? '#FEAE02' : '#4B0082'
+          borderColor: isStartGeometry ? FEATURE_DRAW_FILL_COLOR : FEATURE_DRAW_SECONDARY_FILL_COLOR
         };
       } else if (level) {
         // Public warning: use LevelColors if level is defined
@@ -9788,14 +9856,14 @@ var getFilterParams = function getFilterParams(areas, searchQuery) {
     search: searchQuery
   });
 };
-var useAreaRequest = function useAreaRequest() {
+var useAreaRequest = function useAreaRequest(isDialogOpen) {
   var _useState = useState([]),
     areas = _useState[0],
     setAreas = _useState[1];
   var _useState2 = useState(undefined),
     fetchAreaError = _useState2[0],
     setFetchAreaError = _useState2[1];
-  var _useAreaKeywords = useAreaKeywords(),
+  var _useAreaKeywords = useAreaKeywords(isDialogOpen),
     areaKeywords = _useAreaKeywords.data,
     isAreasLoading = _useAreaKeywords.isLoading,
     error = _useAreaKeywords.error,
@@ -9854,7 +9922,7 @@ var AreaObjectLoaderConnect = function AreaObjectLoaderConnect(_ref) {
   var _useState5 = useState(''),
     searchQuery = _useState5[0],
     setSearchQuery = _useState5[1];
-  var _useAreaRequest = useAreaRequest(),
+  var _useAreaRequest = useAreaRequest(isDialogOpen),
     areas = _useAreaRequest.areas,
     fetchAreaKeywords = _useAreaRequest.fetchAreaKeywords,
     fetchAreaError = _useAreaRequest.fetchAreaError,
@@ -9875,7 +9943,7 @@ var AreaObjectLoaderConnect = function AreaObjectLoaderConnect(_ref) {
   var isAviationWarning = (selectedWarning == null ? void 0 : selectedWarning.warningDetail.level) === 'SIG' || (selectedWarning == null ? void 0 : selectedWarning.warningDetail.level) === 'AIR';
   var styledGeoJSON = warningLevelFeatureColors(selectedWarning == null || (_selectedWarning$warn = selectedWarning.warningDetail) == null ? void 0 : _selectedWarning$warn.level, selectedWarning == null || (_selectedWarning$warn2 = selectedWarning.warningDetail) == null || (_selectedWarning$warn2 = _selectedWarning$warn2.areas) == null || (_selectedWarning$warn2 = _selectedWarning$warn2[0]) == null ? void 0 : _selectedWarning$warn2.geoJSON, isAviationWarning);
   // Inject warning level into feature properties to be read in OlMapViewConnect
-  if (styledGeoJSON && (_styledGeoJSON$featur = styledGeoJSON.features) != null && _styledGeoJSON$featur.length) {
+  if (styledGeoJSON != null && (_styledGeoJSON$featur = styledGeoJSON.features) != null && _styledGeoJSON$featur.length) {
     styledGeoJSON.features.forEach(function (feature) {
       // eslint-disable-next-line no-param-reassign
       feature.properties = Object.assign({}, feature.properties, {
@@ -9885,10 +9953,10 @@ var AreaObjectLoaderConnect = function AreaObjectLoaderConnect(_ref) {
     });
   }
   var sharedData = React__default.useMemo(function () {
-    var _selectedWarning$warn3;
+    var _selectedWarning$warn3, _selectedWarning$warn4;
     return {
       features: [{
-        id: (selectedWarning == null || (_selectedWarning$warn3 = selectedWarning.warningDetail.areas) == null || (_selectedWarning$warn3 = _selectedWarning$warn3[0]) == null ? void 0 : _selectedWarning$warn3.areaId) || '',
+        id: (_selectedWarning$warn3 = selectedWarning == null || (_selectedWarning$warn4 = selectedWarning.warningDetail.areas) == null || (_selectedWarning$warn4 = _selectedWarning$warn4[0]) == null ? void 0 : _selectedWarning$warn4.areaId) != null ? _selectedWarning$warn3 : '',
         geoJSON: styledGeoJSON
       }]
     };
@@ -9995,8 +10063,8 @@ var AreaObjectLoaderConnect = function AreaObjectLoaderConnect(_ref) {
       left: 50
     },
     drawingListItems: items,
-    error: drawingError || fetchAreaError,
-    isLoading: loading || isAreasLoading,
+    error: drawingError != null ? drawingError : fetchAreaError,
+    isLoading: loading != null ? loading : isAreasLoading,
     onClickFilterChip: onClickFilterChip,
     searchQuery: searchQuery,
     onSearch: onSearch,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/warnings",
-  "version": "14.2.2",
+  "version": "14.3.0",
   "description": "GeoWeb warinings library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {
@@ -8,25 +8,25 @@
     "url": "git@gitlab.com:opengeoweb/opengeoweb.git"
   },
   "dependencies": {
-    "@opengeoweb/api": "14.2.2",
-    "@opengeoweb/shared": "14.2.2",
-    "@opengeoweb/store": "14.2.2",
-    "@opengeoweb/webmap-react": "14.2.2",
+    "@opengeoweb/api": "14.3.0",
+    "@opengeoweb/shared": "14.3.0",
+    "@opengeoweb/store": "14.3.0",
+    "@opengeoweb/webmap-react": "14.3.0",
     "@tanstack/react-query": "^5.85.5",
     "react-redux": "^9.2.0",
-    "@opengeoweb/theme": "14.2.2",
-    "@opengeoweb/form-fields": "14.2.2",
+    "@opengeoweb/theme": "14.3.0",
+    "@opengeoweb/form-fields": "14.3.0",
     "react-hook-form": "^7.50.1",
     "lodash": "^4.17.21",
     "@reduxjs/toolkit": "^2.6.1",
-    "@opengeoweb/snackbar": "14.2.2",
+    "@opengeoweb/snackbar": "14.3.0",
     "react-window": "^1.8.10",
     "react-virtualized-auto-sizer": "^1.0.20",
     "axios": "^1.7.7",
-    "@opengeoweb/core": "14.2.2",
-    "@opengeoweb/webmap": "14.2.2",
-    "@opengeoweb/authentication": "14.2.2",
-    "@opengeoweb/sigmet-airmet": "14.2.2",
+    "@opengeoweb/core": "14.3.0",
+    "@opengeoweb/webmap": "14.3.0",
+    "@opengeoweb/authentication": "14.3.0",
+    "@opengeoweb/sigmet-airmet": "14.3.0",
     "react-i18next": "^15.1.1",
     "i18next": "^25.0.1",
     "@mui/material": "^7.0.1",

package/src/lib/components/AreaObjectLoader/AreaObjectLoaderConnect.d.ts

@@ -1,5 +1,5 @@
-import { uiTypes } from '@opengeoweb/store';
 import React from 'react';
+import type { uiTypes } from '@opengeoweb/store';
 export declare const AreaObjectLoaderConnect: React.FC<{
     bounds?: string;
     source?: uiTypes.Source;

package/src/lib/components/DrawingToolForm/DrawingToolFormContents.d.ts

@@ -22,6 +22,7 @@ export interface DrawingToolFormContentsProps {
     onChangeOpacity: (event: SelectChangeEvent<unknown>) => void;
     onBlurName: (event: React.FocusEvent<HTMLInputElement>) => void;
     onSubmit: () => void;
+    geoJSON?: GeoJSON.FeatureCollection;
 }
 export declare const DrawingToolFormContentsNoMemo: React.FC<DrawingToolFormContentsProps>;
 export declare const DrawingToolFormContents: React.NamedExoticComponent<DrawingToolFormContentsProps>;