Untitled

import React from 'react';
import {Image} from 'react-native';
import {RecyclerListView, DataProvider, LayoutProvider} from 'recyclerlistview';
import { createDrawerNavigator } from 'react-navigation-drawer';

import {
  View,
  List,
  Container,
  Header,
  Content,
  Left,
  Right,
  Button,
  Icon,
  Body,
  Title,
  Text,
  Card,
  CardItem,
  Fab,
  Toast,
  Footer,
  H1,
  Root,
  Drawer,
} from 'native-base';

export default class FetchProducts extends React.Component {
  constructor(props) {
    super(props);
    this.state = {isLoading: true};
  }

  // componentDidMount() {
  //   return fetch('http://167.99.3.52/products/')
  //     .then(response => response.json())
  //     .then(responseJson => {
  //       this.setState(
  //         {
  //           isLoading: false,
  //           dataSource: responseJson,
  //         },
  //         function() {},
  //       );
  //     })
  //     .catch(error => {
  //       console.error(error);
  //     });
  // }

  render() {
    return (
      <Root>
        <Container>
          <Header>
            <Left>
              <Button transparent>
                <Icon name="menu" />
              </Button>
            </Left>
            <Body>
              <Title>Home</Title>
            </Body>
            <Right>
              <Button transparent>
                <Icon name="search" />
              </Button>
            </Right>
          </Header>

          <Content padder>
            <H1>Products</H1>
            <List>
              <ProductItem title="Morning Free" price="5775" />
              <ProductItem title="Development Onto" price="7334" />
              <ProductItem title="Mind Seek" price="5964" />
            </List>
          </Content>
          <Fab
            active={this.state.active}
            direction="up"
            containerStyle={{}}
            position="bottomRight"
            onPress={() =>
              Toast.show({
                text: 'Going to Cart!',
                buttonText: 'Okay',
              })
            }>
            <Icon type="FontAwesome" name="shopping-cart" />
          </Fab>
        </Container>
      </Root>
    );
  }
}

class ProductItem extends React.Component {
  render() {
    return (
      <Card>
        <CardItem cardBody>
          <Image
            style={{width: 300, height: 300, flex: 1}}
            source={{
              uri:
                'https://images.pexels.com/photos/67636/rose-blue-flower-rose-blooms-67636.jpeg?auto=compress&cs=tinysrgb&dpr=1&w=500',
            }}
          />
        </CardItem>
        <CardItem>
          <Body>
            <Text>{this.props.price}</Text>
            <Text>{this.props.title}</Text>
          </Body>
        </CardItem>
      </Card>
    );
  }
}