Fix #2876 Cross layer filter doesn't work if layer has localized title (

#2877)

web/client/components/misc/enhancers/localizeStringMap.js

@@ -8,10 +8,9 @@
 
 
 const PropTypes = require('prop-types');
-const { castArray, isObject } = require('lodash');
+const {castArray} = require('lodash');
 const {getContext, mapProps, compose} = require('recompose');
-
-const getLocalizedProp = (locale, prop) => isObject(prop) ? prop[locale] || prop.default : prop;
+const {getLocalizedProp} = require('../../../utils/LocaleUtils');
 
 const accumulate = (props, locale) => (acc = {}, propName) => ({
             ...acc,

web/client/plugins/FloatingLegend.jsx

@@ -11,7 +11,7 @@ const PropTypes = require('prop-types');
 const assign = require('object-assign');
 const {connect} = require('react-redux');
 const {createSelector} = require('reselect');
-const {reverse, head, get, isObject} = require('lodash');
+const {reverse, head, get} = require('lodash');
 const {updateNode} = require('../actions/layers');
 const {resizeLegend, expandLegend} = require('../actions/floatinglegend');
 const {layersSelector} = require('../selectors/layers');
@@ -22,6 +22,7 @@ const {isFeatureGridOpen} = require('../selectors/featuregrid');
 const {legendSizeSelector, legendExpandedSelector} = require('../selectors/floatinglegend');
 const FloatingLegend = require('../components/TOC/FloatingLegend');
 const {parseLayoutValue, getScales} = require('../utils/MapUtils');
+const {getLocalizedProp} = require('../utils/LocaleUtils');
 
 /**
  * FloatingLegend plugin.
@@ -70,8 +71,6 @@ class FloatingLegendComponent extends React.Component {
     }
 }
 
-const parseTitleObject = (title, currentLocale) => title && isObject(title) && (title[currentLocale] || title.default) || title || '';
-
 const floatingLegendSelector = createSelector(
     [
         layersSelector,
@@ -87,7 +86,7 @@ const floatingLegendSelector = createSelector(
         layers: featuredGridOpen && [] || layers && reverse([
             ...layers
                 .filter(layer => layer && layer.group !== 'background' && !layer.loadingError)
-                .map(({title, ...layer}) => ({...layer, title: parseTitleObject(title, currentLocale)}))
+                .map(({title, ...layer}) => ({...layer, title: getLocalizedProp(currentLocale, title)}))
         ]) || [],
         title: map && map.info && map.info.name || '',
         height: size.height || 300,

web/client/selectors/queryform.js

@@ -3,9 +3,13 @@ const {createSelector} = require('reselect');
 
 const {layersSelector} = require('./layers');
 
+const {currentLocaleSelector} = require('./locale');
+
+const {getLocalizedProp} = require('../utils/LocaleUtils');
+
 const crossLayerFilterSelector = state => get(state, "queryform.crossLayerFilter");
 // TODO we should also check if the layer are from the same source to allow cross layer filtering
-const availableCrossLayerFilterLayersSelector = state =>(layersSelector(state) || []).filter(({type} = {}) => type === "wms");
+const availableCrossLayerFilterLayersSelector = state =>(layersSelector(state) || []).filter(({type} = {}) => type === "wms").map(({title, ...layer}) => ({...layer, title: getLocalizedProp(currentLocaleSelector(state), title)}));
 const spatialFieldGeomSelector = state => get(state, "queryform.spatialField.geometry");
 const spatialFieldSelector = state => get(state, "queryform.spatialField");
 const attributePanelExpandedSelector = state => get(state, "queryform.attributePanelExpanded");

web/client/utils/LocaleUtils.js

@@ -6,7 +6,7 @@
  * LICENSE file in the root directory of this source tree.
  */
 const url = require('url');
-
+const {isObject} = require('lodash');
 const {addLocaleData} = require('react-intl');
 
 const en = require('react-intl/locale-data/en');
@@ -151,7 +151,14 @@ const LocaleUtils = {
             title: 'errorTitleDefault',
             message: 'errorDefault'
         };
-    }
+    },
+    /**
+     * Retrieve localized string from object of translations
+     * @param {string} locale code of locale, eg. en-US
+     * @param {string|object} prop source of translation
+     * @returns {string} localized string
+     */
+    getLocalizedProp: (locale, prop) => isObject(prop) ? prop[locale] || prop.default : prop || ''
 };
 
 module.exports = LocaleUtils;

web/client/utils/__tests__/LocaleUtils-test.js

@@ -72,4 +72,12 @@ describe('LocaleUtils', () => {
             message: 'errorDefault'
         });
     });
+    it('getLocalizedProp', () => {
+        expect(LocaleUtils.getLocalizedProp()).toBe('');
+        const stringProp = 'title';
+        expect(LocaleUtils.getLocalizedProp(undefined, stringProp)).toBe('title');
+        const localizedObjectProp = {'it-IT': 'titolo', 'default': 'title'};
+        expect(LocaleUtils.getLocalizedProp('it-IT', localizedObjectProp)).toBe('titolo');
+        expect(LocaleUtils.getLocalizedProp('fr-FR', localizedObjectProp)).toBe('title');
+    });
 });