teecup/frontend/app/my-rounds/[id]/page.tsx

import { Suspense } from "react"
import { RoundDetail } from "@/components/round-detail"

export default async function RoundDetailPage({ params }: { params: Promise<{ id: string }> }) {
  const { id } = await params
  return (
    <Suspense
      fallback={
        <div className="flex min-h-[100dvh] items-center justify-center bg-background">
          <div
            aria-hidden="true"
            className="size-10 animate-spin rounded-full border-4 border-primary/20 border-t-primary"
          />
        </div>
      }
    >
      <RoundDetail roundId={id} />
    </Suspense>
  )
}