diff --git a/resources/assets/vue/components/bookings/elements/PaymentHistoryComponent.vue b/resources/assets/vue/components/bookings/elements/PaymentHistoryComponent.vue
index b9beea76..7be04c65 100644
--- a/resources/assets/vue/components/bookings/elements/PaymentHistoryComponent.vue
+++ b/resources/assets/vue/components/bookings/elements/PaymentHistoryComponent.vue
@@ -1,53 +1,48 @@
 <template>
     <div class="row m-l-0 m-b-10 m-r-0 parentContainer" :class="[{'b-a': item.status === 4}, {'b-danger': item.status === 4}]" >
         <div class="col">
-            <div class="row">
-                <div class="col p-t-10 p-b-10 p-r-0 pointer" @click="clickExpand()" :class="[{'bg-master-lighter': item.status === 1}, {'bg-white': item.status !== 1 && item.status !== 4}]">
-                    <div class="row m-b-5">
-                        <div class="col-auto">
-                            <div class="font-heading fs-8 muted all-caps">Status</div>
-                            <div class="font-heading fs-10 bold" v-if="item.type === 1" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
-                                {{ item.status === 1 ? 'Pending Verification' : item.status === 4 ? 'Rejected' : 'Processing Payment'}}
-                            </div>
-                            <div class="font-heading fs-10 bold" v-if="item.type === 3" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
-                                {{ item.status === 1 ? 'Processing Payment' : 'Transferred'}}
-                            </div>
-                        </div>
-                        <div class="col-auto p-l-0">
-                            <div class="font-heading fs-8 muted all-caps">Payment Amount</div>
-                            <div class="font-heading fs-10 bold">
-                                {{ item.type === 3 ? item.original_currency.short_code : item.currency.short_code}} {{(Math.round((item.type === 3 ? item.original_amount : item.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
-                            </div>
-                        </div>
-                    </div>
+            <div class="row" v-if="item.type === 1">
+                <div class="col">
                     <div class="row">
-                        <div class="col">
-                            <div class="font-heading fs-8 all-caps" v-if="(item.payment_method === 5 && item.status !== 0 && item.status !== 1) || item.payment_method !==5" :class="[{'text-danger': item.status === 4}, {'text-primary': item.status !== 4}]">{{ item.status === 1 ? 'Submitted' : item.status === 2 ? 'Received' : item.status === 4 ? 'Rejected' : 'Paid'}} On: {{item.updated_at}}</div>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-auto" v-if="item.status !== 3" :class="[{'bg-master-light': item.status === 1}, {'bg-master-lighter': item.status === 2}]">
-                    <div class="row align-items-center h-100" v-if="item.payment_method !== 5">
-                        <div class="col">
-                            <i class="fa" :class="[{'fa-cloud-download': item.status === 1 || item.status === 2}, {'fa-ban': item.status === 4}, {'muted': item.status === 1 || item.status === 2}, {'text-danger':  item.status === 4}]"></i>
-                        </div>
-                    </div>
-                    <div class="row align-items-center h-100" v-if="item.type === 1 && item.payment_method === 5">
-                        <div class="col">
-                            <a :href="'https://www.billplz-sandbox.com/bills/'+item.payment_reference"><i class="fa fa-repeat text-success" v-if="item.status !== 2"></i></a>
-                        </div>
-                    </div>
-                </div>
-                <div class="col-auto bg-success" v-if="item.type === 3 && (item.status === 2 || item.status === 3)">
-                    <document-file-viewer-component class="h-100" :file="item.documents.files[0]">
-                        <template slot="button">
-                            <div class="row align-items-center h-100">
-                                <div class="col">
-                                    <i class="fa fa-cloud-download text-white"></i>
+                        <div class="col p-t-10 p-b-10 p-r-0 pointer" @click="clickExpand()" :class="[{'bg-master-lighter': item.status === 1}, {'bg-white': item.status !== 1 && item.status !== 4}]">
+                            <div class="row m-b-5">
+                                <div class="col-auto">
+                                    <div class="font-heading fs-8 muted all-caps">Status</div>
+                                    <div class="font-heading fs-10 bold" v-if="item.type === 1" :class="[{'text-danger': item.status === 1 || item.status === 4}, {'text-success': item.status !== 1 && item.status !== 4}]">
+                                        {{ item.status === 1 ? 'Pending Verification' : item.status === 4 ? 'Rejected' : 'Processing Payment'}}
+                                    </div>
+                                </div>
+                                <div class="col-auto p-l-0">
+                                    <div class="font-heading fs-8 muted all-caps">Payment Amount</div>
+                                    <div class="font-heading fs-10 bold">
+                                        {{item.currency.short_code}} {{(Math.round((item.amount + Number.EPSILON) * 100) / 100).toFixed(2).toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",")}}
+                                    </div>
                                 </div>
                             </div>
-                        </template>
-                    </document-file-viewer-component>
+                            <div class="row">
+                                <div class="col">
+                                    <div class="font-heading fs-8 all-caps" v-if="(item.payment_method === 5 && item.status !== 0 && item.status !== 1) || item.payment_method !==5" :class="[{'text-danger': item.status === 4}, {'text-primary': item.status !== 4}]">{{ item.status === 1 ? 'Submitted' : item.status === 2 ? 'Received' : item.status === 4 ? 'Rejected' : 'Paid'}} On: {{item.updated_at}}</div>
+                                </div>
+                            </div>
+                        </div>
+                        <div class="col-auto" v-if="item.status !== 3" :class="[{'bg-master-light': item.status === 1}, {'bg-master-lighter': item.status === 2}]">
+                            <div class="row align-items-center h-100" v-if="item.payment_method !== 5">
+                                <div class="col">
+                                    <i class="fa" :class="[{'fa-cloud-download': item.status === 1 || item.status === 2}, {'fa-ban': item.status === 4}, {'muted': item.status === 1 || item.status === 2}, {'text-danger':  item.status === 4}]"></i>
+                                </div>
+                            </div>
+                            <div class="row align-items-center h-100" v-if="item.payment_method === 5 && item.status === 1">
+                                <div class="col">
+                                    <a :href="'https://www.billplz-sandbox.com/bills/'+item.payment_reference"><i class="fa fa-repeat text-success"></i></a>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+            <div class="row" v-if="item.type === 3">
+                <div class="col">
+
                 </div>
             </div>
             <div class="row" v-if="expandPaymentDetails">