Fix #9729 fixed formats in catalog used in dashboard (#9733)

web/client/epics/__tests__/catalog-test.js

@@ -16,7 +16,6 @@ const {
     autoSearchEpic,
     openCatalogEpic,
     recordSearchEpic,
-    getSupportedFormatsEpic,
     updateGroupSelectedMetadataExplorerEpic,
     newCatalogServiceAdded
 } = catalog(API);
@@ -34,12 +33,8 @@ import {
     RECORD_LIST_LOADED,
     RECORD_LIST_LOAD_ERROR,
     SET_LOADING,
-    formatOptionsFetch,
-    FORMAT_OPTIONS_LOADING,
-    SET_FORMAT_OPTIONS,
     ADD_LAYER_AND_DESCRIBE,
     addLayerAndDescribe,
-    SHOW_FORMAT_ERROR,
     DESCRIBE_ERROR,
     SAVING_SERVICE,
     NEW_SERVICE_STATUS,
@@ -748,38 +743,6 @@ describe('catalog Epics', () => {
                 }
             });
     });
-    it('getSupportedFormatsEpic wms', (done) => {
-        const NUM_ACTIONS = 4;
-        const url = "base/web/client/test-resources/wms/GetCapabilities-1.1.1.xml";
-        testEpic(addTimeoutEpic(getSupportedFormatsEpic, 0), NUM_ACTIONS, formatOptionsFetch(url), (actions) => {
-            expect(actions.length).toBe(NUM_ACTIONS);
-            try {
-                actions.map((action) => {
-                    switch (action.type) {
-                    case SET_FORMAT_OPTIONS:
-                        expect(action.formats).toBeTruthy();
-                        expect(action.formats.imageFormats).toEqual(['image/png', 'image/gif', 'image/jpeg', 'image/png8', 'image/png; mode=8bit', 'image/vnd.jpeg-png']);
-                        expect(action.formats.infoFormats).toEqual(['text/plain', 'text/html', 'application/json']);
-                        break;
-                    case SHOW_FORMAT_ERROR:
-                        expect(action.status).toBeFalsy();
-                        break;
-                    case FORMAT_OPTIONS_LOADING:
-                        break;
-                    case TEST_TIMEOUT:
-                        break;
-                    default:
-                        expect(true).toBe(false);
-                    }
-                });
-            } catch (e) {
-                done(e);
-            }
-            done();
-        }, {
-            catalog: {}
-        });
-    });
 
     it('updateGroupSelectedMetadataExplorerEpic allows clicking on group to set destination to current group', done => {
         const state = {

web/client/epics/__tests__/config-test.js

@@ -8,7 +8,9 @@
 
 import expect from 'expect';
 import {head} from 'lodash';
-import {loadMapConfigAndConfigureMap, loadMapInfoEpic, storeDetailsInfoDashboardEpic, storeDetailsInfoEpic, backgroundsListInitEpic} from '../config';
+import {
+    loadMapConfigAndConfigureMap, loadMapInfoEpic, storeDetailsInfoDashboardEpic, storeDetailsInfoEpic, backgroundsListInitEpic,    getSupportedFormatsEpic
+} from '../config';
 import {LOAD_USER_SESSION} from '../../actions/usersession';
 import {
     loadMapConfig,
@@ -32,13 +34,50 @@ import ConfigUtils from "../../utils/ConfigUtils";
 import { DETAILS_LOADED } from '../../actions/details';
 import { EMPTY_RESOURCE_VALUE } from '../../utils/MapInfoUtils';
 import { dashboardLoaded } from '../../actions/dashboard';
-
+import {
+    formatOptionsFetch,
+    FORMAT_OPTIONS_LOADING,
+    SET_FORMAT_OPTIONS,
+    SHOW_FORMAT_ERROR
+} from '../../actions/catalog';
 const api = {
     getResource: () => Promise.resolve({mapId: 1234})
 };
 let mockAxios;
 
 describe('config epics', () => {
+    it('getSupportedFormatsEpic wms', (done) => {
+        const NUM_ACTIONS = 4;
+        const url = "base/web/client/test-resources/wms/GetCapabilities-1.1.1.xml";
+        testEpic(addTimeoutEpic(getSupportedFormatsEpic, 0), NUM_ACTIONS, formatOptionsFetch(url), (actions) => {
+            expect(actions.length).toBe(NUM_ACTIONS);
+            try {
+                actions.map((action) => {
+                    switch (action.type) {
+                    case SET_FORMAT_OPTIONS:
+                        expect(action.formats).toBeTruthy();
+                        expect(action.formats.imageFormats).toEqual(['image/png', 'image/gif', 'image/jpeg', 'image/png8', 'image/png; mode=8bit', 'image/vnd.jpeg-png']);
+                        expect(action.formats.infoFormats).toEqual(['text/plain', 'text/html', 'application/json']);
+                        break;
+                    case SHOW_FORMAT_ERROR:
+                        expect(action.status).toBeFalsy();
+                        break;
+                    case FORMAT_OPTIONS_LOADING:
+                        break;
+                    case TEST_TIMEOUT:
+                        break;
+                    default:
+                        expect(true).toBe(false);
+                    }
+                });
+            } catch (e) {
+                done(e);
+            }
+            done();
+        }, {
+            catalog: {}
+        });
+    });
     describe('loadMapConfigAndConfigureMap', () => {
         beforeEach(done => {
             ConfigUtils.setConfigProp("userSessions", {

web/client/epics/catalog.js

@@ -20,7 +20,6 @@ import {
     GET_METADATA_RECORD_BY_ID,
     TEXT_SEARCH,
     CATALOG_CLOSE,
-    FORMAT_OPTIONS_FETCH,
     addCatalogService,
     setLoading,
     deleteCatalogService,
@@ -32,9 +31,6 @@ import {
     resetCatalog,
     textSearch,
     changeSelectedService,
-    formatsLoading,
-    showFormatError,
-    setSupportedFormats,
     ADD_LAYER_AND_DESCRIBE,
     describeError,
     addLayer,
@@ -55,7 +51,6 @@ import {
     selectedCatalogSelector,
     searchOptionsSelector,
     catalogSearchInfoSelector,
-    getFormatUrlUsedSelector,
     isActiveSelector, servicesSelectorWithBackgrounds
 } from '../selectors/catalog';
 import { metadataSourceSelector } from '../selectors/backgroundselector';
@@ -66,11 +61,11 @@ import {
     buildSRSMap,
     extractOGCServicesReferences
 } from '../utils/CatalogUtils';
-import { getSupportedFormat, getCapabilities, describeLayers, flatLayers } from '../api/WMS';
+import { getCapabilities, describeLayers, flatLayers } from '../api/WMS';
 import CoordinatesUtils from '../utils/CoordinatesUtils';
 import ConfigUtils from '../utils/ConfigUtils';
 import {getCapabilitiesUrl, getLayerId, getLayerUrl, removeWorkspace} from '../utils/LayersUtils';
-import { wrapStartStop } from '../observables/epics';
+
 import {zoomToExtent} from "../actions/map";
 import CSW from '../api/CSW';
 import { projectionSelector } from '../selectors/map';
@@ -502,42 +497,6 @@ export default (API) => ({
                     [changeSelectedService(head(keys(services))), allowBackgroundsDeletion(true)] : [])));
             }),
 
-    /**
-     * Fetch all supported formats of a WMS service configured (infoFormats and imageFormats)
-     * Dispatches an action that sets the supported formats of the service.
-     * @param {Observable} action$ the actions triggered
-     * @param {object} getState store object
-     * @memberof epics.catalog
-     * @return {external:Observable}
-     */
-    getSupportedFormatsEpic: (action$, {getState = ()=> {}} = {}) =>
-        action$.ofType(FORMAT_OPTIONS_FETCH)
-            .filter((action)=> action.force || getFormatUrlUsedSelector(getState()) !== action?.url)
-            .switchMap(({url = ''} = {})=> {
-                return Rx.Observable.defer(() => getSupportedFormat(url, true))
-                    .switchMap((supportedFormats) => {
-                        return Rx.Observable.of(
-                            setSupportedFormats(supportedFormats, url),
-                            showFormatError(supportedFormats.imageFormats.length === 0 && supportedFormats.infoFormats.length === 0)
-                        );
-                    })
-                    .let(
-                        wrapStartStop(
-                            formatsLoading(true),
-                            formatsLoading(false),
-                            () => {
-                                return Rx.Observable.of(
-                                    error({
-                                        title: "layerProperties.format.error.title",
-                                        message: 'layerProperties.format.error.message'
-                                    }),
-                                    formatsLoading(false)
-                                );
-                            }
-                        )
-                    );
-            }),
-
     /**
     * Sets control property to currently selected group when catalogue is open
     * Sets the currently selected group as the destination of new layers in catalogue

web/client/epics/config.js

@@ -36,6 +36,18 @@ import {getRequestParameterValue} from "../utils/QueryParamsUtils";
 import { EMPTY_RESOURCE_VALUE } from '../utils/MapInfoUtils';
 import { changeLayerProperties } from '../actions/layers';
 import { createBackgroundsList, setCurrentBackgroundLayer } from '../actions/backgroundselector';
+import {
+    FORMAT_OPTIONS_FETCH,
+    formatsLoading,
+    showFormatError,
+    setSupportedFormats
+} from '../actions/catalog';
+import {
+    getFormatUrlUsedSelector
+} from '../selectors/catalog';
+import { getSupportedFormat } from '../api/WMS';
+import { wrapStartStop } from '../observables/epics';
+import { error } from '../actions/notifications';
 
 const prepareMapConfiguration = (data, override, state) => {
     const queryParamsMap = getRequestParameterValue('map', state);
@@ -280,3 +292,41 @@ export const backgroundsListInitEpic = (action$) =>
                 ...(currentBackground ? [setCurrentBackgroundLayer(currentBackground.id)] : [])
             );
         });
+
+
+/**
+     * this epic is moved here because it needs to work also in dashboards
+     * Fetch all supported formats of a WMS service configured (infoFormats and imageFormats)
+     * Dispatches an action that sets the supported formats of the service.
+     * @param {Observable} action$ the actions triggered
+     * @param {object} getState store object
+     * @memberof epics.catalog
+     * @return {external:Observable}
+     */
+export const getSupportedFormatsEpic = (action$, {getState = ()=> {}} = {}) =>
+    action$.ofType(FORMAT_OPTIONS_FETCH)
+        .filter((action)=> action.force || getFormatUrlUsedSelector(getState()) !== action?.url)
+        .switchMap(({url = ''} = {})=> {
+            return Observable.defer(() => getSupportedFormat(url, true))
+                .switchMap((supportedFormats) => {
+                    return Observable.of(
+                        setSupportedFormats(supportedFormats, url),
+                        showFormatError(supportedFormats.imageFormats.length === 0 && supportedFormats.infoFormats.length === 0)
+                    );
+                })
+                .let(
+                    wrapStartStop(
+                        formatsLoading(true),
+                        formatsLoading(false),
+                        () => {
+                            return Observable.of(
+                                error({
+                                    title: "layerProperties.format.error.title",
+                                    message: 'layerProperties.format.error.message'
+                                }),
+                                formatsLoading(false)
+                            );
+                        }
+                    )
+                );
+        });

web/client/plugins/widgetbuilder/enhancers/catalogEditorEnhancer.js

@@ -12,6 +12,16 @@ import { dashboardSetSelectedService, setDashboardCatalogMode, dashboardDeleteSe
 import { dashboardServicesSelector,
     selectedDashboardServiceSelector, dashboardCatalogModeSelector, dashboardIsNewServiceSelector } from '../../../selectors/dashboard';
 import { error } from '../../../actions/notifications';
+import {
+    getSupportedFormatsInNewServiceSelector,
+    getSupportedGFIFormatsSelector,
+    formatsLoadingSelector,
+    showFormatErrorSelector
+} from '../../../selectors/catalog';
+import {
+    formatOptionsFetch
+} from '../../../actions/catalog';
+
 import CatalogServiceEditor from '../CatalogServiceEditor';
 
 export const catalogEditorEnhancer = compose(
@@ -20,12 +30,17 @@ export const catalogEditorEnhancer = compose(
         marginRight: "5px"}}),
     connect((state) => ({
         mode: dashboardCatalogModeSelector(state),
+        showFormatError: showFormatErrorSelector(state),
         dashboardServices: dashboardServicesSelector(state),
+        formatsLoading: formatsLoadingSelector(state),
+        infoFormatOptions: getSupportedGFIFormatsSelector(state),
+        formatOptions: getSupportedFormatsInNewServiceSelector(state),
         dashboardSelectedService: selectedDashboardServiceSelector(state),
         isNew: dashboardIsNewServiceSelector(state)
     }), {
         onChangeSelectedService: dashboardSetSelectedService,
         onChangeCatalogMode: setDashboardCatalogMode,
+        onFormatOptionsFetch: formatOptionsFetch,
         onDeleteService: dashboardDeleteService,
         onAddService: updateDashboardService,
         error: error

web/client/selectors/catalog.js

@@ -56,9 +56,11 @@ export const catalogSearchInfoSelector = createStructuredSelector({
     projection: projectionSelector
 });
 export const formatsLoadingSelector = (state) => get(state, "catalog.formatsLoading", false);
+export const getSupportedFormatsInNewServiceSelector = (state) => get(state, "catalog.newService.supportedFormats.imageFormats", []);
 export const getSupportedFormatsSelector = (state) => modeSelector(state) === 'edit'
-    ? get(state, "catalog.newService.supportedFormats.imageFormats", [])
+    ? getSupportedFormatsInNewServiceSelector(state)
     : selectedCatalogSelector(state)?.supportedFormats?.imageFormats || [];
+
 export const getSupportedGFIFormatsSelector = (state) => get(state, "catalog.newService.supportedFormats.infoFormats", getDefaultSupportedGetFeatureInfoFormats());
 export const getFormatUrlUsedSelector = (state) => get(state, "catalog.newService.formatUrlUsed", '');
 export const getNewServiceStatusSelector = (state) => get(state, "catalog.isNewServiceAdded", false);