chatsList.js 1.2 KB

123456789101112131415161718192021222324252627282930313233343536373839
  1. import { Link } from "react-router-dom"
  2. import ReactTimeAgo from 'react-time-ago'
  3. import TimeAgo from 'javascript-time-ago'
  4. import ru from 'javascript-time-ago/locale/ru.json'
  5. import React from 'react';
  6. TimeAgo.addLocale(ru)
  7. const ChatItem = ({ id, chat }) => {
  8. return (
  9. <li className="aside-chat" >
  10. <Link to={`/chat_id.${id}`}>
  11. {chat.avatar && <img src={chat.avatar.url} alt="chat-avatar" />}
  12. <div className="aside-chat-info">
  13. <h5>{chat.title}</h5>
  14. <span>Последнее обновление: </span>
  15. {chat.lastModified && <ReactTimeAgo date={+(chat.lastModified)} locale="ru" timeStyle="round" />}
  16. </div>
  17. </Link>
  18. </li>
  19. )
  20. }
  21. const ChatsList = ({ chats, onChat }) => {
  22. return (
  23. <>
  24. <ul className="chat-list">
  25. <li className="aside-chat-btn">
  26. <Link to="/chat">Новый чат</Link>
  27. </li>
  28. {Object.entries(chats).map(([id, chat]) => <ChatItem key={id} id={id} chat={chat} />)}
  29. </ul>
  30. </>
  31. )
  32. }
  33. export default ChatsList