Commit 06c807fc authored by Elisabeth Reuhl's avatar Elisabeth Reuhl
Browse files

Remove extraneous stuff from Filters and CollapsedFilters (issue #59)

parent 4ad60ec8
import React from "react";
import { Button, Card, Chip, Grid } from "@material-ui/core";
import { Chip } from "@material-ui/core";
import { useStyles } from "../../styles";
import { useTranslation } from "react-i18next";
import ExpandLessIcon from "@material-ui/icons/ExpandLess";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
export const CollapsedFilters = (props) => {
const [input, dispatch] = props.reducer;
const { input } = props;
const { t, i18n } = useTranslation();
const classes = useStyles();
return (
<Card className={classes.card}>
<Grid className={classes.dashboardTileHeader} item>
<Button
onClick={() => {
dispatch({type: "TOGGLE_STATE", payload: {toggledField: "mapControlsExpanded"}})
}}
>
<h3 className={classes.h3}>{t('Filters')}</h3>
{input.mapControlsExpanded ? <ExpandLessIcon/> : <ExpandMoreIcon/>}
</Button>
{/*Chip for mode*/}
<Chip label={input.mode === "archaeoSites"
? "Archaeological Sites"
: "Objects"}
/>
{/*Chip for for string query*/}
{input.searchStr !== ""
&& <Chip variant="outlined" label={`Search term: ${input.searchStr}`}/>}
{/*Chip for filter by period*/}
{input.chronOntologyTerm !== null
&& <Chip variant="outlined" label={`Chronontology term: ${input.chronOntologyTerm}`}/>}
{/*Chip for filter by region*/}
{input.sitesMode === "region" && input.regionTitle !== null
&& <Chip variant="outlined"
label={`Region: ${input.regionTitle}`}
/>}
{/*Chip for filter by coordinates*/}
{(/-?\d{1,2}\.\d+,-?\d{1,3}\.\d+/.test(input.boundingBoxCorner1) && (/-?\d{1,2}\.\d+,-?\d{1,3}\.\d+/.test(input.boundingBoxCorner2)))
&& <Chip variant="outlined"
label={`Bounding box: [${input.boundingBoxCorner1}], [${input.boundingBoxCorner2}]`}/>}
{/*Chip for filter by catalogs*/}
{input.checkedCatalogLabels.length !== 0
&& <Chip variant="outlined" label={`Catalog: ${input.checkedCatalogLabels}`}/>}
</Grid>
</Card>
)
<>
{/*Chip for mode*/}
<Chip label={input.mode === "archaeoSites"
? "Archaeological Sites"
: "Objects"}
/>
{/*Chip for for string query*/}
{input.searchStr !== ""
&& <Chip variant="outlined" label={`Search term: ${input.searchStr}`}/>}
{/*Chip for filter by period*/}
{input.chronOntologyTerm !== null
&& <Chip variant="outlined" label={`Chronontology term: ${input.chronOntologyTerm}`}/>}
{/*Chip for filter by region*/}
{input.sitesMode === "region" && input.regionTitle !== null
&& <Chip variant="outlined"
label={`Region: ${input.regionTitle}`}
/>}
{/*Chip for filter by coordinates*/}
{(/-?\d{1,2}\.\d+,-?\d{1,3}\.\d+/.test(input.boundingBoxCorner1) && (/-?\d{1,2}\.\d+,-?\d{1,3}\.\d+/.test(input.boundingBoxCorner2)))
&& <Chip variant="outlined"
label={`Bounding box: [${input.boundingBoxCorner1}], [${input.boundingBoxCorner2}]`}/>}
{/*Chip for filter by catalogs*/}
{input.checkedCatalogLabels.length !== 0
&& <Chip variant="outlined" label={`Catalog: ${input.checkedCatalogLabels}`}/>}
</>
);
};
import React from 'react';
import {
Button, Card, Checkbox, FormControlLabel, FormGroup, FormLabel, Grid, IconButton, Radio, RadioGroup, Switch,
TextField, Tooltip
Checkbox, FormControlLabel, FormGroup, FormLabel, Grid, IconButton, Radio, RadioGroup, Switch, TextField, Tooltip
} from '@material-ui/core';
import Autocomplete from '@material-ui/lab/Autocomplete';
import ClearIcon from "@material-ui/icons/Clear";
import ExpandLessIcon from "@material-ui/icons/ExpandLess";
import ExpandMoreIcon from "@material-ui/icons/ExpandMore";
import { useStyles } from '../../styles';
import { useTranslation } from "react-i18next";
......@@ -32,18 +29,8 @@ export const Filters = (props) => {
return (
<Card className={classes.card}>
<Grid className={classes.dashboardTileHeader} item>
<Button
onClick={() => {
dispatch({type: "TOGGLE_STATE", payload: {toggledField: "mapControlsExpanded"}})
}}
>
<h3 className={classes.h3}>{t('Filters')}</h3>
{input.mapControlsExpanded ? <ExpandLessIcon/> : <ExpandMoreIcon/>}
</Button>
</Grid>
{<Grid className={classes.dashboardTileContent} item container direction="column" spacing={2}>
<>
{<Grid /*className={classes.dashboardTileContent}*/ item container direction="column" spacing={2}>
<Grid item container direction="row" spacing={2}>
{/*radio buttons for selecting mode*/
<Grid item>
......@@ -269,6 +256,6 @@ export const Filters = (props) => {
</Grid>}
</Grid>
</Grid>}
</Card>
)
</>
);
};
......@@ -90,7 +90,7 @@ export const PageHeader = (props) => {
<SearchIcon/> Filters <ExpandMoreIcon/>
</Button>
<CollapsedFilters
reducer={[input, dispatch]}
input={input}
/>
</Grid>
<Grid item xs={1}>
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment