import { logger } from "@scandic-hotels/common/logger"

import List from "./List"
import Puffs from "./Puffs"
import Text from "./Text"

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

import type { BlocksProps } from "@/types/components/current/blocks"
import { BlocksTypenameEnum } from "@/types/requests/utils/typename"

export default function Blocks({ blocks }: BlocksProps) {
  if (!blocks?.length) {
    return null
  }

  return (
    <section className={styles.wrapper}>
      {blocks.map((block, idx) => {
        const type = block.__typename
        switch (type) {
          case BlocksTypenameEnum.CurrentBlocksPageBlocksList:
            return <List key={`${block.__typename}-${idx}`} {...block} />
          case BlocksTypenameEnum.CurrentBlocksPageBlocksPuffs:
            return <Puffs key={`${block.__typename}-${idx}`} {...block} />
          case BlocksTypenameEnum.CurrentBlocksPageBlocksText:
            return <Text key={`${block.__typename}-${idx}`} {...block} />
          default:
            logger.error(`Unknown type: (${type})`)
            return null
        }
      })}
      <div id="mainarea_personalized"></div>
    </section>
  )
}