feat: refactor BaseHeader to accept main component as prop for improved flexibility

src/routes/__root.tsx

@@ -1,5 +1,5 @@
 import { LayoutMain } from '@/modules/layout'
-
+// const LayoutMain = null;
 import { Link, Outlet, createRootRoute } from '@tanstack/react-router'
 import { TanStackRouterDevtools } from '@tanstack/react-router-devtools'
 import { Toaster } from '@/components/ui/sonner'
@@ -10,9 +10,10 @@ export const Route = createRootRoute({
   component: RootComponent,
 })
 
-const BaseHeader = (props: { children?: React.ReactNode }) => {
-  if (props.children) {
-    return props.children
+const BaseHeader = (props: { main?: React.ComponentType | null }) => {
+  if (props.main) {
+    const MainComponent = props.main
+    return <MainComponent />
   }
   return (
     <>
@@ -36,7 +37,7 @@ const BaseHeader = (props: { children?: React.ReactNode }) => {
 function RootComponent() {
   return (
     <div className='h-full overflow-hidden'>
-      <BaseHeader><LayoutMain /></BaseHeader>
+      <BaseHeader main={LayoutMain} />
       <AuthProvider mustLogin={true}>
         <TooltipProvider>
           <main className='h-[calc(100%-3rem)] overflow-auto scrollbar'>