diff --git a/app/soapbox/features/chats/components/chat.js b/app/soapbox/features/chats/components/chat.js index 1a09edd47..8db6ddb62 100644 --- a/app/soapbox/features/chats/components/chat.js +++ b/app/soapbox/features/chats/components/chat.js @@ -1,4 +1,5 @@ import React from 'react'; +import { connect } from 'react-redux'; import ImmutablePropTypes from 'react-immutable-proptypes'; import PropTypes from 'prop-types'; import Avatar from '../../../components/avatar'; @@ -6,11 +7,29 @@ import DisplayName from '../../../components/display_name'; import ImmutablePureComponent from 'react-immutable-pure-component'; import { shortNumberFormat } from 'soapbox/utils/numbers'; import emojify from 'soapbox/features/emoji/emoji'; +import { makeGetChat } from 'soapbox/selectors'; -export default class Chat extends ImmutablePureComponent { + +const makeMapStateToProps = () => { + const getChat = makeGetChat(); + + const mapStateToProps = (state, { chatId }) => { + const chat = state.getIn(['chats', chatId]); + + return { + chat: chat ? getChat(state, chat.toJS()) : undefined, + }; + }; + + return mapStateToProps; +}; + +export default @connect(makeMapStateToProps) +class Chat extends ImmutablePureComponent { static propTypes = { - chat: ImmutablePropTypes.map.isRequired, + chatId: PropTypes.string.isRequired, + chat: ImmutablePropTypes.map, onClick: PropTypes.func, }; diff --git a/app/soapbox/features/chats/components/chat_list.js b/app/soapbox/features/chats/components/chat_list.js index e24d31ab9..2624a6e2f 100644 --- a/app/soapbox/features/chats/components/chat_list.js +++ b/app/soapbox/features/chats/components/chat_list.js @@ -1,10 +1,10 @@ import React from 'react'; import { connect } from 'react-redux'; import PropTypes from 'prop-types'; +import ImmutablePropTypes from 'react-immutable-proptypes'; import { injectIntl } from 'react-intl'; import ImmutablePureComponent from 'react-immutable-pure-component'; import Chat from './chat'; -import { makeGetChat } from 'soapbox/selectors'; const chatDateComparator = (chatA, chatB) => { // Sort most recently updated chats at the top @@ -18,15 +18,13 @@ const chatDateComparator = (chatA, chatB) => { }; const mapStateToProps = state => { - const getChat = makeGetChat(); - - const chats = state.get('chats') - .map(chat => getChat(state, chat.toJS())) + const chatIds = state.get('chats') .toList() - .sort(chatDateComparator); + .sort(chatDateComparator) + .map(chat => chat.get('id')); return { - chats, + chatIds, }; }; @@ -37,23 +35,24 @@ class ChatList extends ImmutablePureComponent { static propTypes = { dispatch: PropTypes.func.isRequired, intl: PropTypes.object.isRequired, + chatIds: ImmutablePropTypes.list, onClickChat: PropTypes.func, emptyMessage: PropTypes.node, }; render() { - const { chats, emptyMessage } = this.props; + const { chatIds, emptyMessage } = this.props; return (