feat(SW-214): Implement usp component

components/Blocks/UspGrid/index.tsx

@@ -0,0 +1,35 @@
+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>
+  )
+}