import React from 'react'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; import ImmutablePropTypes from 'react-immutable-proptypes'; import { fetchGroups } from '../../../actions/groups'; import { defineMessages, injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { Link } from 'react-router-dom'; import classNames from 'classnames'; import GroupCard from './card'; const messages = defineMessages({ heading: { id: 'column.groups', defaultMessage: 'Groups' }, create: { id: 'groups.create', defaultMessage: 'Create group' }, tab_featured: { id: 'groups.tab_featured', defaultMessage: 'Featured' }, tab_member: { id: 'groups.tab_member', defaultMessage: 'Groups you\'re in' }, tab_admin: { id: 'groups.tab_admin', defaultMessage: 'Groups you manage' }, }); const mapStateToProps = (state, { activeTab }) => ({ groupIds: state.getIn(['group_lists', activeTab]), }); export default @connect(mapStateToProps) @injectIntl class Groups extends ImmutablePureComponent { static propTypes = { params: PropTypes.object.isRequired, activeTab: PropTypes.string.isRequired, dispatch: PropTypes.func.isRequired, groups: ImmutablePropTypes.map, groupIds: ImmutablePropTypes.list, intl: PropTypes.object.isRequired, }; componentWillMount () { this.props.dispatch(fetchGroups(this.props.activeTab)); } componentDidUpdate(oldProps) { if (this.props.activeTab && this.props.activeTab !== oldProps.activeTab) { this.props.dispatch(fetchGroups(this.props.activeTab)); } } render () { const { intl, groupIds, activeTab } = this.props; return (
{intl.formatMessage(messages.heading)}
{intl.formatMessage(messages.create)}

{intl.formatMessage(messages.tab_featured)} {intl.formatMessage(messages.tab_member)} {intl.formatMessage(messages.tab_admin)}

{groupIds.map(id => )}
); } }