Files
web/components/Current/Blocks/List/ListItem.tsx
Michael Zetterberg 14e93eba7c chore: lint fix
2024-04-23 14:43:17 +02:00

70 lines
1.8 KiB
TypeScript

import { cva } from "class-variance-authority"
import styles from "./list.module.css"
import type { ListItem } from "@/types/requests/blocks/list"
import { BlockListItemsEnum } from "@/types/requests/blocks/list"
const config = {
variants: {
type: {
default: styles.disc,
checkmark: styles.checkmark,
},
},
defaultVariants: {
type: "default",
},
} as const
const listItemStyle = cva(styles.listItem, config)
export default function ListItem({ listItem }: { listItem: ListItem }) {
const typeName = listItem.__typename
switch (typeName) {
case BlockListItemsEnum.CurrentBlocksPageBlocksListBlockListItemsListItem:
return (
<li
className={listItemStyle({
type: listItem.list_item.list_item_style,
})}
>
{listItem.list_item.subtitle ? (
<>
<strong>{listItem.list_item.title}</strong>
<br />
<span>{listItem.list_item.subtitle}</span>
</>
) : (
listItem.list_item.title
)}
</li>
)
case BlockListItemsEnum.CurrentBlocksPageBlocksListBlockListItemsListItemExternalLink:
return (
<li
className={listItemStyle({
type: listItem.list_item_external_link.list_item_style,
})}
>
<a
className={styles.link}
href={listItem.list_item_external_link.link.href}
>
<strong>{listItem.list_item_external_link.link.title}</strong>
</a>
{listItem.list_item_external_link.subtitle && (
<span>
<br />
{listItem.list_item_external_link.subtitle}
</span>
)}
</li>
)
default:
return null
}
}