You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

AbstractMessageContainer.js 1.3KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253
  1. // @flow
  2. import { PureComponent } from 'react';
  3. export type Props = {
  4. /**
  5. * The messages array to render.
  6. */
  7. messages: Array<Object>
  8. }
  9. /**
  10. * Abstract component to display a list of chat messages, grouped by sender.
  11. *
  12. * @extends PureComponent
  13. */
  14. export default class AbstractMessageContainer<P: Props> extends PureComponent<P> {
  15. static defaultProps = {
  16. messages: []
  17. };
  18. /**
  19. * Iterates over all the messages and creates nested arrays which hold
  20. * consecutive messages sent by the same participant.
  21. *
  22. * @private
  23. * @returns {Array<Array<Object>>}
  24. */
  25. _getMessagesGroupedBySender() {
  26. const messagesCount = this.props.messages.length;
  27. const groups = [];
  28. let currentGrouping = [];
  29. let currentGroupParticipantId;
  30. for (let i = 0; i < messagesCount; i++) {
  31. const message = this.props.messages[i];
  32. if (message.id === currentGroupParticipantId) {
  33. currentGrouping.push(message);
  34. } else {
  35. currentGrouping.length && groups.push(currentGrouping);
  36. currentGrouping = [ message ];
  37. currentGroupParticipantId = message.id;
  38. }
  39. }
  40. currentGrouping.length && groups.push(currentGrouping);
  41. return groups;
  42. }
  43. }