Error when using router.visit

[rainerbez]

@inertiajs/react Version

2.0.0

Backend stack (optional)

Laravel 12
PHP 8.3

Describe the problem

I am trying to do automatic redirection of a user when the user is already logged in.
I am using visit of "router.visit(...)" but the JavaScript throws the following error:

@inertiajs_react.js?v=9af24f1b:6541 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'version') at RedirectIfLoggedIn (utils.ts:22:16)

My code is as following:
export function RedirectIfLoggedIn( auth: { user?: any }, targetRoute?: string | URL, ): boolean { if (auth.user) { router.visit(targetRoute ? targetRoute : route('dashboard')); return true; } return false;

When I open the Inertia's source code through the browser, it shows that the fault is the last method getHeaders in the following code:

var V = class { constructor(e, t) { this.page = t; this.requestHasFinished = false; this.requestParams = L.create(e), this.cancelToken = new AbortController(); } static create(e, t) { return new V(e, t); } async send() { this.requestParams.onCancelToken(() => this.cancel({ cancelled: true })), ge(this.requestParams.all()), this.requestParams.onStart(), this.requestParams.all().prefetch && (this.requestParams.onPrefetching(), ye(this.requestParams.all())); let e = this.requestParams.all().prefetch; return axios_default({ method: this.requestParams.all().method, url: I(this.requestParams.all().url).href, data: this.requestParams.data(), params: this.requestParams.queryParams(), signal: this.cancelToken.signal, headers: this.getHeaders(), onUploadProgress: this.onProgress.bind(this), responseType: "text" }).then((t) => (this.response = A.create(this.requestParams, t, this.page), this.response.handle())).catch((t) => (t == null ? void 0 : t.response) ? (this.response = A.create(this.requestParams, t.response, this.page), this.response.handle()) : Promise.reject(t)).catch((t) => { if (!axios_default.isCancel(t) && de(t)) return Promise.reject(t); }).finally(() => { this.finish(), e && this.response && this.requestParams.onPrefetchResponse(this.response); }); } finish() { this.requestParams.wasCancelledAtAll() || (this.requestParams.markAsFinished(), this.fireFinishEvents()); } fireFinishEvents() { this.requestHasFinished || (this.requestHasFinished = true, he(this.requestParams.all()), this.requestParams.onFinish()); } cancel({ cancelled: e = false, interrupted: t = false }) { this.requestHasFinished || (this.cancelToken.abort(), this.requestParams.markAsCancelled({ cancelled: e, interrupted: t }), this.fireFinishEvents()); } onProgress(e) { this.requestParams.data() instanceof FormData && (e.percentage = e.progress ? Math.round(e.progress * 100) : 0, fe(e), this.requestParams.all().onProgress(e)); } getHeaders() { let e = { ...this.requestParams.headers(), Accept: "text/html, application/xhtml+xml", "X-Requested-With": "XMLHttpRequest", "X-Inertia": true }; return s.get().version && (e["X-Inertia-Version"] = s.get().version), e; } };

I tried to call this router.visit method both directly in a component (before the rendering and returning null - to prevent useless rendering) and in the useEffect. Both throw an error.

Accidentally, I found a temporary go around solution using setTimeOut for 1 ms, and in fact this works without problems:

export function RedirectIfLoggedIn( auth: { user?: any }, targetRoute?: string | URL, ): boolean { if (auth.user) { setTimeout( () => router.visit(targetRoute ? targetRoute : route('dashboard')), 1, ); return true; } return false; }

Steps to reproduce

Use a Fresh installation of Laravel 12, and React.js 2.0.0
Then inside a component, if the user is logged in, try to redirect the user using router.visit(...) ... but instead of redirecting it throws the error:

@inertiajs_react.js?v=9af24f1b:6541 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'version')

[JuveleeDave]

Hi, can I work on this?