resources/js/components/chat-bot-logs/Item.js

   1 import moment from 'moment';
   2 import PropTypes from 'prop-types';
   3 import React from 'react';
   4 import { ListGroup } from 'react-bootstrap';
   5 import { useTranslation } from 'react-i18next';
   6
   7 const getEntryDate = entry => {
   8         const dateStr = moment(entry.created_at).fromNow();
   9         return entry.user
  10                 ? `${entry.user.username} ${dateStr}`
  11                 : dateStr;
  12 };
  13
  14 const getEntryOrigin = (entry, t) => {
  15         return t('chatBotLog.origin.chatLog', {
  16                 channel: entry.origin.params[0],
  17                 date: new Date(entry.origin.created_at),
  18                 nick: entry.origin.nick,
  19         });
  20 };
  21
  22 const Item = ({ entry }) => {
  23         const { t } = useTranslation();
  24
  25         return <ListGroup.Item>
  26                 <div>
  27                         <div>
  28                                 {entry.text}
  29                         </div>
  30                         {entry.origin ?
  31                                 <div
  32                                         className="text-muted"
  33                                 >
  34                                         {getEntryOrigin(entry, t)}
  35                                 </div>
  36                         : null}
  37                         <div
  38                                 className="text-muted"
  39                                 title={moment(entry.created_at).format('LLLL')}
  40                         >
  41                                 {getEntryDate(entry)}
  42                         </div>
  43                 </div>
  44         </ListGroup.Item>;
  45 };
  46
  47 Item.propTypes = {
  48         entry: PropTypes.shape({
  49                 created_at: PropTypes.string,
  50                 origin: PropTypes.shape({}),
  51                 text: PropTypes.string,
  52         }),
  53 };
  54
  55 Item.defaultProps = {
  56         entry: {},
  57 };
  58
  59 export default Item;