diff --git a/README.md b/README.md
index aa97380..6513666 100644
--- a/README.md
+++ b/README.md
@@ -1,5 +1,7 @@
 # supMDX
-A template to make blog-like site with MDX
+A template to make blog-like site with MDX and next.js
+
+Note that this template is still in development and may change without compatibility
 
 ## Configuration
 - `supMDX.yml`
diff --git a/components/MDXRoot.tsx b/components/MDXRoot.tsx
index d078d9b..a131ffc 100644
--- a/components/MDXRoot.tsx
+++ b/components/MDXRoot.tsx
@@ -1,4 +1,5 @@
 import Head from 'next/head';
+import type {AppProps} from 'next/app';
 import Nav from './Nav';
 import Footer from './Footer';
 import MetaInfo from './MetaInfo';
@@ -6,9 +7,7 @@ import type {HeadingInfo} from '@sup39/rehype-mdx-export-headings';
 
 export type MDXProps = {
   children: JSX.Element
-  data: {
-    pathname: string,
-  },
+  router: AppProps['router'],
   meta: Partial<{
     title: string
     description: string
@@ -18,7 +17,7 @@ export type MDXProps = {
   headings: HeadingInfo[]
 };
 
-export default function MDXRoot({children, data: {pathname}, meta={}, headings}: MDXProps) {
+export default function MDXRoot({children, router: {pathname}, meta={}, headings}: MDXProps) {
   const {title, description} = meta;
   const h1 = meta.h1 ?? title;
   return <>
diff --git a/pages/_app.tsx b/pages/_app.tsx
index c656758..45e9492 100644
--- a/pages/_app.tsx
+++ b/pages/_app.tsx
@@ -13,8 +13,8 @@ const extendedHx = Object.fromEntries(hx.map(H => [H,
   </H>,
 ]));
 
-export default function App({Component, pageProps, router: {pathname}}: AppProps) {
+export default function App({Component, pageProps, router}: AppProps) {
   return <MDXProvider components={{S, ...extendedHx}}>
-    <Component data={{pathname}} {...pageProps} />
+    <Component router={router} {...pageProps} />
   </MDXProvider>;
 }