feat(*): View Detail.

client/src/containers/Drawers/PaymentReceiveDetailDrawer/PaymentReceiveDetail.js

@@ -9,8 +9,8 @@ import { usePaymentReceiveDetailContext } from './PaymentReceiveDetailProvider';
  * payment receive view detail.
  */
 export default function PaymentReceiveDetail() {
-  const { data } = usePaymentReceiveDetailContext();
-  
+  const { transactions } = usePaymentReceiveDetailContext();
+
   return (
     <div className="view-detail-drawer">
       <Tabs animate={true} large={true} defaultSelectedTabId="journal_entries">
@@ -18,7 +18,7 @@ export default function PaymentReceiveDetail() {
         <Tab
           title={intl.get('journal_entries')}
           id={'journal_entries'}
-          panel={<JournalEntriesTable transactions={data} />}
+          panel={<JournalEntriesTable transactions={transactions} />}
         />
       </Tabs>
     </div>

client/src/containers/Drawers/PaymentReceiveDetailDrawer/PaymentReceiveDetailProvider.js

@@ -9,9 +9,11 @@ const PaymentReceiveDetailContext = React.createContext();
  * Payment receive detail provider.
  */
 function PaymentReceiveDetailProvider({ paymentReceiveId, ...props }) {
-
   // Handle fetch transaction by reference.
-  const { data, isLoading: isTransactionLoading } = useTransactionsByReference(
+  const {
+    data: { transactions },
+    isLoading: isTransactionLoading,
+  } = useTransactionsByReference(
     {
       reference_id: paymentReceiveId,
       reference_type: 'paymentReceive',
@@ -20,7 +22,7 @@ function PaymentReceiveDetailProvider({ paymentReceiveId, ...props }) {
   );
 
   //provider.
-  const provider = { data };
+  const provider = { transactions };
 
   return (
     <DashboardInsider loading={isTransactionLoading}>