@opengeoweb/layer-select 10.1.0 → 11.0.0

package/index.esm.js

@@ -4,16 +4,16 @@ import React__default from 'react';
 import { useSelector, useDispatch } from 'react-redux';
 import { CustomIconButton, FilterOption, ToolContainerDraggable, CustomAccordion, CustomToggleButton, CustomTooltip, SearchHighlight, SearchField, ToggleMenu } from '@opengeoweb/shared';
 import { Filter, LayersAdd, Add, Cached, Edit, Visibility, Delete, Close, Copy } from '@opengeoweb/theme';
-import { uiTypes, serviceActions, selectorMemoizationOptions, serviceSelectors, uiActions, getUserAddedServices, setUserAddedServices, layerActions, uiSelectors, layerSelectors, useSetupDialog, mapSelectors, layerTypes } from '@opengeoweb/store';
-import { createEntityAdapter, createSlice, createSelector, createListenerMiddleware, isAnyOf } from '@reduxjs/toolkit';
+import { uiTypes, serviceActions, selectorMemoizationOptions, serviceSelectors, uiActions, getUserAddedServices, setUserAddedServices, layerActions, uiSelectors, layerSelectors, mapListener, serviceListener, layersListener, mapReducer, serviceReducer, layerReducer, uiReducer, useSetupDialog, mapSelectors, layerTypes } from '@opengeoweb/store';
+import { createEntityAdapter, createSlice, createSelector, createListenerMiddleware, isAnyOf, combineReducers, configureStore } from '@reduxjs/toolkit';
 import { compact, countBy, partition } from 'lodash';
-import { Switch, Grid2, List, Box, Typography, Backdrop, CircularProgress, Button, ListItem, ListItemText, Dialog, DialogTitle, LinearProgress, DialogContent, InputAdornment, DialogActions } from '@mui/material';
+import { snackbarListener, snackbarReducer, snackbarTypes, snackbarActions } from '@opengeoweb/snackbar';
+import { Switch, Grid2, List, Box, Typography, useTheme, Backdrop, CircularProgress, Button, ListItem, ListItemText, Dialog, DialogTitle, LinearProgress, DialogContent, InputAdornment, DialogActions } from '@mui/material';
 import 'i18next';
 import { useTranslation } from 'react-i18next';
 import { FixedSizeList } from 'react-window';
 import { getDimensionsList, LayerInfoButton } from '@opengeoweb/webmap-react';
 import { webmapUtils, LayerType, getWMSServiceId, queryWMSServiceInfo, queryWMSLayers, invalidateWMSGetCapabilities, clearImageCacheForAllMaps } from '@opengeoweb/webmap';
-import { snackbarTypes, snackbarActions } from '@opengeoweb/snackbar';
 import { ReactHookFormProvider, defaultFormOptions, ReactHookFormTextField } from '@opengeoweb/form-fields';
 import { useFormContext } from 'react-hook-form';
 
@@ -92,7 +92,7 @@ var fi = {
 	"service-has-been-deleted": "Palvelu \"{{serviceName}}\" poistettu"
 };
 var no = {
-	"layer-select": "Lagvalg",
+	"layer-select": "Datavelger",
 	"select-all": "Velg alle",
 	"groups-and-keywords-dialog-title": "Grupper & Nøkkelord",
 	add: "legg til",
@@ -100,7 +100,7 @@ var no = {
 	"layer-list-results": "resultat",
 	groups: "Grupper",
 	keywords: "Nøkkelord",
-	"layer-select-button-tooltip": "Åpne lagvalg",
+	"layer-select-button-tooltip": "Åpne datavelger",
 	all: "ALLE",
 	services: "Tjenester",
 	"add-a-new-service": "Legg til en ny tjeneste",
@@ -459,8 +459,8 @@ var slice = createSlice({
     });
   }
 });
-var reducer = slice.reducer;
-var layerSelectActions = slice.actions;
+var layerSelectReducer = slice.reducer,
+  layerSelectActions = slice.actions;
 
 /* *
  * Licensed under the Apache License, Version 2.0 (the "License");
@@ -622,7 +622,7 @@ var getFilteredLayers = createSelector([getEnabledServiceIds, serviceSelectors.g
 /**
  * Returns service popup details
  *
- * Example getActiveServices(store, 'server-id');
+ * Example getServicePopupDetails(store, 'server-id');
  * @param {object} store store: object - store object
  * @returns {object} returnType: object of active service
  */
@@ -630,6 +630,27 @@ var getServicePopupDetails = function getServicePopupDetails(store) {
   var _store$layerSelect3;
   return (store == null || (_store$layerSelect3 = store.layerSelect) == null ? void 0 : _store$layerSelect3.servicePopup) || initialServicePopupState;
 };
+/**
+ * Returns service with active filtered layers from seaerch
+ *
+ * Example getFilteredActiveServices(store);
+ * @param {object} store store: object - store object
+ * @returns {object} returnType: object of active service
+ */
+var getFilteredActiveServices = createSelector([getFilteredLayers, getActiveServices, getSearchFilter], function (layers, activeServices, searchResult) {
+  var servicesResult = searchResult.length ? layers.reduce(function (layers, _ref) {
+    var serviceName = _ref.serviceName;
+    return layers.includes(serviceName) ? layers : layers.concat(serviceName);
+  }, []) : [];
+  var updatedServices = Object.fromEntries(Object.entries(activeServices).map(function (_ref2) {
+    var key = _ref2[0],
+      service = _ref2[1];
+    return [key, Object.assign({}, service, {
+      isInSearch: servicesResult.includes(service.serviceId)
+    })];
+  }));
+  return updatedServices;
+}, selectorMemoizationOptions);
 
 var selectors = /*#__PURE__*/Object.freeze({
   __proto__: null,
@@ -643,6 +664,7 @@ var selectors = /*#__PURE__*/Object.freeze({
   getCheckedFilterIds: getCheckedFilterIds,
   getEnabledServiceIds: getEnabledServiceIds,
   getFilterById: getFilterById,
+  getFilteredActiveServices: getFilteredActiveServices,
   getFilteredLayers: getFilteredLayers,
   getFilters: getFilters,
   getSearchFilter: getSearchFilter,
@@ -1167,13 +1189,24 @@ layerSelectListener.startListening({
  * Copyright 2022 - Finnish Meteorological Institute (FMI)
  * Copyright 2024 - The Norwegian Meteorological Institute (MET Norway)
  * */
-var layerSelectConfig = {
-  // TODO: remove id in https://gitlab.com/opengeoweb/opengeoweb/-/issues/5561
-  id: 'layerSelect-module',
-  reducersMap: {
-    layerSelect: reducer
-  },
-  middlewares: [layerSelectListener.middleware]
+var layerSelectReducersMap = {
+  webmap: mapReducer,
+  services: serviceReducer,
+  layers: layerReducer,
+  layerSelect: layerSelectReducer,
+  ui: uiReducer,
+  snackbar: snackbarReducer
+};
+var layerSelectMiddlewares = [mapListener.middleware, serviceListener.middleware, layersListener.middleware, layerSelectListener.middleware, snackbarListener.middleware];
+var layerSelectRootReducer = combineReducers(layerSelectReducersMap);
+var createMockStore = function createMockStore(mockState) {
+  return configureStore({
+    reducer: layerSelectRootReducer,
+    preloadedState: mockState,
+    middleware: function middleware(getDefaultMiddleware) {
+      return getDefaultMiddleware().concat(layerSelectMiddlewares);
+    }
+  });
 };
 
 var KeywordFilterButtonConnect = function KeywordFilterButtonConnect(_ref) {
@@ -1936,9 +1969,12 @@ var ServiceChip = function ServiceChip(_ref) {
     service = _ref.service,
     isSelected = _ref.isSelected,
     isDisabled = _ref.isDisabled,
-    toggleChip = _ref.toggleChip;
+    toggleChip = _ref.toggleChip,
+    isInSearch = _ref.isInSearch;
   var _useLayerSelectTransl = useLayerSelectTranslation(),
     t = _useLayerSelectTransl.t;
+  var _useTheme = useTheme(),
+    geowebColors = _useTheme.palette.geowebColors;
   var chip = all ? 'all' : service && service.serviceUrl;
   return jsx(CustomTooltip, {
     title: service != null && service["abstract"] ? "Abstract: " + service["abstract"] : '',
@@ -1955,7 +1991,17 @@ var ServiceChip = function ServiceChip(_ref) {
           return toggleChip(chip);
         },
         disabled: isDisabled,
-        sx: style$1,
+        sx: Object.assign({}, style$1, isInSearch && Object.assign({
+          backgroundColor: geowebColors.chip.highlightDefault.rgba + "!important",
+          '&:hover': {
+            backgroundColor: geowebColors.chip.highlightDefaultMouseOver.rgba + "!important"
+          }
+        }, isSelected && {
+          backgroundColor: geowebColors.chip.highlightActiveDefault.rgba + "!important",
+          '&:hover': {
+            backgroundColor: geowebColors.chip.highlightActiveMouseOver.rgba + "!important"
+          }
+        })),
         children: service ? service.serviceName : t('all')
       })
     })
@@ -1967,6 +2013,7 @@ var ServiceChipConnect = function ServiceChipConnect(_ref) {
     isAllSelected = _ref.isAllSelected;
   var dispatch = useDispatch();
   var serviceId = service.serviceId;
+  var isInSearch = service.isInSearch || false;
   var toggleChip = function toggleChip() {
     if (service.enabled) {
       if (isAllSelected) {
@@ -1988,7 +2035,8 @@ var ServiceChipConnect = function ServiceChipConnect(_ref) {
     service: service,
     toggleChip: toggleChip,
     isSelected: isAllSelected ? false : service.enabled,
-    isDisabled: service.isLoading
+    isDisabled: service.isLoading,
+    isInSearch: isInSearch
   });
 };
 var AllChipConnect = function AllChipConnect(_ref2) {
@@ -2058,12 +2106,12 @@ var ServiceList = function ServiceList(_ref) {
 
 var ServiceListConnect = function ServiceListConnect(_ref) {
   var setHeight = _ref.setHeight;
-  var activeServices = useAppSelector(function (store) {
-    return getActiveServices(store);
+  var filteredActiveServices = useAppSelector(function (store) {
+    return getFilteredActiveServices(store);
   });
   return jsx(ServiceList, {
     setHeight: setHeight,
-    activeServicesById: sortByService(activeServices)
+    activeServicesById: sortByService(filteredActiveServices)
   });
 };
 
@@ -3161,4 +3209,4 @@ var LayerSelectConnect = function LayerSelectConnect(_ref) {
   });
 };
 
-export { AllChipConnect, KeywordFilterButtonConnect, KeywordFilterResults, KeywordFilterResultsConnect, KeywordFilterResultsListItemConnect, KeywordFilterSelectAllSwitchConnect, LAYER_SELECT_NAMESPACE, LayerAddRemoveButton, LayerList, LayerListConnect, LayerListDimensions, LayerListRow, LayerSelectButtonConnect, LayerSelectConnect, SearchFieldConnect, ServiceChip, ServiceChipConnect, ServiceList, ServiceListConnect, ServiceOptionsButton, ServiceOptionsDialog, ServiceOptionsDialogConnect, ServicePopup, ServicePopupConnect, ServicePopupDialogConnect, getServiceFailedUpdateMessage, getServiceSuccesUpdateMessage, getSuccesMessage, isUserAddedService, layerSelectActions, layerSelectConfig, initialState as layerSelectInitialState, layerSelectListener, reducer as layerSelectReducer, selectors as layerSelectSelectors, layerSelectTranslations, types as layerSelectTypes, useAppSelector };
+export { AllChipConnect, KeywordFilterButtonConnect, KeywordFilterResults, KeywordFilterResultsConnect, KeywordFilterResultsListItemConnect, KeywordFilterSelectAllSwitchConnect, LAYER_SELECT_NAMESPACE, LayerAddRemoveButton, LayerList, LayerListConnect, LayerListDimensions, LayerListRow, LayerSelectButtonConnect, LayerSelectConnect, SearchFieldConnect, ServiceChip, ServiceChipConnect, ServiceList, ServiceListConnect, ServiceOptionsButton, ServiceOptionsDialog, ServiceOptionsDialogConnect, ServicePopup, ServicePopupConnect, ServicePopupDialogConnect, createMockStore, getServiceFailedUpdateMessage, getServiceSuccesUpdateMessage, getSuccesMessage, isUserAddedService, layerSelectActions, initialState as layerSelectInitialState, layerSelectListener, layerSelectMiddlewares, layerSelectReducer, layerSelectReducersMap, selectors as layerSelectSelectors, layerSelectTranslations, types as layerSelectTypes, useAppSelector };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opengeoweb/layer-select",
-  "version": "10.1.0",
+  "version": "11.0.0",
   "description": "GeoWeb layer select library for the opengeoweb project",
   "license": "Apache-2.0",
   "repository": {

package/src/lib/components/ServiceList/ServiceChip.d.ts

@@ -6,6 +6,7 @@ interface ServiceChipProps {
     isSelected?: boolean;
     isDisabled?: boolean;
     toggleChip?: (service: string) => void;
+    isInSearch?: boolean;
 }
 export declare const ServiceChip: React.FC<ServiceChipProps>;
 export {};

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

@@ -1,7 +1,7 @@
-export { layerSelectActions, initialState as layerSelectInitialState, reducer as layerSelectReducer, } from './reducer';
+export { layerSelectActions, initialState as layerSelectInitialState, layerSelectReducer, } from './reducer';
 export * as layerSelectSelectors from './selectors';
 export { useAppSelector } from './selectors';
 export * as layerSelectTypes from './types';
-export * from './config';
+export * from './store';
 export { isUserAddedService } from './utils';
 export { layerSelectListener } from './listeners';

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

@@ -5,8 +5,7 @@ export declare const layerSelectFilterAdapter: import("@reduxjs/toolkit").Entity
 export declare const layerSelectActiveServicesAdapter: import("@reduxjs/toolkit").EntityAdapter<ActiveServiceObject>;
 export declare const initialServicePopupState: ServicePopupObject;
 export declare const initialState: LayerSelectStoreType;
-export declare const reducer: import("redux").Reducer<LayerSelectStoreType>;
-export declare const layerSelectActions: import("@reduxjs/toolkit").CaseReducerActions<{
+export declare const layerSelectReducer: import("redux").Reducer<LayerSelectStoreType>, layerSelectActions: import("@reduxjs/toolkit").CaseReducerActions<{
     setSearchFilter: (draft: Draft<LayerSelectStoreType>, action: PayloadAction<SetSearchFilterPayload>) => void;
     closeServicePopupOpen: (draft: Draft<LayerSelectStoreType>) => void;
     toggleServicePopup: (draft: Draft<LayerSelectStoreType>, action: PayloadAction<ToggleServicePopupPayload>) => void;

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

@@ -90,8 +90,48 @@ export declare const getFilteredLayers: ((state: LayerSelectModuleState & import
 /**
  * Returns service popup details
  *
- * Example getActiveServices(store, 'server-id');
+ * Example getServicePopupDetails(store, 'server-id');
  * @param {object} store store: object - store object
  * @returns {object} returnType: object of active service
  */
 export declare const getServicePopupDetails: (store: LayerSelectModuleState) => ServicePopupObject;
+/**
+ * Returns service with active filtered layers from seaerch
+ *
+ * Example getFilteredActiveServices(store);
+ * @param {object} store store: object - store object
+ * @returns {object} returnType: object of active service
+ */
+export declare const getFilteredActiveServices: ((state: LayerSelectModuleState & import("@opengeoweb/store").CoreAppStore) => {
+    [k: string]: {
+        isInSearch: boolean;
+        serviceId?: string | undefined;
+        serviceName?: string | undefined;
+        serviceUrl?: string | undefined;
+        abstract?: string | undefined;
+        enabled?: boolean | undefined;
+        filterIds?: string[] | undefined;
+        scope?: import("dist/libs/shared/src").SystemScope | undefined;
+        isLoading?: boolean | undefined;
+        keywords?: string[] | undefined;
+        groups?: string[] | undefined;
+    };
+}) & import("reselect").OutputSelectorFields<(args_0: LayerWithServiceName[], args_1: ActiveServiceObjectEntities, args_2: string) => {
+    [k: string]: {
+        isInSearch: boolean;
+        serviceId?: string | undefined;
+        serviceName?: string | undefined;
+        serviceUrl?: string | undefined;
+        abstract?: string | undefined;
+        enabled?: boolean | undefined;
+        filterIds?: string[] | undefined;
+        scope?: import("dist/libs/shared/src").SystemScope | undefined;
+        isLoading?: boolean | undefined;
+        keywords?: string[] | undefined;
+        groups?: string[] | undefined;
+    };
+}, {
+    clearCache: () => void;
+}> & {
+    clearCache: () => void;
+};

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

@@ -0,0 +1,13 @@
+import { WebMapStateModuleState, UIModuleState } from '@opengeoweb/store';
+import { ToolkitStore } from '@reduxjs/toolkit/dist/configureStore';
+import { LayerSelectModuleState } from './types';
+export declare const layerSelectReducersMap: {
+    webmap: import("redux").Reducer<import("dist/libs/store/src/store/map/types").WebMapState, import("redux").AnyAction>;
+    services: import("redux").Reducer<import("dist/libs/store/src/store/map/types").ServiceState, import("redux").AnyAction>;
+    layers: import("redux").Reducer<import("dist/libs/store/src/store/map/types").LayerState, import("redux").AnyAction>;
+    layerSelect: import("redux").Reducer<import("./types").LayerSelectStoreType>;
+    ui: import("redux").Reducer<import("dist/libs/store/src/store/ui/types").UIStoreType, import("redux").AnyAction>;
+    snackbar: import("redux").Reducer<import("dist/libs/snackbar/src/lib/store/types").SnackbarState, import("redux").AnyAction>;
+};
+export declare const layerSelectMiddlewares: (import("@reduxjs/toolkit").ListenerMiddleware<import("./types").RootState, import("@reduxjs/toolkit").ThunkDispatch<import("./types").RootState, unknown, import("redux").AnyAction>, unknown> | import("@reduxjs/toolkit").ListenerMiddleware<import("@opengeoweb/snackbar").SnackbarModuleStore, import("@reduxjs/toolkit").ThunkDispatch<import("@opengeoweb/snackbar").SnackbarModuleStore, unknown, import("redux").AnyAction>, unknown>)[];
+export declare const createMockStore: (mockState?: WebMapStateModuleState | LayerSelectModuleState | UIModuleState) => ToolkitStore;

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

@@ -1,3 +1,4 @@
+import { SystemScope } from '@opengeoweb/shared';
 import { CoreAppStore, serviceTypes } from '@opengeoweb/store';
 import { EntityState } from '@reduxjs/toolkit';
 export type RootState = CoreAppStore & LayerSelectModuleState;
@@ -11,10 +12,11 @@ export interface ActiveServiceObject {
     abstract?: string;
     enabled?: boolean;
     filterIds?: string[];
-    scope?: serviceTypes.ServiceScope;
+    scope?: SystemScope;
     isLoading?: boolean;
     keywords?: string[];
     groups?: string[];
+    isInSearch?: boolean;
 }
 export type FilterType = 'keywords' | 'groups';
 export interface Filter {

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

@@ -1,8 +1,9 @@
-import { EntityAdapter, Draft } from '@reduxjs/toolkit';
+import { SystemScope } from '@opengeoweb/shared';
 import { serviceTypes } from '@opengeoweb/store';
 import { LayerProps } from '@opengeoweb/webmap';
+import { Draft, EntityAdapter } from '@reduxjs/toolkit';
 import { Filter, FilterType, LayerSelectStoreType } from './types';
 export declare const getFilterId: (filterType: FilterType, filterName: string) => string;
 export declare const produceFilters: (filterNames: string[], filterType: FilterType, draft: Draft<LayerSelectStoreType>, layerSelectFilterAdapter: EntityAdapter<Filter>) => void;
 export declare const filterLayersFromService: (serviceId: string, services: serviceTypes.Services, filterIds: string[], allFiltersActive: boolean, searchString: string) => LayerProps[];
-export declare const isUserAddedService: (scope: serviceTypes.ServiceScope) => boolean;
+export declare const isUserAddedService: (scope: SystemScope) => boolean;

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

@@ -1,7 +0,0 @@
-export declare const layerSelectConfig: {
-    id: string;
-    reducersMap: {
-        layerSelect: import("redux").Reducer<import("./types").LayerSelectStoreType>;
-    };
-    middlewares: import("@reduxjs/toolkit").ListenerMiddleware<import("./types").RootState, import("redux-thunk").ThunkDispatch<import("./types").RootState, unknown, import("redux").AnyAction>, unknown>[];
-};

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

@@ -1 +0,0 @@
-export { createMockStore } from './testUtils';

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

@@ -1,4 +0,0 @@
-import { Store } from '@reduxjs/toolkit';
-import { uiTypes, WebMapStateModuleState } from '@opengeoweb/store';
-import { LayerSelectModuleState } from '../store/types';
-export declare const createMockStore: (mockState?: LayerSelectModuleState & uiTypes.UIModuleState & WebMapStateModuleState) => Store;