diff --git a/app/components/MyOrders/index.js b/app/components/MyOrders/index.js
index 037fdf39..4f177036 100644
--- a/app/components/MyOrders/index.js
+++ b/app/components/MyOrders/index.js
@@ -1,7 +1,7 @@
 import React from 'react';
 import { View, ScrollView, Text, Image } from 'react-native';
 
-import { Container, Header, Tab, Tabs, TabHeading, Icon, List } from 'native-base';
+import { List } from 'native-base';
 import { Actions } from 'react-native-router-flux';
 import { connect } from 'react-redux';
 import { createStructuredSelector } from 'reselect';
@@ -14,7 +14,7 @@ import Button from '../../components/Button';
 import styles from './style';
 import strings from '../../localization';
 import OrderList from '../../containers/OrderList';
-
+import { getUpdateOrderStatus, getPaymentProof } from '../../containers/OrderDetail/selectors';
 
 const icon = require('./../../../assets/images/icon.png');
 const noTicket = require('./../../../assets/images/noticket.png');
@@ -53,6 +53,8 @@ const MyOrders = (props) => {
                       key={order.id}
                       order={order}
                       confirmPayment={this.confirmPayment}
+                      statusProgress={props.orderStatus}
+                      paymentProof={props.paymentProof}
                       onPress={() => {
                         Actions.orderDetail({
                           orderId: order.id,
@@ -83,7 +85,9 @@ MyOrders.propTypes = {
 };
 
 const mapStateToProps = createStructuredSelector({
-  orders: selectors.getOrders()
+  orders: selectors.getOrders(),
+  orderStatus: getUpdateOrderStatus(),
+  paymentProof: getPaymentProof()
 });
 
 export default connect(mapStateToProps, actions)(MyOrders);
diff --git a/app/components/MyOrders/style.js b/app/components/MyOrders/style.js
index 183db1a5..f4e03912 100644
--- a/app/components/MyOrders/style.js
+++ b/app/components/MyOrders/style.js
@@ -38,22 +38,6 @@ const styles = StyleSheet.create({
     justifyContent: 'center',
     backgroundColor: 'transparent'
   },
-  tabs: {
-  },
-  tabHeading: {
-    flex: 1,
-    backgroundColor: '#FF6F00'
-  },
-  tabTitle: {
-    fontSize: 16,
-    fontFamily: 'Montserrat',
-    fontWeight: '500',
-    color: '#FFF'
-  },
-  tabBarSelectedItemStyle: {
-    borderBottomWidth: 2,
-    borderBottomColor: 'red'
-  }
 });
 
 export default styles;
diff --git a/app/components/OrderItem/index.js b/app/components/OrderItem/index.js
index 58f5908d..702d17a1 100644
--- a/app/components/OrderItem/index.js
+++ b/app/components/OrderItem/index.js
@@ -1,3 +1,4 @@
+
 import 'intl';
 import 'intl/locale-data/jsonp/id';
 import React, { Component } from 'react';
@@ -68,6 +69,11 @@ export default class OrderItem extends Component {
         </Text>
       );
     }
+    return (
+      <Text note style={[ styles.statusText, { backgroundColor: 'blue', color: 'white' } ]}>
+        {this.state.status.toUpperCase()}
+      </Text>
+    );
   }
 
   ticketTypes = () => {
@@ -99,8 +105,12 @@ export default class OrderItem extends Component {
   };
 
   render() {
-    const { status } = this.state;
     const { order } = this.props;
+    const { color, status } = this.state;
+    // console.log('landing here orderItem this.state', this.state);
+    // console.log('landing here this.props orderItem', this.props.order);
+    // console.log('landing here localeDateAddOneHour', localeDateAddOneHour(order.created_at));
+    // console.log('landing here moment()', Moment());
     return (
       <CardItem style={styles.container} button onPress={() => this.props.onPress()}>
         <View style={styles.item}>
diff --git a/app/components/OrderItem/styles.js b/app/components/OrderItem/styles.js
index 91124cd5..e04ea90b 100644
--- a/app/components/OrderItem/styles.js
+++ b/app/components/OrderItem/styles.js
@@ -48,16 +48,17 @@ const styles = StyleSheet.create({
     borderColor: 'transparent',
     elevation: 0
   },
-  viewText1: {
+  viewText: {
     flex: 0,
     flexDirection: 'row',
-    margin: 20,
+    marginTop: 8
   },
   buttonSection: {
     flex: 1,
     flexDirection: 'row',
     justifyContent: 'center',
     alignItems: 'center',
+    marginLeft: 10
   },
   statusText: {
     fontWeight: 'bold',
diff --git a/app/helpers.js b/app/helpers.js
index c678c32d..49b33ac8 100644
--- a/app/helpers.js
+++ b/app/helpers.js
@@ -116,6 +116,11 @@ export const transactionStatus = (payment) => {
         message: 'pending',
         color: 'red'
       };
+    } else if (payment.transaction_status === 'in progress') {
+      return {
+        message: 'in progress',
+        color: 'blue' 
+      };
     }
     return {
       message: payment.transaction_status,
@@ -126,4 +131,4 @@ export const transactionStatus = (payment) => {
     message: 'not paid',
     color: PRIMARYCOLOR
   };
-};
+}