From 2d384f9e5d171e1293eccd6d6d2ef24cf0e52e09 Mon Sep 17 00:00:00 2001 From: Victor Belomestnov Date: Mon, 10 Oct 2022 10:35:18 +0300 Subject: [PATCH] #8575 SEARCH_WITH_FILTER action: add popup support --- web/client/epics/__tests__/search-test.js | 30 +++++++++++++++++++++++ web/client/epics/search.js | 14 ++++++++--- 2 files changed, 41 insertions(+), 3 deletions(-) diff --git a/web/client/epics/__tests__/search-test.js b/web/client/epics/__tests__/search-test.js index df853a5612..2b5671bab4 100644 --- a/web/client/epics/__tests__/search-test.js +++ b/web/client/epics/__tests__/search-test.js @@ -52,6 +52,7 @@ const STATE_NAME = 'STATE_NAME'; import { testEpic, addTimeoutEpic, TEST_TIMEOUT } from './epicTestUtils'; import {addLayer} from "../../actions/layers"; +import { ADD_MAP_POPUP } from '../../actions/mapPopups'; const nestedService = { nestedPlaceholder: TEST_NESTED_PLACEHOLDER @@ -609,6 +610,35 @@ describe('search Epics', () => { done(); }, {layers: {flat: [{name: "layerName", url: "base/web/client/test-resources/wms/GetFeature.json", visibility: true, queryable: true, type: "wms"}]}}); }); + it('searchOnStartEpic, that adds popup', (done) => { + const testStore = { + mapInfo: {showInMapPopup: true}, + layers: { + flat: [ + { + name: "layerName", + url: "base/web/client/test-resources/wms/GetFeature.json", + visibility: true, + queryable: true, + type: "wms" + } + ] + } + }; + let action = searchLayerWithFilter({layer: "layerName", cql_filter: "cql"}); + const NUM_ACTIONS = 3; + testEpic(searchOnStartEpic, NUM_ACTIONS, action, (actions) => { + expect(actions).toExist(); + expect(actions.length).toBe(NUM_ACTIONS); + expect(actions[0].type).toBe(FEATURE_INFO_CLICK); + expect(actions[1].type).toBe(SHOW_MAPINFO_MARKER); + const popupAction = actions[2]; + expect(popupAction.type).toBe(ADD_MAP_POPUP); + expect(popupAction.popup?.position?.coordinates?.[0]).toBe(968346.2286324208); + expect(popupAction.popup?.position?.coordinates?.[1]).toBe(5538315.133325616); + done(); + }, testStore); + }); it('textSearchShowGFIEpic, it sends info format taken from layer', (done) => { let action = showGFI( { diff --git a/web/client/epics/search.js b/web/client/epics/search.js index 5060c1db3f..cd90b4ca1c 100644 --- a/web/client/epics/search.js +++ b/web/client/epics/search.js @@ -11,6 +11,7 @@ import toBbox from 'turf-bbox'; import pointOnSurface from '@turf/point-on-surface'; import assign from 'object-assign'; import {isNil, sortBy} from 'lodash'; +import uuid from 'uuid'; import {centerToMarkerSelector, getLayerFromName, queryableLayersSelector} from '../selectors/layers'; @@ -44,14 +45,16 @@ import { ZOOM_ADD_POINT } from '../actions/search'; -import CoordinatesUtils from '../utils/CoordinatesUtils'; +import CoordinatesUtils, { reproject } from '../utils/CoordinatesUtils'; import {defaultIconStyle, layerIsVisibleForGFI, showGFIForService} from '../utils/SearchUtils'; import {generateTemplateString} from '../utils/TemplateUtils'; import {API} from '../api/searchText'; import {getFeatureSimple} from '../api/WFS'; import {getDefaultInfoFormatValueFromLayer} from '../utils/MapInfoUtils'; -import {identifyOptionsSelector} from '../selectors/mapInfo'; +import {identifyOptionsSelector, isMapPopup} from '../selectors/mapInfo'; +import { addPopup } from '../actions/mapPopups'; +import { IDENTIFY_POPUP } from '../components/map/popups'; const getInfoFormat = (layerObj, state) => getDefaultInfoFormatValueFromLayer(layerObj, {...identifyOptionsSelector(state)}); @@ -321,9 +324,14 @@ export const searchOnStartEpic = (action$, store) => .switchMap(({ type, geometry, typeName }) => { let coord = pointOnSurface({ type, geometry }).geometry.coordinates; const latlng = {lng: coord[0], lat: coord[1] }; + const {x, y} = reproject(coord, 'EPSG:4326', 'EPSG:3857'); if (coord) { // trigger get feature info - return Rx.Observable.of(featureInfoClick({latlng}, typeName, [typeName], {[typeName]: {cql_filter: cqlFilter}}), showMapinfoMarker()); + return Rx.Observable.of(featureInfoClick({latlng}, typeName, [typeName], {[typeName]: {cql_filter: cqlFilter}}), showMapinfoMarker()) + .merge(Rx.Observable.of(addPopup(uuid(), + {component: IDENTIFY_POPUP, maxWidth: 600, position: {coordinates: [x, y]}})) + .filter(() => isMapPopup(store.getState())) + ); } return Rx.Observable.empty(); }).catch(() => {