Untitled

import React from 'react';
import { StyleSheet, View } from 'react-native';
import { Container, Header, Content, Card, CardItem, Thumbnail, List, ListItem, Text, Button, Icon, Left, Body, Right, Title } from 'native-base';

import firebase from './Config';
import { NavigationActions } from "react-navigation";
import SideMenu from "./SideMenu";

export default class YourProducts extends React.Component {

    constructor() {
        super();

        this.state = {
            items: [],
            itemKeys: [],
            user: null
        };
    }

    deleteProduct = (key) => {
        console.log(key);

        var itemsRef = firebase.database().ref('products/' + key);
        itemsRef.remove().then(function () {
            console.log('removed');
        })
    }

    componentDidMount() {
        // Alert.alert("A " + this.props.navigation.state[0]);
        var user = firebase.auth().currentUser;
        // console.log(user);
        if (user) {
            this.setState({ user: user.email })
        }

        var itemsRef = firebase.database().ref('products');
        itemsRef.on('value', (snapshot) => {
            var products = snapshot.val();
            var newList = Object.values(products);
            var newListKey = Object.keys(products)

            this.setState({
                items: newList,
                itemKeys: newListKey

            });

        });

        this.state.items.map((item, index) => { console.log(item) })
    }

    goToDetail() {
        this.props.navigation.navigate("Detail");
    }

    productList() {
        return this.state.items.map((product, index) => {
            return (
                this.state.user == product['seller_contact'] ?
                    <Card key={index}>
                        <CardItem >
                            <Left>
                                <Button transparent onPress={() => this.props.navigation.navigate("Detail", { product: product })}>
                                <Thumbnail

                                    source={{ uri: product["image"] }} />
                                    </Button>
                                <Body>
                                    <Text>{product["name"]}</Text>
                                    <Text note>{product["seller"] + " - " + product["seller_contact"]}</Text>
                                </Body>
                            </Left>
                        </CardItem>
                        {/* <CardItem cardBody>
                         <Image source={{ uri: product["image"] }} style={{ height: 200, width: null, flex: 1 }} />
                    </CardItem> */}
                        <CardItem>
                            <Body>

                                <Button light bordered  danger onPress={() => { this.deleteProduct(this.state.itemKeys[index]) }}><Text>Delete</Text></Button>
                            </Body>
                            <Right>
                                <Text style={style.price}>{product["price"]} EUR</Text>
                            </Right>
                        </CardItem>
                    </Card> : <Text></Text>
            )
        })
    }

    render() {

        return (
            <Container>
                <Header>
                    <Left>
                        <Button transparent onPress={() => this.props.navigation.navigate("DrawerOpen")}>
                            <Icon name='menu' />
                        </Button>
                    </Left>
                    <Body>
                        <Title>Products</Title>
                    </Body>
                    <Right />
                </Header>
                <Content contentContainerStyle={style.content}>
                    {this.productList()}
                    {/* <Button onPress={this.deleteProduct}><Text>Click</Text></Button> */}
                </Content>
            </Container>
        );
    }
}

const style = StyleSheet.create({
    content: {
        // flex: 1,
        // justifyContent: 'center',
        // alignItems: 'center'
    },
    price: {
        fontSize: 25
    }
});