@opengeoweb/warnings 9.29.0 → 9.30.0

package/index.esm.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useDispatch, useSelector } from 'react-redux';
-import { Polygons, Share, ExitDomain, Edit, Delete, CoastalEvent, TemperatureLow, TemperatureHigh, Rain, Snow, Lightning, Fog, Wind, Thunderstorm, VulcanicEruption, Haze, FreezingPrecipitation, ModerateAircraftIcing, SevereAircraftIcing, ModerateTurbulence, SevereTurbulence, SandStorm, RadioactiveMaterials, DrawPolygon, Visibility, Add, breakpoints, Close, Options, Copy, Success, Expire, Remove } from '@opengeoweb/theme';
+import { Polygons, Share, ExitDomain, Edit, Delete, CoastalEvent, TemperatureLow, TemperatureHigh, Rain, Snow, Lightning, Fog, Wind, Thunderstorm, VulcanicEruption, Haze, FreezingPrecipitation, ModerateAircraftIcing, SevereAircraftIcing, ModerateTurbulence, SevereTurbulence, SandStorm, RadioactiveMaterials, DrawPolygon, Visibility, Add, breakpoints, Close, Options, ChevronDown, ChevronUp, Copy, Success, Expire, Remove } from '@opengeoweb/theme';
 import { uiTypes, uiActions, getSingularDrawtoolDrawLayerId, drawtoolSelectors, layerSelectors, uiSelectors, mapStoreActions, drawtoolActions, layerActions, useSetupDialog } from '@opengeoweb/store';
 import { defaultPolygon, emptyGeoJSON, MapControlButton, getIcon, rewindGeometry, getGeoJSONPropertyValue, currentlySupportedDrawModes, MapView, MapViewLayer, defaultLayers, getFeatureExtent } from '@opengeoweb/webmap-react';
 import { SHARED_NAMESPACE, useConfirmationDialog, ToggleMenu, dateUtils, calculateStartSize, ToolContainerDraggable, AlertBanner, ConfirmationDialog, getAxiosErrorMessage, usePrevious, CustomIconButton, CustomTooltip, Avatar, getInitials, SwitchButton, CustomToggleButton, Filter, getPosition, FilterChip, FilterListItem, FilterLabel, StatusTag, LastUpdateTime, ErrorBoundary, pollingIntervalTimeout, isAxiosError as isAxiosError$1 } from '@opengeoweb/shared';
@@ -13,12 +13,12 @@ import { generateMapId, LayerType, getWMJSMapById, getGeoCoordFromLatLong, WMBBO
 import { snackbarActions, snackbarTypes } from '@opengeoweb/snackbar';
 import * as React from 'react';
 import React__default, { useState, useEffect, useRef } from 'react';
-import { styled, Box, Typography, ListItem, Grid2, Paper, ListItemButton, Stack, LinearProgress, Button, MenuItem, FormHelperText, Tabs, Tab, Card, CardContent, CircularProgress, Menu, DialogTitle, DialogContent, Switch } from '@mui/material';
+import { styled, Box, Typography, ListItem, Grid2, Paper, ListItemButton, Stack, LinearProgress, Button, MenuItem, FormHelperText, Tabs, Tab, Card, CardContent, CircularProgress, Menu, DialogTitle, DialogContent, Switch, ListItemIcon, Checkbox, ListItemText } from '@mui/material';
 import { VariableSizeList } from 'react-window';
 import AutoSizer from 'react-virtualized-auto-sizer';
 import { getApi, createApiInstance, createNonAuthApiInstance, createFakeApiInstance, ApiProvider, ProductStatus, useAirmetList, useSigmetList } from '@opengeoweb/api';
 import { useFormContext } from 'react-hook-form';
-import { isEqual, cloneDeep, clamp } from 'lodash';
+import { isEqual, cloneDeep, clamp, debounce } from 'lodash';
 import { useAuthenticationContext } from '@opengeoweb/authentication';
 import { produce } from 'immer';
 import { isAxiosError } from 'axios';
@@ -149,8 +149,10 @@ var en = {
 	"filter-source": "Sources",
 	"filter-hide": "Hide {{subject}}",
 	"filter-show": "Show {{subject}}",
-	airmet: "Airmet",
-	sigmet: "Sigmet",
+	"filter-only": "ONLY",
+	"warning-domain-aviation": "Aviation",
+	"warning-domain-maritime": "Maritime",
+	"warning-domain-public": "Public",
 	"error-title-retry": "Try again",
 	"aviation-phenomenon-radioactive-cloud": "Radioactive cloud",
 	"aviation-phenomenon-heavy-sandstorm": "Heavy sandstorm",
@@ -318,7 +320,6 @@ var nl = {
 	"filter-phenomenon": "Fenomenen",
 	"filter-level": "Niveaus",
 	"filter-source": "Bronnen",
-	"error-title-retry": "Probeer opnieuw",
 	"warning-dialog-expire-succes": "Waarschuwing laten verlopen is succesvol",
 	"warning-dialog-expire-title": "Waarschuwing laten verlopen",
 	"warning-dialog-expire-confirm": "Verlopen",
@@ -326,7 +327,12 @@ var nl = {
 	"warning-dialog-withdraw-succes": "Waarschuwing is succesvol ingetrokken",
 	"warning-dialog-withdraw-title": "Waarschuwing intrekken",
 	"warning-dialog-withdraw-confirm": "Intrekken",
-	"warning-dialog-withdraw-description": "Weet je zeker dat je deze waarschuwing wilt intrekken?"
+	"warning-dialog-withdraw-description": "Weet je zeker dat je deze waarschuwing wilt intrekken?",
+	"filter-only": "ALLEEN",
+	"warning-domain-aviation": "Luchtvaart",
+	"warning-domain-maritime": "Maritiem",
+	"warning-domain-public": "Publiek",
+	"error-title-retry": "Probeer opnieuw"
 };
 var fi = {
 	"drawing-tool-form-tools": "Työkalut",
@@ -452,7 +458,6 @@ var fi = {
 	"filter-phenomenon": "ei käännetty",
 	"filter-level": "ei käännetty",
 	"filter-source": "ei käännetty",
-	"error-title-retry": "Yritä uudelleen",
 	"warning-dialog-expire-succes": "ei käännetty",
 	"warning-dialog-expire-title": "ei käännetty",
 	"warning-dialog-expire-confirm": "ei käännetty",
@@ -460,7 +465,12 @@ var fi = {
 	"warning-dialog-withdraw-succes": "ei käännetty",
 	"warning-dialog-withdraw-title": "ei käännetty",
 	"warning-dialog-withdraw-confirm": "ei käännetty",
-	"warning-dialog-withdraw-description": "ei käännetty"
+	"warning-dialog-withdraw-description": "ei käännetty",
+	"filter-only": "Pelkästään",
+	"warning-domain-aviation": "ei käännetty",
+	"warning-domain-maritime": "ei käännetty",
+	"warning-domain-public": "ei käännetty",
+	"error-title-retry": "Yritä uudelleen"
 };
 var no = {
 	"drawing-tool-form-tools": "Verktøy",
@@ -586,7 +596,6 @@ var no = {
 	"filter-phenomenon": "Fenomen",
 	"filter-level": "Grad",
 	"filter-source": "Kilder",
-	"error-title-retry": "Prøv igjen",
 	"warning-dialog-expire-succes": "ikke oversatt",
 	"warning-dialog-expire-title": "ikke oversatt",
 	"warning-dialog-expire-confirm": "ikke oversatt",
@@ -594,7 +603,12 @@ var no = {
 	"warning-dialog-withdraw-succes": "ikke oversatt",
 	"warning-dialog-withdraw-title": "ikke oversatt",
 	"warning-dialog-withdraw-confirm": "ikke oversatt",
-	"warning-dialog-withdraw-description": "ikke oversatt"
+	"warning-dialog-withdraw-description": "ikke oversatt",
+	"filter-only": "BARE",
+	"warning-domain-aviation": "ikke oversatt",
+	"warning-domain-maritime": "ikke oversatt",
+	"warning-domain-public": "ikke oversatt",
+	"error-title-retry": "Prøv igjen"
 };
 var warningsTranslations = {
 	en: en,
@@ -4164,9 +4178,6 @@ const getFilterlistWithTranslationKeys = filterList => filterList.reduce((fiterL
 const defaultFilters = [{
   key: 'incident',
   translationKey: 'filter-incident'
-}, {
-  key: 'domain',
-  translationKey: 'filter-domain'
 }, {
   key: 'phenomenon',
   translationKey: 'filter-phenomenon',
@@ -13909,7 +13920,6 @@ const FilterChipWithOptions = ({
         children: jsx(FilterChip, {
           id: id,
           label: label,
-          onAction: onClickOptions,
           actionIcon: actionButton(selectedFiltersAmount),
           isSelected: isAnyFilterSelected,
           handleClick: onClickOptions,
@@ -14071,14 +14081,218 @@ const FilterChipWithOptionsConnect = ({
   }));
 };
 
+const FilterOption = ({
+  filterId,
+  optionId,
+  checked,
+  onClick,
+  label
+}) => {
+  const {
+    t
+  } = useWarningsTranslation();
+  const [showOnly, setShowOnly] = useState(false);
+  const updateShowOnly = debounce(show => setShowOnly(show), 100);
+  return jsx(ListItem, Object.assign({
+    disablePadding: true,
+    dense: true,
+    sx: {
+      width: '100%',
+      minWidth: '300px',
+      paddingRight: '0px',
+      marginLeft: '-12px',
+      fontSize: '12px'
+    },
+    secondaryAction: showOnly && jsx(CustomIconButton, Object.assign({
+      "aria-label": `Only ${optionId}`,
+      style: {
+        backgroundColor: 'transparent',
+        width: 'auto'
+      },
+      edge: "end",
+      onClick: () => onClick(!checked, true),
+      onMouseOver: () => updateShowOnly(true),
+      onMouseOut: () => updateShowOnly(false)
+    }, {
+      children: jsx(Typography, Object.assign({
+        sx: {
+          color: 'geowebColors.buttons.primary.default.fill',
+          fontSize: '14px',
+          fontWeight: 500
+        }
+      }, {
+        children: t('filter-only')
+      }))
+    }))
+  }, {
+    children: jsxs(ListItemButton, Object.assign({
+      role: undefined,
+      onClick: () => onClick(!checked),
+      onMouseOver: () => updateShowOnly(true),
+      onMouseOut: () => updateShowOnly(false),
+      dense: true,
+      disableGutters: true,
+      sx: {
+        padding: 0
+      }
+    }, {
+      children: [jsx(ListItemIcon, {
+        children: jsx(Checkbox, {
+          checked: checked,
+          tabIndex: -1,
+          disableRipple: true,
+          inputProps: {
+            'aria-labelledby': optionId,
+            'aria-label': optionId
+          }
+        })
+      }), jsx(ListItemText, {
+        id: optionId,
+        sx: {
+          padding: 0,
+          margin: 0
+        },
+        primary: label || t(`warning-${filterId}-${optionId}`)
+      })]
+    }))
+  }), optionId);
+};
+
+const ExpandableFilterChip = ({
+  id,
+  options,
+  updateFilter
+}) => {
+  const {
+    t
+  } = useWarningsTranslation();
+  const [anchorEl, setAnchorEl] = useState(null);
+  const selectedOptions = Object.keys(options).filter(k => options[k]);
+  const allSelected = selectedOptions.length === Object.keys(options).length;
+  return jsxs(Fragment, {
+    children: [jsx(CustomTooltip, Object.assign({
+      title: t('filter-options'),
+      placement: "bottom"
+    }, {
+      children: jsx("span", Object.assign({
+        style: {
+          margin: 0
+        }
+      }, {
+        children: jsx(FilterChip, {
+          id: id,
+          label: t(`filter-${id}`),
+          isSelected: selectedOptions.length > 0,
+          onClick: ref => setAnchorEl(ref),
+          isDisabled: false,
+          size: "medium",
+          actionIcon: jsxs(Grid2, Object.assign({
+            container: true,
+            alignItems: "center",
+            style: {
+              marginRight: '8px',
+              minWidth: '36px'
+            }
+          }, {
+            children: [jsx(Options, {}), jsx(Typography, Object.assign({
+              variant: "body2",
+              sx: {
+                paddingLeft: 0.5
+              }
+            }, {
+              children: selectedOptions.length > 0 && selectedOptions.length
+            }))]
+          }))
+        })
+      }))
+    })), jsxs(Menu, Object.assign({
+      title: t(`filter-${id}`),
+      open: Boolean(anchorEl),
+      onClose: () => setAnchorEl(null),
+      anchorEl: anchorEl,
+      BackdropProps: {
+        style: {
+          opacity: 0,
+          transition: 'none'
+        }
+      },
+      sx: {
+        padding: 3
+      }
+    }, {
+      children: [jsxs(DialogTitle, Object.assign({
+        id: "dialog-title",
+        sx: {
+          zIndex: 1,
+          padding: '8px 18px 16px 24px',
+          display: 'flex',
+          justifyContent: 'space-between',
+          alignItems: 'center'
+        }
+      }, {
+        children: [jsx(Typography, Object.assign({
+          sx: {
+            fontSize: '20px',
+            fontWeight: 500,
+            paddingRight: 1
+          },
+          "data-testid": "customDialog-title",
+          component: "span"
+        }, {
+          children: t(`filter-${id}`)
+        })), jsx(CustomIconButton, Object.assign({
+          "aria-label": t('close-dialog-confirm'),
+          onClick: () => setAnchorEl(null),
+          sx: {
+            '&.MuiIconButton-root': {
+              color: 'geowebColors.greys.accessible'
+            }
+          }
+        }, {
+          children: jsx(Close, {})
+        }))]
+      })), jsxs(DialogContent, Object.assign({
+        sx: {
+          padding: '0px 24px 16px 24px'
+        }
+      }, {
+        children: [jsxs(Grid2, Object.assign({
+          container: true,
+          justifyContent: "space-between",
+          alignItems: "center"
+        }, {
+          children: [t('filter-select-all'), jsx(Switch, {
+            inputProps: {
+              'aria-label': t('filter-select-all')
+            },
+            checked: allSelected,
+            onChange: () => updateFilter(id, 'ALL', !allSelected),
+            sx: {
+              marginRight: '-12px',
+              marginTop: '-6px'
+            }
+          })]
+        })), jsx(Box, {
+          children: Object.keys(options).map(optionId => {
+            return jsx(FilterOption, {
+              filterId: id,
+              optionId: optionId,
+              checked: options[optionId],
+              onClick: (checked, only) => updateFilter(id, optionId, checked, only)
+            }, `${id}-${optionId}`);
+          })
+        })]
+      }))]
+    }))]
+  });
+};
+
 const FilterList = ({
   filters: _filters = [],
   onClickAll: _onClickAll = () => {},
   isAllSelected: _isAllSelected = true,
-  showSigmet: _showSigmet = false,
-  showAirmet: _showAirmet = false,
-  setShowSigmet,
-  setShowAirmet
+  filterState,
+  updateFilter
 }) => {
   const {
     t
@@ -14116,58 +14330,23 @@ const FilterList = ({
       return jsx(FilterChipWithOptionsConnect, {
         filter: filter
       }, filter.id);
-    }), setShowSigmet && jsx(CustomTooltip, Object.assign({
-      title: _showSigmet ? t('filter-hide', {
-        subject: t('sigmet')
-      }) : t('filter-show', {
-        subject: t('sigmet')
-      }),
-      placement: "bottom"
-    }, {
-      children: jsx("span", Object.assign({
-        style: {
-          margin: 0
-        }
-      }, {
-        children: jsx(FilterChip, {
-          id: "sigmet",
-          label: t('sigmet'),
-          isSelected: _showSigmet,
-          handleClick: () => setShowSigmet(!_showSigmet),
-          size: "medium"
-        })
-      }))
-    })), setShowAirmet && jsx(CustomTooltip, Object.assign({
-      title: _showAirmet ? t('filter-hide', {
-        subject: t('airmet')
-      }) : t('filter-show', {
-        subject: t('airmet')
-      }),
-      placement: "bottom"
-    }, {
-      children: jsx("span", Object.assign({
-        style: {
-          margin: 0
-        }
-      }, {
-        children: jsx(FilterChip, {
-          id: "airmet",
-          label: t('airmet'),
-          isSelected: _showAirmet,
-          handleClick: () => setShowAirmet(!_showAirmet),
-          size: "medium"
-        })
-      }))
-    }))]
+    }), filterState && Object.keys(filterState).map(filterId => jsx(ExpandableFilterChip, {
+      id: filterId,
+      options: filterState[filterId],
+      updateFilter: updateFilter
+    }, filterId))]
   }));
 };
 
+const HEADER_SIZE = 32;
 const WarningListItemSeperator = _a => {
   var {
       totalWarnings,
-      status
+      status,
+      isExpanded,
+      onClick
     } = _a,
-    props = __rest(_a, ["totalWarnings", "status"]);
+    props = __rest(_a, ["totalWarnings", "status", "isExpanded", "onClick"]);
   const {
     t
   } = useWarningsTranslation();
@@ -14185,15 +14364,28 @@ const WarningListItemSeperator = _a => {
   };
   const headerText = `${totalWarnings} ${getStatus(status)}`;
   return jsx(ListItem, Object.assign({}, props, {
+    sx: {
+      height: HEADER_SIZE,
+      padding: 0
+    },
     "aria-label": `warninglist ${status}`
   }, {
-    children: jsx(Typography, Object.assign({
-      variant: "caption",
+    children: jsxs(ListItemButton, Object.assign({
       sx: {
-        opacity: 0.67
-      }
+        height: HEADER_SIZE,
+        padding: 0
+      },
+      onClick: onClick
     }, {
-      children: headerText
+      children: [isExpanded ? jsx(ChevronDown, {}) : jsx(ChevronUp, {}), jsx(Typography, Object.assign({
+        variant: "caption",
+        sx: {
+          opacity: 0.67,
+          marginLeft: 1
+        }
+      }, {
+        children: headerText
+      }))]
     }))
   }));
 };
@@ -14774,6 +14966,57 @@ const WarningListItem = _a => {
   }), warning.id);
 };
 
+var Domain;
+(function (Domain) {
+  Domain["aviation"] = "aviation";
+  Domain["maritime"] = "maritime";
+  Domain["public"] = "public";
+})(Domain || (Domain = {}));
+const defaultDomainFilter = {
+  aviation: false,
+  maritime: false,
+  public: true
+};
+const useWarningFilters = () => {
+  const [domainFilter, setDomainFilter] = useState(defaultDomainFilter);
+  const updateState = (state, optionKey, value, only) => {
+    if (only) {
+      return Object.keys(state).reduce((acc, k) => Object.assign(Object.assign({}, acc), {
+        [k]: k === optionKey
+      }), {});
+    }
+    return optionKey === 'ALL' ? Object.keys(state).reduce((acc, k) => Object.assign(Object.assign({}, acc), {
+      [k]: value
+    }), {}) : Object.assign(Object.assign({}, state), {
+      [optionKey]: value
+    });
+  };
+  const updateFilter = (filterKey, optionKey, value, only) => {
+    if (filterKey === 'ALL') {
+      return;
+    }
+    if (filterKey === 'domain') {
+      setDomainFilter(state => {
+        return updateState(state, optionKey, value, only);
+      });
+    }
+  };
+  const byFilterState = warning => {
+    const levelDomain = ['SIG', 'AIR'].find(d => d === warning.warningDetail.level) ? Domain.aviation : Domain.public;
+    if (!domainFilter[levelDomain]) {
+      return false;
+    }
+    return true;
+  };
+  return {
+    filterState: {
+      domain: domainFilter
+    },
+    updateFilter,
+    byFilterState
+  };
+};
+
 const sortWarningsOnStatus = warnings => {
   return warnings.reduce((allWarnings, warning) => {
     const status = warning.status || mapProductStatusToWarningStatus(warning.productStatus);
@@ -14838,10 +15081,6 @@ const PublicWarningList = ({
   error,
   selectedPublicWarningId: _selectedPublicWarningId = '',
   lastUpdatedTime,
-  showSigmet,
-  showAirmet,
-  setShowSigmet,
-  setShowAirmet,
   onSelectWarning: _onSelectWarning = () => {},
   onEditWarning: _onEditWarning = () => {},
   onCreateWarning: _onCreateWarning = () => {},
@@ -14856,20 +15095,37 @@ const PublicWarningList = ({
   const {
     t
   } = useWarningsTranslation();
-  const sortedWarnings = sortWarningsOnStatus(_warnings);
+  const {
+    filterState,
+    updateFilter,
+    byFilterState
+  } = useWarningFilters();
+  const sortedWarnings = sortWarningsOnStatus(_warnings.filter(byFilterState));
+  const [expandedSections, setExpandedSections] = React__default.useState({
+    TODO: true,
+    DRAFT: true,
+    PUBLISHED: true,
+    EXPIRED: true
+  });
+  const toggleExpand = (shouldToggle, status) => {
+    setExpandedSections(Object.assign(Object.assign({}, expandedSections), {
+      [status]: shouldToggle
+    }));
+    resetListIndex();
+  };
   const items = [{
     status: PublicWarningStatus.TODO,
     totalWarnings: sortedWarnings.todo.length
-  }, ...sortedWarnings.todo, {
+  }, ...(expandedSections.TODO ? sortedWarnings.todo : []), {
     status: PublicWarningStatus.DRAFT,
     totalWarnings: sortedWarnings.draft.length
-  }, ...sortedWarnings.draft, {
+  }, ...(expandedSections.DRAFT ? sortedWarnings.draft : []), {
     status: PublicWarningStatus.PUBLISHED,
     totalWarnings: sortedWarnings.published.length
-  }, ...sortedWarnings.published, {
+  }, ...(expandedSections.PUBLISHED ? sortedWarnings.published : []), {
     status: PublicWarningStatus.EXPIRED,
     totalWarnings: sortedWarnings.expired.length
-  }, ...sortedWarnings.expired];
+  }, ...(expandedSections.EXPIRED ? sortedWarnings.expired : [])];
   const getItemSize = (index, width) => {
     const item = items[index];
     if (item.totalWarnings !== undefined) {
@@ -14947,10 +15203,8 @@ const PublicWarningList = ({
           filters: filters,
           isAllSelected: _isAllChipSelected,
           onClickAll: _onClickAllChip,
-          showSigmet: showSigmet,
-          showAirmet: showAirmet,
-          setShowSigmet: setShowSigmet,
-          setShowAirmet: setShowAirmet
+          filterState: filterState,
+          updateFilter: updateFilter
         })
       })), jsxs(Grid2, Object.assign({
         className: "create-warning",
@@ -15084,7 +15338,11 @@ const PublicWarningList = ({
               return jsx(WarningListItemSeperator, {
                 status: header.status,
                 totalWarnings: header.totalWarnings,
-                style: style
+                style: style,
+                isExpanded: expandedSections[warning.status],
+                onClick: () => {
+                  toggleExpand(!expandedSections[header.status], header.status);
+                }
               }, key);
             }
             const publicWarning = warning;
@@ -15297,8 +15555,6 @@ const PublicWarningListConnect = () => {
     refetch: refetchSigmetList,
     isFetching: isFetchingSigmet
   } = useSigmetList();
-  const [showAirmet, setShowAirmet] = React__default.useState(false);
-  const [showSigmet, setShowSigmet] = React__default.useState(false);
   const [confirmDialogOptions, setConfirmDialogOptions] = React__default.useState(undefined);
   const filters = useSelector(selectAllFilters);
   const isAllChipSelected = useSelector(getIsAllSelected);
@@ -15431,7 +15687,7 @@ const PublicWarningListConnect = () => {
   }, [dispatch, warnings]);
   const transformedSigmets = (sigmetList === null || sigmetList === void 0 ? void 0 : sigmetList.map(transformSigmetToWarningFormat)) || [];
   const transformedAirmets = (airmetList === null || airmetList === void 0 ? void 0 : airmetList.map(transformAirmetToWarningFormat)) || [];
-  const combinedWarnings = filteredWarnings.concat(showSigmet ? transformedSigmets : []).concat(showAirmet ? transformedAirmets : []).sort((w1, w2) => {
+  const combinedWarnings = filteredWarnings.concat(transformedSigmets).concat(transformedAirmets).sort((w1, w2) => {
     var _a;
     return ((_a = w2.lastUpdatedTime) === null || _a === void 0 ? void 0 : _a.localeCompare(w1.lastUpdatedTime || '')) || 0;
   });
@@ -15452,11 +15708,7 @@ const PublicWarningListConnect = () => {
       onRefetchWarnings: fetchWarnings,
       filters: filters,
       isAllChipSelected: isAllChipSelected,
-      onClickAllChip: onClickAllChip,
-      showSigmet: showSigmet,
-      showAirmet: showAirmet,
-      setShowSigmet: setShowSigmet,
-      setShowAirmet: setShowAirmet
+      onClickAllChip: onClickAllChip
     }), confirmDialogOptions && jsx(ConfirmDeleteWarningDialog, {
       onClose: () => setConfirmDialogOptions(undefined),
       title: confirmDialogOptions.title,

package/package.json

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

package/src/lib/components/FilterList/ExpandableFilterChip.d.ts

@@ -0,0 +1,10 @@
+/// <reference types="react" />
+import { FilterState, UpdateFilter } from '../PublicWarningList/hooks';
+type IdType = keyof FilterState;
+interface Props {
+    id: IdType;
+    options: FilterState[IdType];
+    updateFilter: UpdateFilter;
+}
+declare const ExpandableFilterChip: React.FC<Props>;
+export default ExpandableFilterChip;

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

@@ -1,13 +1,12 @@
 import { FC } from 'react';
 import { WarningListFilter } from '../../store/publicWarnings/types';
+import { FilterState, UpdateFilter } from '../PublicWarningList/hooks';
 interface FilterListProps {
     filters?: WarningListFilter[];
     onClickAll?: (isChecked: boolean) => void;
     isAllSelected?: boolean;
-    showSigmet?: boolean;
-    showAirmet?: boolean;
-    setShowSigmet?: React.Dispatch<React.SetStateAction<boolean>>;
-    setShowAirmet?: React.Dispatch<React.SetStateAction<boolean>>;
+    filterState?: FilterState;
+    updateFilter: UpdateFilter;
 }
 declare const FilterList: FC<FilterListProps>;
 export default FilterList;

package/src/lib/components/FilterList/FilterOption.d.ts

@@ -0,0 +1,12 @@
+import React, { ReactNode } from 'react';
+import { FilterState, OptionKey } from '../PublicWarningList/hooks';
+type FilterType = keyof FilterState;
+interface Props {
+    filterId: FilterType;
+    optionId: OptionKey<FilterType>;
+    checked: boolean;
+    onClick: (checked: boolean, only?: boolean) => void;
+    label?: ReactNode;
+}
+declare const FilterOption: React.FC<Props>;
+export default FilterOption;

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

@@ -1,16 +1,10 @@
 import React from 'react';
 import { PublicWarning } from '../../store/publicWarningForm/types';
 import { WarningListFilter } from '../../store/publicWarnings/types';
-interface WarningStatusProps {
+import { WarningListItemActions } from './WarningListItemMenu';
+interface PublicWarningListProps extends WarningListItemActions {
     warnings: PublicWarning[];
     onSelectWarning?: (warning: PublicWarning) => void;
-    onEditWarning?: (warning: PublicWarning) => void;
-    onDeleteWarning?: (warningId: string, warningEditor?: string) => void;
-    onDeleteReviewWarning?: (warning: PublicWarning) => void;
-    onExpireWarning?: (warning: PublicWarning) => void;
-    onWithdrawWarning?: (warning: PublicWarning) => void;
-}
-export declare const PublicWarningList: React.FC<{
     isLoading?: boolean;
     error?: Error;
     selectedPublicWarningId?: string;
@@ -20,9 +14,6 @@ export declare const PublicWarningList: React.FC<{
     filters?: WarningListFilter[];
     onClickAllChip?: (isChecked: boolean) => void;
     isAllChipSelected?: boolean;
-    showSigmet?: boolean;
-    showAirmet?: boolean;
-    setShowSigmet?: React.Dispatch<React.SetStateAction<boolean>>;
-    setShowAirmet?: React.Dispatch<React.SetStateAction<boolean>>;
-} & WarningStatusProps>;
+}
+export declare const PublicWarningList: React.FC<PublicWarningListProps>;
 export default PublicWarningList;

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

@@ -7,3 +7,4 @@ export declare const PublicWarningListLight: () => React.ReactElement;
 export declare const PublicWarningListError: () => React.ReactElement;
 export declare const PublicWarningListErrorDeleteWarning: () => React.ReactElement;
 export declare const PublicWarningListDifferentEditors: () => React.ReactElement;
+export declare const PublicWarningListExtraLongList: () => React.ReactElement;

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

@@ -1,17 +1,11 @@
 import React from 'react';
 import { ListItemProps } from '@mui/material';
 import { PublicWarning } from '../../store/publicWarningForm/types';
-interface WarningStatusProps extends ListItemProps {
+import { WarningListItemActions } from './WarningListItemMenu';
+export interface WarningListItemProps extends ListItemProps, WarningListItemActions {
     warning: PublicWarning;
+    activeWarningId: string;
     onSelectWarning?: (warning: PublicWarning) => void;
-    onEditWarning?: (warning: PublicWarning) => void;
-    onDeleteWarning?: (warningId: string, warningEditor?: string) => void;
-    onDeleteReviewWarning?: (warning: PublicWarning) => void;
-    onExpireWarning?: (warning: PublicWarning) => void;
-    onWithdrawWarning?: (warning: PublicWarning) => void;
 }
-declare const WarningListItem: React.FC<{
-    warning: PublicWarning;
-    activeWarningId: string;
-} & WarningStatusProps>;
+declare const WarningListItem: React.FC<WarningListItemProps>;
 export default WarningListItem;

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

@@ -1,13 +1,15 @@
 import { MenuItemType } from '@opengeoweb/shared';
 import { TFunction } from 'i18next';
 import { PublicWarning } from '../../store/publicWarningForm/types';
-interface WarningListItemMenuProps {
-    warning: PublicWarning;
+export interface WarningListItemActions {
     onEditWarning?: (warning: PublicWarning) => void;
     onDeleteWarning?: (warningId: string, warningEditor?: string) => void;
     onDeleteReviewWarning?: (warning: PublicWarning) => void;
     onExpireWarning?: (warning: PublicWarning) => void;
     onWithdrawWarning?: (warning: PublicWarning) => void;
+}
+interface WarningListItemMenuProps extends WarningListItemActions {
+    warning: PublicWarning;
     t: TFunction;
 }
 declare const WarningListItemMenu: ({ warning, onEditWarning, onDeleteWarning, onDeleteReviewWarning, onExpireWarning, onWithdrawWarning, t, }: WarningListItemMenuProps) => MenuItemType[];

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

@@ -4,5 +4,6 @@ import { PublicWarningStatus } from '../../store/publicWarningForm/types';
 declare const WarningListItemSeperator: React.FC<{
     totalWarnings: number;
     status: PublicWarningStatus;
+    isExpanded: boolean;
 } & ListItemProps>;
 export default WarningListItemSeperator;

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

@@ -0,0 +1,19 @@
+import { PublicWarning } from '../../store/publicWarningForm/types';
+declare enum Domain {
+    aviation = "aviation",
+    maritime = "maritime",
+    public = "public"
+}
+declare const defaultDomainFilter: Record<Domain, boolean>;
+export interface FilterState {
+    domain: typeof defaultDomainFilter;
+}
+export type FilterKeyType = keyof FilterState;
+export type OptionKey<T extends FilterKeyType> = keyof FilterState[T];
+export type UpdateFilter = <T extends FilterKeyType>(filterKey: T | 'ALL', optionKey: OptionKey<T> | 'ALL', value: boolean, only?: boolean) => void;
+export declare const useWarningFilters: () => {
+    filterState: FilterState;
+    updateFilter: UpdateFilter;
+    byFilterState: (warning: PublicWarning) => boolean;
+};
+export {};