import * as React from 'react' ; import update from 'immutability-helper' ; import ITimeAwaySummaryListProps from './ITimeAwaySummaryListProps' ; import TimeAwaySummaryDay from '../day/TimeAwaySummaryDay' ; import { TimeAwaySummaryItem } from "../../models/TimeAwaySummaryItem" ; import { List , FocusZone , FocusZoneDirection } from 'office-ui-fabric-react' ; import styles from './TimeAwaySummaryList.module.scss' ; export default class TimeAwaySummaryList extends React . Component < ITimeAwaySummaryListProps , any > { constructor ( props ) { super ( props ) ; this . state = { items : [ ] } ; } public componentWillReceiveProps ( props ) { this . _getTimeAwaySummaryList ( ) ; } public componentDidMount ( ) { this . _getTimeAwaySummaryList ( ) ; } public render ( ) { let items = this . state . items ; let isEmpty = items == null ? 0 : ( items . filter ( ( item ) => { return item . PersonNameArray . length !== 0 ; } ) ) . length ; if ( isEmpty > 0 ) { return ( < FocusZone direction = { FocusZoneDirection . vertical } > < List items = { items } className = { styles . list } onRenderCell = { this . _onRenderCell } / > < /FocusZone>); } else { return ( < p > No one is away this week . < /p>); } } private _onRenderCell ( item ) { return ( < TimeAwaySummaryDay item = { item } / > ) ; } private _getTimeAwaySummaryList ( ) { this . props . dataProvider . getTimeAwaySummaryList ( this . props . weekType , this . props . phase , this . props . statusFilter ) . then ( ( items ) => { this . setState ( update ( this . state , { items : { $set : items } } ) ) ; } ) ; } }