The correct usage of Auth0 with react-admin

Question

I am building Admin Dashboard using react-admin.
Now I would like to add signup/login via Auth0.

App.js

import React from "react";
import { Admin, resolveBrowserLocale } from "react-admin";
import authProvider from "./providers/auth/authProvider";
import dataProvider from "./providers/data/dataProvider";

const App = () => {

    return (
        <Admin
            locale={resolveBrowserLocale()}
            dataProvider={dataProvider}
            authProvider={authProvider}
        >
            ........
        </Admin>
    );
};
export default App;

authProviders.js

import { Auth0Client } from "@auth0/auth0-spa-js";
import { Auth0Constants } from "../../config";
import { Auth0AuthProvider } from "ra-auth-auth0";

const auth0 = new Auth0Client({
    domain: Auth0Constants.domain,
    clientId: Auth0Constants.clientId,
    cacheLocation: "localstorage",
});
const authProvider = Auth0AuthProvider(auth0, {
    loginRedirectUri: window.location.origin,
});

export default authProvider;

index.js

import React from "react";
import ReactDOM from "react-dom/client"; // Update this import
import "./index.css";
import App from "./App";
import * as serviceWorker from "./serviceWorker";
import { Auth0Provider } from "@auth0/auth0-react";
import { Auth0Constants } from "./config";

// Create a root element
const root = ReactDOM.createRoot(document.getElementById("root"));

// Render your app using the createRoot method
root.render(
    <React.StrictMode>
        <Auth0Provider
            domain={Auth0Constants.domain}
            clientId={Auth0Constants.clientId}
            authorizationParams={{
                redirect_uri: window.location.origin,
            }}
        >
            <App />
        </Auth0Provider>
    </React.StrictMode>
);

serviceWorker.unregister();

But after successfully loggedin, it keeps reloading...
Is there anybody who will help me with the correct usage of @auth0/auth0-react with react-admin.

Thanks in advance.