18771651137

Committed 24 Oct 2025 06:29AM UTC coverage: 76.947% (+0.03%) from 76.916%

Build # 18771651137

Build Type

Pull #11625

github

Committed by

web-flow

Commit Message

Merge 1e36c4b2c into 98af379d1

Pull Request Pull Request #11625: #11525 - Improve Maps in Dashboards

Run Details

32034 of 49745 branches covered (64.4%)

64 of 79 new or added lines in 10 files covered. (81.01%)

2 existing lines in 2 files now uncovered.

39803 of 51728 relevant lines covered (76.95%)

37.76 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

58.82

/web/client/components/widgets/widget/MapWidget.jsx

/*
 * Copyright 2018, GeoSolutions Sas.
 * All rights reserved.
 *
 * This source code is licensed under the BSD-style license found in the
 * LICENSE file in the root directory of this source tree.
 */

import { omit } from 'lodash';
import React from 'react';
import { withHandlers } from 'recompose';

import BorderLayout from '../../layout/BorderLayout';
import LoadingSpinner from '../../misc/LoadingSpinner';
import MapViewComp from './MapView';
import WidgetContainer from './WidgetContainer';
import MapSwitcher from "../builder/wizard/map/MapSwitcher";
import BackgroundSelector from '../../background/BackgroundSelector';
import LegendViewComponent from './LegendView';
import { getDerivedLayersVisibility } from "../../../utils/LayersUtils";

const MapView = withHandlers({
    onMapViewChanges: ({ onUpdateMapProperty = () => { }}) => ({layers, ...map}) => onUpdateMapProperty(map)
})(MapViewComp);

const LegendView = withHandlers({
    updateProperty: ({ onUpdateMapProperty = () => { }, map }) => (_, value) => {
        const newLayers = map.layers?.map(layer => {
            const updateLayer = value?.layers.find(l => l.id === layer.id);
            if (updateLayer) {
                return {
                    ...layer,
                    visibility: updateLayer.visibility,
                    opacity: updateLayer.opacity,
                    expanded: updateLayer.expanded,
                    layerFilter: updateLayer.layerFilter
                };
            }
            return layer;
        });
        const groups = map.groups?.map(group => {
            const updateGroup = value?.groups.find(g => g.id === group.id);
            if (updateGroup) {
                return {
                    ...group,
                    visibility: updateGroup.visibility,
                    expanded: updateGroup.expanded
                };
            }
            return group;
        });
        onUpdateMapProperty({ ...map, layers: newLayers, groups });
    }
})(LegendViewComponent);

const BackgroundSelectorWithHandlers = withHandlers({
    onPropertiesChange: ({ onUpdateMapProperty, map }) => (layerId, properties) => {
        const newLayers = map.layers?.map(layer => {
            if (layer.group === 'background') {
                const updatedLayer = { ...layer, visibility: false };
                // set the selected background layer to visible
                if (layer.id === layerId) {
                    return { ...updatedLayer, visibility: true, ...properties };
                }
                return updatedLayer;
            }
            return layer;
        });
        onUpdateMapProperty({ ...map, layers: newLayers });
    }
})(BackgroundSelector);

const MapWidgetComponent = ({
    updateProperty = () => { },
    onUpdateMapProperty = () => { },
    toggleDeleteConfirm = () => { },
    id, title,
    map = {},
    maps = [],
    selectedMapId,
    icons,
    hookRegister,
    mapStateSource,
    topRightItems = [],
    options = {},
    confirmDelete = false,
    loading = false,
    dataGrid = {},
    onDelete = () => {},
    headerStyle,
    env,
    selectionActive,
    currentZoomLvl,
    scales,
    language,
    currentLocale
}) => {
    const { size: {height: mapHeight, width: mapWidth} = {}, mapInfoControl } = map;
    const backgroundLayers = (map.layers || []).filter(layer => layer.group === 'background');
    const enableViewerTools = mapHeight > 400 && mapWidth > 400 && mapInfoControl;

    return (<WidgetContainer className={"map-widget-view"} id={`widget-text-${id}`} title={title} confirmDelete={confirmDelete} onDelete={onDelete} toggleDeleteConfirm={toggleDeleteConfirm} headerStyle={headerStyle}
        icons={icons}
        topRightItems={[
            <MapSwitcher
                key="map-switcher"
                className={'map-switcher'}
                maps={maps}
                onChange={(...args) => updateProperty(id, ...args)}
                value={selectedMapId}
                disabled={selectionActive}
            />,
            ...topRightItems]
        }
        isDraggable={dataGrid.isDraggable}
        options={options}
    >
        <BorderLayout
            footer={loading
                ? <div className={"widget-footer"}>
                    <span style={{ "float": "right"}}><LoadingSpinner /></span>
                </div>
                : null
            }>
            <div className="map-widget-view-content">
                <MapView
                    tools={enableViewerTools ? ['popup'] : []}
                    onUpdateMapProperty={onUpdateMapProperty}
                    id={id}
                    map={{
                        ...omit(map, 'mapStateSource')
                    }}
                    mapStateSource={mapStateSource}
                    hookRegister={hookRegister}
                    layers={getDerivedLayersVisibility(map.layers, map.groups)}
                    options={{ style: { margin: '0 10px 10px 10px', height: 'calc(100% - 10px)' }}}
                    env={env}
                />
                {enableViewerTools && <>
                    {map.showBackgroundSelector && backgroundLayers?.length > 0 && (
                        <BackgroundSelectorWithHandlers
                            id={id}
                            map={map}
                            onUpdateMapProperty={onUpdateMapProperty}
                            backgrounds={backgroundLayers}
                            projection={map.projection}
                            style={{
                                position: 'absolute',
                                bottom: 8,
                                left: 8,
                                zIndex: 100,
                                marginBottom: 0
                            }}
                            alwaysVisible={false}
                            canEdit={false}
                            allowDeletion={false}
                            backgroundToolbarItems={[]}
                        />
                    )}
                    {map.showLegend && (
                        <div className="legend-in-mapview">
                            <LegendView
                                id={id}
                                map={map}
                                onUpdateMapProperty={onUpdateMapProperty}
                                currentZoomLvl={currentZoomLvl}
                                scales={scales}
                                language={language}
                                currentLocale={currentLocale}
                            />
                        </div>
                    )}
                </>}
            </div>
        </BorderLayout>
    </WidgetContainer>);
};

const MapWidget = withHandlers({
    onUpdateMapProperty: ({updateProperty = () => {}, id}) => (value) => {
        updateProperty(id, "maps", value, "merge");
    }
})(MapWidgetComponent);

export default MapWidget;

1	/*
2	* Copyright 2018, GeoSolutions Sas.
3	* All rights reserved.
4	*
5	* This source code is licensed under the BSD-style license found in the
6	* LICENSE file in the root directory of this source tree.
7	*/
8
9	import { omit } from 'lodash';
10	import React from 'react';
11	import { withHandlers } from 'recompose';
12
13	import BorderLayout from '../../layout/BorderLayout';
14	import LoadingSpinner from '../../misc/LoadingSpinner';
15	import MapViewComp from './MapView';
16	import WidgetContainer from './WidgetContainer';
17	import MapSwitcher from "../builder/wizard/map/MapSwitcher";
18	import BackgroundSelector from '../../background/BackgroundSelector';
19	import LegendViewComponent from './LegendView';
20	import { getDerivedLayersVisibility } from "../../../utils/LayersUtils";
21
22	const MapView = withHandlers({	1✔
23	onMapViewChanges: ({ onUpdateMapProperty = () => { }}) => ({layers, ...map}) => onUpdateMapProperty(map)	13!
24	})(MapViewComp);
25
26	const LegendView = withHandlers({	1✔
NEW 27	updateProperty: ({ onUpdateMapProperty = () => { }, map }) => (_, value) => {	×
NEW 28	const newLayers = map.layers?.map(layer => {	×
NEW 29	const updateLayer = value?.layers.find(l => l.id === layer.id);	×
NEW 30	if (updateLayer) {	×
NEW 31	return {	×
32	...layer,
33	visibility: updateLayer.visibility,
34	opacity: updateLayer.opacity,
35	expanded: updateLayer.expanded,
36	layerFilter: updateLayer.layerFilter
37	};
38	}
NEW 39	return layer;	×
40	});
NEW 41	const groups = map.groups?.map(group => {	×
NEW 42	const updateGroup = value?.groups.find(g => g.id === group.id);	×
NEW 43	if (updateGroup) {	×
NEW 44	return {	×
45	...group,
46	visibility: updateGroup.visibility,
47	expanded: updateGroup.expanded
48	};
49	}
NEW 50	return group;	×
51	});
NEW 52	onUpdateMapProperty({ ...map, layers: newLayers, groups });	×
53	}
54	})(LegendViewComponent);
55
56	const BackgroundSelectorWithHandlers = withHandlers({	1✔
57	onPropertiesChange: ({ onUpdateMapProperty, map }) => (layerId, properties) => {	1✔
58	const newLayers = map.layers?.map(layer => {	1✔
59	if (layer.group === 'background') {	2✔
60	const updatedLayer = { ...layer, visibility: false };	1✔
61	// set the selected background layer to visible
62	if (layer.id === layerId) {	1!
NEW 63	return { ...updatedLayer, visibility: true, ...properties };	×
64	}
65	return updatedLayer;	1✔
66	}
67	return layer;	1✔
68	});
69	onUpdateMapProperty({ ...map, layers: newLayers });	1✔
70	}
71	})(BackgroundSelector);
72
73	const MapWidgetComponent = ({	1✔
74	updateProperty = () => { },	13✔
75	onUpdateMapProperty = () => { },	×
76	toggleDeleteConfirm = () => { },	×
77	id, title,
78	map = {},	×
79	maps = [],	11✔
80	selectedMapId,
81	icons,
82	hookRegister,
83	mapStateSource,
84	topRightItems = [],	×
85	options = {},	13✔
86	confirmDelete = false,	×
87	loading = false,	11✔
88	dataGrid = {},	13✔
89	onDelete = () => {},	13✔
90	headerStyle,
91	env,
92	selectionActive,
93	currentZoomLvl,
94	scales,
95	language,
96	currentLocale
97	}) => {
98	const { size: {height: mapHeight, width: mapWidth} = {}, mapInfoControl } = map;	13!
99	const backgroundLayers = (map.layers \|\| []).filter(layer => layer.group === 'background');	13!
100	const enableViewerTools = mapHeight > 400 && mapWidth > 400 && mapInfoControl;	13✔
101
102	return (<WidgetContainer className={"map-widget-view"} id={`widget-text-${id}`} title={title} confirmDelete={confirmDelete} onDelete={onDelete} toggleDeleteConfirm={toggleDeleteConfirm} headerStyle={headerStyle}	13✔
103	icons={icons}
104	topRightItems={[
105	<MapSwitcher
106	key="map-switcher"
107	className={'map-switcher'}
108	maps={maps}
109	onChange={(...args) => updateProperty(id, ...args)}	×
110	value={selectedMapId}
111	disabled={selectionActive}
112	/>,
113	...topRightItems]
114	}
115	isDraggable={dataGrid.isDraggable}
116	options={options}
117	>
118	<BorderLayout
119	footer={loading	13✔
120	? <div className={"widget-footer"}>
121	<span style={{ "float": "right"}}><LoadingSpinner /></span>
122	</div>
123	: null
124	}>
125	<div className="map-widget-view-content">
126	<MapView
127	tools={enableViewerTools ? ['popup'] : []}	13✔
128	onUpdateMapProperty={onUpdateMapProperty}
129	id={id}
130	map={{
131	...omit(map, 'mapStateSource')
132	}}
133	mapStateSource={mapStateSource}
134	hookRegister={hookRegister}
135	layers={getDerivedLayersVisibility(map.layers, map.groups)}
136	options={{ style: { margin: '0 10px 10px 10px', height: 'calc(100% - 10px)' }}}
137	env={env}
138	/>
139	{enableViewerTools && <>	18✔
140	{map.showBackgroundSelector && backgroundLayers?.length > 0 && (	7✔
141	<BackgroundSelectorWithHandlers
142	id={id}
143	map={map}
144	onUpdateMapProperty={onUpdateMapProperty}
145	backgrounds={backgroundLayers}
146	projection={map.projection}
147	style={{
148	position: 'absolute',
149	bottom: 8,
150	left: 8,
151	zIndex: 100,
152	marginBottom: 0
153	}}
154	alwaysVisible={false}
155	canEdit={false}
156	allowDeletion={false}
157	backgroundToolbarItems={[]}
158	/>
159	)}
160	{map.showLegend && (	6✔
161	<div className="legend-in-mapview">
162	<LegendView
163	id={id}
164	map={map}
165	onUpdateMapProperty={onUpdateMapProperty}
166	currentZoomLvl={currentZoomLvl}
167	scales={scales}
168	language={language}
169	currentLocale={currentLocale}
170	/>
171	</div>
172	)}
173	</>}
174	</div>
175	</BorderLayout>
176	</WidgetContainer>);
177	};
178
179	const MapWidget = withHandlers({	1✔
180	onUpdateMapProperty: ({updateProperty = () => {}, id}) => (value) => {	13✔
181	updateProperty(id, "maps", value, "merge");	14✔
182	}
183	})(MapWidgetComponent);
184
185	export default MapWidget;

geosolutions-it / MapStore2 / 18771651137

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous