formalizations-list.tsx

import { List, ListItem, ListProps, Text } from '@chakra-ui/react'
import React from 'react'
import { Formalization } from 'src/models'

export type FormalizationListProps = {
  formalizations: Formalization[]
} & ListProps

export const FormalizationList: React.FC<FormalizationListProps> = ({
  formalizations,
  ...props
}) => {
  return (
    <>
      <List>
        {formalizations.map((formalization, index) => {
          return (
            <ListItem key={`formalization-${index}`}>
              <Text>{formalization.name}</Text>
            </ListItem>
          )
        })}
      </List>
    </>
  )
}