Property 'table' does not exist on type '{}'

[AimanAlmureish]

I am trying to implement it on a Next js project and I get the following error in the _app.tsx

import { I18nProvider } from "next-rosetta";
import type { ReactElement, ReactNode } from "react";
import type { NextPage } from "next";
import { AppProps } from "next/app";
import Layout from "../components/layout/layout";
import "../styles/globals.css";
import "../styles/kvass.min.css";

export type NextPageWithLayout<P = {}, IP = P> = NextPage<P, IP> & {
  getLayout?: (page: ReactElement) => ReactNode;
};

type AppPropsWithLayout = AppProps & {
  Component: NextPageWithLayout;
};

function MyApp({ Component, pageProps }: AppPropsWithLayout) {
  const getLayout = Component.getLayout ?? ((page) => page);

  return (
    <I18nProvider table={pageProps.table}>
      {getLayout(<Component {...pageProps} />)}
    </I18nProvider>
  );
}

export default MyApp;

The pageProps.table is showing this error Property 'table' does not exist on type '{}'

[AimanAlmureish]

Any ideas on how to fix it?

[lopezjurip]

Try this:

UPDATED

import type { AppProps } from "next/app";
import { type I18nProps, I18nProvider } from "next-rosetta";

import type { MyLocale } from "../i18n";

export default function App({ Component, pageProps }: AppProps<I18nProps<MyLocale>>) {
  return (
    <I18nProvider table={pageProps.table}>
      ...
    </I18nProvider>
  );
}

[AimanAlmureish]

So sorry for the late response! With my code I get this now Type 'AppPropsWithLayout' is not generic.ts(2315)

This is because I am using the layout. Any fixes for this?