/*
  This page is for the booking.
  It includes a breadcrumb with a link to the home page.
  It also includes a section with the booking.
  It also includes a section with the booking summary.
*/
import { getDictionarys } from '@/getDictionarys'
import Breadcrumb from '@/src/components/Breadcrumb'
import Booking from '@/src/components/page/FindAHome/Booking/Booking'
import getProfileView from '@/src/ssrapi/getProfileView'
import { BookingContent } from '@/src/types/StaticContent/booking.content.type'
import { PropertyDetailContent } from '@/src/types/StaticContent/propertydetail.content.type'
import Routes from '@/src/utils/RouteConstants'
import { getCapitalizeHyphenated } from '@/src/utils/commonFunctions'
import React from 'react'
import styles from './page.module.scss'

// Slug params  
interface SlugParams {
  params: {
    slug: string;
    bookingId: string
  };
  searchParams: { [key: string]: string | string[] | undefined };
}

const page: React.FC<SlugParams> = async ({ params, searchParams }) => {
  const { slug, bookingId } = await params;
  const searchParamsObj = await searchParams;
  const referrer = searchParamsObj.referrer as string;

  // Get the home content
  const BOOKING = await getDictionarys('booking') as BookingContent;
  const ProfileData = await getProfileView()
  const PropertyDetailContent = await getDictionarys('property-detail') as PropertyDetailContent;

  let breadcrumbData = [];
  if (referrer === BOOKING.BREADCRUMB_DATA.Home) {
    breadcrumbData = [
      {
        Link: BOOKING.BREADCRUMB_DATA.HOME,
        LinkUrl: Routes.HOME
      },
      {
        Link: BOOKING.BREADCRUMB_DATA.FIND_A_HOME,
        LinkUrl: Routes.FIND_A_HOME
      },
      {
        Link: getCapitalizeHyphenated(slug),
        LinkUrl: Routes.FIND_A_HOME_INFO(slug)
      },
      {
        ActiveLink: BOOKING.BREADCRUMB_DATA.REVIEW_AND_PAYMENT
      }
    ]
  } else {
    breadcrumbData = [
      {
        Link: BOOKING.BREADCRUMB_DATA.FIND_A_HOME,
        LinkUrl: Routes.FIND_A_HOME
      },
      {
        Link: getCapitalizeHyphenated(slug),
        LinkUrl: Routes.FIND_A_HOME_INFO(slug)
      },
      {
        ActiveLink: BOOKING.BREADCRUMB_DATA.REVIEW_AND_PAYMENT
      }
    ]
  }

  return (
    <main className={`${styles.BookingWrapper} bg-bgColor main-mt pb-[30px] sm:pb-[40px] lg:pb-[50px] xxl:pb-[65px]`}>
      <section className={`${styles.BookingContentWrap}`}>
        <div className={`container`}>
          <Breadcrumb content={breadcrumbData} />
          <Booking bookingId={bookingId} slug={slug} BOOKING={BOOKING} profileData={ProfileData?.data} PropertyDetailContent={PropertyDetailContent} />
        </div>
      </section>
    </main>
  )
}

export default page