fix: fix errors.

src/containers/Drawers/BillDrawer/BillDrawerDetails.js

@@ -19,12 +19,14 @@ import BillDrawerCls from 'style/components/Drawers/BillDrawer.module.scss';
 export default function BillDrawerDetails() {
   const {
     data: { transactions },
-    billId,
   } = useBillDrawerContext();
 
   return (
     <div className={clsx(BillDrawerCls.root)}>
-      <DrawerMainTabs renderActiveTabPanelOnly={true} defaultSelectedTabId="details">
+      <DrawerMainTabs
+        renderActiveTabPanelOnly={true}
+        defaultSelectedTabId="details"
+      >
         <Tab
           title={intl.get('details')}
           id={'details'}
@@ -38,7 +40,7 @@ export default function BillDrawerDetails() {
         <Tab
           title={intl.get('payment_transactions')}
           id={'payment_transactions'}
-          panel={<BillPaymentTransactionTable billId={billId} />}
+          panel={<BillPaymentTransactionTable />}
         />
         <Tab
           title={intl.get('located_landed_cost')}

src/containers/Drawers/BillDrawer/LocatedLandedCostTable.js

@@ -1,5 +1,5 @@
 import React from 'react';
-import { DataTable, Card } from 'components';
+import { DataTable, Card, FormattedMessage as T } from 'components';
 import { Button, Classes, NavbarGroup } from '@blueprintjs/core';
 
 import { useLocatedLandedCostColumns, ActionsMenu } from './components';
@@ -31,16 +31,16 @@ function LocatedLandedCostTable({
   const columns = useLocatedLandedCostColumns();
   const { transactions, billId } = useBillDrawerContext();
 
-  // Handle the transaction delete action.
-  const handleDeleteTransaction = ({ id }) => {
-    openAlert('bill-located-cost-delete', { BillId: id });
-  };
-
   // Handle allocate landed cost button click.
   const handleAllocateCostClick = () => {
     openDialog('allocate-landed-cost', { billId });
   };
 
+  // Handle the transaction delete action.
+  const handleDeleteTransaction = ({ id }) => {
+    openAlert('bill-located-cost-delete', { BillId: id });
+  };
+
   // Handle from transaction link click.
   const handleFromTransactionClick = (original) => {
     const { from_transaction_type, from_transaction_id } = original;
@@ -64,7 +64,7 @@ function LocatedLandedCostTable({
           <Button
             className={Classes.MINIMAL}
             icon={<Icon icon="receipt-24" />}
-            text={'Allocate landed cost'}
+            text={<T id={'allocate_landed_coast'} />}
             onClick={handleAllocateCostClick}
           />
         </NavbarGroup>