@opengeoweb/warnings 9.2.0 → 9.3.0

package/index.esm.js

@@ -7,7 +7,7 @@ import { emptyGeoJSON, MapControlButton, getGeoJSONPropertyValue, getIcon, rewin
 import { useConfirmationDialog, dateUtils, ToggleMenu, calculateStartSize, ToolContainerDraggable, AlertBanner, ConfirmationDialog, getAxiosErrorMessage, CustomIconButton, usePrevious, SwitchButton, StatusTag, ErrorBoundary, isAxiosError } from '@opengeoweb/shared';
 import { snackbarActions } from '@opengeoweb/snackbar';
 import { styled, Box, Typography, ListItem, Grid, Paper, ListItemButton, Stack, LinearProgress, Button, FormHelperText, MenuItem, Tabs, Tab, FormControl, Card, CardContent, ListItemIcon, CircularProgress, List } from '@mui/material';
-import { getApi, createApiInstance, createNonAuthApiInstance, createFakeApiInstance, ApiProvider, useApiContext, useApi } from '@opengeoweb/api';
+import { getApi, createApiInstance, createNonAuthApiInstance, createFakeApiInstance, ApiProvider } from '@opengeoweb/api';
 import { ReactHookFormProvider, defaultFormOptions, ReactHookFormHiddenInput, isValidGeoJsonCoordinates, ReactHookFormSelect, ReactHookFormTextField, useDraftFormHelpers, errorMessages, ReactHookFormDateTime, isValidDate, isXHoursBefore, isXHoursAfter, isEmpty } from '@opengeoweb/form-fields';
 import { isAxiosError as isAxiosError$1 } from 'axios';
 
@@ -2921,9 +2921,9 @@ var drawAdapter = createEntityAdapter({
     return draw.drawingInstanceId;
   }
 });
-var initialState$1 = drawAdapter.getInitialState();
-var slice$1 = createSlice({
-  initialState: initialState$1,
+var initialState$2 = drawAdapter.getInitialState();
+var slice$2 = createSlice({
+  initialState: initialState$2,
   name: 'drawingForm',
   reducers: {
     setDrawValues: function setDrawValues(draft, action) {
@@ -2987,8 +2987,8 @@ var slice$1 = createSlice({
     });
   }
 });
-var reducer$1 = slice$1.reducer;
-var drawActions = slice$1.actions;
+var reducer$2 = slice$2.reducer;
+var drawActions = slice$2.actions;
 
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -5247,57 +5247,69 @@ var publicWarningDialogType = uiTypes.DialogTypes.PublicWarnings;
  * Copyright 2023 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
  * Copyright 2023 - Finnish Meteorological Institute (FMI)
  * */
-var initialState = {};
-var slice = createSlice({
-  initialState: initialState,
+var initialState$1 = {};
+var slice$1 = createSlice({
+  initialState: initialState$1,
   name: 'publicWarningForm',
   reducers: {
     setFormValues: function setFormValues(draft, action) {
       var _action$payload = action.payload,
         object = _action$payload.object,
-        publicWarningDetail = _action$payload.publicWarningDetail;
+        publicWarningDetail = _action$payload.publicWarningDetail,
+        formState = _action$payload.formState;
       if (object) {
         draft.object = object;
       }
       if (publicWarningDetail) {
         draft.publicWarningDetail = publicWarningDetail;
       }
+      if (formState !== undefined) {
+        draft.formState = formState;
+      }
     },
     openPublicWarningFormDialog: function openPublicWarningFormDialog(draft, action) {
       var _action$payload2 = action.payload,
         object = _action$payload2.object,
-        publicWarningDetail = _action$payload2.publicWarningDetail;
+        publicWarningDetail = _action$payload2.publicWarningDetail,
+        _action$payload2$form = _action$payload2.formState,
+        formState = _action$payload2$form === void 0 ? '' : _action$payload2$form,
+        status = _action$payload2.status;
       draft.object = object;
       draft.publicWarningDetail = publicWarningDetail;
       draft.selectedPublicWarningId = publicWarningDetail === null || publicWarningDetail === void 0 ? void 0 : publicWarningDetail.id;
+      draft.formState = formState;
+      draft.status = status;
     },
     // publish warning
     publishWarning: function publishWarning(draft,
     // eslint-disable-next-line no-unused-vars
     action) {
-      draft.formAction = 'publishing';
+      draft.formState = 'publishing';
       draft.error = '';
     },
     publishWarningSuccess: function publishWarningSuccess(draft, action) {
       var publicWarning = action.payload.publicWarning;
       draft.publicWarningDetail = publicWarning.warningDetail;
-      draft.formAction = '';
+      // If form has been published, set form to readonly
+      draft.formState = 'readonly';
+      draft.status = publicWarning.status;
     },
     // save warning
     saveWarning: function saveWarning(draft,
     // eslint-disable-next-line no-unused-vars
     action) {
-      draft.formAction = 'saving';
+      draft.formState = 'saving';
       draft.error = '';
+      draft.status = action.payload.publicWarning.status;
     },
     saveWarningSuccess: function saveWarningSuccess(draft, action) {
       var publicWarning = action.payload.publicWarning;
       draft.publicWarningDetail = publicWarning.warningDetail;
-      draft.formAction = '';
+      draft.formState = '';
     },
     setFormError: function setFormError(draft, action) {
       var error = action.payload.error;
-      draft.formAction = '';
+      draft.formState = '';
       draft.error = error;
     }
   },
@@ -5309,15 +5321,16 @@ var slice = createSlice({
       if (type === publicWarningDialogType && setOpen === false) {
         delete draft.object;
         delete draft.publicWarningDetail;
-        delete draft.formAction;
+        delete draft.formState;
         delete draft.error;
         delete draft.selectedPublicWarningId;
+        delete draft.status;
       }
     });
   }
 });
-var reducer = slice.reducer;
-var publicWarningFormActions = slice.actions;
+var reducer$1 = slice$1.reducer;
+var publicWarningFormActions = slice$1.actions;
 
 var getDeleteSucces = function getDeleteSucces(objectName) {
   return "".concat(objectName, " has been deleted");
@@ -25472,14 +25485,23 @@ var PublicWarningsFormDialog = function PublicWarningsFormDialog(_ref) {
     headerSize = _ref$headerSize === void 0 ? 'xs' : _ref$headerSize,
     children = _ref.children,
     _ref$isLoading = _ref.isLoading,
-    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading;
+    isLoading = _ref$isLoading === void 0 ? false : _ref$isLoading,
+    _ref$isReadOnly = _ref.isReadOnly,
+    isReadOnly = _ref$isReadOnly === void 0 ? false : _ref$isReadOnly,
+    _ref$onChangeFormMode = _ref.onChangeFormMode,
+    onChangeFormMode = _ref$onChangeFormMode === void 0 ? function () {} : _ref$onChangeFormMode,
+    _ref$shouldHideFormMo = _ref.shouldHideFormMode,
+    shouldHideFormMode = _ref$shouldHideFormMo === void 0 ? false : _ref$shouldHideFormMo;
   var minSize = DEFAULT_WARNING_DIALOG_MIN_SIZE;
   var startSizeCalc = calculateStartSize(minSize, size, startPosition);
   var _React$useState = React.useState(startSizeCalc),
     _React$useState2 = _slicedToArray(_React$useState, 2),
     sizeInState = _React$useState2[0],
     setSizeInState = _React$useState2[1];
-  return /*#__PURE__*/React.createElement(ToolContainerDraggable, {
+  var onChangeMode = function onChangeMode() {
+    onChangeFormMode(!isReadOnly);
+  };
+  return /*#__PURE__*/React.createElement(ToolContainerDraggable, Object.assign({
     title: title,
     startSize: sizeInState,
     minWidth: minSize.width,
@@ -25511,7 +25533,8 @@ var PublicWarningsFormDialog = function PublicWarningsFormDialog(_ref) {
         setSizeInState(dragSize);
       }
     },
-    leftHeaderComponent: /*#__PURE__*/React.createElement("div", null),
+    leftHeaderComponent: /*#__PURE__*/React.createElement("div", null)
+  }, !shouldHideFormMode && {
     rightHeaderComponent: /*#__PURE__*/React.createElement(Box, {
       sx: {
         flex: 1,
@@ -25529,14 +25552,18 @@ var PublicWarningsFormDialog = function PublicWarningsFormDialog(_ref) {
         position: 'relative',
         top: -7
       }
-    }, /*#__PURE__*/React.createElement(SwitchButton, null))),
+    }, /*#__PURE__*/React.createElement(SwitchButton, {
+      checked: !isReadOnly,
+      onChange: onChangeMode
+    })))
+  }, {
     sx: {
       footer: {
         backgroundColor: 'inherit',
         boxShadow: 'none'
       }
     }
-  }, isLoading && /*#__PURE__*/React.createElement(LinearProgress, {
+  }), isLoading && /*#__PURE__*/React.createElement(LinearProgress, {
     "data-testid": "loading-bar",
     color: "secondary",
     sx: {
@@ -25912,7 +25939,9 @@ var levelOptions = [{
   color: '#D62A20',
   textColor: '#ffffff'
 }];
-var LevelField = function LevelField() {
+var LevelField = function LevelField(_ref) {
+  var _ref$isDisabled = _ref.isDisabled,
+    isDisabled = _ref$isDisabled === void 0 ? false : _ref$isDisabled;
   var _useDraftFormHelpers = useDraftFormHelpers(),
     isRequired = _useDraftFormHelpers.isRequired;
   var _useFormContext = useFormContext(),
@@ -25935,7 +25964,8 @@ var LevelField = function LevelField() {
         backgroundColor: (levelDetails === null || levelDetails === void 0 ? void 0 : levelDetails.color) || 'none',
         backgroundClip: 'content-box'
       }
-    }
+    },
+    disabled: isDisabled
   }, levelOptions.map(function (level) {
     return /*#__PURE__*/React.createElement(MenuItem, {
       value: level.key,
@@ -26138,10 +26168,12 @@ var ContainerWrapper = styled('div')(function () {
   };
 });
 var ContainerFormWrapper = styled('div')(function (_ref) {
-  var theme = _ref.theme;
+  var _ref$isReadOnly = _ref.isReadOnly,
+    isReadOnly = _ref$isReadOnly === void 0 ? false : _ref$isReadOnly,
+    theme = _ref.theme;
   return _defineProperty({
     padding: theme.spacing(2),
-    height: 'calc(100% - 206px)',
+    height: isReadOnly ? '100%' : "calc(100% - 206px)",
     overflowY: 'auto'
   }, containerQueryBreakpoint, {
     height: 'calc(100% - 88px)'
@@ -26224,7 +26256,8 @@ var Form = function Form(_ref5) {
     DraftFieldHelper = _useDraftFormHelpers.DraftFieldHelper;
   var isPublishing = formAction === 'publishing';
   var isSaving = formAction === 'saving';
-  var areFieldsDisabled = isPublishing || isSaving;
+  var isReadOnly = formAction === 'readonly';
+  var areFieldsDisabled = isPublishing || isSaving || isReadOnly;
   var onPressPublish = function onPressPublish() {
     if (!isPublishing) {
       toggleIsDraft(false);
@@ -26269,7 +26302,9 @@ var Form = function Form(_ref5) {
     reset(getFormData(publicWarningDetails, object));
   }, [object, reset, publicWarningDetails]);
   var errors = getErrors(error);
-  return /*#__PURE__*/React.createElement(ContainerWrapper, null, /*#__PURE__*/React.createElement(ContainerFormWrapper, null, /*#__PURE__*/React.createElement(ContainerGrid, null, errors && /*#__PURE__*/React.createElement(Box, {
+  return /*#__PURE__*/React.createElement(ContainerWrapper, null, /*#__PURE__*/React.createElement(ContainerFormWrapper, {
+    isReadOnly: isReadOnly
+  }, /*#__PURE__*/React.createElement(ContainerGrid, null, errors && /*#__PURE__*/React.createElement(Box, {
     sx: {
       marginBottom: 2
     }
@@ -26323,7 +26358,9 @@ var Form = function Form(_ref5) {
     item: true,
     xs: 12,
     sm: 6
-  }, /*#__PURE__*/React.createElement(LevelField, null)), /*#__PURE__*/React.createElement(Grid, {
+  }, /*#__PURE__*/React.createElement(LevelField, {
+    isDisabled: areFieldsDisabled
+  })), /*#__PURE__*/React.createElement(Grid, {
     item: true,
     xs: 12,
     sm: 6
@@ -26349,7 +26386,7 @@ var Form = function Form(_ref5) {
     isDisabled: areFieldsDisabled
   }))))), /*#__PURE__*/React.createElement(DraftFieldHelper, null), /*#__PURE__*/React.createElement(ReactHookFormHiddenInput, {
     name: "id"
-  })), /*#__PURE__*/React.createElement(Box, {
+  })), !isReadOnly && /*#__PURE__*/React.createElement(Box, {
     sx: {
       padding: '24px 10px 14px 10px',
       position: 'absolute',
@@ -26454,8 +26491,11 @@ var getPublicWarningObject = createSelector(getPublicWarningStore, function (pub
 var getPublicWarning = createSelector(getPublicWarningStore, function (publicWarningStore) {
   return publicWarningStore.publicWarningDetail;
 });
-var getPublicWarningFormAction = createSelector(getPublicWarningStore, function (publicWarningStore) {
-  return (publicWarningStore === null || publicWarningStore === void 0 ? void 0 : publicWarningStore.formAction) || '';
+var getPublicWarningStatus = createSelector(getPublicWarningStore, function (publicWarningStore) {
+  return publicWarningStore === null || publicWarningStore === void 0 ? void 0 : publicWarningStore.status;
+});
+var getPublicWarningFormState = createSelector(getPublicWarningStore, function (publicWarningStore) {
+  return (publicWarningStore === null || publicWarningStore === void 0 ? void 0 : publicWarningStore.formState) || '';
 });
 var getPublicWarningFormError = createSelector(getPublicWarningStore, function (publicWarningStore) {
   return (publicWarningStore === null || publicWarningStore === void 0 ? void 0 : publicWarningStore.error) || '';
@@ -26488,7 +26528,7 @@ var PublicWarningsFormConnect = function PublicWarningsFormConnect() {
     return getPublicWarningObject(store);
   });
   var publicWarningFormAction = useSelector(function (store) {
-    return getPublicWarningFormAction(store);
+    return getPublicWarningFormState(store);
   });
   var publicWarningFormError = useSelector(function (store) {
     return getPublicWarningFormError(store);
@@ -26548,9 +26588,23 @@ var PublicWarningsFormDialogConnect = function PublicWarningsFormDialogConnect(_
     uiSource = _useSetupDialog.uiSource,
     onCloseDialog = _useSetupDialog.onCloseDialog,
     uiIsLoading = _useSetupDialog.uiIsLoading;
+  var dispatch = useDispatch();
+  var onChangeFormMode = function onChangeFormMode(isChecked) {
+    dispatch(publicWarningFormActions.setFormValues({
+      formState: !isChecked ? '' : 'readonly'
+    }));
+  };
+  var formAction = useSelector(function (store) {
+    return getPublicWarningFormState(store);
+  });
+  var publicWarningStatus = useSelector(function (store) {
+    return getPublicWarningStatus(store);
+  });
   if (!isDialogOpen) {
     return null;
   }
+  var isReadOnly = formAction === 'readonly';
+  var shouldHideFormToggleMode = publicWarningStatus !== undefined && publicWarningStatus !== 'DRAFT';
   return /*#__PURE__*/React__default.createElement(PublicWarningsFormDialog, {
     isOpen: isDialogOpen,
     onClose: onCloseDialog,
@@ -26559,7 +26613,10 @@ var PublicWarningsFormDialogConnect = function PublicWarningsFormDialogConnect(_
     source: uiSource,
     bounds: bounds,
     startPosition: startPosition,
-    isLoading: uiIsLoading
+    isLoading: uiIsLoading,
+    isReadOnly: isReadOnly,
+    onChangeFormMode: onChangeFormMode,
+    shouldHideFormMode: shouldHideFormToggleMode
   }, /*#__PURE__*/React__default.createElement(PublicWarningsFormConnect, null));
 };
 
@@ -26637,7 +26694,7 @@ var WarningListColumnContent = function WarningListColumnContent(_a) {
     sx: Object.assign(Object.assign({}, props.sx), {
       width: width
     })
-  }), /*#__PURE__*/React__default.createElement(Box, {
+  }), title && /*#__PURE__*/React__default.createElement(Box, {
     sx: {
       overflow: 'hidden',
       fontWeight: 'normal',
@@ -26660,16 +26717,17 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
   var warnings = _ref.warnings,
     status = _ref.status,
     activeWarningId = _ref.activeWarningId,
-    onSelectWarning = _ref.onSelectWarning;
+    onSelectWarning = _ref.onSelectWarning,
+    onEditWarning = _ref.onEditWarning;
   var headerText = "".concat(warnings.length, " ").concat(getStatus(status));
   var onClickWarning = function onClickWarning(warning) {
     return function () {
       return onSelectWarning(warning);
     };
   };
-  var onEditWarning = function onEditWarning(warning) {
+  var onClickEditWarning = function onClickEditWarning(warning) {
     return function () {
-      return onSelectWarning(warning);
+      return onEditWarning(warning);
     };
   };
   return /*#__PURE__*/React__default.createElement(Box, {
@@ -26710,7 +26768,7 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
         "aria-label": BUTTON_OPTIONS,
         menuItems: status === 'DRAFT' ? [{
           text: BUTTON_EDIT,
-          action: onEditWarning(warning),
+          action: onClickEditWarning(warning),
           icon: /*#__PURE__*/React__default.createElement(Edit, null)
         }] : [],
         buttonIcon: /*#__PURE__*/React__default.createElement(Options, null)
@@ -26735,7 +26793,7 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
     }, /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "Incident",
       status: status,
-      width: 105
+      width: 142
     }), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "Last update",
       status: status,
@@ -26777,7 +26835,9 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
         paddingBottom: '1px',
         marginLeft: -0.5
       }
-    }, ((_a = warning.warningDetail) === null || _a === void 0 ? void 0 : _a.level) && (levelDetails === null || levelDetails === void 0 ? void 0 : levelDetails.title) || '-')), status === 'DRAFT' ? /*#__PURE__*/React__default.createElement(Button, {
+    }, ((_a = warning.warningDetail) === null || _a === void 0 ? void 0 : _a.level) && (levelDetails === null || levelDetails === void 0 ? void 0 : levelDetails.title) || '-')), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
+      status: status
+    }, status === 'DRAFT' ? /*#__PURE__*/React__default.createElement(Button, {
       sx: {
         height: '30px',
         padding: '0px',
@@ -26791,11 +26851,9 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
       content: status.toLowerCase(),
       color: status === 'EXPIRED' ? 'grey' : 'green',
       sx: {
-        width: 66,
-        marginLeft: 0.5,
-        marginRight: 0.5
+        width: 66
       }
-    }))));
+    })))));
   })));
 };
 var PublicWarningList = function PublicWarningList(_ref2) {
@@ -26805,6 +26863,8 @@ var PublicWarningList = function PublicWarningList(_ref2) {
     error = _ref2.error,
     _ref2$onSelectWarning = _ref2.onSelectWarning,
     onSelectWarning = _ref2$onSelectWarning === void 0 ? function () {} : _ref2$onSelectWarning,
+    _ref2$onEditWarning = _ref2.onEditWarning,
+    onEditWarning = _ref2$onEditWarning === void 0 ? function () {} : _ref2$onEditWarning,
     _ref2$onCreateWarning = _ref2.onCreateWarning,
     onCreateWarning = _ref2$onCreateWarning === void 0 ? function () {} : _ref2$onCreateWarning,
     _ref2$selectedPublicW = _ref2.selectedPublicWarningId,
@@ -26835,29 +26895,118 @@ var PublicWarningList = function PublicWarningList(_ref2) {
   }), isLoading && /*#__PURE__*/React__default.createElement(LinearProgress, {
     "data-testid": "loading-bar",
     color: "secondary"
-  }), sortedWarnings && !error && !isLoading && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(WarningsOnStatus, {
+  }), sortedWarnings && !error && /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(WarningsOnStatus, {
     status: "TODO",
     warnings: sortedWarnings.todo,
     onSelectWarning: onSelectWarning,
+    onEditWarning: onEditWarning,
     activeWarningId: selectedPublicWarningId
   }), /*#__PURE__*/React__default.createElement(WarningsOnStatus, {
     status: "DRAFT",
     warnings: sortedWarnings.draft,
     onSelectWarning: onSelectWarning,
+    onEditWarning: onEditWarning,
     activeWarningId: selectedPublicWarningId
   }), /*#__PURE__*/React__default.createElement(WarningsOnStatus, {
     status: "PUBLISHED",
     warnings: sortedWarnings.published,
     onSelectWarning: onSelectWarning,
+    onEditWarning: onEditWarning,
     activeWarningId: selectedPublicWarningId
   }), /*#__PURE__*/React__default.createElement(WarningsOnStatus, {
     status: "EXPIRED",
     warnings: sortedWarnings.expired,
     onSelectWarning: onSelectWarning,
+    onEditWarning: onEditWarning,
     activeWarningId: selectedPublicWarningId
   })));
 };
 
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2023 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2023 - Finnish Meteorological Institute (FMI)
+ * */
+var publicWarningsAdapter = createEntityAdapter({
+  selectId: function selectId(warning) {
+    return warning.id;
+  }
+});
+var initialState = {
+  warnings: publicWarningsAdapter.getInitialState(),
+  isLoading: true
+};
+var slice = createSlice({
+  initialState: initialState,
+  name: 'publicWarnings',
+  reducers: {
+    fetchWarnings: function fetchWarnings(draft) {
+      draft.isLoading = true;
+      delete draft.error;
+    },
+    fetchWarningsSuccess: function fetchWarningsSuccess(draft, action) {
+      var warnings = action.payload.warnings;
+      draft.isLoading = false;
+      publicWarningsAdapter.setAll(draft.warnings, warnings);
+    },
+    fetchWarningsError: function fetchWarningsError(draft, action) {
+      var error = action.payload.error;
+      draft.isLoading = false;
+      draft.error = error;
+    }
+  }
+});
+var reducer = slice.reducer;
+var publicWarningActions = slice.actions;
+
+/* *
+ * Licensed under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License.
+ * You may obtain a copy of the License at
+ *
+ *     http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software
+ * distributed under the License is distributed on an "AS IS" BASIS,
+ * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
+ * See the License for the specific language governing permissions and
+ * limitations under the License.
+ *
+ * Copyright 2023 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
+ * Copyright 2023 - Finnish Meteorological Institute (FMI)
+ * */
+var getPublicWarningsStore = function getPublicWarningsStore(store) {
+  if (store && store.publicWarnings) {
+    return store.publicWarnings;
+  }
+  return null;
+};
+var _publicWarningsAdapte = publicWarningsAdapter.getSelectors(function (state) {
+    var _a, _b;
+    return (_b = (_a = state === null || state === void 0 ? void 0 : state.publicWarnings) === null || _a === void 0 ? void 0 : _a.warnings) !== null && _b !== void 0 ? _b : {
+      entities: {},
+      ids: []
+    };
+  }),
+  selectAllPublicWarnings = _publicWarningsAdapte.selectAll;
+var isPublicWarningsLoading = createSelector(getPublicWarningsStore, function (store) {
+  return (store === null || store === void 0 ? void 0 : store.isLoading) || false;
+});
+var getPublicWarningsError = createSelector(getPublicWarningsStore, function (store) {
+  return store === null || store === void 0 ? void 0 : store.error;
+});
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -26876,31 +27025,48 @@ var PublicWarningList = function PublicWarningList(_ref2) {
  * */
 var PublicWarningListConnect = function PublicWarningListConnect() {
   var dispatch = useDispatch();
-  var _useApiContext = useApiContext(),
-    api = _useApiContext.api;
-  var _useApi = useApi(api.getWarnings),
-    warnings = _useApi.result,
-    isLoading = _useApi.isLoading,
-    error = _useApi.error;
+  var warnings = useSelector(function (store) {
+    return selectAllPublicWarnings(store);
+  });
   var selectedPublicWarningId = useSelector(function (store) {
     return getSelectedPublicWarningId(store);
   });
-  var selectWarning = function selectWarning(publicWarning) {
-    dispatch(publicWarningFormActions.openPublicWarningFormDialog(Object.assign({}, publicWarning && {
+  var isLoading = useSelector(function (store) {
+    return isPublicWarningsLoading(store);
+  });
+  var error = useSelector(function (store) {
+    return getPublicWarningsError(store);
+  });
+  var openPublicWarningDialog = function openPublicWarningDialog(formAction, publicWarning) {
+    dispatch(publicWarningFormActions.openPublicWarningFormDialog(Object.assign(Object.assign({}, publicWarning && {
       publicWarningDetail: Object.assign(Object.assign({}, publicWarning.warningDetail), {
         id: publicWarning.id
-      })
+      }),
+      status: publicWarning.status
+    }), {
+      formState: formAction
     })));
   };
+  var selectWarning = function selectWarning(publicWarning) {
+    openPublicWarningDialog('readonly', publicWarning);
+  };
   var createWarning = function createWarning() {
-    return selectWarning();
+    openPublicWarningDialog('');
+  };
+  var editWarning = function editWarning(publicWarning) {
+    openPublicWarningDialog('', publicWarning);
   };
+  React__default.useEffect(function () {
+    // fetch warnings on mount
+    dispatch(publicWarningActions.fetchWarnings());
+  }, [dispatch]);
   return /*#__PURE__*/React__default.createElement(PublicWarningList, {
     warnings: warnings,
     isLoading: isLoading,
     error: error,
     onSelectWarning: selectWarning,
     onCreateWarning: createWarning,
+    onEditWarning: editWarning,
     selectedPublicWarningId: selectedPublicWarningId
   });
 };
@@ -27433,7 +27599,7 @@ function takeLatest$1(patternOrChannel, worker) {
   return fork.apply(void 0, [takeLatest, patternOrChannel, worker].concat(args));
 }
 
-var _marked$1 = /*#__PURE__*/_regeneratorRuntime().mark(drawingSaga);
+var _marked$2 = /*#__PURE__*/_regeneratorRuntime().mark(drawingSaga);
 var getSnackbarMessage = function getSnackbarMessage(objectName, id) {
   return "Object ".concat(objectName, " has been ").concat(id ? 'updated' : 'saved', "!");
 };
@@ -27528,12 +27694,12 @@ function drawingSaga() {
       case "end":
         return _context2.stop();
     }
-  }, _marked$1);
+  }, _marked$2);
 }
 
-var _marked = /*#__PURE__*/_regeneratorRuntime().mark(saveOrUpdateWarning),
-  _marked2 = /*#__PURE__*/_regeneratorRuntime().mark(errorSaga),
-  _marked3 = /*#__PURE__*/_regeneratorRuntime().mark(toggleDialogLoadingSaga),
+var _marked$1 = /*#__PURE__*/_regeneratorRuntime().mark(saveOrUpdateWarning),
+  _marked2$1 = /*#__PURE__*/_regeneratorRuntime().mark(errorSaga),
+  _marked3$1 = /*#__PURE__*/_regeneratorRuntime().mark(toggleDialogLoadingSaga),
   _marked4 = /*#__PURE__*/_regeneratorRuntime().mark(openDialogSaga),
   _marked5 = /*#__PURE__*/_regeneratorRuntime().mark(publicWarningRootSaga);
 var PUBLISH_SUCCES = 'Public warning has succesfully been published!';
@@ -27572,7 +27738,7 @@ function saveOrUpdateWarning(publicWarning) {
       case "end":
         return _context.stop();
     }
-  }, _marked);
+  }, _marked$1);
 }
 function publishWarningSaga(_ref) {
   var payload = _ref.payload;
@@ -27621,7 +27787,7 @@ function saveWarningSaga(_ref2) {
         case 4:
           savedWarning = _context3.sent;
           _context3.next = 7;
-          return put(publicWarningFormActions.publishWarningSuccess({
+          return put(publicWarningFormActions.saveWarningSuccess({
             publicWarning: savedWarning,
             message: SAVE_SUCCES
           }));
@@ -27677,7 +27843,7 @@ function errorSaga(message) {
       case "end":
         return _context5.stop();
     }
-  }, _marked2);
+  }, _marked2$1);
 }
 function toggleDialogLoadingSaga(isLoading) {
   var isDialogOpen;
@@ -27701,7 +27867,7 @@ function toggleDialogLoadingSaga(isLoading) {
       case "end":
         return _context6.stop();
     }
-  }, _marked3);
+  }, _marked3$1);
 }
 function openDialogSaga() {
   return _regeneratorRuntime().wrap(function openDialogSaga$(_context7) {
@@ -27743,6 +27909,75 @@ function publicWarningRootSaga() {
   }, _marked5);
 }
 
+var _marked = /*#__PURE__*/_regeneratorRuntime().mark(fetchWarningsSaga),
+  _marked2 = /*#__PURE__*/_regeneratorRuntime().mark(refetchWarnings),
+  _marked3 = /*#__PURE__*/_regeneratorRuntime().mark(publicWarnings);
+function fetchWarningsSaga() {
+  var warningsApi, _yield$call, warnings;
+  return _regeneratorRuntime().wrap(function fetchWarningsSaga$(_context) {
+    while (1) switch (_context.prev = _context.next) {
+      case 0:
+        _context.prev = 0;
+        _context.next = 3;
+        return call(getWarningsApi);
+      case 3:
+        warningsApi = _context.sent;
+        _context.next = 6;
+        return call(warningsApi.getWarnings);
+      case 6:
+        _yield$call = _context.sent;
+        warnings = _yield$call.data;
+        _context.next = 10;
+        return put(publicWarningActions.fetchWarningsSuccess({
+          warnings: warnings
+        }));
+      case 10:
+        _context.next = 16;
+        break;
+      case 12:
+        _context.prev = 12;
+        _context.t0 = _context["catch"](0);
+        _context.next = 16;
+        return put(publicWarningActions.fetchWarningsError({
+          error: {
+            name: _context.t0.name,
+            message: _context.t0.message
+          }
+        }));
+      case 16:
+      case "end":
+        return _context.stop();
+    }
+  }, _marked, null, [[0, 12]]);
+}
+function refetchWarnings() {
+  return _regeneratorRuntime().wrap(function refetchWarnings$(_context2) {
+    while (1) switch (_context2.prev = _context2.next) {
+      case 0:
+        _context2.next = 2;
+        return put(publicWarningActions.fetchWarnings());
+      case 2:
+      case "end":
+        return _context2.stop();
+    }
+  }, _marked2);
+}
+function publicWarnings() {
+  return _regeneratorRuntime().wrap(function publicWarnings$(_context3) {
+    while (1) switch (_context3.prev = _context3.next) {
+      case 0:
+        _context3.next = 2;
+        return takeLatest$1(publicWarningActions.fetchWarnings, fetchWarningsSaga);
+      case 2:
+        _context3.next = 4;
+        return takeLatest$1([publicWarningFormActions.publishWarningSuccess, publicWarningFormActions.saveWarningSuccess], refetchWarnings);
+      case 4:
+      case "end":
+        return _context3.stop();
+    }
+  }, _marked3);
+}
+
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
  * you may not use this file except in compliance with the License.
@@ -27762,10 +27997,11 @@ function publicWarningRootSaga() {
 var drawingModuleConfig = {
   id: 'drawing-module',
   reducersMap: {
-    drawings: reducer$1,
-    publicWarningForm: reducer
+    drawings: reducer$2,
+    publicWarningForm: reducer$1,
+    publicWarnings: reducer
   },
-  sagas: [drawingSaga, publicWarningRootSaga]
+  sagas: [drawingSaga, publicWarningRootSaga, publicWarnings]
 };
 
 export { DIALOG_TITLE, DrawingToolConnect, Wrapper as DrawingToolForm, DrawingToolFormConnect, DrawingToolMapButtonConnect, ObjectManagerConnect, ObjectManagerMapButtonConnect, PublicWarningApiWrapper, PublicWarningsFormDialog, PublicWarningsFormDialogConnect, WarningsModuleProvider, componentsLookUp, drawingModuleConfig, useObjectDrawDialogAction };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/warnings",
-  "version": "9.2.0",
+  "version": "9.3.0",
   "description": "GeoWeb warinings library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {

package/src/lib/components/PublicWarningList/PublicWarningList.d.ts

@@ -5,7 +5,7 @@ export declare const CREATE_WARNING = "Create a warning";
 export declare const BUTTON_EDIT = "Edit";
 export declare const BUTTON_OPTIONS = "Options";
 export declare const WarningListColumnContent: React.FC<GridProps & {
-    title: string;
+    title?: string;
     status: PublicWarningStatus;
     children?: React.ReactNode;
     width?: number;
@@ -15,6 +15,7 @@ export declare const PublicWarningList: React.FC<{
     isLoading?: boolean;
     error?: Error;
     onSelectWarning?: (warning: PublicWarning) => void;
+    onEditWarning?: (warning: PublicWarning) => void;
     onCreateWarning?: () => void;
     selectedPublicWarningId?: string;
 }>;

package/src/lib/components/PublicWarningsForm/LevelField/LevelField.d.ts

@@ -6,4 +6,6 @@ export declare const levelOptions: {
     color: string;
     textColor: string;
 }[];
-export declare const LevelField: React.FC;
+export declare const LevelField: React.FC<{
+    isDisabled?: boolean;
+}>;

package/src/lib/components/PublicWarningsForm/PublicWarningsForm.d.ts

@@ -1,6 +1,7 @@
 import * as React from 'react';
 import { PublicWarningDetail } from '../../store/publicWarningForm/types';
 import { BaseDrawingListItem, DrawingListItem } from '../../store/drawings/types';
+import { FormAction } from '../../store/publicWarningForm/reducer';
 export declare const getEmptyPublicWarning: () => PublicWarningDetail;
 export declare const getFormData: (publicWarningsDetails: PublicWarningDetail | undefined, object?: DrawingListItem) => PublicWarningDetail;
 export declare const LABEL_PROBABILITY = "Probability";
@@ -15,7 +16,6 @@ interface FormData extends PublicWarningDetail {
     'translation-select'?: string;
 }
 export declare const prepareFormValues: (data: FormData) => PublicWarningDetail;
-export type FormAction = '' | 'saving' | 'publishing';
 interface FormProps {
     formAction?: FormAction;
     onSaveForm?: (formValues: PublicWarningDetail) => void;

package/src/lib/components/PublicWarningsForm/PublicWarningsForm.stories.d.ts

@@ -23,3 +23,5 @@ export declare const PublicWarningsSavingFormDemo: () => React.ReactElement;
 export declare const PublicWarningsSavingFormDemoDark: () => React.ReactElement;
 export declare const PublicWarningsErrorFormDemo: () => React.ReactElement;
 export declare const PublicWarningsErrorFormDemoDark: () => React.ReactElement;
+export declare const PublicWarningsReadOnlyFormDemo: () => React.ReactElement;
+export declare const PublicWarningsReadOnlyFormDemoDark: () => React.ReactElement;

package/src/lib/components/PublicWarningsFormDialog/PublicWarningsFormDialog.d.ts

@@ -16,4 +16,7 @@ export declare const PublicWarningsFormDialog: React.FC<{
     headerSize?: HeaderSize;
     children: React.ReactNode;
     isLoading?: boolean;
+    isReadOnly?: boolean;
+    onChangeFormMode?: (isReadOnly: boolean) => void;
+    shouldHideFormMode?: boolean;
 }>;

package/src/lib/components/PublicWarningsFormDialog/PublicWarningsFormDialog.stories.d.ts

@@ -39,3 +39,11 @@ export declare const PublicWarningsFormDialogDarkBigError: {
     (): React.ReactElement;
     storyName: string;
 };
+export declare const PublicWarningsFormDialogLightReadOnly: {
+    (): React.ReactElement;
+    storyName: string;
+};
+export declare const PublicWarningsFormDialogDarkReadOnly: {
+    (): React.ReactElement;
+    storyName: string;
+};

package/src/lib/store/config.d.ts

@@ -2,15 +2,18 @@ import { CoreAppStore } from '@opengeoweb/store';
 import drawingSagas from './drawings/sagas';
 import { DrawState } from './drawings/types';
 import { PublicWarningFormState } from './publicWarningForm/reducer';
+import { PublicWarningsState } from './publicWarnings/types';
 export interface WarningModuleStore extends CoreAppStore {
     drawings?: DrawState;
     publicWarningForm?: PublicWarningFormState;
+    publicWarnings?: PublicWarningsState;
 }
 export declare const drawingModuleConfig: {
     id: string;
     reducersMap: {
         drawings: import("redux").Reducer<DrawState, import("redux").AnyAction>;
         publicWarningForm: import("redux").Reducer<PublicWarningFormState, import("redux").AnyAction>;
+        publicWarnings: import("redux").Reducer<PublicWarningsState, import("redux").AnyAction>;
     };
     sagas: (typeof drawingSagas)[];
 };

package/src/lib/store/publicWarningForm/reducer.d.ts

@@ -1,11 +1,12 @@
 import { PayloadAction, Draft } from '@reduxjs/toolkit';
 import { DrawingListItem } from '../drawings/types';
-import { PublicWarning, PublicWarningDetail } from './types';
-export type FormAction = '' | 'saving' | 'publishing';
+import { PublicWarning, PublicWarningDetail, PublicWarningStatus } from './types';
+export type FormAction = '' | 'saving' | 'publishing' | 'readonly';
 export interface PublicWarningFormState {
     object?: DrawingListItem;
     publicWarningDetail?: PublicWarningDetail;
-    formAction?: FormAction;
+    status?: PublicWarningStatus;
+    formState?: FormAction;
     error?: string;
     selectedPublicWarningId?: string;
 }
@@ -15,10 +16,13 @@ export declare const publicWarningFormActions: import("@reduxjs/toolkit").CaseRe
     setFormValues: (draft: Draft<PublicWarningFormState>, action: PayloadAction<{
         object?: DrawingListItem;
         publicWarningDetail?: PublicWarningDetail;
+        formState?: FormAction;
     }>) => void;
     openPublicWarningFormDialog: (draft: Draft<PublicWarningFormState>, action: PayloadAction<{
         object?: DrawingListItem;
         publicWarningDetail?: PublicWarningDetail;
+        formState?: FormAction;
+        status?: PublicWarningStatus;
     }>) => void;
     publishWarning: (draft: Draft<PublicWarningFormState>, action: PayloadAction<{
         publicWarning: PublicWarning;

package/src/lib/store/publicWarningForm/selectors.d.ts

@@ -11,7 +11,12 @@ export declare const getPublicWarning: ((state: WarningModuleStore) => import(".
 }> & {
     clearCache: () => void;
 };
-export declare const getPublicWarningFormAction: ((state: WarningModuleStore) => "" | "saving" | "publishing") & import("reselect").OutputSelectorFields<(args_0: PublicWarningFormState) => "" | "saving" | "publishing", {
+export declare const getPublicWarningStatus: ((state: WarningModuleStore) => import("./types").PublicWarningStatus | undefined) & import("reselect").OutputSelectorFields<(args_0: PublicWarningFormState) => import("./types").PublicWarningStatus | undefined, {
+    clearCache: () => void;
+}> & {
+    clearCache: () => void;
+};
+export declare const getPublicWarningFormState: ((state: WarningModuleStore) => "" | "saving" | "publishing" | "readonly") & import("reselect").OutputSelectorFields<(args_0: PublicWarningFormState) => "" | "saving" | "publishing" | "readonly", {
     clearCache: () => void;
 }> & {
     clearCache: () => void;

package/src/lib/store/publicWarnings/reducer.d.ts

@@ -0,0 +1,18 @@
+import { PayloadAction, Draft } from '@reduxjs/toolkit';
+import { PublicWarningsState } from './types';
+import { PublicWarning } from '../publicWarningForm/types';
+export declare const publicWarningsAdapter: import("@reduxjs/toolkit").EntityAdapter<PublicWarning>;
+export declare const initialState: PublicWarningsState;
+export declare const reducer: import("redux").Reducer<PublicWarningsState, import("redux").AnyAction>;
+export declare const publicWarningActions: import("@reduxjs/toolkit").CaseReducerActions<{
+    fetchWarnings: (draft: Draft<PublicWarningsState>) => void;
+    fetchWarningsSuccess: (draft: Draft<PublicWarningsState>, action: PayloadAction<{
+        warnings: PublicWarning[];
+    }>) => void;
+    fetchWarningsError: (draft: Draft<PublicWarningsState>, action: PayloadAction<{
+        error: {
+            name: string;
+            message: string;
+        };
+    }>) => void;
+}, "publicWarnings">;

package/src/lib/store/publicWarnings/reducer.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/src/lib/store/publicWarnings/sagas.d.ts

@@ -0,0 +1,5 @@
+import { SagaIterator } from 'redux-saga';
+export declare function fetchWarningsSaga(): SagaIterator;
+export declare function refetchWarnings(): SagaIterator;
+declare function publicWarnings(): SagaIterator;
+export default publicWarnings;

package/src/lib/store/publicWarnings/sagas.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/src/lib/store/publicWarnings/selectors.d.ts

@@ -0,0 +1,14 @@
+import { PublicWarningsState } from './types';
+import { WarningModuleStore } from '../config';
+export declare const getPublicWarningsStore: (store: WarningModuleStore) => PublicWarningsState;
+export declare const selectAllPublicWarnings: (state: WarningModuleStore) => import("../publicWarningForm/types").PublicWarning[];
+export declare const isPublicWarningsLoading: ((state: WarningModuleStore) => boolean) & import("reselect").OutputSelectorFields<(args_0: PublicWarningsState) => boolean, {
+    clearCache: () => void;
+}> & {
+    clearCache: () => void;
+};
+export declare const getPublicWarningsError: ((state: WarningModuleStore) => import("./types").PublicWarningError | undefined) & import("reselect").OutputSelectorFields<(args_0: PublicWarningsState) => import("./types").PublicWarningError | undefined, {
+    clearCache: () => void;
+}> & {
+    clearCache: () => void;
+};

package/src/lib/store/publicWarnings/selectors.spec.d.ts

@@ -0,0 +1 @@
+export {};

package/src/lib/store/publicWarnings/types.d.ts

@@ -0,0 +1,11 @@
+import { EntityState } from '@reduxjs/toolkit';
+import { PublicWarning } from '../publicWarningForm/types';
+export type PublicWarningError = {
+    name: string;
+    message: string;
+};
+export type PublicWarningsState = {
+    warnings: EntityState<PublicWarning>;
+    isLoading: boolean;
+    error?: PublicWarningError;
+};