From d1e7419f6b883aac639960e1e455eaa2c75293bb Mon Sep 17 00:00:00 2001 From: Alexandre Lanceart Date: Sat, 11 May 2019 08:38:59 +0200 Subject: [PATCH] feature(filter) * Filtering universities is now possible based on the country of the university * Filters are synchronized between the map and the search page Fixes #13 In progress: #31 --- .../components/filter/DownshiftMultiple.js | 100 +++++++----------- frontend/src/components/filter/Filter.js | 100 ++++++++++-------- frontend/src/components/map/UnivMakers.js | 52 +++++---- frontend/src/components/map/UnivMap.js | 98 +++++++++-------- frontend/src/components/pages/PageMap.js | 29 ++--- frontend/src/components/pages/PageSearch.js | 25 ++--- frontend/src/components/search/Search.js | 45 +++++--- frontend/src/components/search/UnivList.js | 24 +++-- frontend/src/redux/reducers/filter.js | 6 +- 9 files changed, 246 insertions(+), 233 deletions(-) diff --git a/frontend/src/components/filter/DownshiftMultiple.js b/frontend/src/components/filter/DownshiftMultiple.js index f2520ed..af1773a 100644 --- a/frontend/src/components/filter/DownshiftMultiple.js +++ b/frontend/src/components/filter/DownshiftMultiple.js @@ -1,24 +1,3 @@ - -/** - * - * WARNING THIS FILE HAS NOT BEEN REVIEWED AS OF 22.02.2019 - * THINGS MIGHT NOT BE SUPER CLEAR OR BROKEN - * - * - * - * - * - * - * - * - * - * - * - * - */ - - - // Inspired by : https://material-ui.com/demos/autocomplete/ import React from "react"; @@ -30,19 +9,19 @@ import TextField from "@material-ui/core/TextField"; import Paper from "@material-ui/core/Paper"; import MenuItem from "@material-ui/core/MenuItem"; import Chip from "@material-ui/core/Chip"; -import __map from "lodash/map"; import __difference from "lodash/difference"; import fuzzysort from "fuzzysort"; +import isEqual from "lodash/isEqual"; function renderInput(inputProps) { - const { InputProps, classes, ref, ...other } = inputProps; + const {InputProps, classes, ref, ...other} = inputProps; return ( -1; @@ -68,17 +47,22 @@ function renderSuggestion({ suggestion, index, itemProps, highlightedIndex, sele ); } + renderSuggestion.propTypes = { highlightedIndex: PropTypes.number, index: PropTypes.number, itemProps: PropTypes.object, selectedItem: PropTypes.string, - suggestion: PropTypes.shape({ label: PropTypes.string, id: PropTypes.number }).isRequired, + suggestion: PropTypes.shape({label: PropTypes.string, id: PropTypes.number}).isRequired, }; class DownshiftMultiple extends React.Component { - state = this.props.config; + + constructor(props) { + super(props); + this.state = Object.assign({}, this.props.config); + } componentDidMount() { this.setState(this.props.config); @@ -86,7 +70,11 @@ class DownshiftMultiple extends React.Component { // eslint-disable-next-line no-unused-vars componentDidUpdate(prevProps, prevState, snapshot) { - if (this.state.selectedItems != prevState.selectedItems) { + if (!isEqual(prevProps.config.selectedItems, this.props.config.selectedItems)) { + this.setState(this.props.config); + } + + if (this.state.selectedItems !== prevState.selectedItems) { this.props.onChange(this.state.selectedItems); } } @@ -99,19 +87,19 @@ class DownshiftMultiple extends React.Component { getSuggestions(value) { - const { options } = this.props; - const { selectedItems } = this.state; + const {options} = this.props; + const {selectedItems} = this.state; let possible = __difference(options, selectedItems); - const filter = fuzzysort.go(value, possible, { limit: 5, key: "label" }); + const filter = fuzzysort.go(value, possible, {limit: 5, key: "label"}); if (filter.length > 0) { - return __map(filter, (item) => item.obj); + return filter.map(item => item.obj); } else { return possible.slice(0, 4); } } handleKeyDown = event => { - const { inputValue, selectedItems } = this.state; + const {inputValue, selectedItems} = this.state; if (selectedItems.length && !inputValue.length && keycode(event) === "backspace") { this.setState({ selectedItems: selectedItems.slice(0, selectedItems.length - 1), @@ -120,12 +108,12 @@ class DownshiftMultiple extends React.Component { }; handleInputChange = event => { - this.setState({ inputValue: event.target.value }); + this.setState({inputValue: event.target.value}); }; handleChange = item => { - const { options } = this.props; - let { selectedItems } = this.state; + const {options} = this.props; + let {selectedItems} = this.state; if (selectedItems.indexOf(item) === -1) { for (let ind in options) { let el = options[ind]; @@ -146,30 +134,23 @@ class DownshiftMultiple extends React.Component { this.setState(state => { const selectedItems = [...state.selectedItems]; selectedItems.splice(selectedItems.indexOf(item), 1); - return { selectedItems }; + return {selectedItems}; }); }; render() { - const { classes, field_label, field_placeholder } = this.props; - const { inputValue, selectedItems } = this.state; + const {classes, fieldLabel, fieldPlaceholder} = this.props; + const {inputValue, selectedItems} = this.state; return (
{ - ({ - getInputProps, - getItemProps, - isOpen, - inputValue: inputValue2, - selectedItem: selectedItem2, - highlightedIndex, - }) => + ({getInputProps, getItemProps, isOpen, inputValue: inputValue2, selectedItem: selectedItem2, highlightedIndex,}) => (
{renderInput({ @@ -189,9 +170,9 @@ class DownshiftMultiple extends React.Component { )), onChange: this.handleInputChange, onKeyDown: this.handleKeyDown, - placeholder: field_placeholder, + placeholder: fieldPlaceholder, }), - label: field_label, + label: fieldLabel, })} {isOpen ? ( @@ -199,7 +180,7 @@ class DownshiftMultiple extends React.Component { renderSuggestion({ suggestion, index, - itemProps: getItemProps({ item: suggestion.id }), + itemProps: getItemProps({item: suggestion.id}), highlightedIndex, selectedItem: selectedItem2, }), @@ -221,27 +202,20 @@ DownshiftMultiple.propTypes = { onComponentUnmount: PropTypes.func.isRequired, onChange: PropTypes.func.isRequired, config: PropTypes.object.isRequired, - field_label: PropTypes.string.isRequired, - field_placeholder: PropTypes.string.isRequired, + fieldLabel: PropTypes.string.isRequired, + fieldPlaceholder: PropTypes.string.isRequired, options: PropTypes.array.isRequired, }; DownshiftMultiple.defaultProps = { - options: [ - { label: "Item 1", id: 1 }, - { label: "Item 2", id: 2 }, - { label: "Item 3", id: 3 }, - { label: "Item 4", id: 4 }, - ], - field_label: "label", - field_placeholder: "placeholder", - config: { selectedItems: [], inputValue: "" } + fieldLabel: "", + fieldPlaceholder: "Filtrer par Pays", }; const styles = theme => ({ root: { flexGrow: 1, - height: 250, + zIndex: 100000, }, container: { flexGrow: 1, diff --git a/frontend/src/components/filter/Filter.js b/frontend/src/components/filter/Filter.js index 1ebf081..352a96c 100644 --- a/frontend/src/components/filter/Filter.js +++ b/frontend/src/components/filter/Filter.js @@ -1,43 +1,23 @@ - -/** - * - * WARNING THIS FILE HAS NOT BEEN REVIEWED AS OF 22.02.2019 - * THINGS MIGHT NOT BE SUPER CLEAR OR BROKEN - * - * - * - * - * - * - * - * - * - * - * - * - */ - - - - import React from "react"; import PropTypes from "prop-types"; import DownshiftMultiple from "./DownshiftMultiple"; import CustomComponentForAPI from "../common/CustomComponentForAPI"; -import { connect } from "react-redux"; -import __map from "lodash/map"; -import __indexOf from "lodash/indexOf"; -import { saveSelectedUniversities, saveFilterConfig } from "../../redux/actions/filter"; +import {connect} from "react-redux"; +import {saveFilterConfig, saveSelectedUniversities} from "../../redux/actions/filter"; import ExpansionPanel from "@material-ui/core/ExpansionPanel"; import ExpansionPanelSummary from "@material-ui/core/ExpansionPanelSummary"; import ExpansionPanelDetails from "@material-ui/core/ExpansionPanelDetails"; import ExpandMoreIcon from "@material-ui/icons/ExpandMore"; import Typography from "@material-ui/core/Typography"; import withStyles from "@material-ui/core/styles/withStyles"; +import InfoIcon from "@material-ui/icons/InfoOutlined"; import getActions from "../../redux/api/getActions"; +import {compose} from "recompose"; +let isOpen = false; +let hasSelection = false; /** * Implementation of a filter component @@ -48,8 +28,9 @@ import getActions from "../../redux/api/getActions"; */ class Filter extends CustomComponentForAPI { + saveCountriesFilterConfig(state) { - this.props.saveConfig({ countriesFilter: state }); + this.props.saveConfig({countriesFilter: state}); } /** @@ -58,44 +39,66 @@ class Filter extends CustomComponentForAPI { * @returns {Array} of the countries instances * @memberof Filter */ + + + getCountriesWhereThereAreUniversities() { - const mainCampuses = this.getLatestReadData("mainCampuses"); + const {mainCampuses, cities, countries} = this.getLatestReadDataFor(["mainCampuses", "cities", "countries"]); + + let citiesMap = new Map(), + countriesMap = new Map(); + + cities.forEach(el => citiesMap.set(el.id, el)); + countries.forEach(el => countriesMap.set(el.id, el)); - // use of map to get only each country once let res = new Map(); - mainCampuses.forEach(campus => { - const country = this.joinCampus(campus).country, - code = country.iso_alpha2_code; - res.set(code, country); - }); + mainCampuses.forEach(el => { + const cityId = el.city, + city = citiesMap.get(cityId), + countryId = city.country, + country = countriesMap.get(countryId); + res.set(countryId, country); + }); return [...res.values()]; } updateSelectedUniversities(selection) { const mainCampuses = this.getLatestReadData("mainCampuses"), - listOfCountries = __map(selection, (s) => s.id); + listOfCountries = selection.map(s => s.id); let selectedUniversities = []; mainCampuses.forEach(campus => { const campusFull = this.joinCampus(campus); - if (__indexOf(listOfCountries, campusFull.country.iso_alpha2_code) > -1) { + if (listOfCountries.includes(campusFull.country.iso_alpha2_code)) { selectedUniversities.push(campusFull.university.id); } }); this.props.saveSelection(selectedUniversities); + hasSelection = selectedUniversities.length !== 0; + this.forceUpdate(); } customRender() { - const options = __map(this.getCountriesWhereThereAreUniversities(), - (c) => { return { id: c.iso_alpha2_code, label: c.name }; }); - const { classes } = this.props; + const options = this.getCountriesWhereThereAreUniversities() + .map(c => ({id: c.iso_alpha2_code, label: c.name})); + const {classes} = this.props; + return ( - - }> + { + isOpen = !isOpen; + this.forceUpdate(); + }}> + }> Appliquer des filtres +
+ + + {hasSelection ? "(Un filtre est actif)" : "(Aucun filtre est actif)"} + +
{ @@ -123,7 +126,7 @@ const mapStateToProps = (state) => { mainCampuses: state.api.mainCampusesAll, cities: state.api.citiesAll, countries: state.api.countriesAll, - countriesFilterConfig: state.app.filter.countriesFilter + countriesFilterConfig: state.app.filter.countriesFilter, }; }; @@ -147,8 +150,15 @@ const styles = theme => ({ }, heading: { fontSize: theme.typography.pxToRem(15), - fontWeight: theme.typography.fontWeightRegular, + fontWeight: theme.typography.fontWeightMedium, }, + infoFilter: { + marginLeft: 2 * theme.spacing.unit, + display: "inherit" + } }); -export default connect(mapStateToProps, mapDispatchToProps)(withStyles(styles)(Filter)); +export default compose( + connect(mapStateToProps, mapDispatchToProps), + withStyles(styles) +)(Filter); diff --git a/frontend/src/components/map/UnivMakers.js b/frontend/src/components/map/UnivMakers.js index 63ea2f6..063910e 100644 --- a/frontend/src/components/map/UnivMakers.js +++ b/frontend/src/components/map/UnivMakers.js @@ -1,7 +1,7 @@ import React from "react"; import PropTypes from "prop-types"; -import { connect } from "react-redux"; -import { Marker, Popup } from "react-leaflet"; +import {connect} from "react-redux"; +import {Marker, Popup} from "react-leaflet"; import UnivPopupContent from "./UnivPopupContent"; import getActions from "../../redux/api/getActions"; @@ -10,7 +10,6 @@ import CustomComponentForAPI from "../common/CustomComponentForAPI"; import arrayOfInstancesToMap from "../../utils/arrayOfInstancesToMap"; - /** * Class that renders the markers for the map of the universities. * @@ -23,10 +22,12 @@ import arrayOfInstancesToMap from "../../utils/arrayOfInstancesToMap"; class UnivMarkers extends CustomComponentForAPI { customRender() { - const { universities, + const { + universities, mainCampuses, countries, - cities } = this.getAllLatestReadData(); + cities + } = this.getAllLatestReadData(); // some conversions for optimization (faster search of element in a map) const universitiesMap = arrayOfInstancesToMap(universities), @@ -34,23 +35,30 @@ class UnivMarkers extends CustomComponentForAPI { citiesMap = arrayOfInstancesToMap(cities); let mainCampusesSelection = []; + const listUnivsel = this.props.selectedUniversities; + + //console.log(this.props.selectedUniversities); // Merge the data and add it to the selection + mainCampuses.forEach(campus => { const univ = universitiesMap.get(campus.university); - if (campus && univ) { - const city = citiesMap.get(campus.city), - country = countriesMap.get(city.country); - - mainCampusesSelection.push({ - univName: univ.name, - univLogo: univ.logo, - univCity: city.name, - univCountry: country.name, - lat: campus.lat, - lon: campus.lon, - id: univ.id - }); - + if ((listUnivsel.length > 0 && listUnivsel.indexOf(univ.id) > -1) || listUnivsel.length === 0) { + + if (campus && univ) { + const city = citiesMap.get(campus.city), + country = countriesMap.get(city.country); + + mainCampusesSelection.push({ + univName: univ.name, + univLogo: univ.logo, + univCity: city.name, + univCountry: country.name, + lat: campus.lat, + lon: campus.lon, + id: univ.id + }); + + } } }); @@ -58,7 +66,7 @@ class UnivMarkers extends CustomComponentForAPI { return ( mainCampusesSelection.map((el, idx) => ( - + { @@ -86,7 +95,8 @@ const mapStateToProps = (state) => { universities: state.api.universitiesAll, mainCampuses: state.api.mainCampusesAll, cities: state.api.citiesAll, - countries: state.api.countriesAll + countries: state.api.countriesAll, + selectedUniversities: state.app.selectedUniversities }; }; diff --git a/frontend/src/components/map/UnivMap.js b/frontend/src/components/map/UnivMap.js index a3cef3a..1481c8d 100644 --- a/frontend/src/components/map/UnivMap.js +++ b/frontend/src/components/map/UnivMap.js @@ -1,11 +1,11 @@ -import React, { Component } from "react"; -import { connect } from "react-redux"; +import React, {Component} from "react"; +import {connect} from "react-redux"; import PropTypes from "prop-types"; -import { Map, TileLayer, LayersControl, LayerGroup } from "react-leaflet"; +import {LayerGroup, LayersControl, Map, TileLayer} from "react-leaflet"; import UnivMarkers from "./UnivMakers"; -import { saveMainMapStatus } from "../../redux/actions/map"; +import {saveMainMapStatus} from "../../redux/actions/map"; /** @@ -20,7 +20,7 @@ class UnivMap extends Component { state = { leafletInstance: null, height: 800, - } + }; constructor(props) { super(props); @@ -36,10 +36,11 @@ class UnivMap extends Component { updateDimensions() { try { const height = window.innerHeight - document.getElementById("MySuperMap").getBoundingClientRect().y; - this.setState({ height: Math.round(0.9 * height) }); + this.setState({height: Math.round(0.9 * height)}); } // eslint-disable-next-line no-empty - catch (err) { } + catch (err) { + } } componentDidMount() { @@ -50,7 +51,7 @@ class UnivMap extends Component { componentWillUnmount() { // Save the state of the map to the redux store so that it is restored easily - const { leafletInstance } = this.state; + const {leafletInstance} = this.state; if (leafletInstance) { let selectedLayer = ""; if (this.state.selectedLayer) { @@ -97,58 +98,61 @@ class UnivMap extends Component { const stamenName = "Stamen Watercolor", osmFrName = "OpenStreetMap France", esriName = "Esri WorldImagery", - { selectedLayer, zoom, center } = this.props.map, - { height } = this.state; + {selectedLayer, zoom, center} = this.props.map, + {height} = this.state; // Create the map and add the layers and markers return ( - this.saveLeafletInstance(e.target)} onBaselayerchange={(e) => this.saveSelectedLayer(e)}> + <> + this.saveLeafletInstance(e.target)} onBaselayerchange={(e) => this.saveSelectedLayer(e)}> - + - - - - - - {/* Need to overlay 2 layers for this one */} - + + + + + {/* Need to overlay 2 layers for this one */} + + + + + + + + - - - - - - - + - + - {/* Add the markers for the universities */} - + {/* Add the markers for the universities */} + - + + ); } } diff --git a/frontend/src/components/pages/PageMap.js b/frontend/src/components/pages/PageMap.js index f2230b6..78ee1a0 100644 --- a/frontend/src/components/pages/PageMap.js +++ b/frontend/src/components/pages/PageMap.js @@ -1,12 +1,12 @@ import React from "react"; import PropTypes from "prop-types"; import withStyles from "@material-ui/core/styles/withStyles"; -import Grid from "@material-ui/core/Grid"; import Typography from "@material-ui/core/Typography"; import UnivMap from "../map/UnivMap"; import Paper from "@material-ui/core/Paper"; import {compose} from "recompose"; import {withErrorBoundary} from "../common/ErrorBoundary"; +import Filter from "../filter/Filter"; /** @@ -17,18 +17,16 @@ import {withErrorBoundary} from "../common/ErrorBoundary"; */ class PageMap extends React.Component { render() { - const { theme } = this.props; + const {theme, classes} = this.props; return ( - - - - Exploration Cartographique - - - - {/* */} - + + Exploration Cartographique + +
+ +
+ ); } @@ -36,11 +34,16 @@ class PageMap extends React.Component { PageMap.propTypes = { theme: PropTypes.object.isRequired, + classes: PropTypes.object.isRequired, }; -const styles = {}; +const styles = theme => ({ + filter: { + marginBottom: 2 * theme.spacing.unit, + } +}); export default compose( - withStyles(styles, { withTheme: true }), + withStyles(styles, {withTheme: true}), withErrorBoundary() )(PageMap); diff --git a/frontend/src/components/pages/PageSearch.js b/frontend/src/components/pages/PageSearch.js index 860a8ff..b1a86d0 100644 --- a/frontend/src/components/pages/PageSearch.js +++ b/frontend/src/components/pages/PageSearch.js @@ -1,12 +1,12 @@ import React from "react"; import PropTypes from "prop-types"; import withStyles from "@material-ui/core/styles/withStyles"; -import Grid from "@material-ui/core/Grid"; import Typography from "@material-ui/core/Typography"; import Search from "../search/Search"; import Paper from "@material-ui/core/Paper"; import {withErrorBoundary} from "../common/ErrorBoundary"; import {compose} from "recompose"; +import Filter from "../filter/Filter"; /** @@ -16,19 +16,20 @@ import {compose} from "recompose"; * @extends {React.Component} */ class PageSearch extends React.Component { + + state = { + selectedOption: null, + }; + render() { - const { theme } = this.props; + const {theme} = this.props; return ( - - - - Recherche d'une université - - - - {/* */} - + + Recherche d'une université + + + ); } @@ -40,6 +41,6 @@ PageSearch.propTypes = { const styles = {}; export default compose( - withStyles(styles, { withTheme: true }), + withStyles(styles, {withTheme: true}), withErrorBoundary(), )(PageSearch); diff --git a/frontend/src/components/search/Search.js b/frontend/src/components/search/Search.js index fc9a28d..a7a891d 100644 --- a/frontend/src/components/search/Search.js +++ b/frontend/src/components/search/Search.js @@ -4,12 +4,10 @@ import PropTypes from "prop-types"; import TextField from "@material-ui/core/TextField"; import CustomComponentForAPI from "../common/CustomComponentForAPI"; -import { connect } from "react-redux"; +import {connect} from "react-redux"; import fuzzysort from "fuzzysort"; import UnivList from "./UnivList"; import withStyles from "@material-ui/core/styles/withStyles"; - - import getActions from "../../redux/api/getActions"; @@ -22,9 +20,11 @@ import getActions from "../../redux/api/getActions"; * */ class Search extends CustomComponentForAPI { + state = { - suggestions: [] - } + input: "", + }; + /** * Get the university suggestions for the `input` string. @@ -32,19 +32,29 @@ class Search extends CustomComponentForAPI { * @param {string} input * @memberof Search */ - getSuggestions(input) { - const universities = this.getLatestReadData("universities"), - filter = fuzzysort.go(input, universities, { keys: ["name", "acronym"] }); + getSuggestions() { + const filteredUniversities = this.props.selectedUniversities, + universities = this.getLatestReadData("universities"), + possibleUniversities = filteredUniversities.length === 0 ? + universities + : + universities.filter(univ => filteredUniversities.includes(univ.id)), + filter = fuzzysort.go( + this.state.input, + possibleUniversities, + {keys: ["name", "acronym"]} + ); let suggestions = filter.map(item => item.obj); - if (suggestions.length == 0) { - suggestions = universities; + if (suggestions.length === 0) { + suggestions = possibleUniversities; } - this.setState({ suggestions }); + return suggestions; } customRender() { - const { classes } = this.props; + const suggestions = this.getSuggestions(); + const {classes} = this.props; return ( <> @@ -54,13 +64,13 @@ class Search extends CustomComponentForAPI { InputLabelProps={{ shrink: true, }} - placeholder="Rechercher..." + placeholder="Nom ou acronyme..." fullWidth margin="normal" - InputProps={{ classes: { input: classes.inputCentered } }} - onChange={(e) => this.getSuggestions(e.target.value)} + InputProps={{classes: {input: classes.inputCentered}}} + onChange={(e) => this.setState({input: e.target.value})} /> - + ); } @@ -68,16 +78,17 @@ class Search extends CustomComponentForAPI { Search.propTypes = { classes: PropTypes.object.isRequired, + selectedUniversities: PropTypes.array.isRequired }; - const mapStateToProps = (state) => { return { universities: state.api.universitiesAll, mainCampuses: state.api.mainCampusesAll, cities: state.api.citiesAll, countries: state.api.countriesAll, + selectedUniversities: state.app.selectedUniversities }; }; diff --git a/frontend/src/components/search/UnivList.js b/frontend/src/components/search/UnivList.js index f532ab8..77be9af 100644 --- a/frontend/src/components/search/UnivList.js +++ b/frontend/src/components/search/UnivList.js @@ -10,9 +10,10 @@ import Button from "@material-ui/core/Button"; import KeyboardArrowLeft from "@material-ui/icons/KeyboardArrowLeft"; import KeyboardArrowRight from "@material-ui/icons/KeyboardArrowRight"; import SwipeableViews from "react-swipeable-views"; -import { Link } from "react-router-dom"; +import {Link} from "react-router-dom"; import range from "../../utils/range"; import {APP_ROUTES} from "../../config/appRoutes"; +import isEqual from "lodash/isEqual"; /** * Component to provide a nice list of universities that can be swiped @@ -27,7 +28,7 @@ class UnivList extends React.Component { componentDidUpdate(prevProps) { // If the list is not the same, then make sure to "reset" and move to the first page - if (prevProps.universitiesToList != this.props.universitiesToList) { + if (!isEqual(prevProps.universitiesToList, this.props.universitiesToList)) { this.handleStepChange(0); } } @@ -46,12 +47,12 @@ class UnivList extends React.Component { } handleStepChange(activeStep) { - this.setState({ activeStep }); + this.setState({activeStep}); } render() { - const { classes, theme, itemsPerPage, universitiesToList } = this.props, - { activeStep } = this.state, + const {classes, theme, itemsPerPage, universitiesToList} = this.props, + {activeStep} = this.state, numberOfItems = universitiesToList.length, maxSteps = Math.ceil(numberOfItems / itemsPerPage); @@ -78,12 +79,12 @@ class UnivList extends React.Component { {range(maxSteps).map(page => (
- + {getIndexesOnPage(page).map( univIdx => ( - + ) @@ -100,14 +101,15 @@ class UnivList extends React.Component { activeStep={activeStep} className={classes.mobileStepper} nextButton={ - } backButton={ } @@ -146,4 +148,4 @@ const styles = theme => ({ }, }); -export default withStyles(styles, { withTheme: true })(UnivList); +export default withStyles(styles, {withTheme: true})(UnivList); diff --git a/frontend/src/redux/reducers/filter.js b/frontend/src/redux/reducers/filter.js index c28174c..482abb0 100644 --- a/frontend/src/redux/reducers/filter.js +++ b/frontend/src/redux/reducers/filter.js @@ -15,9 +15,7 @@ import { SAVE_SELECTED_UNIVERSITIES, SAVE_FILTER_CONFIG } from "../actions/actio export function saveSelectedUniversities(state = [], action) { switch (action.type) { case SAVE_SELECTED_UNIVERSITIES: - return { - selection: action.newSelection, - }; + return action.newSelection; default: return state; @@ -32,7 +30,7 @@ export function saveSelectedUniversities(state = [], action) { * @param {string} action * @returns */ -export function saveFilterConfig(state = { countriesFilter: { selectedItems: [], inputValue: "" } }, action) { +export function saveFilterConfig(state = { countriesFilter: { selectedItems: [], inputValue: "" }}, action) { switch (action.type) { case SAVE_FILTER_CONFIG: return Object.assign({}, state, action.config); -- GitLab