/**
 * 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, Content, Text, CardItem, Left, Button, Card } from 'native-base';
import { View, Image } from 'react-native';

import Headercontent from '../../../components/redux/header';
import { withNavigation } from 'react-navigation';
import styles from './viewmoreListStyles';
import AddToCartButton from '../../../components/redux/addToCartButton'

interface ViewmorelistViewProps {
    type: any;
    name: string;
    textTitle: string;
    details: any;
    cartItemLength: number;
    goforProductDetailPage: (product:any) => void;
    goToMyCart: () => void;
    goBack: () => void;
}

const ViewmorelistView = (props:ViewmorelistViewProps) => {
    const { textTitle,
        type,
        name,
        goBack,
        details,
        cartItemLength
    } = props
    return (
        <Container>
            <Headercontent
                name={name}
                onPress={goBack}
                loginTitle={textTitle}
                type={type}
                cartItemLength={cartItemLength}
                rightIcon={'shopping-cart'}
                rightType={type}
                stylesRight={styles.rightIcon}
                onPressToCart={() => props.goToMyCart()}
            />
            <Content padder>
                <View style={styles.listView}>
                    {details.map((productItems:any, index:number) => {
                        return (
                            <Card style={styles.cardStyle} key={index}>
                                <CardItem style={styles.cardItem} >
                                    <Left>
                                        <Button
                                            success
                                            style={styles.offerButtons}
                                            onPress={() => props.goforProductDetailPage(productItems)}
                                        >
                                            <Text> {productItems.off}</Text>
                                        </Button>
                                    </Left>
                                </CardItem>
                                <CardItem
                                    button
                                    style={styles.imageItem}
                                    onPress={() => props.goforProductDetailPage(productItems)}
                                >
                                    <Image
                                        source={ productItems.image}
                                        style={styles.imageStyle}
                                    />
                                </CardItem>
                                <CardItem style={styles.rateItem}>
                                    <Text>{productItems.salePrice}</Text>
                                    <Text style={styles.crossedText}>
                                        {productItems.regularPrice}
                                    </Text>
                                </CardItem>
                                <CardItem style={styles.nameItem}>
                                    <Text style={styles.nameItemText}>
                                        {productItems.name}
                                    </Text>
                                </CardItem>
                                <CardItem style={styles.cardqtyItem}>
                                    <Text >
                                        {productItems.qty}
                                    </Text>
                                </CardItem>
                                <CardItem
                                    style={styles.footerButton}
                                >
                                    <AddToCartButton product={productItems} productId={productItems.id} productQty={productItems.units} />
                                </CardItem>
                            </Card>
                        )
                    })}
                </View>
            </Content>
        </Container>
    )
}
export default withNavigation(ViewmorelistView);
