@opengeoweb/warnings 9.10.2 → 9.11.0

package/index.esm.js

@@ -10,8 +10,8 @@ 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 { VariableSizeList } from 'react-window';
 import AutoSizer from 'react-virtualized-auto-sizer';
+import { DATE_FORMAT_FNS, ReactHookFormProvider, defaultFormOptions, ReactHookFormHiddenInput, isValidGeoJsonCoordinates, ReactHookFormSelect, ReactHookFormTextField, useDraftFormHelpers, errorMessages, ReactHookFormDateTime, isValidDate, isXHoursBefore, isXHoursAfter, isEmpty } from '@opengeoweb/form-fields';
 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 { useFormContext } from 'react-hook-form';
 import { clamp } from 'lodash';
 import { useAuthenticationContext } from '@opengeoweb/authentication';
@@ -951,10 +951,7 @@ var ObjectManagerMapButtonConnect = function ObjectManagerMapButtonConnect(_ref)
  * Copyright 2023 - Koninklijk Nederlands Meteorologisch Instituut (KNMI)
  * Copyright 2023 - Finnish Meteorological Institute (FMI)
  * */
-var DATE_FORMAT = 'dd/MM/yyyy HH:mm';
-var DATE_FORMAT_UTC = "yyyy-MM-dd'T'HH:mm:ss'Z'";
 var DATE_FORMAT_HEADER = 'EEEE, MMMM dd';
-var DATE_FORMAT_DATE_FIELDS = 'DD/MM/YYYY HH:mm'; // TODO: should be 'ddd DD MMM HH:mm' https://gitlab.com/opengeoweb/opengeoweb/-/issues/4484
 var DATE_FORMAT_LASTUPDATEDTIME = 'HH:mm';
 
 var DEFAULT_ADD_BUTTON_HEIGHT = 80;
@@ -1207,7 +1204,7 @@ var Objects = function Objects(_ref2) {
           maxHeight: '32px',
           overflow: 'hidden'
         }
-      }, object.scope === 'global' && 'Global: ', "".concat(dateUtils.dateToString(dateUtils.utc(object.lastUpdatedTime), DATE_FORMAT), " UTC")))))));
+      }, object.scope === 'global' && 'Global: ', "".concat(dateUtils.dateToString(dateUtils.utc(object.lastUpdatedTime), DATE_FORMAT_FNS), " UTC")))))));
     })));
   });
 };
@@ -4185,7 +4182,7 @@ var useFormDirty = function useFormDirty(_ref) {
 
 var opacityOptions = [100, 90, 80, 70, 60, 50, 40, 30, 20, 10, 0];
 var getObjectName$1 = function getObjectName(objectName) {
-  return objectName || "".concat(dateUtils.dateToString(new Date(), DATE_FORMAT, true), " UTC");
+  return objectName || "".concat(dateUtils.dateToString(new Date(), DATE_FORMAT_FNS, true), " UTC");
 };
 var SAVE_OBJECT_BUTTON = 'Save new object';
 var UPDATE_OBJECT_BUTTON = 'Update object';
@@ -4928,7 +4925,7 @@ var OBJECTS_MENU = 'Object options';
 var NO_OBJECT = '(no object selected)';
 var OBJECT_SELECTED = 'object selected';
 var formatDate = function formatDate(lastUpdatedTime) {
-  return dateUtils.dateToString(dateUtils.isoStringToDate(lastUpdatedTime), "".concat(DATE_FORMAT, " 'UTC'"));
+  return dateUtils.dateToString(dateUtils.isoStringToDate(lastUpdatedTime), "".concat(DATE_FORMAT_FNS, " 'UTC'"));
 };
 var getObjectName = function getObjectName(geoJSON, objectName) {
   if (geoJSON) {
@@ -5266,7 +5263,6 @@ var ValidFrom = function ValidFrom(_ref) {
       }
     },
     label: LABEL_VALID_FROM,
-    format: DATE_FORMAT_DATE_FIELDS,
     disablePast: true,
     disabled: isDisabled || isReadOnly,
     isReadOnly: isReadOnly,
@@ -5333,7 +5329,6 @@ var ValidUntil = function ValidUntil(_ref) {
       }
     },
     label: LABEL_VALID_UNTIL,
-    format: DATE_FORMAT_DATE_FIELDS,
     disablePast: true,
     disabled: isDisabled || isReadOnly,
     isReadOnly: isReadOnly
@@ -5352,8 +5347,8 @@ var getEmptyPublicWarning = function getEmptyPublicWarning() {
   return {
     id: '',
     phenomenon: '',
-    validFrom: dateUtils.dateToString(validFromTime, DATE_FORMAT_UTC, true),
-    validUntil: dateUtils.dateToString(validUntilTime, DATE_FORMAT_UTC, true),
+    validFrom: dateUtils.dateToString(validFromTime),
+    validUntil: dateUtils.dateToString(validUntilTime),
     level: '',
     probability: 30,
     descriptionOriginal: '',
@@ -5822,8 +5817,17 @@ var PublicWarningsFormConnect = function PublicWarningsFormConnect() {
       isFormDirty: isFormDirty
     }));
   };
+  var getIsReadOnly = function getIsReadOnly() {
+    if (publicWarningFormAction === 'readonly') {
+      return true;
+    }
+    if ((publicWarning === null || publicWarning === void 0 ? void 0 : publicWarning.status) === 'TODO' && publicWarningFormAction === '') {
+      return false;
+    }
+    return !isEditor && (publicWarning === null || publicWarning === void 0 ? void 0 : publicWarning.status) !== undefined;
+  };
   // Readonly also in case you are not creating a new warning and you are not set as the editor
-  var isReadOnly = publicWarningFormAction === 'readonly' || !isEditor && (publicWarning === null || publicWarning === void 0 ? void 0 : publicWarning.status) !== undefined;
+  var isReadOnly = getIsReadOnly();
   return /*#__PURE__*/React.createElement(PublicWarningsForm, {
     object: publicWarningObject,
     publicWarningDetails: publicWarning === null || publicWarning === void 0 ? void 0 : publicWarning.warningDetail,
@@ -6037,22 +6041,6 @@ var PublicWarningsFormDialogConnect = function PublicWarningsFormDialogConnect(_
   }, /*#__PURE__*/React__default.createElement(PublicWarningsFormConnect, null));
 };
 
-/* *
- * 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 getStatus = function getStatus(status) {
   switch (status) {
     case 'DRAFT':
@@ -6060,7 +6048,7 @@ var getStatus = function getStatus(status) {
     case 'PUBLISHED':
       return 'Published';
     case 'TODO':
-      return 'To do';
+      return 'Reviews';
     default:
       return 'Expired (last 24 hours)';
   }
@@ -6068,6 +6056,7 @@ var getStatus = function getStatus(status) {
 var CREATE_WARNING = 'Create a warning';
 var BUTTON_EDIT = 'Edit';
 var BUTTON_DELETE = 'Delete';
+var BUTTON_USE = 'Use';
 var BUTTON_OPTIONS = 'Options';
 var sortWarningsOnStatus = function sortWarningsOnStatus(warnings) {
   return warnings.reduce(function (allWarnings, warning) {
@@ -6099,6 +6088,16 @@ var sortWarningsOnStatus = function sortWarningsOnStatus(warnings) {
     expired: []
   });
 };
+var getWarningWithoutId = function getWarningWithoutId(warning) {
+  warning.id;
+    var warningDetail = warning.warningDetail,
+    fullWarning = __rest(warning, ["id", "warningDetail"]);
+  warningDetail.id;
+    var cleanWarningDetail = __rest(warningDetail, ["id"]);
+  return Object.assign(Object.assign({}, fullWarning), {
+    warningDetail: cleanWarningDetail
+  });
+};
 var WarningListColumnContent = function WarningListColumnContent(_a) {
   var title = _a.title,
     status = _a.status,
@@ -6154,6 +6153,32 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
       return onDeleteWarning(warningId);
     };
   };
+  var onClickUseWarning = function onClickUseWarning(warning) {
+    return function () {
+      onEditWarning(getWarningWithoutId(warning));
+    };
+  };
+  var getMenuItems = function getMenuItems(warning) {
+    if (status === 'DRAFT') {
+      return [{
+        text: BUTTON_EDIT,
+        action: onClickEditWarning(warning),
+        icon: /*#__PURE__*/React__default.createElement(Edit, null)
+      }, {
+        text: BUTTON_DELETE,
+        action: onClickDeleteWarning(warning.id),
+        icon: /*#__PURE__*/React__default.createElement(Delete, null)
+      }];
+    }
+    if (status === 'TODO') {
+      return [{
+        text: BUTTON_USE,
+        action: onClickUseWarning(warning),
+        icon: /*#__PURE__*/React__default.createElement(Edit, null)
+      }];
+    }
+    return [];
+  };
   return /*#__PURE__*/React__default.createElement(Box, {
     sx: {
       paddingBottom: 2
@@ -6183,40 +6208,44 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
         borderColor: status === 'EXPIRED' ? 'geowebColors.cards.cardContainerDisabledBorder' : 'geowebColors.cards.cardContainerBorder',
         borderRadius: 1,
         borderWidth: activeWarningId === warning.id ? '1px' : '1px',
-        borderStyle: 'solid'
+        borderStyle: 'solid',
+        containerType: 'inline-size'
       },
-      secondaryAction: status !== 'EXPIRED' && ( /*#__PURE__*/React__default.createElement(ToggleMenu, {
+      secondaryAction: status !== 'EXPIRED' ? ( /*#__PURE__*/React__default.createElement(ToggleMenu, {
         menuTitle: BUTTON_OPTIONS,
         tooltipTitle: BUTTON_OPTIONS,
         menuPosition: "bottom",
         "aria-label": BUTTON_OPTIONS,
-        menuItems: status === 'DRAFT' ? [{
-          text: BUTTON_EDIT,
-          action: onClickEditWarning(warning),
-          icon: /*#__PURE__*/React__default.createElement(Edit, null)
-        }, {
-          text: BUTTON_DELETE,
-          action: onClickDeleteWarning(warning.id),
-          icon: /*#__PURE__*/React__default.createElement(Delete, null)
-        }] : [],
+        menuItems: getMenuItems(warning),
         buttonIcon: /*#__PURE__*/React__default.createElement(Options, null)
+      })) : ( /*#__PURE__*/React__default.createElement(Box, {
+        sx: {
+          width: 24
+        }
       }))
     }, /*#__PURE__*/React__default.createElement(ListItemButton, {
-      sx: {
+      sx: _defineProperty({
         height: '100%',
         minHeight: '48px',
-        padding: 1
-      },
+        padding: 1,
+        '.warning-list': {
+          justifyContent: 'left'
+        }
+      }, "@container (min-width: ".concat(breakpoints.desktop, "px)"), {
+        '.warning-list': {
+          justifyContent: 'space-between'
+        }
+      }),
       onClick: onClickWarning(warning),
       "aria-label": "warning item for ".concat(warning.id),
       selected: activeWarningId === warning.id
     }, /*#__PURE__*/React__default.createElement(Grid, {
+      className: "warning-list",
       container: true,
       item: true,
       xs: true,
       rowSpacing: 0,
       columnSpacing: 2,
-      justifyContent: "left",
       alignItems: "center"
     }, /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "Incident",
@@ -6226,15 +6255,15 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
       title: "Last update",
       status: status,
       width: 142
-    }, warning.lastUpdatedTime && "".concat(dateUtils.dateToString(dateUtils.utc(warning.lastUpdatedTime), DATE_FORMAT), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
+    }, warning.lastUpdatedTime && "".concat(dateUtils.dateToString(dateUtils.utc(warning.lastUpdatedTime), DATE_FORMAT_FNS), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "Start time",
       status: status,
       width: 142
-    }, warning.warningDetail.validFrom && "".concat(dateUtils.dateToString(dateUtils.utc(warning.warningDetail.validFrom), DATE_FORMAT), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
+    }, warning.warningDetail.validFrom && "".concat(dateUtils.dateToString(dateUtils.utc(warning.warningDetail.validFrom), DATE_FORMAT_FNS), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "End time",
       status: status,
       width: 142
-    }, warning.warningDetail.validUntil && "".concat(dateUtils.dateToString(dateUtils.utc(warning.warningDetail.validUntil), DATE_FORMAT), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
+    }, warning.warningDetail.validUntil && "".concat(dateUtils.dateToString(dateUtils.utc(warning.warningDetail.validUntil), DATE_FORMAT_FNS), " UTC")), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
       title: "Domain",
       status: status
     }, warning.warningDetail.domain), /*#__PURE__*/React__default.createElement(WarningListColumnContent, {
@@ -6267,7 +6296,8 @@ var WarningsOnStatus = function WarningsOnStatus(_ref) {
       status: status
     }, status === 'DRAFT' ? ( /*#__PURE__*/React__default.createElement(Box, {
       sx: {
-        position: 'relative'
+        position: 'relative',
+        right: 12
       }
     }, warning.editor && ( /*#__PURE__*/React__default.createElement(Box, {
       sx: {

package/package.json

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

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

@@ -4,7 +4,9 @@ import { PublicWarning, PublicWarningStatus } from '../../store/publicWarningFor
 export declare const CREATE_WARNING = "Create a warning";
 export declare const BUTTON_EDIT = "Edit";
 export declare const BUTTON_DELETE = "Delete";
+export declare const BUTTON_USE = "Use";
 export declare const BUTTON_OPTIONS = "Options";
+export declare const getWarningWithoutId: (warning: PublicWarning) => PublicWarning;
 export declare const WarningListColumnContent: React.FC<GridProps & {
     title?: string;
     status: PublicWarningStatus;

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

@@ -1,5 +1,5 @@
 export interface PublicWarningDetail {
-    id: string;
+    id?: string;
     phenomenon: string;
     geoJSON: GeoJSON.FeatureCollection;
     validFrom: string;

package/src/lib/utils/constants.d.ts

@@ -1,5 +1,2 @@
-export declare const DATE_FORMAT = "dd/MM/yyyy HH:mm";
-export declare const DATE_FORMAT_UTC = "yyyy-MM-dd'T'HH:mm:ss'Z'";
 export declare const DATE_FORMAT_HEADER = "EEEE, MMMM dd";
-export declare const DATE_FORMAT_DATE_FIELDS = "DD/MM/YYYY HH:mm";
 export declare const DATE_FORMAT_LASTUPDATEDTIME = "HH:mm";