[BUG] startReached is not working

[chaosuperDK]

Describe the bug startReached is never triggered

Reproduction Found this demo from issue list, it's working well before bump deps to latest https://stackblitz.com/edit/react-2muuo1?devtoolsheight=33&file=src/List.js

To Reproduce

1. Scroll to top, working well
2. Click update alll deps to latest at left deps panel
3. Scroll to top, startReached not working

Expected behavior Scroll to top should trigger startReached event properly

Desktop (please complete the following information):

• OS: Mac
• Browser chrome

[petyosi]

I'm not sure what's going on with Stackblitz lately, but it seems like a very similar code runs as expected on the website. And in codesandbox.

If you can figure out what's wrong with Stackblitz, please let me know.

[maxhelsel]

This is happening to me as well after updating to the latest version - scrolling to the top not firing startReached. For context, running a reverse-infinite-chat setup. Decided to just roll with a 'click to load more' button for now

[chaosuperDK]

Yes, I've tried clone repo and run 'browse-examples', startReached demo works well as expect. But it happened after bump repo's dep react(^16.13.1), react-dom(^16.13.1) to latest.

[maxhelsel]

Hmm, today was the first time I've come back to my infinite-reverse-chat components since updating a lot of packages (and React to 17+). Lots of strange stuff going on, but my normal Virtuoso lists are working just fine. It's only the reverse-chat lists

[petyosi]

@maxhelsel @chaosuperDK Use the codesandbox I have linked above to replicate your issue and post it here. I will take a look.

[chaosuperDK]

@petyosi codesandbox seems ok. Could you bump your local repo's react and react-dom version to latest and give it a try ? I've tried and it's really exist.

[chaosuperDK]

Context: Cloned repo with latest react and react-dom. After rollback urx and react-urx version from 0.2.10 to 0.2.8 fixed this.

[petyosi]

@chaosuperDK @maxhelsel thanks for the clues. I found the problem. Please upgrade to v2.3.0.

[chaosuperDK]

It's working, but there's a little problem

[plugin: vite:dep-pre-bundle] Failed to resolve entry for package "@virtuoso.dev/react-urx". The package may have incorrect main/module/exports specified in its package.json: Failed to resolve entry for package "@virtuoso.dev/react-urx". The package may have incorrect main/module/exports specified in its package.json

I'm using vite as fast try&debug tool by the way

[invincibleyolk]

I'm facing the same problem

[chaosuperDK]

@invincibleyolk Remove "exports" property from node_modules/@virtuoso.dev/react-urx/package.json will make vite work.

[petyosi]

I removed exports in 2.3.1: https://unpkg.com/browse/@virtuoso.dev/react-urx@0.2.12/package.json

[invincibleyolk]

@invincibleyolk Remove "exports" property from node_modules/@virtuoso.dev/react-urx/package.json will make vite work.

Thanks mate ;)

[petyosi]

Thanks for your help anyone. v2.3.1 should resolve the problems. Let me know if this is not the case.

[ariboren]

@petyosi I'm still seeing this issue on v2.3.1.

[petyosi]

@ariboren can you provide more details? It looks like it's resolved for the people in the thread.

[ariboren]

I've partially resolved it -- I had updated to v2.3.1 in my library code but the consumer was still pegged to an older version. However, now startReached only fires the first time I scroll to the top. Here's a sample of my code.

            <VirtuosoStyled
                components={{
                    Header: hasMore ? Loader : EndState,
                }}
                followOutput
                alignToBottom
                overscan={10}
                firstItemIndex={firstItemIndex}
                initialTopMostItemIndex={messages.allIds.length - 1}
                // this works
                atTopStateChange={(atTop) => {
                    if (atTop) {
                        handleLoadMore();
                    }
                }}
                // never fires
                startReached={handleLoadMore}
                data={messages.allIds}
                itemContent={(index, id: string) => {
                    const message = messages.byId[id];

                    if (!message) {
                        return null;
                    }

                    return (
                        <MemoizedMessage
                            // bunch of props
                        />
                    );
                }}
            />

In this example, I have a loader in the components.Header prop, visible below, but I have the same result without i.

[petyosi]

I can't debug non-runnable code reliably. Please use one of the samples above to showcase your problem.

[Nathan-Notifi]

I'm running into the same issue where startReached only fires once. Is there a specific indexing logic that goes into accounting for startReached?