FiltersBlock.tsx 1.74 KB
Newer Older
Matija Obreza's avatar
Matija Obreza committed
1
import * as React from 'react';
Matija Obreza's avatar
Matija Obreza committed
2
3
import {connect} from 'react-redux';
import {bindActionCreators} from 'redux';
Matija Obreza's avatar
Matija Obreza committed
4
5
import {withStyles} from 'material-ui/styles';

Valeriy Panov's avatar
Valeriy Panov committed
6
import {log} from 'utilities/debug';
Matija Obreza's avatar
Matija Obreza committed
7
import { showSnackbar } from 'actions/snackbar';
Valeriy Panov's avatar
Valeriy Panov committed
8

Matija Obreza's avatar
Matija Obreza committed
9
10
import ExpandFiltersComponent from './ExpandFiltersComponent';
import Button from 'material-ui/Button';
Maxym Borodenko's avatar
Maxym Borodenko committed
11
import {cleanFilters} from 'utilities';
Matija Obreza's avatar
Matija Obreza committed
12
13
14
15
16
17
18
19

const styles = (theme) => ({
    btnGreen: theme.buttons.green,
    btnReset: theme.buttons.reset,
});

//
// Renders a standard filters block
Matija Obreza's avatar
Matija Obreza committed
20
const FiltersBlock = ({ title, children, handleSubmit, onSubmit, initialize, classes, showSnackbar }) => {
21
22
23
24
25
26
  const scrollToTop = () => {
    if (window) {
      window.scrollTo(0, 0);
    }
  };

Matija Obreza's avatar
Matija Obreza committed
27
  const onReset = (e) => {
Matija Obreza's avatar
Matija Obreza committed
28
    showSnackbar('Resetting filters...');
Valeriy Panov's avatar
Valeriy Panov committed
29
    log('Clearing form');
Matija Obreza's avatar
Matija Obreza committed
30
31
    initialize({});
    setTimeout(handleSubmit, 100);
32
    scrollToTop();
Matija Obreza's avatar
Matija Obreza committed
33
34
  };

35
  const processSubmit = handleSubmit((data) => {
Matija Obreza's avatar
Matija Obreza committed
36
    showSnackbar('Applying filters...');
37
    console.log('Submitting', data);
38
    scrollToTop();
39
40
41
    return onSubmit(cleanFilters(data));
  });

Matija Obreza's avatar
Matija Obreza committed
42
43
44
  return (
    <div>
      <ExpandFiltersComponent title={ title || 'Filters' }>
45
        <form onSubmit={ processSubmit }>
Matija Obreza's avatar
Matija Obreza committed
46
          { children }
Maxim Babichev's avatar
Maxim Babichev committed
47
            <div className="pt-20 pb-20 pl-20">
48
            <Button raised onClick={ processSubmit } type="submit" className={ classes.btnGreen }>Apply filters</Button>
Matija Obreza's avatar
Matija Obreza committed
49
50
51
52
53
54
55
56
            <Button onClick={ onReset } type="button" className={ classes.btnReset }>Reset</Button>
          </div>
        </form>
      </ExpandFiltersComponent>
    </div>
  );
};

Matija Obreza's avatar
Matija Obreza committed
57
58
59
60
61
const mapDispatchToProps = (dispatch) => bindActionCreators({
    showSnackbar,
}, dispatch);

export default connect(null, mapDispatchToProps)(withStyles(styles)<any>(FiltersBlock));