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

import EnterDetailsProvider from "@/components/HotelReservation/EnterDetails/Provider"
import SelectedRoom from "@/components/HotelReservation/EnterDetails/SelectedRoom"
import { setLang } from "@/i18n/serverContext"

import { preload } from "./page"

import styles from "./layout.module.css"

import { StepEnum } from "@/types/components/hotelReservation/enterDetails/step"
import type { LangParams, LayoutArgs } from "@/types/params"

export default async function StepLayout({
  summary,
  children,
  hotelHeader,
  params,
  sidePeek,
}: React.PropsWithChildren<
  LayoutArgs<LangParams & { step: StepEnum }> & {
    hotelHeader: React.ReactNode
    sidePeek: React.ReactNode
    summary: React.ReactNode
  }
>) {
  setLang(params.lang)
  preload()

  const user = await getProfileSafely()

  return (
    <EnterDetailsProvider step={params.step} isMember={!!user}>
      <main className={styles.layout}>
        {hotelHeader}
        <div className={styles.content}>
          <SelectedRoom />
          {children}
          <aside className={styles.summaryContainer}>
            <div className={styles.hider} />
            <div className={styles.summary}>{summary}</div>
            <div className={styles.shadow} />
          </aside>
        </div>
        {sidePeek}
      </main>
    </EnterDetailsProvider>
  )
}