feat(GLTable): columns text overflow.

src/containers/Drawers/CashflowTransactionDetailDrawer/CashflowTransactionDrawerHeader.js

@@ -7,7 +7,6 @@ import {
   FormattedMessage as T,
   Row,
   Col,
-  CommercialDocTopHeader,
   CommercialDocHeader,
 } from 'components';
 import { useCashflowTransactionDrawerContext } from './CashflowTransactionDrawerProvider';
@@ -16,23 +15,14 @@ import { useCashflowTransactionDrawerContext } from './CashflowTransactionDrawer
  * Cashlflow transaction drawer detail Header.
  */
 export default function CashflowTransactionDrawerHeader() {
-  const {
-    cashflowTransaction: {
-      formatted_amount,
-      transaction_type_formatted,
-      transaction_number,
-      reference_no,
-      date,
-      description,
-    },
-  } = useCashflowTransactionDrawerContext();
+  const { cashflowTransaction } = useCashflowTransactionDrawerContext();
 
   return (
     <CommercialDocHeader>
       <CommercialDocHeader>
         <DetailsMenu>
           <DetailItem name={'total'} label={<T id={'total'} />}>
-            <h3 class="amount">{formatted_amount}</h3>
+            <h3 class="big-number">{cashflowTransaction.formatted_amount}</h3>
           </DetailItem>
         </DetailsMenu>
       </CommercialDocHeader>
@@ -44,33 +34,26 @@ export default function CashflowTransactionDrawerHeader() {
               name={'transaction_type'}
               label={<T id={'cash_flow_drawer.label_transaction_type'} />}
             >
-              {transaction_type_formatted}
+              {cashflowTransaction.transaction_type_formatted}
             </DetailItem>
 
             <DetailItem
               name={'transaction_number'}
               label={<T id={'cash_flow.drawer.label_transaction_no'} />}
             >
-              {transaction_number}
+              {cashflowTransaction.transaction_number}
             </DetailItem>
 
             <DetailItem label={<T id={'date'} />}>
-              <FormatDate value={date} />
+              <FormatDate value={cashflowTransaction.date} />
             </DetailItem>
 
             <DetailItem name={'reference-no'} label={<T id={'reference_no'} />}>
-              {defaultTo(reference_no, '-')}
+              {defaultTo(cashflowTransaction.reference_no, '-')}
             </DetailItem>
           </DetailsMenu>
         </Col>
       </Row>
-
-      {/* <div class="cashflow-drawer__content-description">
-        <b class="title">
-          <T id={'description'} />
-        </b>
-        : {defaultTo(description, '—')}
-      </div> */}
     </CommercialDocHeader>
   );
 }

src/containers/Drawers/InvoiceDetailDrawer/InvoicePaymentTransactions/components.js

@@ -75,6 +75,7 @@ export const useInvoicePaymentTransactionsColumns = () => {
         accessor: 'payment_number',
         width: 100,
         className: 'payment_number',
+        textOverview: true,
       },
       {
         id: 'payment_reference_no',