/**
 * 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 { View, ScrollView } from 'react-native';
import {
  Card,
  CardItem,
  Left,
  Text,
  Right,
  Button,
  Thumbnail,
  Body,
  Icon,
} from 'native-base';
import scrollCards from '../../../Database/star';
import styles from './scrollableStyle';
class ScrollCards extends React.Component<any, any> {
  render() {
    const { click } = this.props;
    const headingLeft = 'Complete your profile';
    return (
      <View>
        <CardItem header>
          <Left>
            <Text>{headingLeft}</Text>
          </Left>
        </CardItem>
        <ScrollView horizontal={true} showsHorizontalScrollIndicator={false}>
          {scrollCards.scrollCardsContainer.map((cards: any) => {
            return (
              <Card style={styles.card}>
                <View>
                  <View style={styles.iconCircle}>
                    <Icon name={cards.icon} />
                  </View>
                </View>
                <Body style={styles.paddHorizontal}>
                  <Text style={styles.textHead}>{cards.text1}</Text>
                  <Text note style={styles.descText}>
                    {cards.desc}
                  </Text>
                </Body>
                <View style={styles.paddVertical}>
                  <Button small style={styles.buttonStyle}>
                    <Text style={styles.butonText}>{cards.buttonText}</Text>
                  </Button>
                </View>
              </Card>
            );
          })}
        </ScrollView>
      </View>
    );
  }
}
export default ScrollCards;
