'use strict';

var slicedToArray = require('./slicedToArray-067dd3bc.js');
var React = require('react');
var reactBootstrap = require('react-bootstrap');
require('./_commonjsHelpers-06173234.js');
require('./web.dom.iterable-d98303e0.js');
require('./core.get-iterator-method-5643aa10.js');

function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }

var React__default = /*#__PURE__*/_interopDefaultLegacy(React);

var PageFilter = function PageFilter(props) {
  var getParams = props.getParams,
      filters = props.filters,
      defaultFilter = props.defaultFilter;

  var _useState = React.useState(''),
      _useState2 = slicedToArray._slicedToArray(_useState, 2),
      filter = _useState2[0],
      setFilter = _useState2[1];

  var usePrevious = function usePrevious(value) {
    var ref = React.useRef();
    React.useEffect(function () {
      ref.current = value;
    });
    return ref.current;
  };

  var sortAttr = usePrevious({ filter: filter });

  React.useEffect(function () {
    if (sortAttr && sortAttr.filter !== filter) {
      getParams(filter);
    }
  }, [filter, sortAttr, getParams]);

  if (filters.length) {
    return React__default["default"].createElement(
      reactBootstrap.Dropdown,
      { alignRight: true },
      React__default["default"].createElement(
        reactBootstrap.Dropdown.Toggle,
        { className: 'filter-dropdown', id: 'filter-dropdown' },
        filter || defaultFilter
      ),
      React__default["default"].createElement(
        reactBootstrap.Dropdown.Menu,
        { className: 'select-dropdown' },
        filters.map(function (filter, index) {
          return React__default["default"].createElement(
            reactBootstrap.Dropdown.Item,
            { key: index, onClick: function onClick() {
                return setFilter(filter);
              } },
            filter
          );
        })
      ),
      React__default["default"].createElement(
        'style',
        { jsx: 'true' },
        '\n          .filter-dropdown {\n            float: right;\n          }\n          .select-dropdown > a {\n            color: #8e8c84;\n          }\n        '
      )
    );
  }
  return null;
};

module.exports = PageFilter;
