import React from 'react';
import {get} from 'lodash/fp';
import ThreadContent from '../../../../../models/ThreadContent';
import Text from '../Text';
import Info from '../Info';

interface Props {
  threadContent: ThreadContent;
}

export default ({threadContent}: Props) => {
  return (
    <div className='text-align-right' data-msg-key={get('contentInstance.id', threadContent)}>
      <div className='wrapper inline-block'>
        <div className='media-object pull-right' data-animate='slide-in-right slide-out-right'>
          <div className='small white-bg talk-bubble border tri-right right-in'>
            <Text threadContent={threadContent} />
          </div>
          <Info threadContent={threadContent} />
        </div>
      </div>
    </div>
  );
};