From 1a8e7ac06ef15f27e4cb78363dface2af8a42da3 Mon Sep 17 00:00:00 2001
From: luzmediach <marc@luzmedia.ch>
Date: Sun, 21 Jan 2024 12:48:10 +0100
Subject: [PATCH] NavMobile to use Nav interfaces and add SiteToc to sidebar

---
 packages/core/src/ui/Nav/NavMobile.tsx | 20 +++++++-------------
 1 file changed, 7 insertions(+), 13 deletions(-)

diff --git a/packages/core/src/ui/Nav/NavMobile.tsx b/packages/core/src/ui/Nav/NavMobile.tsx
index a975c073..980f5e6f 100644
--- a/packages/core/src/ui/Nav/NavMobile.tsx
+++ b/packages/core/src/ui/Nav/NavMobile.tsx
@@ -4,20 +4,16 @@ import { useRouter } from "next/router.js";
 import { useEffect, useState } from "react";
 import { SearchContext, SearchField } from "../Search";
 import { MenuIcon, CloseIcon } from "../Icons";
-import { NavLink, SearchProviderConfig } from "../types";
+import type { NavConfig, ThemeConfig } from "./Nav";
 
-interface Props extends React.PropsWithChildren {
-  author?: string;
-  links?: Array<NavLink>;
-  search?: SearchProviderConfig;
-}
+interface Props extends NavConfig, ThemeConfig, React.PropsWithChildren {}
 
-// TODO why mobile navigation only accepts author and regular nav accepts different things like title, logo, version
+// TODO: Search doesn't appear
 export const NavMobile: React.FC<Props> = ({
   children,
+  title,
   links,
   search,
-  author,
 }) => {
   const router = useRouter();
   const [isOpen, setIsOpen] = useState(false);
@@ -77,8 +73,8 @@ export const NavMobile: React.FC<Props> = ({
               legacyBehavior
             >
               {/* <Logomark className="h-9 w-9" /> */}
-              <div className="font-extrabold text-primary dark:text-primary-dark text-2xl ml-6">
-                {author}
+              <div className="font-extrabold text-primary dark:text-primary-dark text-lg ml-6">
+                {title}
               </div>
             </Link>
           </div>
@@ -106,9 +102,7 @@ export const NavMobile: React.FC<Props> = ({
               ))}
             </ul>
           )}
-          {/* <div className="pt-6 border border-t-2">
-                        {children}
-                    </div> */}
+          <div className="pt-6">{children}</div>
         </Dialog.Panel>
       </Dialog>
     </>