import { Metadata } from "next"

import { SortOptions } from "@modules/store/components/refinement-list/sort-products"
import StoreTemplate from "@modules/store/templates"
import { LayoutComponentNode, LayoutContext } from "@vibentec/component-map"
import { getRegion } from "@lib/data/regions"
import { loadPageConfig } from "@vibentec/configloader"
import { DynamicLayoutRenderer } from "@vibentec/renderer"

export const metadata: Metadata = {
  title: "Store",
  description: "Explore all of our products.",
}

type Params = {
  searchParams: Promise<{
    sortBy?: SortOptions
    page?: string
  }>
  params: Promise<{
    countryCode: string
  }>
}

export default async function StorePage(props: Params) {
  const params = await props.params
  const searchParams = await props.searchParams
  const region = await getRegion(params.countryCode)
  const { sortBy, page } = searchParams
  const nodes: LayoutComponentNode[] = await loadPageConfig("Store")

  const context: LayoutContext = {
    customer: null,
    cart: null,
    shippingOptions: [],
    contentChildren: null,
    countryCode: params.countryCode,
    region,
  }
  return (
    <>
      <StoreTemplate
        sortBy={sortBy}
        page={page}
        countryCode={params.countryCode}
      />
      <DynamicLayoutRenderer nodes={nodes} context={context} />
    </>
  )
}
