import { UspCard } from "@scandic-hotels/design-system/UspCard"

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

import type { UspGrid as UspGridType } from "@scandic-hotels/trpc/types/blocks"

interface UspGridProps extends Pick<UspGridType, "usp_grid"> {}

export default function UspGrid({ usp_grid }: UspGridProps) {
  return (
    <div className={styles.grid}>
      {usp_grid.usp_card.map(
        (usp) =>
          usp.text.json && (
            <UspCard
              className={styles.uspCard}
              key={usp.text.json.uid}
              iconName={usp.icon}
              embeds={usp.text.embedded_itemsConnection.edges}
              nodes={usp.text.json.children}
            />
          )
      )}
    </div>
  )
}