AFP-70: basic information on order history page

ecom-web/src/components/order-history/Order.jsx

 import React from 'react';
+import { totalPrice } from '../../util/order_history_util';
 
 const Order = (props) => {
 
     const {order} = props;
-    console.log(order);
+    const {orderItems, customerAddress} = order;
+
+    const orderTotalPrice = totalPrice(orderItems);
+    const orderPlaced = new Date(order.orderCreatedAt);
 
     return (
-        null
+        <div>
+            <p>Order ID: {order.id}</p>
+            <p>Order Status: {order.orderStatus}</p>
+            <p>Order Placed: {orderPlaced.getUTCMonth()}
+                /{orderPlaced.getUTCDay()}
+                /{orderPlaced.getUTCFullYear()}
+            </p>
+            <p>
+                Delivery Address: {`
+                ${customerAddress.street},
+                ${customerAddress.city},
+                ${customerAddress.state} ${customerAddress.zip}
+                `}
+            </p>
+            <p>Total Price: ${orderTotalPrice}</p>
+
+        </div>
     )
 }
 

ecom-web/src/components/order-history/order-history.jsx

 import React, { useEffect, useState } from 'react'
-import { getOrderHistory } from '../../actions/order_actions';
+import { getOrderHistory } from '../../util/order_api_util';
 import Order from './Order';
 
 import './order-history.css'
@@ -7,11 +7,14 @@ import './order-history.css'
 const OrderHistory = () => {
 
     const [orderHistory, setOrderHistory] = useState([]);
+    const [callMade, setCallMade] = useState(false);
     
     useEffect( async () => {
-        const userHistory = await getOrderHistory('e-com-test-id2');
+        if (callMade) return;
+        const userHistory = await getOrderHistory('e-com-test-id2'); //insert user email from user details stored in redux 
         setOrderHistory(userHistory);
-    }, [orderHistory]);
+        setCallMade(true);
+    });
 
     return (
         <main>

ecom-web/src/util/order_history_util.js

+export const totalPrice = (items) => {
+    return items.reduce((acc,item) => {
+        return acc + item.itemPrice;
+    }, 0).toFixed(2);
+}
\ No newline at end of file