/**
 * 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 { Root } from 'native-base';
import ViewmorelistView from './viewmoreListView';
import { withDatabase } from '../../../Database/grocery'
import { NavigationStackScreenProps } from 'react-navigation-stack';

interface Iprops extends NavigationStackScreenProps {
    database: any;
}
interface Istate {
    text: number,
    button: boolean,
    remove: string,
    add: string,
    selectedIndex: any;
}

class ViewmoreListContainer extends Component<Iprops,Istate> {
    constructor(props:Iprops) {
        super(props)
        this.state = {
            text: 1,
            button: true,
            remove: 'red',
            add: 'red',
            selectedIndex:null
        }
    }

    goBack = () => {
         this.props.navigation.goBack()
    }

    goforProductDetailPage(items:any) {
         this.props.navigation.navigate('GroceryProductdetails', { items });
    }
    
    gotoAddItems(productId:number, offerIndex:number) {
        this.props.database.addToCart(offerIndex, productId)
        this.setState({
            button: !this.state.button
        })
    }
    goToMyCart = () => {
        this.props.navigation.navigate('GroceryMycart')
    }

    addCount = () => {
        this.setState({
            text: this.state.text + 1,
            add: 'green',
            remove: 'red',
        })
    }

    subtractCount = () => {
        this.setState({
            text: this.state.text - 1,
            add: 'red',
            remove: 'green',
        })
        if (this.state.text < 1) {
            this.setState({
                button: !this.state.button
            })
        }
    }

    render() {
        const name = 'arrow-left'
        const type = 'FontAwesome';
        const textTitle = 'Product List';
        const details = this.props.navigation.getParam('listItems');
        const offerIndex = this.props.navigation.getParam('offerIndex');
        const { selectedIndex } = this.state
        return (
            <Root>
                <ViewmorelistView
                    textTitle={textTitle}
                    type={type}
                    name={name}
                    goBack={this.goBack}
                    details={details}
                    goforProductDetailPage={(items:any) => this.goforProductDetailPage(items)}
                    addCount={() => this.addCount()}
                    subtractCount={this.subtractCount}
                    text={this.state.text}
                    gotoAddItems={(index:any) => this.gotoAddItems(index, offerIndex)}
                    add={this.state.add}
                    remove={this.state.remove}
                    goToMyCart={this.goToMyCart}
                    i={selectedIndex}
                />
            </Root>
        )
    }
}
export default withDatabase(ViewmoreListContainer);
