bug: groupStyles always undefined with VirtualizedMessageList

[aaronvg]

Describe the bug groupStyles undefined

To Reproduce Create virtualized message list and a custom message.

Get the groupStyles in the CustomMessage

const {
    isReactionEnabled,
    message,
    reactionSelectorRef,
    showDetailedReactions,
    groupStyles,
    firstOfGroup,
    endOfGroup,
    groupedByUser,
  } = useMessageContext();

groupStyles is always undefined.

Happens even when adding a custom groupStyles function on the VirtualizedMessageList

Package version

• stream-chat-react: 10.2.0
• stream-chat-css:
• stream-chat-js:

Desktop (please complete the following information):

• OS: [e.g. iOS]
• Browser [e.g. chrome, safari] Chrome, electron
• Version [e.g. 22]

Add any other context about the problem here.

[MartinCupela]

Hello @aaronvg the groupStyle string is injected into the virtual message wrapper div class. So you can target the message by its group in your CSS. VirtualizedMessageList works differently compared to MessageList, because each message is wrapped. Is there any other reason why you would need access to groupStyle in your components?

[aaronvg]

I did end up figuring that out. It just seems easier for me to programmatically show or hide elements in the message based on their group style rather than with css. But i got it to work with css.

Do definitely update the docs though!

[MartinCupela]

Closing the issue with a follow-up issue https://github.com/GetStream/stream-chat-react-issues/issues/4 created