import React , { ReactElement } from 'react' ; import { Tag } from 'antd' ; import { option as Option } from 'fp-ts' ; import { pipe } from 'fp-ts/function' ; export function renderFlag ( flag ? ) { return pipe ( flag , Option . fromPredicate ( ( flagOrUndefined ) => flagOrUndefined !== undefined ) , Option . fold ( ( ) => < > < />, (someFlag) => <Tag color={someFlag ? 'green' : 'volcano'}>{someFlag ? 'Yes' : 'No'}</Tag > ) ) ; } export type TagClickHandler = ( rawTag : string ) => void ; export function renderTagsWithClickHandler ( onClick ) { return function renderTags ( tagsString ? ) { return pipe ( tagsString , Option . fromPredicate < string | undefined > ( Boolean ) , Option . fold ( ( ) => < > < />, (someTagsString) => (<> { someTagsString ! . split ( ':' ) . map ( ( tag ) => ( < Tag onClick = { ( ) => onClick ( someTagsString ! ) } key = { tag } > { tag } < /Tag>))} < />))); } ; } export function renderActionsAsColumn < Item > ( columnWidth ) { return function getActionsColumn ( getActions ) { return { fixed : 'right' as const , width : columnWidth , render ( text , record ) { return getActions ( record ) ; } , } ; } ; }