Prevent Inertia from replacing the url

[ltraccard-dynadmic]

Hi,

I am trying to implement a page where I load a resource with an infinite scroll. Everything is working fine, except for one little thing.

Visiting /users will render the first 25 users, scrolling down will load page 2, the received dataset will be added to the initial dataset and the url will be rewritten to /users?page=2, and so on.

I do not offer any other way to navigate trough the dataset, so the problem occurs when you access a page with a page parameter.

Visiting /users?page=2 will render the users from 26 to 50, it's now impossible to access the first 25 users with infinite scrolling.

I found a fix but the url is now flashing.

Inertia.on('navigate', (event) => {
    const url = hrefToUrl(event.detail.page.url);
    url.searchParams.delete('cursor');
    window.history.replaceState(event.detail.page, '', url.toString());
})

I will be great if we could prevent Inertia from replacing the state, or some given parameters. I can make a PR if you think it could be a good addition to Inertia.

[ragulka]

I'd love to have this. It looks like at the moment when setPage is called, it will always either replace or push the history state. Perhaps it would be possible to add a 3rd option which would simply set the page, but wouldn't touch the history at all?

inertia/packages/core/src/router.ts

Line 457 in 2595fa3

replace ? this.replaceState(page) : this.pushState(page)

[knightspore]

I found a solution where adding this router hook outside of createInertiaApp seems to work quite well, without any flashing.

[ignacio-dev]

Also, Inertia v2 is nearly out of beta, and it offers infinite scroll without url replacement ☺️

[aphrxia]

@ignacio-dev any information on the schedule for the v2 stable release? TIA

[brendanpetty]

Also, Inertia v2 is nearly out of beta, and it offers infinite scroll without url replacement ☺️

I was hoping that to be true, but it doesn't seem to work (and there's no documentation about this). Url is replaced just as normal. Am I missing something?

[brendanpetty]

The latest release (including #2135) appears to have fixed this for me... I can use preserveUrl: true and everything works as I hoped for. @aphrxia @ragulka