diff --git a/assets/js/components/PeopleIndex.js b/assets/js/components/PeopleIndex.js index f523b0ba..580c146e 100644 --- a/assets/js/components/PeopleIndex.js +++ b/assets/js/components/PeopleIndex.js @@ -21,10 +21,24 @@ const People = new Model('people') const PeopleSelector = new Selectable('people') const PeopleFilter = new Filterable('people') +function getUrlFilter(state) { + const url = new URL(state.getIn(['router', 'location', 'search'], ''), window.location) + const decoded = atob(url.searchParams.get('filter', undefined)) + try { + return JSON.parse(decoded) + } catch (_e) { + return undefined + } +} + const mapStateToProps = state => { const selection = PeopleSelector.immutableSelected(state) + const storeFilter = PeopleFilter.getFilter(state) + const urlFilter = getUrlFilter(state) return { selection, + urlFilter, + initialFilter: urlFilter ? urlFilter : storeFilter } } @@ -83,9 +97,12 @@ export class PeopleIndex extends Component { super(props) this.state = { currentState: 0, - copied: false + copied: false, } this.onCopy = this.onCopy.bind(this) + if (this.props.urlFilter) { + this.props.filter.set(this.props.urlFilter) + } } onCopy() { @@ -114,7 +131,7 @@ export class PeopleIndex extends Component { - + ) diff --git a/assets/js/components/people-browser/BooleanFilter.js b/assets/js/components/people-browser/BooleanFilter.js index b0d37f11..ab567e3c 100644 --- a/assets/js/components/people-browser/BooleanFilter.js +++ b/assets/js/components/people-browser/BooleanFilter.js @@ -53,7 +53,7 @@ const OperatorWidgetForField = withFieldState('property')(props => { return ( Comparison - + Is @@ -75,7 +75,7 @@ const OperatorWidgetForField = withFieldState('property')(props => { return ( Comparison - + ) } @@ -100,7 +100,7 @@ export const BooleanFilter = props => { What - + Name E-Mail City diff --git a/assets/js/components/people-browser/Search.js b/assets/js/components/people-browser/Search.js index 38cf910b..c5f7ece6 100644 --- a/assets/js/components/people-browser/Search.js +++ b/assets/js/components/people-browser/Search.js @@ -1,30 +1,49 @@ import React from 'react' import Grid from '@material-ui/core/Grid' -import IconButton from '@material-ui/core/IconButton' +import Button from '@material-ui/core/Button' import { Form, withFormApi } from 'informed' import faPlusSquare from '@fortawesome/fontawesome-free-solid/faPlusSquare' import { library as faLibrary } from '@fortawesome/fontawesome' import { FontAwesomeIcon } from '@fortawesome/react-fontawesome' import MaterialFormSwitch from '../MaterialFormSwitch' +import copy from 'copy-to-clipboard' faLibrary.add(faPlusSquare) import BooleanFilter from './BooleanFilter' const AddButton = withFormApi(props => ( - { const curFilter = props.formApi.getState().values.filter || [] props.formApi.setValues({...(props.formApi.getState().values), filter: [...curFilter, {}]}) }}> - +  Add a filter + +)) + +const CopyButton = withFormApi(props => ( + )) export const Search = props => { + const initialFilter = (props.initialFilter || {children: [{}]}).children + const initialOp = (props.initialFilter || {op: 'and'}).op + const boolOp = initialOp == 'or' return ( -
props.filter.set({op: values.op ? 'or' : 'and', children: values.filter})}> + props.filter.set({op: values.op ? 'or' : 'and', children: values.filter})}> {({formApi}) => ( Match All Match Any @@ -33,7 +52,7 @@ export const Search = props => { )} - Add a filter + )}