import * as React from 'react' ; import { Box , Text } from 'ink' ; import { RuleResults } from '@checkup/core' ; import * as objectPath from 'object-path' ; import { TaskDisplayName } from '../sub-components/task-display-name' ; import { getOptions } from '../get-options' ; const startCase = require ( 'lodash.startcase' ) ; type ListOptions = { items : Record < string , { groupBy : string ; value : string ; } > ; } ; type ListItem = { text : string ; value : string | number ; } ; export const List = ( { taskResult } ) => { let listItems = buildListData ( taskResult ) ; return ( < > < TaskDisplayName taskResult = { taskResult } / > < Box marginLeft = { 2 } flexDirection = "column" > { listItems . map ( ( item ) => { return ( < Text key = { item . text } > { startCase ( item . text ) } { item . value } < /Text>); } ) } < /Box> < />); } ; function buildListData ( taskResult ) { let { rule , results } = taskResult ; let { items } = getOptions < ListOptions > ( rule ) ; let listItems = [ ] ; for ( let item of Object . keys ( items ) ) { listItems . push ( { text : item , value : results . filter ( ( result ) => objectPath . get ( result , items [ item ] . groupBy ) === items [ item ] . value ) . length , } ) ; } return listItems ; }