diff --git a/src/pages/about/api.tsx b/src/app/about/api/page.tsx
similarity index 97%
rename from src/pages/about/api.tsx
rename to src/app/about/api/page.tsx
index e47d16c1..30e77da9 100644
--- a/src/pages/about/api.tsx
+++ b/src/app/about/api/page.tsx
@@ -1,3 +1,4 @@
+"use client";
 import { Code, Heading, Text, VStack } from "@chakra-ui/react";
 import { GetStaticProps, NextPage } from "next";
 import Layout from "^/components/Layout";
@@ -21,7 +22,7 @@ type Props = {
     specs: [string, string];
 };
 
-export const getStaticProps: GetStaticProps<Props> = async ({}) => {
+export const getProps: GetStaticProps<Props> = async ({}) => {
     const specsOrVersions = splitParts(EXAMPLE_QUERY);
     const { canonicalSpecs } = await destination(specsOrVersions);
 
diff --git a/src/pages/about/index.tsx b/src/app/about/page.tsx
similarity index 100%
rename from src/pages/about/index.tsx
rename to src/app/about/page.tsx
diff --git a/src/components/About/About.tsx b/src/components/About/About.tsx
index 77d520a0..e8af1f17 100644
--- a/src/components/About/About.tsx
+++ b/src/components/About/About.tsx
@@ -1,3 +1,4 @@
+"use client";
 import {
     Code,
     Heading,
diff --git a/src/components/Header/NavLink.tsx b/src/components/Header/NavLink.tsx
index 32b33d27..d249dccd 100644
--- a/src/components/Header/NavLink.tsx
+++ b/src/components/Header/NavLink.tsx
@@ -12,7 +12,7 @@ const NavLink: FunctionComponent<LinkProps> = ({
     children,
     ...props
 }) => {
-    const { asPath } = useRouter();
+    const { asPath } = useRouter() ?? {};
     const [isActive, setIsActive] = useState(false);
 
     useEffect(() => {