Tristan Yang
41 lines
1.3 KiB
TypeScript
41 lines
1.3 KiB
TypeScript
/* eslint-disable @typescript-eslint/indent */
|
|
import { FC, memo, useEffect } from 'react';
|
|
// import { MessagePayload } from '../../../app/slices/message';
|
|
import { useAppSelector } from '../../../app/store';
|
|
import TextMessage from './Message/Text';
|
|
|
|
type Props = {
|
|
uid: number
|
|
};
|
|
|
|
// 间隔10秒
|
|
const interval = 10 * 1000;
|
|
const Index: FC<Props> = ({ uid }) => {
|
|
const { mids, messageMap } = useAppSelector(store => { return { mids: store.userMessage.byId[uid], messageMap: store.message }; });
|
|
console.log("mids", mids, uid);
|
|
useEffect(() => {
|
|
const container = document.querySelector("#MESSAGE_LIST_CONTAINER");
|
|
if (mids && mids.length > 0 && container) {
|
|
setTimeout(() => {
|
|
container.scrollTop = container.scrollHeight;
|
|
}, 30);
|
|
}
|
|
}, [mids]);
|
|
|
|
if (!mids) return null;
|
|
return mids.map((mid, idx) => {
|
|
const currMsg = messageMap[mid];
|
|
const prevMsg = messageMap[mids[idx - 1]];
|
|
const compact = !prevMsg
|
|
? false
|
|
: prevMsg.from_uid !== currMsg.from_uid
|
|
? false
|
|
: (currMsg.created_at ?? 0) - (prevMsg.created_at ?? 0) < interval;
|
|
return <TextMessage hostId={uid} key={currMsg.mid} {...currMsg} compact={compact} isFirst={idx === 0} />;
|
|
});
|
|
};
|
|
|
|
export default memo(Index, (prev, next) => {
|
|
return JSON.stringify(prev.uid) === JSON.stringify(next.uid);
|
|
});
|