Next.js13.4+MUI5中ThemeProvider传入无效children报错求助

我正在用Next.js 13.4搭配MUI 5做开发，在app目录下创建了not-found.tsx文件。访问随机不存在的路由时，页面能正常显示我定义的样式，但控制台却抛出错误：Failed prop type: Invalid prop \children` supplied to `ThemeProvider`, expected a ReactNode`。我不确定报错原因，搜了相关内容也没找到有效解决办法，附上相关代码和错误信息寻求帮助。

相关代码 #

not-found.tsx #

'use client';
import { Box, Typography } from '@mui/material';

const NotFound = () => {
  return (
    <Box>
      <Typography variant='h1'>404</Typography>
      <Typography variant='h3'>Page Not Found</Typography>
    </Box>
  );
};

export default NotFound;

layout.tsx #

export default function RootLayout({
  children,
}: {
  children: React.ReactNode;
}) {
  return (
    <Providers>
      <html lang='en'>
        <body className={inter.className}>
          <Navbar />
          <ThemeRegistry options={{ key: 'mui' }}>{children}</ThemeRegistry>
        </body>
      </html>
    </Providers>
  );
}

控制台错误信息 #

app-index.js:31 Warning: Failed prop type: Invalid prop `children` supplied to `ThemeProvider`, expected a ReactNode.
    at ThemeProvider (webpack-internal:///(app-pages-browser)/./node_modules/@mui/material/styles/ThemeProvider.js:26:14)
    at ThemeRegistry (webpack-internal:///(app-pages-browser)/./src/app/components/ThemeRegistry.tsx:25:13)
    at body
    at html
    at Provider

内容的提问来源于stack exchange，提问作者folov55205