Merge branch 'feature/Cash-flow' of https://github.com/bigcapitalhq/client into feature/Cash-flow

src/containers/CashFlow/AccountTransactions/AccountTransactionsDataTable.js

@@ -9,9 +9,10 @@ import TableSkeletonRows from 'components/Datatable/TableSkeletonRows';
 import TableSkeletonHeader from 'components/Datatable/TableHeaderSkeleton';
 
 import withSettings from '../../Settings/withSettings';
+import withAlertsActions from 'containers/Alert/withAlertActions';
 
 import { useMemorizedColumnsWidths } from '../../../hooks';
-import { useAccountTransactionsColumns } from './components';
+import { useAccountTransactionsColumns, ActionsMenu } from './components';
 import { useAccountTransactionsContext } from './AccountTransactionsProvider';
 import { compose } from 'utils';
 
@@ -21,6 +22,9 @@ import { compose } from 'utils';
 function AccountTransactionsDataTable({
   // #withSettings
   cashflowTansactionsTableSize,
+
+  // #withAlertsActions
+  openAlert,
 }) {
   // Retrieve table columns.
   const columns = useAccountTransactionsColumns();
@@ -36,6 +40,11 @@ function AccountTransactionsDataTable({
   const [initialColumnsWidths, , handleColumnResizing] =
     useMemorizedColumnsWidths(TABLES.CASHFLOW_Transactions);
 
+  // handle delete transaction
+  const handleDeleteTransaction = ({ reference_id }) => {
+    openAlert('account-transaction-delete', { referenceId: reference_id });
+  };
+
   return (
     <CashflowTransactionsTable
       noInitialFetch={true}
@@ -51,6 +60,7 @@ function AccountTransactionsDataTable({
       TableLoadingRenderer={TableSkeletonRows}
       TableRowsRenderer={TableVirtualizedListRows}
       TableHeaderSkeletonRenderer={TableSkeletonHeader}
+      ContextMenu={ActionsMenu}
       // #TableVirtualizedListRows props.
       vListrowHeight={cashflowTansactionsTableSize == 'small' ? 32 : 40}
       vListOverscanRowCount={0}
@@ -60,6 +70,9 @@ function AccountTransactionsDataTable({
         'There is deposit/withdrawal transactions on the current account.'
       }
       className="table-constrant"
+      payload={{
+        onDelete: handleDeleteTransaction,
+      }}
     />
   );
 }
@@ -68,6 +81,7 @@ export default compose(
   withSettings(({ cashflowTransactionsSettings }) => ({
     cashflowTansactionsTableSize: cashflowTransactionsSettings?.tableSize,
   })),
+  withAlertsActions,
 )(AccountTransactionsDataTable);
 
 const DashboardConstrantTable = styled(DataTable)`