fetch coin from api action

Author: Danite

App.js

@@ -2,7 +2,7 @@ import React from 'react';
 import {StyleSheet, Text, View} from 'react-native';
 import {Provider} from "react-redux";
 
-import {Header} from "./src/components";
+import {Header, CryptoContainer} from "./src/components";
 import Store from "./src/Store";
 
 export default class App extends React.Component {
@@ -11,6 +11,7 @@ export default class App extends React.Component {
       <Provider store={Store}>
         <View>
           <Header>Crypto Tracker</Header>
+          <CryptoContainer />
         </View>
       </Provider>
     );

package.json

@@ -27,6 +27,7 @@
     "preset": "jest-expo"
   },
   "dependencies": {
+    "axios": "^0.18.0",
     "expo": "^25.0.0",
     "react": "16.2.0",
     "react-native": "0.52.0",

src/Actions/FetchCoinData.js

@@ -0,0 +1,18 @@
+import axios from "axios";
+import { apiBaseUrl } from "../Utils/Constants";
+import { FETCHING_COIN_DATA, FETCHING_COIN_DATA_SUCCESS, FETCHING_COIN_DATA_FAIL } from "../Utils/ActionTypes";
+
+
+export default function FetchCoinData() {
+    return dispatch => {
+        dispatch({ type: FETCHING_COIN_DATA })
+
+        return axios.get(`${apiBaseUrl}/v1/ticker/?limit=10`)
+            .then(res => {
+                dispatch({ type: FETCHING_COIN_DATA_SUCCESS, payload: res.data})
+            })
+            .catch(err => {
+                dispatch({ type: FETCHING_COIN_DATA_FAIL, payload: err.data})
+            })
+    }
+}

src/Utils/ActionTypes.js

@@ -0,0 +1,3 @@
+export const FETCHING_COIN_DATA = "FETCHING_COIN_DATA";
+export const FETCHING_COIN_DATA_SUCCESS = "FETCHING_COIN_DATA_SUCCESS";
+export const FETCHING_COIN_DATA_FAIL = "FETCHING_COIN_DATA_FAIL";

src/Utils/Constants.js

@@ -0,0 +1 @@
+export const apiBaseUrl = "https://api.coinmarketcap.com";

src/components/CryptoContainer/CryptoContainer.js

@@ -0,0 +1,23 @@
+import React, { Component } from "react";
+import { View, Text } from "react-native";
+import { connect } from "react-redux";
+
+
+class CryptoContainer extends Component {
+
+    render() {
+        return (
+            <View>
+                <Text>Nani is this shit</Text>
+            </View>
+        )
+    }
+}
+
+function mapStateToProps(state) {
+    return {
+        crypto: state.crypto
+    }
+}
+
+export default connect(mapStateToProps)(CryptoContainer);

src/components/index.js

@@ -1,4 +1,5 @@
 import Header from "./Header/Header";
+import CryptoContainer from "./CryptoContainer/CryptoContainer"
 
 
-export { Header };
+export { Header, CryptoContainer };