Files
web/components/Blocks/UspGrid/index.tsx
2024-09-25 16:00:50 +02:00

36 lines
1.1 KiB
TypeScript

import { getIconByIconName } from "@/components/Icons/get-icon-by-icon-name"
import JsonToHtml from "@/components/JsonToHtml"
import { renderOptions } from "./renderOptions"
import { getUspIconName } from "./utils"
import styles from "./uspgrid.module.css"
import type { UspGridProps, UspIcon } from "@/types/components/blocks/uspGrid"
function UspIcon({ icon }: { icon: UspIcon }) {
const iconName = getUspIconName(icon)
const Icon = iconName ? getIconByIconName(iconName) : null
return Icon ? <Icon color="red" /> : null
}
export default function UspGrid({ usp_grid }: UspGridProps) {
return (
<div className={styles.grid}>
{usp_grid.usp_card.map(
(usp) =>
usp.text.json && (
<div key={usp.text.json.uid} className={styles.usp}>
<UspIcon icon={usp.icon} />
<JsonToHtml
embeds={usp.text.embedded_itemsConnection?.edges}
nodes={usp.text.json.children}
renderOptions={renderOptions}
/>
</div>
)
)}
</div>
)
}