add names to conversation view and set header styles
Change-Id: Ic34b2cea754a5a82224a9fbf158b0126c7e44a5e
diff --git a/client/src/components/MessageList.jsx b/client/src/components/MessageList.jsx
index bcbcd28..513af54 100644
--- a/client/src/components/MessageList.jsx
+++ b/client/src/components/MessageList.jsx
@@ -35,10 +35,13 @@
dayjs.extend(isBetween);
export default function MessageList(props) {
- const messagesComponents = useMemo(() => buildMessagesList(props.messages), [props.messages]);
+ const messagesComponents = useMemo(
+ () => buildMessagesList(props.account, props.members, props.messages),
+ [props.account, props.members, props.messages]
+ );
return (
- <Stack marginLeft="16px" marginRight="16px" direction="column-reverse">
+ <Stack direction="column-reverse">
{messagesComponents?.map(({ Component, id, props }) => (
<Component key={id} {...props} />
))}
@@ -46,7 +49,7 @@
);
}
-const buildMessagesList = (messages) => {
+const buildMessagesList = (account, members, messages) => {
if (messages.length == 0) {
return null;
}
@@ -63,7 +66,7 @@
components.push({
id: `group-${messageBubblesGroup[0].id}`,
Component: MessageBubblesGroup,
- props: { messages: messageBubblesGroup },
+ props: { account, members, messages: messageBubblesGroup },
});
messageBubblesGroup = [];
};