diff --git a/web/client/components/widgets/widget/LegendView.jsx b/web/client/components/widgets/widget/LegendView.jsx index 9fbd537af6..69a3b35fac 100644 --- a/web/client/components/widgets/widget/LegendView.jsx +++ b/web/client/components/widgets/widget/LegendView.jsx @@ -35,7 +35,8 @@ export default ({ scales, zoom: currentZoomLvl, layerOptions: { - legendOptions: legendProps + legendOptions: legendProps, + hideFilter: true } }} onChangeMap={(newMap) => { diff --git a/web/client/plugins/FilterLayer/index.jsx b/web/client/plugins/FilterLayer/index.jsx index 1def09715e..5c7e1b58ad 100644 --- a/web/client/plugins/FilterLayer/index.jsx +++ b/web/client/plugins/FilterLayer/index.jsx @@ -9,7 +9,7 @@ import React from 'react'; import { connect } from 'react-redux'; import { createPlugin } from '../../utils/PluginsUtils'; import { openQueryBuilder } from '../../actions/layerFilter'; -import FilterNodeTool from './components/FilterNodeTool'; + // dummy plugin const FilterLayer = () => null; @@ -55,11 +55,6 @@ export default createPlugin('FilterLayer', target: 'toolbar', Component: FilterLayerButton, position: 6 - }, { - name: "FilterLayer", - target: 'node-tool', - Component: FilterNodeTool, - position: 6 }] } } diff --git a/web/client/plugins/TOC/components/DefaultLayer.jsx b/web/client/plugins/TOC/components/DefaultLayer.jsx index 991640bfe5..6599e1bdab 100644 --- a/web/client/plugins/TOC/components/DefaultLayer.jsx +++ b/web/client/plugins/TOC/components/DefaultLayer.jsx @@ -23,6 +23,7 @@ import NodeHeader from './NodeHeader'; import NodeTool from './NodeTool'; import ExpandButton from './ExpandButton'; import Message from '../../../components/I18N/Message'; +import FilterNodeTool from './FilterNodeTool'; const getLayerVisibilityWarningMessageId = (node, config = {}) => { if (config.visualizationMode === VisualizationModes._2D && ['3dtiles', 'model'].includes(node.type)) { @@ -127,6 +128,10 @@ const DefaultLayerNode = ({ itemComponent: NodeTool }; + const filterNode = !config?.layerOptions?.hideFilter + ? [{ name: 'FilterLayer', Component: FilterNodeTool }] + : []; + return ( <> : null) : null} - {nodeToolItems.filter(({ selector = () => true }) => selector(componentProps)).map(({ Component, name }) => { + {[ ...filterNode, ...nodeToolItems ].filter(({ selector = () => true }) => selector(componentProps)).map(({ Component, name }) => { return (); })} @@ -216,6 +221,7 @@ const DefaultLayerNode = ({ * @prop {object} config.layerOptions.tooltipOptions options for layer title tooltip * @prop {boolean} config.layerOptions.hideLegend hide the legend of the layer * @prop {object} config.layerOptions.legendOptions additional options for WMS legend + * @prop {boolean} config.layerOptions.hideFilter hide the filter button */ const DefaultLayer = ({ node: nodeProp, diff --git a/web/client/plugins/FilterLayer/components/FilterNodeTool.jsx b/web/client/plugins/TOC/components/FilterNodeTool.jsx similarity index 100% rename from web/client/plugins/FilterLayer/components/FilterNodeTool.jsx rename to web/client/plugins/TOC/components/FilterNodeTool.jsx diff --git a/web/client/plugins/TOC/components/TOC.jsx b/web/client/plugins/TOC/components/TOC.jsx index d97499cf20..d726c4e7e0 100644 --- a/web/client/plugins/TOC/components/TOC.jsx +++ b/web/client/plugins/TOC/components/TOC.jsx @@ -55,6 +55,7 @@ import { * @prop {object} config.layerOptions.tooltipOptions options for layer title tooltip * @prop {boolean} config.layerOptions.hideLegend hide the legend of the layer * @prop {object} config.layerOptions.legendOptions additional options for WMS legend + * @prop {boolean} config.layerOptions.hideFilter hide the filter button in the layer nodes */ export function ControlledTOC({ tree, @@ -133,6 +134,7 @@ export function ControlledTOC({ * @prop {object} config.layerOptions.tooltipOptions options for layer title tooltip * @prop {boolean} config.layerOptions.hideLegend hide the legend of the layer * @prop {object} config.layerOptions.legendOptions additional options for WMS legend + * @prop {boolean} config.layerOptions.hideFilter hide the filter button in the layer nodes */ function TOC({ map = { layers: [], groups: [] }, diff --git a/web/client/plugins/TOC/components/__tests__/DefaultLayer-test.jsx b/web/client/plugins/TOC/components/__tests__/DefaultLayer-test.jsx index 583a3bffe2..b5c9647e32 100644 --- a/web/client/plugins/TOC/components/__tests__/DefaultLayer-test.jsx +++ b/web/client/plugins/TOC/components/__tests__/DefaultLayer-test.jsx @@ -394,4 +394,34 @@ describe('test DefaultLayer module component', () => { expect(layerNode).toBeFalsy(); expect(errorTooltip).toBeFalsy(); }); + + it('should display the layer filter button', () => { + const layer = { + id: 'layer00', + name: 'layer00', + title: 'Layer', + visibility: false, + opacity: 0.5, + layerFilter: {} + }; + + ReactDOM.render(, document.getElementById("container")); + const filter = document.querySelector('.glyphicon-filter'); + expect(filter).toBeTruthy(); + }); + + it('should not display the layer filter button when hideFilter is true', () => { + const layer = { + id: 'layer00', + name: 'layer00', + title: 'Layer', + visibility: false, + opacity: 0.5, + layerFilter: {} + }; + + ReactDOM.render(, document.getElementById("container")); + const filter = document.querySelector('.glyphicon-filter'); + expect(filter).toBeFalsy(); + }); }); diff --git a/web/client/plugins/FilterLayer/components/__tests__/FilterNodeTool-test.jsx b/web/client/plugins/TOC/components/__tests__/FilterNodeTool-test.jsx similarity index 100% rename from web/client/plugins/FilterLayer/components/__tests__/FilterNodeTool-test.jsx rename to web/client/plugins/TOC/components/__tests__/FilterNodeTool-test.jsx diff --git a/web/client/plugins/TOC/index.js b/web/client/plugins/TOC/index.js index 6c84647ceb..4ea2bd86ef 100644 --- a/web/client/plugins/TOC/index.js +++ b/web/client/plugins/TOC/index.js @@ -145,6 +145,7 @@ registerCustomSaveHandler('toc', (state) => (state?.toc?.config)); * } * } * ``` + * @prop {boolean} config.layerOptions.hideFilter hide the filter button in the layer nodes * @prop {boolean} defaultOpen if true will open the table of content at initialization * @prop {object[]} items this property contains the items injected from the other plugins, * using the `containers` option in the plugin that want to inject the components.