Using react-moralis with NextJs App Router

#1

Hello guys, how are you?

I need some help as I am building my dApp with NextJs version 13.4.19 and I am facing some issues to wrap my whole app with the MoralisProvider.

What I used to do is to wrap my dApp on the _app.js like this:

import { NotificationProvider } from "@web3uikit/core";

export default function App({ Component, pageProps }) {
  const getLayout =
    Component.getLayout || ((page) => <MainLayout>{page}</MainLayout>);
  return (
    <MoralisProvider initializeOnMount={false}>
        <NotificationProvider>
          {getLayout(<Component {...pageProps} />)}
        </NotificationProvider>
    </MoralisProvider>
  );
}

But the _app.js does not work on app router as for what I have read: " Inside app each folder represent a route segment. The very first folder i.e app itself represent the root route segment."

But I can not wrap the html body with the provider as it is a server component and can not use useState() is this a known deal breaker for using react-moralis and other similar packages?

Thanks a lot!

#2

Hi, react-moralis is now deprecated and will no longer receive updates. To use moralis we recommend using the API directly in your backend