/**
 * 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 { withNavigation } from 'react-navigation';

import { View, Image } from 'react-native';
import { Container, Content, Text, CardItem, Left, Button, Card } from 'native-base';

import styles from './viewmoreListStyles';
import Headercontent from '../../../components/grocery/header';
import AddRemoveCounterComponent from '../../../components/grocery/cartAddRemoveItems';

interface ViewmorelistViewprops {
    textTitle: string;
    type: string;
    name: string;
    goBack: () => void;
    details: any;
    remove: string;
    add: string;
    subtractCount: (first:number,second:number,count:number) => void;
    addCount: () => void;
    text: number;
    gotoAddItems: (item:any) => void;
    goToMyCart: () => void;
    goforProductDetailPage: (item:any) => void;
    i: number;
}

const ViewmorelistView = (props: ViewmorelistViewprops) => {
    const { textTitle,
        type,
        name,
        goBack,
        details,
        remove,
        add,
        subtractCount,
        addCount,
        text,
        gotoAddItems,
        goToMyCart,
        i
    } = props
     return (
        <Container>
            <Headercontent
                name={name}
                onPress={goBack}
                loginTitle={textTitle}
                type={type}
                rightIcon={'shopping-cart'}
                rightType={type}
                onPressToCart={goToMyCart}
                stylesRight={styles.rightIcon}

            />
            <Content padder>
                <View style={styles.listView}>
                    {details.products.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} numberOfLines={1}>
                                        {productItems.name}
                                    </Text>
                                </CardItem>
                                <CardItem style={styles.cardqtyItem}>
                                    <Text>
                                        {productItems.qty}
                                    </Text>
                                </CardItem>
                                <CardItem
                                    style={styles.footerButton}
                                >
                                    {productItems.units < 1 ? <Button
                                        block
                                        style={styles.addButton}
                                        onPress={() => gotoAddItems(index)}
                                    >
                                        <Text>Add</Text>
                                    </Button>

                                        : <AddRemoveCounterComponent
                                            subtractCount={() => subtractCount(i, index, productItems.units)}
                                            remove={remove}
                                            text={text}
                                            addCount={addCount}
                                            add={add}
                                        />
                                    }
                                </CardItem>
                            </Card>
                        )
                    })}
                </View>
            </Content>
        </Container>
    )
}
export default withNavigation(ViewmorelistView);
