import { serverClient } from "@/lib/trpc/server"

import SectionHeader from "@/components/SectionHeader"

import Container from "../Container"
import ClientUpcomingStays from "./Client"

import type { AccountPageComponentProps } from "@/types/components/myPages/myPage/accountPage"

export default async function UpcomingStays({
  lang,
  title,
  subtitle,
  link,
}: AccountPageComponentProps) {
  const initialUpcomingStays = await serverClient().user.stays.upcoming()
  if (!initialUpcomingStays?.data) {
    return null
  }
  return (
    <Container>
      <SectionHeader title={title} subtitle={subtitle} link={link} />
      <ClientUpcomingStays
        initialUpcomingStays={initialUpcomingStays}
        lang={lang}
      />
    </Container>
  )
}