8086 Bugfixes for layout changes

web/client/components/contextcreator/ContextCreator.jsx

@@ -17,8 +17,9 @@ import ConfigureMap from './ConfigureMapStep';
 import ConfigureThemes from './ConfigureThemes';
 import {CONTEXT_TUTORIALS} from '../../actions/contextcreator';
 /**
- * Filters plugins and applies overrides.
- * The resulting array will filter the pluginsConfig returning only the ones present in viewerPlugins.
+ * Merges plugins "cfg" from pluginsConfigs and applies "overrides" from viewerPlugins.
+ * The resulting array will return viewerPlugins with "cfg" applied directly from the pluginsConfigs and optionally overridden
+ * with "overrides" from viewerPlugins.
  * If some viewerPlugin is an object, it can contain a special entry "overrides". If so, the configuration here
  * will override the ones in the original plugin config.
  * Actually overrides are supported only for "cfg" values.
@@ -46,17 +47,20 @@ import {CONTEXT_TUTORIALS} from '../../actions/contextcreator';
  *               "cfg": { activateQueryTool: false, otherOptions: true }
  *           },
  *   ```
+ * NOTE: Logic has changed to support custom list of plugins to be active on the map configuration step of context wizard.
+ * The final result will match previous implementation except that it will also contain plugins that are missing
+ * in "viewer"/"desktop" array inside localConfig.json -> plugins
  * @param {array} pluginsConfigs array of plugins (Strings or objects) to override
  * @param {array} viewerPlugins list of plugins to use
  */
 export const pluginsFilterOverride = (pluginsConfigs, viewerPlugins) => {
-    return pluginsConfigs.map(p => {
-        const pName = isObject(p) ? p.name : p;
+    return viewerPlugins.map((viewerPlugin) => {
+        const pName = isObject(viewerPlugin) ? viewerPlugin.name : viewerPlugin;
         // find out
-        const viewerPlugin = find(viewerPlugins, vp => {
-            return pName === (isObject(vp) ? vp.name : vp);
+        const p = find(pluginsConfigs, plugin => {
+            return pName === (isObject(plugin) ? plugin.name : plugin);
         });
-        if (viewerPlugin) {
+        if (p) {
             if (isObject(viewerPlugin) && viewerPlugin.overrides) {
                 const newP = isObject(p) ? p : { name: p };
                 const cfg = {
@@ -70,8 +74,8 @@ export const pluginsFilterOverride = (pluginsConfigs, viewerPlugins) => {
             }
             return p;
         }
-        return null;
-    }).filter(p => p); // remove plugins not found
+        return viewerPlugin;
+    });
 };
 
 export default class ContextCreator extends React.Component {

web/client/components/security/UserMenu.jsx

@@ -94,7 +94,7 @@ class UserMenu extends React.Component {
         renderUnsavedMapChangesDialog: true,
         renderButtonText: false,
         hidden: false,
-        displayUnsavedDialog: true
+        displayUnsavedDialog: false
     };
 
     renderGuestTools = () => {

web/client/plugins/MetadataExplorer.jsx

@@ -75,6 +75,7 @@ import {
 } from '../selectors/catalog';
 import { layersSelector } from '../selectors/layers';
 import { currentLocaleSelector, currentMessagesSelector } from '../selectors/locale';
+import {burgerMenuSelector} from "../selectors/controls";
 import { isLocalizedLayerStylesEnabledSelector } from '../selectors/localizedLayerStyles';
 import { projectionSelector } from '../selectors/map';
 import { mapLayoutValuesSelector } from '../selectors/maplayout';
@@ -219,7 +220,7 @@ class MetadataExplorerComponent extends React.Component {
             <ResponsivePanel
                 containerStyle={this.props.dockStyle}
                 containerId="catalog-root"
-                className={this.props.active ? 'catalog-active' : ''}
+                containerClassName={this.props.active ? 'catalog-active' : ''}
                 open={this.props.active}
                 size={this.props.width}
                 position="right"
@@ -296,7 +297,17 @@ export default {
             icon: <Glyphicon glyph="folder-open"/>,
             action: setControlProperty.bind(null, "metadataexplorer", "enabled", true, true),
             doNotHide: true,
-            priority: 2
+            priority: 1
+        },
+        BackgroundSelector: {
+            name: 'MetadataExplorer',
+            doNotHide: true,
+            priority: 1
+        },
+        TOC: {
+            name: 'MetadataExplorer',
+            doNotHide: true,
+            priority: 1
         },
         SidebarMenu: {
             name: 'metadataexplorer',
@@ -305,6 +316,9 @@ export default {
             tooltip: "catalog.tooltip",
             icon: <Glyphicon glyph="folder-open"/>,
             action: setControlProperty.bind(null, "metadataexplorer", "enabled", true, true),
+            selector: (state) => ({
+                style: { display: burgerMenuSelector(state) ? 'none' : null }
+            }),
             toggle: true,
             doNotHide: true,
             priority: 1

web/client/plugins/SidebarMenu.jsx

@@ -11,7 +11,6 @@ import PropTypes from 'prop-types';
 import ContainerDimensions from 'react-container-dimensions';
 import {DropdownButton, Glyphicon, MenuItem} from "react-bootstrap";
 import {connect} from "react-redux";
-import assign from "object-assign";
 import {createSelector} from "reselect";
 import {bindActionCreators} from "redux";
 
@@ -83,6 +82,7 @@ class SidebarMenu extends React.Component {
     }
 
     shouldComponentUpdate(nextProps) {
+        const markedAsInactive = nextProps.isActive === false;
         const newSize = nextProps.state.map?.present?.size?.height !== this.props.state.map?.present?.size?.height;
         const newHeight = nextProps.style.bottom !== this.props.style.bottom;
         const newItems = nextProps.items !== this.props.items;
@@ -93,7 +93,7 @@ class SidebarMenu extends React.Component {
             }
             return prev;
         }, []).length > 0 : false;
-        return newSize || newItems || newVisibleItems || newHeight || burgerMenuState;
+        return newSize || newItems || newVisibleItems || newHeight || burgerMenuState || markedAsInactive;
     }
 
     componentDidUpdate(prevProps) {
@@ -121,19 +121,17 @@ class SidebarMenu extends React.Component {
         return { ...style, height: hasBottomOffset ? 'auto' : '100%', maxHeight: style?.height ?? null, bottom: hasBottomOffset ? `calc(${style.bottom} + 30px)` : null };
     };
 
-    getPanels = items => {
-        return items.filter((item) => item.panel)
-            .map((item) => assign({}, item, {panel: item.panel === true ? item.plugin : item.panel})).concat(
-                items.filter((item) => item.tools).reduce((previous, current) => {
-                    return previous.concat(
-                        current.tools.map((tool, index) => ({
-                            name: current.name + index,
-                            panel: tool,
-                            cfg: current.cfg.toolsCfg ? current.cfg.toolsCfg[index] : {}
-                        }))
-                    );
-                }, [])
+    getPanels = () => {
+        return this.props.items.filter((item) => item.tools).reduce((previous, current) => {
+            return previous.concat(
+                current.tools.map((tool, index) => ({
+                    name: current.name + index,
+                    panel: tool,
+                    cfg: current?.cfg?.toolsCfg?.[index] || {}
+                }))
             );
+        }, []);
+
     };
 
     visibleItems = (target) => {

web/client/plugins/TOC.jsx

@@ -132,7 +132,7 @@ const tocSelector = createSelector(
         layers,
         selectedLayers: layers.filter((l) => head(selectedNodes.filter(s => s === l.id))),
         noFilterResults: layers.filter((l) => filterLayersByTitle(l, filterText, currentLocale)).length === 0,
-        updatableLayersCount: layers.filter(l => l.group !== 'background' && (l.type === 'wms' || l.type === 'wmts')).length > 0,
+        updatableLayersCount: layers.filter(l => l.group !== 'background' && (l.type === 'wms' || l.type === 'wmts')).length,
         selectedGroups: selectedNodes.map(n => getNode(groups, n)).filter(n => n && n.nodes),
         mapName,
         filteredGroups: addFilteredAttributesGroups(groups, [

web/client/themes/default/less/cesium.less

@@ -28,4 +28,8 @@
     text-shadow: none;
     display: table-cell;
     vertical-align: middle;
-}
+}
+
+#map .cesium-viewer .compass {
+    right: 40px;
+}