/**
 * 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, { Component } from 'react';
import {
  Container,
  List,
  ListItem,
  Left,
  Right,
  Thumbnail,
  Body,
  Badge,
  Text,
} from 'native-base';
import styles from './style';
import { FlatList } from 'react-native';

const WhatsappChatListView = (props: { goToChat?: any; chatUser?: any }) => {
  const { goToChat } = props;
  return (
    <Container>
      <FlatList
        data={props.chatUser}
        keyExtractor={(item, index) => index.toString()}
        renderItem={({ item: user }) => (
          <ListItem avatar onPress={goToChat}>
            <Left>
              <Thumbnail source={user.image} />
            </Left>
            <Body style={[styles.bodySection]}>
              <Text style={styles.userName}>{user.name}</Text>
              <Text style={styles.userDesc} numberOfLines={1}>
                {user.description}
              </Text>
            </Body>
            <Right style={[styles.rightSection]}>
              <Text style={styles.lastchat}>{user.date}</Text>
              {user.time && (
                <Text style={[styles.lastchat, styles.time]}>{user.time}</Text>
              )}
              {user.past && <Text style={styles.lastchat}>{user.past}</Text>}
              {user.unreadMsg && (
                <Badge style={styles.badgeSection}>
                  <Text style={styles.badgeText}>{user.unreadMsg}</Text>
                </Badge>
              )}
            </Right>
          </ListItem>
        )}
      />
    </Container>
  );
};

export default WhatsappChatListView;
