feature/IO-3000-messaging-sockets-migration2 -

- [EXISTING BUG?] The updated at timeframes do not automatically update as time passes. If you receive a message, and it is changed to a few seconds ago, if you wait a few minutes, it does not change unless you interact with it forcing a re-render. This can be solved by adding a tick state and periodically refreshing - unsure of the performance impact for many elements however.

Signed-off-by: Dave Richer <dave@imexsystems.ca>
This commit is contained in:
Dave Richer
2024-11-27 10:21:53 -08:00
parent 5e871b024d
commit 70c31eae9e

View File

@@ -1,5 +1,5 @@
import { Badge, Card, List, Space, Tag } from "antd";
import React from "react";
import React, { useEffect, useState } from "react";
import { connect } from "react-redux";
import { Virtuoso } from "react-virtuoso";
import { createStructuredSelector } from "reselect";
@@ -20,6 +20,18 @@ const mapDispatchToProps = (dispatch) => ({
});
function ChatConversationListComponent({ conversationList, selectedConversation, setSelectedConversation }) {
// That comma is there for a reason, do not remove it
const [, forceUpdate] = useState(false);
// Re-render every minute
useEffect(() => {
const interval = setInterval(() => {
forceUpdate((prev) => !prev); // Toggle state to trigger re-render
}, 60000); // 1 minute in milliseconds
return () => clearInterval(interval); // Cleanup on unmount
}, []);
const renderConversation = (index) => {
const item = conversationList[index];
const cardContentRight = <TimeAgoFormatter>{item.updated_at}</TimeAgoFormatter>;