Skip to content

Commit

Permalink
[Taskman #125725] Fixed country filter; Removed autocomplete from sid…
Browse files Browse the repository at this point in the history 
…ebar
  • Loading branch information
@razvanMiu
razvanMiu committed Dec 15, 2020
1 parent e6afe4b commit 21dd7c5
Show file tree
Hide file tree
Showing 5 changed files with 167 additions and 101 deletions.
17 changes: 16 additions & 1 deletion src/components/manage/Blocks/DiscodataOpenlayersMapBlock/View.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,14 +5,15 @@ import { compose } from 'redux';
import { connect } from 'react-redux';
import { Link } from 'react-router-dom';
import { Portal } from 'react-portal';
import { toast } from 'react-toastify';
// HELPERS
import qs from 'query-string';
import axios from 'axios';
import jsonp from 'jsonp';
import { settings } from '~/config';
import { isArray } from 'lodash';
// VOLTO
import { Icon as VoltoIcon } from '@plone/volto/components';
import { Icon as VoltoIcon, Toast } from '@plone/volto/components';
import PrivacyProtection from './PrivacyProtection';
// VOLTO-DATABLOCKS
import { setQueryParam } from 'volto-datablocks/actions';
Expand Down Expand Up @@ -630,6 +631,20 @@ const OpenlayersMapView = (props) => {
.then((response) => {
const data = JSON.parse(response.request.response);
const extent = data.results?.[0];
if (
extent.MIN_X === null ||
extent.MIN_Y === null ||
extent.MAX_X === null ||
extent.MAX_Y === null
) {
return toast.warn(
<Toast
warn
title=""
content="No results for selected filters. Please change or clear the filters."
/>,
);
}
if (
stateRef.current.map.sitesSourceQuery?.where &&
(stateRef.current.map.sitesSourceQuery?.where.includes(
Expand Down
228 changes: 137 additions & 91 deletions src/components/manage/Blocks/FiltersBlock/View.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@ import { connect } from 'react-redux';
import { Header, Modal, Select, Input, List } from 'semantic-ui-react';
import { Portal } from 'react-portal';
import { Icon } from '@plone/volto/components';
import { setQueryParam } from 'volto-datablocks/actions';
import { setQueryParam, deleteQueryParam } from 'volto-datablocks/actions';
import { settings } from '~/config';
import _uniqueId from 'lodash/uniqueId';
import axios from 'axios';
Expand Down Expand Up @@ -578,6 +578,37 @@ const View = ({ content, ...props }) => {
}
};

const changeFilterSidebar = (
data,
filter,
filtersToDelete = [],
triggerQueryUpdate = false,
) => {
if (mounted.current) {
const newFilters = { ...state.filters };
newFilters[filter.queryToSet] = [data.value];

filtersToDelete.forEach((filter) => {
newFilters[filter] = [];
});

setState({
...state,
filters: { ...(newFilters || {}) },
});
if (triggerQueryUpdate) {
props.setQueryParam({
queryParam: {
[filter.queryToSet]: newFilters[filter.queryToSet],
},
});
props.deleteQueryParam({
queryParam: [...filtersToDelete],
});
}
}
};

const updateFilters = () => {
if (mounted.current && state.filters && state.filtersMeta) {
const newFilters = { ...state.filters };
Expand Down Expand Up @@ -830,7 +861,6 @@ const View = ({ content, ...props }) => {
const provinces = state.filters.province;
let nuts = [];
let nuts_latest = [];
console.log(state.filters);
siteCountries &&
siteCountries.forEach((country) => {
const filteredRegions = regions
Expand All @@ -855,9 +885,6 @@ const View = ({ content, ...props }) => {
nuts_latest.push(region);
}
});
} else {
nuts.push(country);
nuts_latest.push(country);
}
});
props.setQueryParam({
Expand Down Expand Up @@ -1227,98 +1254,116 @@ const View = ({ content, ...props }) => {
<div className="dynamic-filter-body">
<Header as="h3">Reporting year</Header>
<div className="input-container">
<Select
search
onChange={(event, data) => {
changeFilter(
data,
state.filtersMeta['reporting_years'],
0,
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['reporting_years']?.placeholder
}
options={
state.filtersMeta['reporting_years']?.options || []
}
value={state.filters['reportingYear']?.[0]}
/>
<form autoComplete="reporting-year">
<Select
search
onChange={(event, data) => {
changeFilterSidebar(
data,
state.filtersMeta['reporting_years'],
[],
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['reporting_years']?.placeholder
}
options={
state.filtersMeta['reporting_years']?.options || []
}
value={state.filters['reportingYear']?.[0]}
/>
</form>
</div>
<Header as="h3">Country</Header>
<div className="input-container">
<Select
search
onChange={(event, data) => {
changeFilter(
data,
state.filtersMeta['countries'],
0,
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['countries']?.placeholder
}
options={state.filtersMeta['countries']?.options || []}
value={state.filters['siteCountry']?.[0]}
/>
<form autoComplete="country">
<Select
search
selection
onChange={(event, data) => {
changeFilterSidebar(
data,
state.filtersMeta['countries'],
[
'nuts_latest',
'nuts_regions',
'province',
'region',
'riverBasin',
],
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['countries']?.placeholder
}
options={
state.filtersMeta['countries']?.options || []
}
value={state.filters['siteCountry']?.[0]}
autoComplete="country-name"
/>
</form>
</div>
<Header as="h3">Industry</Header>
<div className="input-container">
<Select
search
onChange={(event, data) => {
changeFilter(
data,
state.filtersMeta['industries'],
0,
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['industries']?.placeholder
}
options={state.filtersMeta['industries']?.options || []}
value={state.filters['EEAActivity']?.[0]}
/>
<form autoComplete="industry">
<Select
search
onChange={(event, data) => {
changeFilterSidebar(
data,
state.filtersMeta['industries'],
[],
true,
);
props.setQueryParam({
queryParam: {
advancedFiltering: true,
filtersCounter: props.discodata_query.search[
'filtersCounter'
]
? props.discodata_query.search[
'filtersCounter'
] + 1
: 1,
},
});
}}
placeholder={
state.filtersMeta['industries']?.placeholder
}
options={
state.filtersMeta['industries']?.options || []
}
value={state.filters['EEAActivity']?.[0]}
/>
</form>
</div>
</div>
<div className="dynamic-filter-actions">
Expand Down Expand Up @@ -1355,6 +1400,7 @@ export default compose(
}),
{
setQueryParam,
deleteQueryParam,
},
),
)(View);
5 changes: 3 additions & 2 deletions src/customizations/volto/components/theme/Footer/Footer.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -96,10 +96,11 @@ const Footer = ({ intl }) => (
Denmark
<br />
<a
href="mailto:industry.helpdesk@eea.europa.eu"
rel="noreferrer"
href="mailto:info@eea.europa.eu"
target="_blank"
>
industry.helpdesk@eea.europa.eu
Contact us
</a>
</p>
</div>
Expand Down
8 changes: 4 additions & 4 deletions src/customizations/volto/components/theme/Header/Header.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -57,12 +57,12 @@ class Header extends Component {
<div className="header-partner-section">
<Image
src={eclogo}
alt=""
title=""
height={60}
alt="European Comission"
title="European Comission"
height={55}
style={{ marginRight: '10px' }}
/>
<Image src={eealogo} alt="" title="" height={60} />
<Image src={eealogo} alt="EEA" title="EEA" height={50} />
</div>
</div>
</div>
Expand Down
10 changes: 7 additions & 3 deletions src/customizations/volto/components/theme/Logo/Logo.jsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,10 @@ const messages = defineMessages({
id: 'Plone Site',
defaultMessage: 'Plone Site',
},
industrialEmissions: {
id: 'Industrial Emissions',
defaultMessage: 'Industrial Emissions Portal'
}
});

/**
Expand All @@ -40,9 +44,9 @@ const Logo = () => {
>
<Image
src={LogoImage}
alt={intl.formatMessage(messages.plonesite)}
title={intl.formatMessage(messages.plonesite)}
height={66}
alt={intl.formatMessage(messages.industrialEmissions)}
title={intl.formatMessage(messages.industrialEmissions)}
height={70}
/>
</Link>
);
Expand Down

0 comments on commit 21dd7c5

Please sign in to comment.