diff --git a/src/components/common/messaging/bars/ReplyBar.tsx b/src/components/common/messaging/bars/ReplyBar.tsx index c8c4aa8d..491e1f1a 100644 --- a/src/components/common/messaging/bars/ReplyBar.tsx +++ b/src/components/common/messaging/bars/ReplyBar.tsx @@ -81,10 +81,11 @@ const Base = styled.div` `; // ! FIXME: Move to global config -const MAX_REPLIES = 4; +const MAX_REPLIES = 5; export default observer(({ channel, replies, setReplies }: Props) => { - const client = useClient(); + const client = channel.client; + // Event listener for adding new messages to reply bar. useEffect(() => { return internalSubscribe("ReplyBar", "add", (_message) => { const message = _message as Message; @@ -107,26 +108,24 @@ export default observer(({ channel, replies, setReplies }: Props) => { }); }, [replies, setReplies, client.user]); - const renderer = getRenderer(channel); - if (renderer.state !== "RENDER") return null; + // Map all the replies to messages we are aware of. + const messages = replies.map((x) => client.messages.get(x.id)); - const ids = replies.map((x) => x.id); - const messages = renderer.messages.filter((x) => ids.includes(x._id)); + // Remove any replies which don't resolve to valid messages. + useEffect(() => { + if (messages.includes(undefined)) { + setReplies( + replies.filter((_, i) => typeof messages[i] !== "undefined"), + ); + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [messages, replies, setReplies]); return (