React Virtuoso Message List - ref.current.scrollToItem based on the item.data instead of using the item index?

[vasiline2256]

Hello,
I have a list of Messages and a Message can be a reply to another Message,
and when I clicked Goto Message button of a Reply Message I want to scroll to the original Message being replied to ( If it is already loaded with Load More after scrolling up )

I see that there is already a function:

ref.current.scrollToItem({index: 50, align: 'center' })

but this function seems to only accept the generated index value,
is there a way to filter and get the index from the data passed to that Message instead?

because for me it is difficult to get the generated index for the Reply Message,
since the Message Items are virtualized, I cannot use scrollIntoView() with id for this,
or is there some other way that can accomplish this?

[vasiline2256]

hi, sorry to ask this but
is there currently no existing options to filter and get the index from the data passed to that Message Item?

[petyosi]

@vasiline2256 I see what you mean, this is a good feature enhancement. I will include the option to pass the data item to the scrollToItem and post an update here.

If you need any help with the implementation of the message list, reach out to [email protected].

[vasiline2256]

hi, is there an option to do something after ref.current.scrollToItem({index: 50, align: 'center' })? like with .then(() => { ... })?

for example: scrollToItem and then highlight it with css?

does such a feature already exist?

[petyosi]

@vasiline2256 Just published a new version of the MessageList component that exposes the necessary features to build the feature. Here's an example that scrolls to the replied message and highlights it using data.map.