import Puffs from "./Puffs"
import Contacts from "./Contacts"

import { AsideTypenameEnum } from "@/types/requests/utils/typename"
import type { AsideProps } from "@/types/components/current/aside"

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

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

  return (
    <aside className={styles.wrapper}>
      {blocks.map((block, idx) => {
        const type = block.__typename
        switch (type) {
          case AsideTypenameEnum.CurrentBlocksPageAsideContact:
            return (
              <Contacts
                contacts={block.contact.contactConnection.edges}
                key={`block-${idx}`}
              />
            )
          case AsideTypenameEnum.CurrentBlocksPageAsidePuff:
            return (
              <Puffs
                key={`block-${idx}`}
                puffs={block.puff.puffConnection.edges}
              />
            )
          default:
            return null
        }
      })}
    </aside>
  )
}
