/**
 * React Native Full App (https://store.enappd.com/product/react-native-full-app)
 *
 * Copyright © 2019-present Enappd. All rights reserved.
 *
 * This source code is licensed as per the terms found in the
 * LICENSE.md file in the root directory of this source tree.
 */

import React from 'react';
import {
  Container,
  ListItem,
  Left,
  Right,
  Thumbnail,
  Body,
  Text,
  Button,
  Icon,
} from 'native-base';
import { FlatList } from 'react-native';

import styles from './style';

const WhatsappCallListView = (props: any) => {
  return (
    <Container>
      <FlatList
        data={props.chatUser}
        keyExtractor={(item, index) => index.toString()}
        renderItem={({ item: user }) => (
          <ListItem avatar>
            <Left>
              <Thumbnail source={user.image} />
            </Left>
            <Body style={[styles.bodySection]}>
              <Text style={styles.userName}>{user.name}</Text>
              <Text style={styles.userDesc} numberOfLines={1}>
                {user.call}
              </Text>
            </Body>
            <Right style={[styles.rightSection]}>
              {user.phone && (
                <Button transparent>
                  <Icon name="call" style={styles.icon} />
                </Button>
              )}
              {user.video && (
                <Button transparent>
                  <Icon name="videocam" style={styles.icon} />
                </Button>
              )}
            </Right>
          </ListItem>
        )}
      />
    </Container>
  );
};

export default WhatsappCallListView;
