diff --git a/src/Components/SideSheet/Comments/Components/ClusteredMessages.tsx b/src/Components/SideSheet/Comments/Components/ClusteredMessages.tsx index 338a364b..39d578e3 100644 --- a/src/Components/SideSheet/Comments/Components/ClusteredMessages.tsx +++ b/src/Components/SideSheet/Comments/Components/ClusteredMessages.tsx @@ -1,5 +1,5 @@ import React, { - FC, SetStateAction, Dispatch, + FC, SetStateAction, Dispatch, } from "react" import { Typography } from "@equinor/eds-core-react" import styled from "styled-components" @@ -37,69 +37,88 @@ interface ClusteredMessagesProps { } const ClusteredMessages: FC = ({ - comments, reviewComments, setReviewComments, + comments, reviewComments, setReviewComments, }) => { const currentUser: any = useCurrentUser() const isCurrentUser = (userId: string) => currentUser?._info.localAccountId === userId type Cluster = { - userId: string; - meta: { - commenterName: string | null | undefined; - createdDate: string; + userId: string; + meta: { + commenterName: string | null | undefined; + createdDate: string; + }; + messages: { + text: string | undefined; + isEdited: boolean | undefined; + id: string; + modifiedDate?: string; + }[]; }; - messages: { - text: string | undefined; - isEdited: boolean | undefined; - id: string; - }[]; -}; -const generateMessageCluster = (postedComments: ReviewComment[]): Cluster[] => { - const clusters: Cluster[] = [] - const strToDate = (dateString: string): Date => new Date(dateString) - const diffInMinutes = (date1: Date, date2: Date): number => (date2.getTime() - date1.getTime()) / 1000 / 60 + const generateMessageCluster = (postedComments: ReviewComment[]): Cluster[] => { + const clusters: Cluster[] = [] + const strToDate = (dateString: string): Date => new Date(dateString) + const diffInMinutes = (date1: Date, date2: Date): number => (date2.getTime() - date1.getTime()) / 1000 / 60 - postedComments.forEach((comment) => { - if (!comment.userId || !comment.createdDate) return + postedComments.forEach((comment) => { + if (!comment.userId || !comment.createdDate) return - const { userId } = comment - const createdDate = strToDate(comment.createdDate) + const { userId } = comment + const createdDate = strToDate(comment.createdDate) - if (clusters.length === 0 - || clusters[clusters.length - 1].userId !== userId - || diffInMinutes(strToDate(clusters[clusters.length - 1].meta.createdDate), createdDate) > 5) { - clusters.push({ - userId, - meta: { - commenterName: comment.commenterName, - createdDate: comment.createdDate, - }, - messages: [{ text: comment.text || undefined, isEdited: comment.isEdited, id: comment.id || "" }], - }) - } else { - clusters[clusters.length - 1].messages.push({ text: comment.text || undefined, isEdited: comment.isEdited, id: comment.id || "" }) - } - }) + if (clusters.length === 0 + || clusters[clusters.length - 1].userId !== userId + || diffInMinutes(strToDate(clusters[clusters.length - 1].meta.createdDate), createdDate) > 5) { + clusters.push({ + userId, + meta: { + commenterName: comment.commenterName, + createdDate: comment.createdDate, + }, + messages: [{ + text: comment.text || undefined, + isEdited: comment.isEdited, + id: comment.id || "", + modifiedDate: comment.modifiedDate, + }], + }) + } else { + clusters[clusters.length - 1].messages.push({ + text: comment.text || undefined, + isEdited: comment.isEdited, + id: comment.id || "", + modifiedDate: comment.modifiedDate, + }) + } + }) - return clusters -} + return clusters + } - return ( - <> - {generateMessageCluster(comments).map((cluster, index) => ( - -
- {!isCurrentUser(cluster.userId) && ( - {cluster.meta.commenterName} - )} - - {formatDate(cluster.meta.createdDate)} - -
-
- {cluster.messages.map((message, messageIndex) => { - console.log(message) - return ( + return ( + <> + {generateMessageCluster(comments).map((cluster, index) => ( + +
+ {!isCurrentUser(cluster.userId) && ( + {cluster.meta.commenterName} + )} + + {formatDate(cluster.meta.createdDate)} + +
+
+ {cluster.messages.map((message, messageIndex) => { + console.log(message) + return ( + <> + {message.isEdited && ( + + Edited + {" "} + {formatDate(message.modifiedDate || "")} + + )} { setReviewComments={setReviewComments} userId={cluster.userId} /> - ) - })} -
-
+ + ) + })} +
+
))} - + ) }