/* 
    This page is used to display all photos of a home.
    It is a child route of the FindAHome page.
*/
import Breadcrumb from '@/src/components/Breadcrumb'
import AllPhotosSection from '@/src/components/page/FindAHome/AllPhotosSection'
import getPropertyDetails from '@/src/ssrapi/getPropertyDetails'
import Routes from '@/src/utils/RouteConstants'
import { getCapitalizeHyphenated } from '@/src/utils/commonFunctions'
import React from 'react'

/**
 * Interface for the slug parameters
 */
interface SlugParams {
    params: {
        slug: string;
    };
}

const page: React.FC<SlugParams> = async ({ params }) => {
    /**
     * Get the slug from the parameters
     */
    const { slug } = await params;
    const PropertyDetails = await getPropertyDetails(slug);

    // Breadcrumb data
    const BreadcrumbData = [
        {
            Link: 'Find a home',
            LinkUrl: Routes.FIND_A_HOME
        },
        {
            Link: getCapitalizeHyphenated(slug),
            LinkUrl: Routes.FIND_A_HOME_INFO(slug)
        },
        {
            ActiveLink: 'All photos'
        }
    ]


    return (
        <>
            <main className={`main-mt main-mt pb-[30px] sm:pb-[40px]`}>
                <section>
                    <div className={`container`}>
                        <Breadcrumb content={BreadcrumbData} />
                        <AllPhotosSection propertyImages={PropertyDetails ? [PropertyDetails?.data?.workspaceImage, ...(PropertyDetails?.data?.propertyImage || [])] : []} />
                    </div>
                </section>
            </main>
        </>
    )
}

export default page