import React from 'react'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { connect } from 'react-redux'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { injectIntl } from 'react-intl'; import { setupListAdder, resetListAdder } from '../../actions/lists'; import { createSelector } from 'reselect'; import List from './components/list'; import Account from './components/account'; import NewListForm from '../lists/components/new_list_form'; // hack const getOrderedLists = createSelector([state => state.get('lists')], lists => { if (!lists) { return lists; } return lists.toList().filter(item => !!item).sort((a, b) => a.get('title').localeCompare(b.get('title'))); }); const mapStateToProps = state => ({ listIds: getOrderedLists(state).map(list=>list.get('id')), }); const mapDispatchToProps = dispatch => ({ onInitialize: accountId => dispatch(setupListAdder(accountId)), onReset: () => dispatch(resetListAdder()), }); class ListAdder extends ImmutablePureComponent { static propTypes = { accountId: PropTypes.string.isRequired, onClose: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, onInitialize: PropTypes.func.isRequired, onReset: PropTypes.func.isRequired, listIds: ImmutablePropTypes.list.isRequired, }; componentDidMount () { const { onInitialize, accountId } = this.props; onInitialize(accountId); } componentWillUnmount () { const { onReset } = this.props; onReset(); } render () { const { accountId, listIds } = this.props; return (