From 116f5ff40a42d6bd2e61170bdb3e152831534098 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 11:07:50 +0200 Subject: [PATCH 1/9] chore: fixing map draw funcitonality --- src/components/admin/HearingFormStep3.jsx | 44 ++++++++--------------- src/middleware/hearingEditor.js | 1 - 2 files changed, 15 insertions(+), 30 deletions(-) diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index cfd8e7b70..769e2b2d7 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -5,7 +5,7 @@ import React, { useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import { injectIntl, FormattedMessage } from 'react-intl'; -import Leaflet from 'leaflet'; +import Leaflet, { featureGroup } from 'leaflet'; import { Button, Fieldset, FileInput } from 'hds-react'; import { isEmpty, includes, keys, isMatch } from 'lodash'; import { connect, useDispatch } from 'react-redux'; @@ -23,6 +23,7 @@ import { hearingShape } from '../../types'; import { getCorrectContrastMapTileUrl, getMapElement } from '../../utils/map'; import { parseCollection } from '../../utils/hearingEditor'; import { addToast } from '../../actions/toast'; +import { is } from 'immutable'; Leaflet.Marker.prototype.options.icon = new Leaflet.Icon({ iconUrl: leafletMarkerIconUrl, @@ -32,14 +33,6 @@ Leaflet.Marker.prototype.options.icon = new Leaflet.Icon({ iconAnchor: [13, 41], }); -function getFirstGeometry(featureCollectionGeoJSON) { - const firstFeature = featureCollectionGeoJSON.features[0]; - if (firstFeature) { - return firstFeature.geometry; - } - return {}; -} - /** * Returns an array of the remaining features * @param {Object[]} currentFeatures @@ -70,20 +63,16 @@ const HearingFormStep3 = (props) => { const [initialGeoJSON, setInitialGeoJSON] = useState(props.hearing.geojson); const dispatch = useDispatch(); + console.debug('isEdited', isEdited); useEffect(() => { Leaflet.drawLocal = getTranslatedTooltips(language); }, [language]); - const onDrawEdited = (event) => { - // TODO: Implement proper onDrawEdited functionality - setIsEdited(true); - onHearingChange('geojson', getFirstGeometry(event.layers.toGeoJSON())); - }; - const onDrawCreated = (event) => { + console.debug('onDrawCreated', event); // TODO: Implement proper onDrawCreated functionality - if (isEdited) { + if (!isEdited) { /** * first time an element is created and the map hasn't been edited/elements removed */ @@ -105,11 +94,6 @@ const HearingFormStep3 = (props) => { */ onAddMapMarkersToCollection(event.layer.toGeoJSON()); } - } else if (hearing.geojson.coordinates) { - /** - * if geojson has coordinates -> transform hearing.geojson to FeatureCollection and add element - */ - onAddMapMarker(event.layer.toGeoJSON()); } else { /** * hearing.geojson is a FeatureCollection -> add element to geojson.features @@ -120,6 +104,7 @@ const HearingFormStep3 = (props) => { // eslint-disable-next-line sonarjs/cognitive-complexity const onDrawDeleted = (event) => { + console.debug('why is this being called'); // TODO: Implement proper onDrawDeleted functionality if (event.layers && !isEmpty(event.layers._layers) && hearing.geojson.features) { /** @@ -165,6 +150,7 @@ const HearingFormStep3 = (props) => { if (remainingFeatures.length === 0) { // hearing is a FeatureCollection and all elements have been removed onHearingChange('geojson', {}); + console.debug('is edited = false') setIsEdited(false); setInitialGeoJSON({}); } else { @@ -180,6 +166,7 @@ const HearingFormStep3 = (props) => { } else { // hearing.geojson is a single element that has been removed onHearingChange('geojson', {}); + console.debug('is edited = false 2') setIsEdited(false); setInitialGeoJSON({}); } @@ -252,9 +239,11 @@ const HearingFormStep3 = (props) => { } }, [visible, map]); - const refCallBack = (el) => { - map = el; - }; + function refCallback(instance) { + if (instance) { + map = instance; + } + } if (typeof window === 'undefined') return null; @@ -262,7 +251,7 @@ const HearingFormStep3 = (props) => {
}> { )} /> { - featureGroup = group; - }} + ref={featureGroup} > (next) => (action) => { const NORMALIZE_ACTIONS = [EditorActions.POST_HEARING_SUCCESS, EditorActions.SAVE_HEARING_SUCCESS]; - if (NORMALIZE_ACTIONS.includes(action.type)) { const hearing = get(action, 'payload.hearing'); dispatch(updateHearingAfterSave(fillFrontIdsAndNormalizeHearing(hearing))); From 9862b1041471205541d5a445ce98eb5a8340fd11 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 11:58:52 +0200 Subject: [PATCH 2/9] chore: this should work but doesn't --- src/components/admin/HearingFormStep3.jsx | 12 ++++++++---- 1 file changed, 8 insertions(+), 4 deletions(-) diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index 769e2b2d7..7672d48e4 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -2,7 +2,7 @@ /* eslint-disable no-underscore-dangle */ /* eslint-disable global-require */ /* eslint-disable import/no-unresolved */ -import React, { useEffect, useState } from 'react'; +import React, { useCallback, useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import { injectIntl, FormattedMessage } from 'react-intl'; import Leaflet, { featureGroup } from 'leaflet'; @@ -63,21 +63,24 @@ const HearingFormStep3 = (props) => { const [initialGeoJSON, setInitialGeoJSON] = useState(props.hearing.geojson); const dispatch = useDispatch(); - console.debug('isEdited', isEdited); useEffect(() => { Leaflet.drawLocal = getTranslatedTooltips(language); }, [language]); - const onDrawCreated = (event) => { + const onDrawCreated = useCallback((event) => { console.debug('onDrawCreated', event); // TODO: Implement proper onDrawCreated functionality + console.log('isEdited', isEdited) if (!isEdited) { + console.debug('hearing', hearing); /** * first time an element is created and the map hasn't been edited/elements removed */ setIsEdited(true); if (!hearing.geojson || !hearing.geojson.type) { + console.log(hearing.geojson); + console.log('tätä pitäs kutsua vaan kerran....') /** * if hearing.geojson is null or doesnt have type -> add a single element */ @@ -98,9 +101,10 @@ const HearingFormStep3 = (props) => { /** * hearing.geojson is a FeatureCollection -> add element to geojson.features */ + console.log('miksi tätä ei kutsuta?') onAddMapMarkersToCollection(event.layer.toGeoJSON()); } - }; + }, [isEdited, hearing.geojson, onCreateMapMarker, onAddMapMarker, onAddMapMarkersToCollection]); // eslint-disable-next-line sonarjs/cognitive-complexity const onDrawDeleted = (event) => { From e71260ae1d21683741f3c082107eba24a7924d43 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 14:40:17 +0200 Subject: [PATCH 3/9] fix: fixed hearing map drawings --- src/components/admin/HearingEditor.jsx | 17 +++++++- src/components/admin/HearingFormStep3.jsx | 53 +++-------------------- 2 files changed, 20 insertions(+), 50 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index d168ac3c1..d9b44e321 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -1,5 +1,5 @@ /* eslint-disable react/forbid-prop-types */ -import React, { useEffect, useState } from 'react'; +import React, { useEffect, useRef, useState } from 'react'; import PropTypes from 'prop-types'; import { connect, useDispatch } from 'react-redux'; import { isEmpty } from 'lodash'; @@ -47,6 +47,7 @@ import { contactShape, hearingShape, labelShape, organizationShape, userShape } import * as EditorSelector from '../../selectors/hearingEditor'; import CommentReportModal from '../CommentReportModal/CommentReportModal'; import { addToast } from '../../actions/toast'; +import { geoJSON } from 'leaflet'; const HearingEditor = (props) => { const [errors, setErrors] = useState({}); @@ -72,6 +73,9 @@ const HearingEditor = (props) => { fetchEditorContactPersons(); }, [fetchEditorContactPersons]); + const geoJSONRef = useRef(); + geoJSONRef.current = hearing?.geojson; + const checkIfEmpty = (obj) => !Object.entries(obj).some(([, v]) => Object.entries(v).length > 0); useEffect(() => { @@ -126,7 +130,16 @@ const HearingEditor = (props) => { const onCreateMapMarker = (value) => dispatch(createMapMarker(value)); - const onAddMapMarker = (value) => dispatch(addMapMarker(value)); + const onAddMapMarker = (value) => { + console.log('geoJSONRef', geoJSONRef.current); + if (isEmpty(geoJSONRef.current)) { + dispatch(createMapMarker(value)); + } else if (geoJSONRef.current.type !== 'FeatureCollection') { + dispatch(addMapMarker(value)); + } else { + dispatch(addMapMarkerToCollection(value)); + } + } const onAddMapMarkersToCollection = (value) => dispatch(addMapMarkerToCollection(value)); diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index 7672d48e4..de6a8a6c9 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -2,7 +2,7 @@ /* eslint-disable no-underscore-dangle */ /* eslint-disable global-require */ /* eslint-disable import/no-unresolved */ -import React, { useCallback, useEffect, useState } from 'react'; +import React, { useCallback, useEffect, useRef, useState } from 'react'; import PropTypes from 'prop-types'; import { injectIntl, FormattedMessage } from 'react-intl'; import Leaflet, { featureGroup } from 'leaflet'; @@ -23,7 +23,6 @@ import { hearingShape } from '../../types'; import { getCorrectContrastMapTileUrl, getMapElement } from '../../utils/map'; import { parseCollection } from '../../utils/hearingEditor'; import { addToast } from '../../actions/toast'; -import { is } from 'immutable'; Leaflet.Marker.prototype.options.icon = new Leaflet.Icon({ iconUrl: leafletMarkerIconUrl, @@ -58,8 +57,7 @@ const HearingFormStep3 = (props) => { let map; let featureGroup; const { hearing, language, isHighContrast, visible } = props; // const props - const { onHearingChange, onCreateMapMarker, onAddMapMarker, onAddMapMarkersToCollection, onContinue } = props; // function props - const [isEdited, setIsEdited] = useState(false); + const { onHearingChange, onAddMapMarker, onContinue } = props; // function props const [initialGeoJSON, setInitialGeoJSON] = useState(props.hearing.geojson); const dispatch = useDispatch(); @@ -69,46 +67,11 @@ const HearingFormStep3 = (props) => { }, [language]); const onDrawCreated = useCallback((event) => { - console.debug('onDrawCreated', event); - // TODO: Implement proper onDrawCreated functionality - console.log('isEdited', isEdited) - if (!isEdited) { - console.debug('hearing', hearing); - /** - * first time an element is created and the map hasn't been edited/elements removed - */ - setIsEdited(true); - if (!hearing.geojson || !hearing.geojson.type) { - console.log(hearing.geojson); - console.log('tätä pitäs kutsua vaan kerran....') - /** - * if hearing.geojson is null or doesnt have type -> add a single element - */ - onCreateMapMarker(event.layer.toGeoJSON().geometry); - } else if (hearing.geojson.type !== 'FeatureCollection') { - /** - * if hearing.geojson has a type that isn't FeatureCollection - * -> add element and transform hearing.geojson to FeatureCollection - */ - onAddMapMarker(event.layer.toGeoJSON()); - } else if (hearing.geojson.type === 'FeatureCollection') { - /** - * if hearing.geojson type is FeatureCollection - add element to geojson.features - */ - onAddMapMarkersToCollection(event.layer.toGeoJSON()); - } - } else { - /** - * hearing.geojson is a FeatureCollection -> add element to geojson.features - */ - console.log('miksi tätä ei kutsuta?') - onAddMapMarkersToCollection(event.layer.toGeoJSON()); - } - }, [isEdited, hearing.geojson, onCreateMapMarker, onAddMapMarker, onAddMapMarkersToCollection]); + onAddMapMarker(event.layer.toGeoJSON().geometry); + }, [onAddMapMarker]); // eslint-disable-next-line sonarjs/cognitive-complexity const onDrawDeleted = (event) => { - console.debug('why is this being called'); // TODO: Implement proper onDrawDeleted functionality if (event.layers && !isEmpty(event.layers._layers) && hearing.geojson.features) { /** @@ -154,24 +117,18 @@ const HearingFormStep3 = (props) => { if (remainingFeatures.length === 0) { // hearing is a FeatureCollection and all elements have been removed onHearingChange('geojson', {}); - console.debug('is edited = false') - setIsEdited(false); setInitialGeoJSON({}); } else { // hearing is a FeatureCollection that still has elements after removal onHearingChange('geojson', { type: hearing.geojson.type, features: remainingFeatures }); if (currentStateFeatures) { - setIsEdited(true); setInitialGeoJSON({ type: hearing.geojson.type, features: remainingStateFeatures }); - } else { - setIsEdited(true); } } } else { // hearing.geojson is a single element that has been removed onHearingChange('geojson', {}); console.debug('is edited = false 2') - setIsEdited(false); setInitialGeoJSON({}); } }; @@ -208,7 +165,7 @@ const HearingFormStep3 = (props) => { } onHearingChange('geojson', featureCollection.features[0].geometry); const parsedFile = parseCollection(featureCollection); - onCreateMapMarker(parsedFile); + onAddMapMarker(parsedFile); setInitialGeoJSON(parsedFile); } else { dispatch(addToast(createLocalizedNotificationPayload(NOTIFICATION_TYPES.error, MESSAGE_INCORRECT_FILE))); From 9032dc801921ea1fa4ccd4f6b9c0dfff398f1086 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 14:50:38 +0200 Subject: [PATCH 4/9] chore: remove unnecessary code --- src/components/admin/HearingEditor.jsx | 6 ------ 1 file changed, 6 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index d9b44e321..a6ce2e9e7 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -128,8 +128,6 @@ const HearingEditor = (props) => { const onSectionChange = (sectionID, field, value) => dispatch(changeSection(sectionID, field, value)); - const onCreateMapMarker = (value) => dispatch(createMapMarker(value)); - const onAddMapMarker = (value) => { console.log('geoJSONRef', geoJSONRef.current); if (isEmpty(geoJSONRef.current)) { @@ -141,8 +139,6 @@ const HearingEditor = (props) => { } } - const onAddMapMarkersToCollection = (value) => dispatch(addMapMarkerToCollection(value)); - /** * Add a new attachments to a section. * The upload happens as soon as user selects a file to upload. @@ -252,8 +248,6 @@ const HearingEditor = (props) => { labels={labels} language={language} onAddMapMarker={onAddMapMarker} - onAddMapMarkersToCollection={onAddMapMarkersToCollection} - onCreateMapMarker={onCreateMapMarker} onDeleteExistingQuestion={onDeleteExistingQuestion} onDeleteTemporaryQuestion={onDeleteTemporaryQuestion} onHearingChange={onHearingChange} From 88409a5a368c29b0ab1596ba4cbd7c7a6c89a3e6 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 14:54:20 +0200 Subject: [PATCH 5/9] chore: fixed storing invalid data to redux --- src/components/admin/HearingEditor.jsx | 2 +- src/components/admin/HearingFormStep3.jsx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index a6ce2e9e7..210615e57 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -131,7 +131,7 @@ const HearingEditor = (props) => { const onAddMapMarker = (value) => { console.log('geoJSONRef', geoJSONRef.current); if (isEmpty(geoJSONRef.current)) { - dispatch(createMapMarker(value)); + dispatch(createMapMarker(value.geojson)); } else if (geoJSONRef.current.type !== 'FeatureCollection') { dispatch(addMapMarker(value)); } else { diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index de6a8a6c9..863e9b4ef 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -67,7 +67,7 @@ const HearingFormStep3 = (props) => { }, [language]); const onDrawCreated = useCallback((event) => { - onAddMapMarker(event.layer.toGeoJSON().geometry); + onAddMapMarker(event.layer.toGeoJSON()); }, [onAddMapMarker]); // eslint-disable-next-line sonarjs/cognitive-complexity From bd3de903c823203901d84199258f33419ab79293 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Tue, 11 Feb 2025 14:59:35 +0200 Subject: [PATCH 6/9] fix: removed more unnecessary debugs and code --- src/components/admin/HearingEditor.jsx | 2 +- src/components/admin/HearingFormStep3.jsx | 1 - src/reducers/hearingEditor/hearing.js | 2 +- 3 files changed, 2 insertions(+), 3 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index 210615e57..a6ce2e9e7 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -131,7 +131,7 @@ const HearingEditor = (props) => { const onAddMapMarker = (value) => { console.log('geoJSONRef', geoJSONRef.current); if (isEmpty(geoJSONRef.current)) { - dispatch(createMapMarker(value.geojson)); + dispatch(createMapMarker(value)); } else if (geoJSONRef.current.type !== 'FeatureCollection') { dispatch(addMapMarker(value)); } else { diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index 863e9b4ef..1d7d60f5a 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -128,7 +128,6 @@ const HearingFormStep3 = (props) => { } else { // hearing.geojson is a single element that has been removed onHearingChange('geojson', {}); - console.debug('is edited = false 2') setInitialGeoJSON({}); } }; diff --git a/src/reducers/hearingEditor/hearing.js b/src/reducers/hearingEditor/hearing.js index 86782230e..ba7f151c0 100644 --- a/src/reducers/hearingEditor/hearing.js +++ b/src/reducers/hearingEditor/hearing.js @@ -25,7 +25,7 @@ const data = handleActions( [EditorActions.EDIT_HEARING]: (state, { payload: { field, value } }) => ({ ...state, [field]: value }), [EditorActions.CREATE_MAP_MARKER]: (state, { payload: { value } }) => ({ ...state, - geojson: value, + geojson: value.geojson, }), [EditorActions.ADD_MAP_MARKER]: (state, { payload: { value } }) => { const foo = state.geojson; From 6e4dd14861c4f8a089dc5db4b667b861d9edf189 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Wed, 12 Feb 2025 14:32:50 +0200 Subject: [PATCH 7/9] fix: fixed map markers and geojson being wrong on first element --- src/components/admin/HearingEditor.jsx | 3 +-- src/components/admin/HearingFormStep3.jsx | 4 ++-- src/reducers/hearingEditor/hearing.js | 2 +- src/utils/map.js | 6 +++--- 4 files changed, 7 insertions(+), 8 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index a6ce2e9e7..23178c10e 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -47,7 +47,6 @@ import { contactShape, hearingShape, labelShape, organizationShape, userShape } import * as EditorSelector from '../../selectors/hearingEditor'; import CommentReportModal from '../CommentReportModal/CommentReportModal'; import { addToast } from '../../actions/toast'; -import { geoJSON } from 'leaflet'; const HearingEditor = (props) => { const [errors, setErrors] = useState({}); @@ -130,7 +129,7 @@ const HearingEditor = (props) => { const onAddMapMarker = (value) => { console.log('geoJSONRef', geoJSONRef.current); - if (isEmpty(geoJSONRef.current)) { + if (isEmpty(geoJSONRef.current) || !geoJSONRef.current) { dispatch(createMapMarker(value)); } else if (geoJSONRef.current.type !== 'FeatureCollection') { dispatch(addMapMarker(value)); diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index 1d7d60f5a..503d6db2f 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -71,7 +71,7 @@ const HearingFormStep3 = (props) => { }, [onAddMapMarker]); // eslint-disable-next-line sonarjs/cognitive-complexity - const onDrawDeleted = (event) => { + const onDrawDeleted = useCallback((event) => { // TODO: Implement proper onDrawDeleted functionality if (event.layers && !isEmpty(event.layers._layers) && hearing.geojson.features) { /** @@ -130,7 +130,7 @@ const HearingFormStep3 = (props) => { onHearingChange('geojson', {}); setInitialGeoJSON({}); } - }; + }, [hearing.geojson, initialGeoJSON, onHearingChange]); const readTextFile = (file, callback) => { try { diff --git a/src/reducers/hearingEditor/hearing.js b/src/reducers/hearingEditor/hearing.js index ba7f151c0..3841542c6 100644 --- a/src/reducers/hearingEditor/hearing.js +++ b/src/reducers/hearingEditor/hearing.js @@ -25,7 +25,7 @@ const data = handleActions( [EditorActions.EDIT_HEARING]: (state, { payload: { field, value } }) => ({ ...state, [field]: value }), [EditorActions.CREATE_MAP_MARKER]: (state, { payload: { value } }) => ({ ...state, - geojson: value.geojson, + geojson: value.geometry, }), [EditorActions.ADD_MAP_MARKER]: (state, { payload: { value } }) => { const foo = state.geojson; diff --git a/src/utils/map.js b/src/utils/map.js index 86413d2c3..28920b376 100644 --- a/src/utils/map.js +++ b/src/utils/map.js @@ -4,9 +4,9 @@ import { Polygon, GeoJSON, Marker, Polyline } from 'react-leaflet'; import 'proj4'; // import required for side effect import 'proj4leaflet'; // import required for side effect -import * as leafletMarkerIconUrl from '../../assets/images/leaflet/marker-icon.png'; -import * as leafletMarkerRetinaIconUrl from '../../assets/images/leaflet/marker-icon-2x.png'; -import * as leafletMarkerShadowUrl from '../../assets/images/leaflet/marker-shadow.png'; +import leafletMarkerIconUrl from '../../assets/images/leaflet/marker-icon.png'; +import leafletMarkerRetinaIconUrl from '../../assets/images/leaflet/marker-icon-2x.png'; +import leafletMarkerShadowUrl from '../../assets/images/leaflet/marker-shadow.png'; export function EPSG3067() { const crsName = 'EPSG:3067'; From 19b763d2db1a60058c629b96b942d1a42daaff7c Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Wed, 12 Feb 2025 15:52:22 +0200 Subject: [PATCH 8/9] chore: fix linter errors --- src/components/admin/HearingEditor.jsx | 1 - src/components/admin/HearingFormStep3.jsx | 6 ++---- 2 files changed, 2 insertions(+), 5 deletions(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index 23178c10e..006874ace 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -128,7 +128,6 @@ const HearingEditor = (props) => { const onSectionChange = (sectionID, field, value) => dispatch(changeSection(sectionID, field, value)); const onAddMapMarker = (value) => { - console.log('geoJSONRef', geoJSONRef.current); if (isEmpty(geoJSONRef.current) || !geoJSONRef.current) { dispatch(createMapMarker(value)); } else if (geoJSONRef.current.type !== 'FeatureCollection') { diff --git a/src/components/admin/HearingFormStep3.jsx b/src/components/admin/HearingFormStep3.jsx index 503d6db2f..351f402db 100644 --- a/src/components/admin/HearingFormStep3.jsx +++ b/src/components/admin/HearingFormStep3.jsx @@ -2,10 +2,10 @@ /* eslint-disable no-underscore-dangle */ /* eslint-disable global-require */ /* eslint-disable import/no-unresolved */ -import React, { useCallback, useEffect, useRef, useState } from 'react'; +import React, { useCallback, useEffect, useState } from 'react'; import PropTypes from 'prop-types'; import { injectIntl, FormattedMessage } from 'react-intl'; -import Leaflet, { featureGroup } from 'leaflet'; +import Leaflet from 'leaflet'; import { Button, Fieldset, FileInput } from 'hds-react'; import { isEmpty, includes, keys, isMatch } from 'lodash'; import { connect, useDispatch } from 'react-redux'; @@ -272,8 +272,6 @@ HearingFormStep3.propTypes = { language: PropTypes.string, isHighContrast: PropTypes.bool, onAddMapMarker: PropTypes.func, - onAddMapMarkersToCollection: PropTypes.func, - onCreateMapMarker: PropTypes.func, }; export default connect(mapStateToProps, null)(injectIntl(HearingFormStep3)); From a0896700a3929f28d319bb59dafb8385cc58a7dc Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Arto=20P=C3=A4rssinen?= Date: Thu, 13 Feb 2025 10:13:43 +0200 Subject: [PATCH 9/9] chore: moving ref update to useEffect --- src/components/admin/HearingEditor.jsx | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/src/components/admin/HearingEditor.jsx b/src/components/admin/HearingEditor.jsx index 006874ace..3b02583b0 100644 --- a/src/components/admin/HearingEditor.jsx +++ b/src/components/admin/HearingEditor.jsx @@ -73,10 +73,15 @@ const HearingEditor = (props) => { }, [fetchEditorContactPersons]); const geoJSONRef = useRef(); - geoJSONRef.current = hearing?.geojson; const checkIfEmpty = (obj) => !Object.entries(obj).some(([, v]) => Object.entries(v).length > 0); + useEffect(() => { + if(hearing) { + geoJSONRef.current = hearing.geojson; + } + }, [hearing]); + useEffect(() => { if (!isEmpty(editorErrors)) { setErrors({