import { Suspense } from "react"

import { getName } from "@/lib/trpc/memoizedRequests"

import MyPagesSidebar from "@/components/MyPages/Sidebar"

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

export default async function MyPagesNavigation() {
  const user = await getName()

  // Check if we have user, that means we are logged in andt the My Pages menu can show.
  if (!user) {
    return null
  }
  return (
    <Suspense fallback={<SidebarNavigationSkeleton />}>
      <MyPagesSidebar />
    </Suspense>
  )
}