Product compare application

src/actions/product.js

@@ -2,12 +2,12 @@ import * as types from '../constants/types';
 
 export function getProducts() {
   return dispatch => {
-    fetch(`${process.env.REACT_APP_API_URL}/v1/api/products`)
+    fetch(`https://api.myjson.com/bins/dfnzz`)
       .then(response => response.json())
       .then(response => {
         dispatch({
           type: types.FETCH_PRODUCTS,
-          payload: response
+          payload: response.products
         });
       })
   }
@@ -15,4 +15,4 @@ export function getProducts() {
 
 export function compare(product) {
   return {type: types.COMPARE_PRODUCT, product};
-}
+}

src/components/Compare/index.js

@@ -1,5 +1,4 @@
 import React from 'react'
-import {Table} from 'reactstrap'
 import './index.css'
 
 const Compare = ({products}) =>
@@ -8,7 +7,7 @@ const Compare = ({products}) =>
       <div className={(products.length < 2
         ? 'hidden-xs-up'
         : '')}>
-        <Table>
+        <table className="table">
           <thead className="thead-default">
           <tr>
             <th></th>
@@ -45,7 +44,7 @@ const Compare = ({products}) =>
               )}
             </tr>
           </tbody>
-        </Table>
+        </table>
       </div>
     </div>
   </div>;

src/components/Product/index.js

@@ -1,18 +1,6 @@
 import React from 'react'
 import './index.css'
 
-// const Product = ({product, compare}) =>
-//     <div key={product.id} className="col-3 product-card">
-//       <Card inverse
-//             onClick={() => compare(product)}
-//             color={product.compare ? "success" : "primary"}
-//       >
-//         <CardBlock>
-//           <CardTitle>{product.name}</CardTitle>
-//         </CardBlock>
-//       </Card>
-//     </div>;
-
 const Product = ({product, compare}) =>
     <div key={product.id} className="col-3">
         <div className={"product " + (product.compare ? "compare" : "")} >