From 004ac8f7cea1226969486161918d493f9cdcddda Mon Sep 17 00:00:00 2001 From: Miu Razvan Date: Tue, 24 Nov 2020 12:03:28 +0200 Subject: [PATCH] Small fixes; Added collation to queries. --- .../manage/Blocks/DetailedLink/View.jsx | 8 +- .../DiscodataComponents/Custom/View.jsx | 437 ++++++++---------- .../Blocks/DiscodataComponents/schema.jsx | 6 +- .../DiscodataOpenlayersMapBlock/View.jsx | 92 ++-- .../manage/Blocks/FiltersBlock/View.jsx | 87 ++-- .../manage/Blocks/SidebarBlock/View.jsx | 1 + .../Blocks/SiteBlocks/PermitingAuthority.jsx | 2 +- .../manage/Blocks/SiteBlocks/QueryBuilder.jsx | 16 +- src/components/theme/View/DefaultView.jsx | 39 +- src/components/theme/View/RedirectView.jsx | 15 +- src/helpers/api.jsx | 6 +- 11 files changed, 354 insertions(+), 355 deletions(-) diff --git a/src/components/manage/Blocks/DetailedLink/View.jsx b/src/components/manage/Blocks/DetailedLink/View.jsx index 41c98836..bbf6273d 100644 --- a/src/components/manage/Blocks/DetailedLink/View.jsx +++ b/src/components/manage/Blocks/DetailedLink/View.jsx @@ -88,7 +88,13 @@ const View = (props) => { } return e.preventDefault; }} - to={!backButton && getPath(detailedLink?.path)} + to={ + !backButton && { + pathname: getPath(detailedLink?.path), + search: '', + hash: '', + } + } > {buttonTitle || detailedLink?.title || 'Go'} diff --git a/src/components/manage/Blocks/DiscodataComponents/Custom/View.jsx b/src/components/manage/Blocks/DiscodataComponents/Custom/View.jsx index 10dc6e6d..b7f93410 100644 --- a/src/components/manage/Blocks/DiscodataComponents/Custom/View.jsx +++ b/src/components/manage/Blocks/DiscodataComponents/Custom/View.jsx @@ -147,83 +147,37 @@ const getDate = (field) => { } }; -const components = { - eprtrReportingYears: ( - options, - queryParameters, - packages, - search, - setQueryParam, - placeholder, - className, - mode, - ) => { - let activeValue = ''; - if (queryParameters[0]?.queryParameterToSet) { - activeValue = search[queryParameters[0].queryParameterToSet] || ''; - } - return ( -
-
- - - -

Last report was submitted on:

-

{getDate(packages[0])}

-
- {/*
-

Reporting year

- { - const queryParametersToSet = {}; - queryParameters.forEach((queryParam) => { - queryParametersToSet[ - queryParam.queryParameterToSet - ] = data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.[queryParam.selectorOptionKey]; - }); - setQueryParam({ - queryParam: { - ...(queryParametersToSet || {}), - }, - }); - }} - placeholder={placeholder} - options={options} - value={activeValue} +const ReportingYears = (props) => { + const { packages = [], className = '' } = props; + + return ( +
+
+ + -
*/} - {/*
-

Publish date

-

{getDate(packages[1])}

-
*/} + +

Last report was submitted on:

+

{getDate(packages[0])}

- ); - }, - eprtrCountryGroupSelector: ( - options, - queryParameters, - packages, - search, - setQueryParam, - placeholder, - className, - mode, - ) => { - const initialQueryParameters = {}; +
+ ); +}; + +const CountryGroupSelector = (props) => { + const { search = {}, setQueryParam = () => {} } = props; + useEffect(() => { + const initialQueryParameters = {}; if (!search.analysisCountryGroupId && countryGroups?.[0]?.key) { initialQueryParameters.analysisCountryGroupId = countryGroups[0].key; } @@ -240,84 +194,84 @@ const components = { }, }); } - return ( -
-
Industrial pollution in
-
- {countryGroups?.length && ( - { - setQueryParam({ - queryParam: { - analysisCountryGroupId: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - }, - }); - }} - placeholder={'Country group'} - options={countryGroups} - value={search.analysisCountryGroupId} - /> - )} - {pollutionType && ( - { - setQueryParam({ - queryParam: { - analysisPollutantType: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - }, - }); - }} - placeholder={'Pollution by'} - options={pollutionType} - value={search.analysisPollutantType} - /> - )} - {search.analysisPollutantType && ( - { - setQueryParam({ - queryParam: { - analysisPollutant: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - }, - }); - }} - placeholder={'Select pollutant'} - options={pollutants[search.analysisPollutantType]} - value={ - optionExists( - search.analysisPollutant, - pollutants[search.analysisPollutantType], - ) - ? search.analysisPollutant - : null - } - /> - )} -
+ }, []); + + return ( +
+
Industrial pollution in
+
+ {countryGroups?.length && ( + { + setQueryParam({ + queryParam: { + analysisCountryGroupId: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + }, + }); + }} + placeholder={'Country group'} + options={countryGroups} + value={search.analysisCountryGroupId} + /> + )} + {pollutionType && ( + { + setQueryParam({ + queryParam: { + analysisPollutantType: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + }, + }); + }} + placeholder={'Pollution by'} + options={pollutionType} + value={search.analysisPollutantType} + /> + )} + {search.analysisPollutantType && ( + { + setQueryParam({ + queryParam: { + analysisPollutant: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + }, + }); + }} + placeholder={'Select pollutant'} + options={pollutants[search.analysisPollutantType]} + value={ + optionExists( + search.analysisPollutant, + pollutants[search.analysisPollutantType], + ) + ? search.analysisPollutant + : null + } + /> + )}
- ); - }, - eprtrCountrySelector: ( - options, - queryParameters, - packages, - search, - setQueryParam, - placeholder, - className, - mode, - discodata_resources, - ) => { - const countries = discodata_resources.analysis_countries; +
+ ); +}; + +const CountrySelector = (props) => { + const { + discodata_resources = {}, + search = {}, + setQueryParam = () => {}, + } = props; + const countries = discodata_resources.analysis_countries || []; + + useEffect(() => { const initialQueryParameters = {}; if (!search.analysisCountryCode && countries?.[0]?.key) { @@ -337,84 +291,91 @@ const components = { }, }); } - return ( -
- -
Industrial pollution in
-
- {countryGroups?.length && ( - { - setQueryParam({ - queryParam: { - analysisCountryCode: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - analysisCountryName: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.value, - }, - }); - }} - placeholder={'Country'} - options={countries} - value={search.analysisCountryName} - /> - )} - {pollutionType && ( - { - setQueryParam({ - queryParam: { - analysisPollutantType: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - }, - }); - }} - placeholder={'Pollution by'} - options={pollutionType} - value={search.analysisPollutantType} - /> - )} - {search.analysisPollutantType && ( - { - setQueryParam({ - queryParam: { - analysisPollutant: data.options.filter((opt) => { - return opt.value === data.value; - })[0]?.key, - }, - }); - }} - placeholder={'Select pollutant'} - options={pollutants[search.analysisPollutantType]} - value={ - optionExists( - search.analysisPollutant, - pollutants[search.analysisPollutantType], - ) - ? search.analysisPollutant - : null - } - /> - )} -
-
- ); - }, + }, [countries]); + + return ( +
+ +
Industrial pollution in
+ {countries.length > 0 ? ( + <> +
+ {countryGroups?.length && ( + { + setQueryParam({ + queryParam: { + analysisCountryCode: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + analysisCountryName: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.value, + }, + }); + }} + placeholder={'Country'} + options={countries} + value={search.analysisCountryName} + /> + )} + {pollutionType && ( + { + setQueryParam({ + queryParam: { + analysisPollutantType: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + }, + }); + }} + placeholder={'Pollution by'} + options={pollutionType} + value={search.analysisPollutantType} + /> + )} + {search.analysisPollutantType && ( + { + setQueryParam({ + queryParam: { + analysisPollutant: data.options.filter((opt) => { + return opt.value === data.value; + })[0]?.key, + }, + }); + }} + placeholder={'Select pollutant'} + options={pollutants[search.analysisPollutantType]} + value={ + optionExists( + search.analysisPollutant, + pollutants[search.analysisPollutantType], + ) + ? search.analysisPollutant + : null + } + /> + )} +
+ + ) : ( + '' + )} +
+ ); }; const View = ({ content, ...props }) => { @@ -526,18 +487,12 @@ const View = ({ content, ...props }) => { return ( <> - {components[props.data.component] ? ( - components[props.data.component]( - options, - queryParametersToSet, - packages, - props.search, - props.setQueryParam, - placeholder, - className, - props.mode, - props.discodata_resources, - ) + {props.data.component === 'ReportingYears' && mounted ? ( + + ) : props.data.component === 'CountryGroupSelector' && mounted ? ( + + ) : props.data.component === 'CountrySelector' && mounted ? ( + ) : props.mode === 'edit' ? (

Component not selected

) : ( diff --git a/src/components/manage/Blocks/DiscodataComponents/schema.jsx b/src/components/manage/Blocks/DiscodataComponents/schema.jsx index b16819a2..945c44f9 100644 --- a/src/components/manage/Blocks/DiscodataComponents/schema.jsx +++ b/src/components/manage/Blocks/DiscodataComponents/schema.jsx @@ -402,9 +402,9 @@ export const makeCustomSchema = (props) => { title: 'Component', type: 'array', choices: [ - ['eprtrReportingYears', 'EPRTR reporting years'], - ['eprtrCountryGroupSelector', 'EPRTR country group selector'], - ['eprtrCountrySelector', 'EPRTR country selector'], + ['ReportingYears', 'EPRTR reporting years'], + ['CountryGroupSelector', 'EPRTR country group selector'], + ['CountrySelector', 'EPRTR country selector'], ], }, }; diff --git a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx index 450d49d7..f50f3445 100644 --- a/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx +++ b/src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx @@ -278,7 +278,7 @@ const OpenlayersMapView = (props) => { }, [state]) useEffect(() => { - if (mapRendered && stateRef.current.map.element) { + if (mapRendered && mounted.current && stateRef.current.map.element) { if (['byLocationTerm', 'bySiteTerm'].includes(state.updateMapPosition)) { onSourceChange(); } else if (['byAdvancedFilters'].includes(state.updateMapPosition)) { @@ -303,13 +303,18 @@ const OpenlayersMapView = (props) => { }, [state.map.sitesSourceQuery?.where, state.updateMapPosition]) useEffect(() => { - if (!mapRendered && prepareMapRender && document.getElementById('map')) { + if ( + !mapRendered && + mounted.current && + prepareMapRender && + document.getElementById('map') + ) { renderMap(); setMapRendered(true); } }, [prepareMapRender]); - if (mapRendered && !firstFilteringUpdate) { + if (mapRendered && mounted.current && !firstFilteringUpdate) { updateFilters(); updateRegionsFilters(); setFirstFilteringUpdate(true); @@ -452,7 +457,7 @@ const OpenlayersMapView = (props) => { updateMapPosition = 'bySiteTerm'; } - if (updateMapPosition) { + if (updateMapPosition && mounted.current) { setState({ ...state, map: { @@ -516,7 +521,11 @@ const OpenlayersMapView = (props) => { } function applyZoom() { - if (stateRef.current.map && stateRef.current.map.element) { + if ( + stateRef.current.map && + stateRef.current.map.element && + mounted.current + ) { const newZoom = stateRef.current.map.element.getView().getZoom(); if ( newZoom > zoomSwitch || @@ -582,7 +591,7 @@ const OpenlayersMapView = (props) => { axios .get( encodeURI( - `${settings.providerUrl}?query=SELECT shape_wm.STX as x, shape_wm.STY as y, Site_reporting_year from [IED].[latest].[SiteMap] WHERE siteName LIKE '%${stateRef.current.siteTerm}%' ORDER BY [Site_reporting_year] DESC`, + `${settings.providerUrl}?query=SELECT shape_wm.STX as x, shape_wm.STY as y, Site_reporting_year from [IED].[latest].[SiteMap] WHERE siteName COLLATE Latin1_General_CI_AI LIKE '%${stateRef.current.siteTerm}%' ORDER BY [Site_reporting_year] DESC`, ), ) .then((response) => { @@ -647,22 +656,31 @@ const OpenlayersMapView = (props) => { duration: 2000, maxZoom: 15, }; - if (stateRef.current.updateMapPosition === 'bySiteTerm') { + if ( + stateRef.current.updateMapPosition === 'bySiteTerm' && + mounted.current + ) { stateRef.current.map.element.getView().cancelAnimations(); getSiteTermLocation(options); } - if (stateRef.current.updateMapPosition === 'byLocationTerm') { + if ( + stateRef.current.updateMapPosition === 'byLocationTerm' && + mounted.current + ) { stateRef.current.map.element.getView().cancelAnimations(); setSelectedSite(null); getLocation(options); } - if (stateRef.current.updateMapPosition === 'byAdvancedFilters') { + if ( + stateRef.current.updateMapPosition === 'byAdvancedFilters' && + mounted.current + ) { stateRef.current.map.element.getView().cancelAnimations(); setSelectedSite(null); getLocationByAdvancedFilters(options); } // UPDATE OLD FILTERS - if (stateRef.current.updateMapPosition !== null) { + if (stateRef.current.updateMapPosition !== null && mounted.current) { setState({ ...stateRef.current, map: { @@ -695,6 +713,7 @@ const OpenlayersMapView = (props) => { ); const featuresProperties = features[0].getProperties(); if ( + mounted.current && detailed && JSON.stringify(stateRef.current.popupDetails.properties) !== JSON.stringify(featuresProperties) @@ -711,6 +730,7 @@ const OpenlayersMapView = (props) => { }, }); } else if ( + mounted.current && !detailed && JSON.stringify(stateRef.current.popup.properties) !== JSON.stringify(featuresProperties) @@ -1046,7 +1066,7 @@ const OpenlayersMapView = (props) => { } // Events sitesSource.on('updateClosestFeature', function (e) { - if (!reqs && e.target.getState() === 'ready') { + if (!reqs && e.target.getState() === 'ready' && mounted.current) { if (selectedSiteCoordinates.current) { const closestFeature = sitesSource.getClosestFeatureToCoordinate( selectedSiteCoordinates.current, @@ -1131,25 +1151,30 @@ const OpenlayersMapView = (props) => { } const setSiteQueryParams = () => { - axios - .get( - encodeURI( - `${settings.providerUrl}?query=SELECT DISTINCT siteId, siteInspireId FROM [IED].[latest].[FacilitiesPerSite] WHERE siteId = '${state.popupDetails.properties.id}'`, - ), - ) - .then((response) => { - const data = JSON.parse(response.request.response); - props.setQueryParam({ - queryParam: { - siteInspireId: data.results[0].siteInspireId, - siteId: state.popupDetails.properties.id, - siteName: state.popupDetails.properties.siteName, - siteReportingYear: - state.popupDetails.properties.Site_reporting_year, - }, + return new Promise((resolve, reject) => { + axios + .get( + encodeURI( + `${settings.providerUrl}?query=SELECT DISTINCT siteId, siteInspireId FROM [IED].[latest].[FacilitiesPerSite] WHERE siteId LIKE '${state.popupDetails.properties.id}'`, + ), + ) + .then((response) => { + const data = JSON.parse(response.request.response); + props.setQueryParam({ + queryParam: { + siteInspireId: data.results[0].siteInspireId, + siteId: state.popupDetails.properties.id, + siteName: state.popupDetails.properties.siteName, + siteReportingYear: + state.popupDetails.properties.Site_reporting_year, + }, + }); + resolve(true); + }) + .catch((error) => { + reject(false); }); - }) - .catch((error) => {}); + }); }; if (!__CLIENT__) return ''; @@ -1323,8 +1348,13 @@ const OpenlayersMapView = (props) => {