import { Suspense } from "react"

import { auth } from "@/auth"
import MyPagesSidebar from "@/components/MyPages/Sidebar"
import { isValidSession } from "@/utils/session"

import SidebarNavigationSkeleton from "../MyPages/Sidebar/SidebarNavigationSkeleton"

export default async function MyPagesNavigation() {
  const session = await auth()
  if (!isValidSession(session)) {
    return null
  }
  return (
    <Suspense fallback={<SidebarNavigationSkeleton />}>
      <MyPagesSidebar />
    </Suspense>
  )
}