Merge pull request #533 from bigcapitalhq/bulk-categorize-bank-transactions

feat: Bulk categorize bank transactions

packages/server/src/api/controllers/Banking/BankTransactionsMatchingController.ts

@@ -1,12 +1,8 @@
 import { Inject, Service } from 'typedi';
+import { body, param } from 'express-validator';
 import { NextFunction, Request, Response, Router } from 'express';
 import BaseController from '@/api/controllers/BaseController';
 import { MatchBankTransactionsApplication } from '@/services/Banking/Matching/MatchBankTransactionsApplication';
-import { body, param } from 'express-validator';
-import {
-  GetMatchedTransactionsFilter,
-  IMatchTransactionsDTO,
-} from '@/services/Banking/Matching/types';
 
 @Service()
 export class BankTransactionsMatchingController extends BaseController {
@@ -20,9 +16,17 @@ export class BankTransactionsMatchingController extends BaseController {
     const router = Router();
 
     router.post(
-      '/:transactionId',
+      '/unmatch/:transactionId',
+      [param('transactionId').exists()],
+      this.validationResult,
+      this.unmatchMatchedBankTransaction.bind(this)
+    );
+    router.post(
+      '/match',
       [
-        param('transactionId').exists(),
+        body('uncategorizedTransactions').exists().isArray({ min: 1 }),
+        body('uncategorizedTransactions.*').isNumeric().toInt(),
+
         body('matchedTransactions').isArray({ min: 1 }),
         body('matchedTransactions.*.reference_type').exists(),
         body('matchedTransactions.*.reference_id').isNumeric().toInt(),
@@ -30,12 +34,6 @@ export class BankTransactionsMatchingController extends BaseController {
       this.validationResult,
       this.matchBankTransaction.bind(this)
     );
-    router.post(
-      '/unmatch/:transactionId',
-      [param('transactionId').exists()],
-      this.validationResult,
-      this.unmatchMatchedBankTransaction.bind(this)
-    );
     return router;
   }
 
@@ -50,21 +48,21 @@ export class BankTransactionsMatchingController extends BaseController {
     req: Request<{ transactionId: number }>,
     res: Response,
     next: NextFunction
-  ) {
+  ): Promise<Response | null> {
     const { tenantId } = req;
-    const { transactionId } = req.params;
+    const bodyData = this.matchedBodyData(req);
-    const matchTransactionDTO = this.matchedBodyData(
+
-      req
+    const uncategorizedTransactions = bodyData?.uncategorizedTransactions;
-    ) as IMatchTransactionsDTO;
+    const matchedTransactions = bodyData?.matchedTransactions;
 
     try {
       await this.bankTransactionsMatchingApp.matchTransaction(
         tenantId,
-        transactionId,
+        uncategorizedTransactions,
-        matchTransactionDTO
+        matchedTransactions
       );
       return res.status(200).send({
-        id: transactionId,
+        ids: uncategorizedTransactions,
         message: 'The bank transaction has been matched.',
       });
     } catch (error) {

packages/server/src/api/controllers/Banking/BankingController.ts

@@ -6,6 +6,7 @@ import { BankingRulesController } from './BankingRulesController';
 import { BankTransactionsMatchingController } from './BankTransactionsMatchingController';
 import { RecognizedTransactionsController } from './RecognizedTransactionsController';
 import { BankAccountsController } from './BankAccountsController';
+import { BankingUncategorizedController } from './BankingUncategorizedController';
 
 @Service()
 export class BankingController extends BaseController {
@@ -29,6 +30,10 @@ export class BankingController extends BaseController {
       '/bank_accounts',
       Container.get(BankAccountsController).router()
     );
+    router.use(
+      '/categorize',
+      Container.get(BankingUncategorizedController).router()
+    );
     return router;
   }
 }

packages/server/src/api/controllers/Banking/BankingUncategorizedController.ts

@@ -0,0 +1,57 @@
+import { Inject, Service } from 'typedi';
+import { NextFunction, Request, Response, Router } from 'express';
+import { query } from 'express-validator';
+import BaseController from '../BaseController';
+import { GetAutofillCategorizeTransaction } from '@/services/Banking/RegonizeTranasctions/GetAutofillCategorizeTransaction';
+
+@Service()
+export class BankingUncategorizedController extends BaseController {
+  @Inject()
+  private getAutofillCategorizeTransactionService: GetAutofillCategorizeTransaction;
+
+  /**
+   * Router constructor.
+   */
+  router() {
+    const router = Router();
+
+    router.get(
+      '/autofill',
+      [
+        query('uncategorizedTransactionIds').isArray({ min: 1 }),
+        query('uncategorizedTransactionIds.*').isNumeric().toInt(),
+      ],
+      this.validationResult,
+      this.getAutofillCategorizeTransaction.bind(this)
+    );
+    return router;
+  }
+
+  /**
+   * Retrieves the autofill values of the categorize form of the given
+   * uncategorized transactions.
+   * @param {Request} req
+   * @param {Response} res
+   * @param {NextFunction} next
+   * @returns {Promise<Response | null>}
+   */
+  public async getAutofillCategorizeTransaction(
+    req: Request,
+    res: Response,
+    next: NextFunction
+  ) {
+    const { tenantId } = req;
+    const uncategorizedTransactionIds = req.query.uncategorizedTransactionIds;
+
+    try {
+      const data =
+        await this.getAutofillCategorizeTransactionService.getAutofillCategorizeTransaction(
+          tenantId,
+          uncategorizedTransactionIds
+        );
+      return res.status(200).send({ data });
+    } catch (error) {
+      next(error);
+    }
+  }
+}

packages/server/src/api/controllers/Cashflow/GetCashflowTransaction.ts

@@ -1,6 +1,6 @@
 import { Service, Inject } from 'typedi';
 import { Router, Request, Response, NextFunction } from 'express';
-import { param } from 'express-validator';
+import { param, query } from 'express-validator';
 import BaseController from '../BaseController';
 import { ServiceError } from '@/exceptions';
 import CheckPolicies from '@/api/middleware/CheckPolicies';
@@ -24,7 +24,12 @@ export default class GetCashflowAccounts extends BaseController {
     const router = Router();
 
     router.get(
-      '/transactions/:transactionId/matches',
+      '/transactions/matches',
+      [
+        query('uncategorizeTransactionsIds').exists().isArray({ min: 1 }),
+        query('uncategorizeTransactionsIds.*').exists().isNumeric().toInt(),
+      ],
+      this.validationResult,
       this.getMatchedTransactions.bind(this)
     );
     router.get(
@@ -44,7 +49,7 @@ export default class GetCashflowAccounts extends BaseController {
    * @param {NextFunction} next
    */
   private getCashflowTransaction = async (
-    req: Request,
+    req: Request<{ transactionId: number }>,
     res: Response,
     next: NextFunction
   ) => {
@@ -71,19 +76,24 @@ export default class GetCashflowAccounts extends BaseController {
    * @param {NextFunction} next
    */
   private async getMatchedTransactions(
-    req: Request<{ transactionId: number }>,
+    req: Request<
+      { transactionId: number },
+      null,
+      null,
+      { uncategorizeTransactionsIds: Array<number> }
+    >,
     res: Response,
     next: NextFunction
   ) {
     const { tenantId } = req;
-    const { transactionId } = req.params;
+    const uncategorizeTransactionsIds = req.query.uncategorizeTransactionsIds;
     const filter = this.matchedQueryData(req) as GetMatchedTransactionsFilter;
 
     try {
       const data =
         await this.bankTransactionsMatchingApp.getMatchedTransactions(
           tenantId,
-          transactionId,
+          uncategorizeTransactionsIds,
           filter
         );
       return res.status(200).send(data);

packages/server/src/api/controllers/Cashflow/NewCashflowTransaction.ts

@@ -1,10 +1,15 @@
 import { Service, Inject } from 'typedi';
 import { ValidationChain, check, param, query } from 'express-validator';
 import { Router, Request, Response, NextFunction } from 'express';
+import { omit } from 'lodash';
 import BaseController from '../BaseController';
 import { ServiceError } from '@/exceptions';
 import CheckPolicies from '@/api/middleware/CheckPolicies';
-import { AbilitySubject, CashflowAction } from '@/interfaces';
+import {
+  AbilitySubject,
+  CashflowAction,
+  ICategorizeCashflowTransactioDTO,
+} from '@/interfaces';
 import { CashflowApplication } from '@/services/Cashflow/CashflowApplication';
 
 @Service()
@@ -44,7 +49,7 @@ export default class NewCashflowTransactionController extends BaseController {
       this.catchServiceErrors
     );
     router.post(
-      '/transactions/:id/categorize',
+      '/transactions/categorize',
       this.categorizeCashflowTransactionValidationSchema,
       this.validationResult,
       this.categorizeCashflowTransaction,
@@ -89,6 +94,7 @@ export default class NewCashflowTransactionController extends BaseController {
    */
   public get categorizeCashflowTransactionValidationSchema() {
     return [
+      check('uncategorized_transaction_ids').exists().isArray({ min: 1 }),
       check('date').exists().isISO8601().toDate(),
       check('credit_account_id').exists().isInt().toInt(),
       check('transaction_number').optional(),
@@ -161,7 +167,7 @@ export default class NewCashflowTransactionController extends BaseController {
    * @param {NextFunction} next
    */
   private revertCategorizedCashflowTransaction = async (
-    req: Request,
+    req: Request<{ id: number }>,
     res: Response,
     next: NextFunction
   ) => {
@@ -191,14 +197,19 @@ export default class NewCashflowTransactionController extends BaseController {
     next: NextFunction
   ) => {
     const { tenantId } = req;
-    const { id: cashflowTransactionId } = req.params;
+    const matchedObject = this.matchedBodyData(req);
-    const cashflowTransaction = this.matchedBodyData(req);
+    const categorizeDTO = omit(matchedObject, [
+      'uncategorizedTransactionIds',
+    ]) as ICategorizeCashflowTransactioDTO;
+
+    const uncategorizedTransactionIds =
+      matchedObject.uncategorizedTransactionIds;
 
     try {
       await this.cashflowApplication.categorizeTransaction(
         tenantId,
-        cashflowTransactionId,
+        uncategorizedTransactionIds,
-        cashflowTransaction
+        categorizeDTO
       );
       return res.status(200).send({
         message: 'The cashflow transaction has been created successfully.',
@@ -269,7 +280,7 @@ export default class NewCashflowTransactionController extends BaseController {
    * @param {NextFunction} next
    */
   public getUncategorizedCashflowTransactions = async (
-    req: Request,
+    req: Request<{ id: number }>,
     res: Response,
     next: NextFunction
   ) => {

packages/server/src/interfaces/CashFlow.ts

@@ -236,6 +236,7 @@ export interface ICashflowTransactionSchema {
 export interface ICashflowTransactionInput extends ICashflowTransactionSchema {}
 
 export interface ICategorizeCashflowTransactioDTO {
+  date: Date;
   creditAccountId: number;
   referenceNo: string;
   transactionNumber: string;

packages/server/src/interfaces/CashflowService.ts

@@ -130,20 +130,23 @@ export interface ICommandCashflowDeletedPayload {
 
 export interface ICashflowTransactionCategorizedPayload {
   tenantId: number;
-  uncategorizedTransaction: any;
+  uncategorizedTransactions: Array<IUncategorizedCashflowTransaction>;
   cashflowTransaction: ICashflowTransaction;
+  oldUncategorizedTransactions: Array<IUncategorizedCashflowTransaction>;
   categorizeDTO: any;
   trx: Knex.Transaction;
 }
 export interface ICashflowTransactionUncategorizingPayload {
   tenantId: number;
-  uncategorizedTransaction: IUncategorizedCashflowTransaction;
+  uncategorizedTransactionId: number;
+  oldUncategorizedTransactions: Array<IUncategorizedCashflowTransaction>;
   trx: Knex.Transaction;
 }
 export interface ICashflowTransactionUncategorizedPayload {
   tenantId: number;
-  uncategorizedTransaction: IUncategorizedCashflowTransaction;
+  uncategorizedTransactionId: number;
-  oldUncategorizedTransaction: IUncategorizedCashflowTransaction;
+  uncategorizedTransactions: Array<IUncategorizedCashflowTransaction>;
+  oldUncategorizedTransactions: Array<IUncategorizedCashflowTransaction>;
   trx: Knex.Transaction;
 }
 

packages/server/src/models/UncategorizedCashflowTransaction.ts

@@ -31,7 +31,7 @@ export default class UncategorizedCashflowTransaction extends mixin(
   /**
    * Timestamps columns.
    */
-  static get timestamps() {
+  get timestamps() {
     return ['createdAt', 'updatedAt'];
   }
 

packages/server/src/services/Banking/Matching/GetMatchedTransactions.ts

@@ -1,6 +1,7 @@
 import { Inject, Service } from 'typedi';
 import * as R from 'ramda';
 import moment from 'moment';
+import { first, sumBy } from 'lodash';
 import { PromisePool } from '@supercharge/promise-pool';
 import { GetMatchedTransactionsFilter, MatchedTransactionsPOJO } from './types';
 import { GetMatchedTransactionsByExpenses } from './GetMatchedTransactionsByExpenses';
@@ -47,21 +48,24 @@ export class GetMatchedTransactions {
   /**
    * Retrieves the matched transactions.
    * @param {number} tenantId -
+   * @param {Array<number>} uncategorizedTransactionIds - Uncategorized transactions ids.
    * @param {GetMatchedTransactionsFilter} filter -
    * @returns {Promise<MatchedTransactionsPOJO>}
    */
   public async getMatchedTransactions(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionIds: Array<number>,
     filter: GetMatchedTransactionsFilter
   ): Promise<MatchedTransactionsPOJO> {
     const { UncategorizedCashflowTransaction } = this.tenancy.models(tenantId);
 
-    const uncategorizedTransaction =
+    const uncategorizedTransactions =
       await UncategorizedCashflowTransaction.query()
-        .findById(uncategorizedTransactionId)
+        .whereIn('id', uncategorizedTransactionIds)
         .throwIfNotFound();
 
+    const totalPending = Math.abs(sumBy(uncategorizedTransactions, 'amount'));
+
     const filtered = filter.transactionType
       ? this.registered.filter((item) => item.type === filter.transactionType)
       : this.registered;
@@ -71,14 +75,14 @@ export class GetMatchedTransactions {
       .process(async ({ type, service }) => {
         return service.getMatchedTransactions(tenantId, filter);
       });
-
     const { perfectMatches, possibleMatches } = this.groupMatchedResults(
-      uncategorizedTransaction,
+      uncategorizedTransactions,
       matchedTransactions
     );
     return {
       perfectMatches,
       possibleMatches,
+      totalPending,
     };
   }
 
@@ -90,20 +94,20 @@ export class GetMatchedTransactions {
    * @returns {MatchedTransactionsPOJO}
    */
   private groupMatchedResults(
-    uncategorizedTransaction,
+    uncategorizedTransactions: Array<any>,
     matchedTransactions
   ): MatchedTransactionsPOJO {
     const results = R.compose(R.flatten)(matchedTransactions?.results);
 
+    const firstUncategorized = first(uncategorizedTransactions);
+    const amount = sumBy(uncategorizedTransactions, 'amount');
+    const date = firstUncategorized.date;
+
     // Sort the results based on amount, date, and transaction type
-    const closestResullts = sortClosestMatchTransactions(
+    const closestResullts = sortClosestMatchTransactions(amount, date, results);
-      uncategorizedTransaction,
-      results
-    );
     const perfectMatches = R.filter(
       (match) =>
-        match.amount === uncategorizedTransaction.amount &&
+        match.amount === amount && moment(match.date).isSame(date, 'day'),
-        moment(match.date).isSame(uncategorizedTransaction.date, 'day'),
       closestResullts
     );
     const possibleMatches = R.difference(closestResullts, perfectMatches);

packages/server/src/services/Banking/Matching/GetMatchedTransactionsByType.ts

@@ -7,6 +7,7 @@ import {
   MatchedTransactionsPOJO,
 } from './types';
 import { Inject, Service } from 'typedi';
+import PromisePool from '@supercharge/promise-pool';
 
 export abstract class GetMatchedTransactionsByType {
   @Inject()
@@ -43,24 +44,28 @@ export abstract class GetMatchedTransactionsByType {
   }
 
   /**
-   *
+   * Creates the common matched transaction.
    * @param {number} tenantId
-   * @param {number} uncategorizedTransactionId
+   * @param {Array<number>} uncategorizedTransactionIds
    * @param {IMatchTransactionDTO} matchTransactionDTO
    * @param {Knex.Transaction} trx
    */
   public async createMatchedTransaction(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionIds: Array<number>,
     matchTransactionDTO: IMatchTransactionDTO,
     trx?: Knex.Transaction
   ) {
     const { MatchedBankTransaction } = this.tenancy.models(tenantId);
 
-    await MatchedBankTransaction.query(trx).insert({
+    await PromisePool.withConcurrency(2)
-      uncategorizedTransactionId,
+      .for(uncategorizedTransactionIds)
-      referenceType: matchTransactionDTO.referenceType,
+      .process(async (uncategorizedTransactionId) => {
-      referenceId: matchTransactionDTO.referenceId,
+        await MatchedBankTransaction.query(trx).insert({
-    });
+          uncategorizedTransactionId,
+          referenceType: matchTransactionDTO.referenceType,
+          referenceId: matchTransactionDTO.referenceId,
+        });
+      });
   }
 }

packages/server/src/services/Banking/Matching/MatchBankTransactionsApplication.ts

@@ -2,7 +2,7 @@ import { Inject, Service } from 'typedi';
 import { GetMatchedTransactions } from './GetMatchedTransactions';
 import { MatchBankTransactions } from './MatchTransactions';
 import { UnmatchMatchedBankTransaction } from './UnmatchMatchedTransaction';
-import { GetMatchedTransactionsFilter, IMatchTransactionsDTO } from './types';
+import { GetMatchedTransactionsFilter, IMatchTransactionDTO } from './types';
 
 @Service()
 export class MatchBankTransactionsApplication {
@@ -23,12 +23,12 @@ export class MatchBankTransactionsApplication {
    */
   public getMatchedTransactions(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionsIds: Array<number>,
     filter: GetMatchedTransactionsFilter
   ) {
     return this.getMatchedTransactionsService.getMatchedTransactions(
       tenantId,
-      uncategorizedTransactionId,
+      uncategorizedTransactionsIds,
       filter
     );
   }
@@ -42,13 +42,13 @@ export class MatchBankTransactionsApplication {
    */
   public matchTransaction(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionId: number | Array<number>,
-    matchTransactionsDTO: IMatchTransactionsDTO
+    matchedTransactions: Array<IMatchTransactionDTO>
   ): Promise<void> {
     return this.matchTransactionService.matchTransaction(
       tenantId,
       uncategorizedTransactionId,
-      matchTransactionsDTO
+      matchedTransactions
     );
   }
 

packages/server/src/services/Banking/Matching/MatchTransactions.ts

@@ -1,4 +1,4 @@
-import { isEmpty } from 'lodash';
+import { castArray } from 'lodash';
 import { Knex } from 'knex';
 import { Inject, Service } from 'typedi';
 import { PromisePool } from '@supercharge/promise-pool';
@@ -10,11 +10,16 @@ import {
   ERRORS,
   IBankTransactionMatchedEventPayload,
   IBankTransactionMatchingEventPayload,
-  IMatchTransactionsDTO,
+  IMatchTransactionDTO,
 } from './types';
 import { MatchTransactionsTypes } from './MatchTransactionsTypes';
 import { ServiceError } from '@/exceptions';
-import { sumMatchTranasctions } from './_utils';
+import {
+  sumMatchTranasctions,
+  sumUncategorizedTransactions,
+  validateUncategorizedTransactionsExcluded,
+  validateUncategorizedTransactionsNotMatched,
+} from './_utils';
 
 @Service()
 export class MatchBankTransactions {
@@ -39,27 +44,25 @@ export class MatchBankTransactions {
    */
   async validate(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionId: number | Array<number>,
-    matchTransactionsDTO: IMatchTransactionsDTO
+    matchedTransactions: Array<IMatchTransactionDTO>
   ) {
     const { UncategorizedCashflowTransaction } = this.tenancy.models(tenantId);
-    const { matchedTransactions } = matchTransactionsDTO;
+    const uncategorizedTransactionIds = castArray(uncategorizedTransactionId);
 
     // Validates the uncategorized transaction existance.
-    const uncategorizedTransaction =
+    const uncategorizedTransactions =
       await UncategorizedCashflowTransaction.query()
-        .findById(uncategorizedTransactionId)
+        .whereIn('id', uncategorizedTransactionIds)
         .withGraphFetched('matchedBankTransactions')
         .throwIfNotFound();
 
     // Validates the uncategorized transaction is not already matched.
-    if (!isEmpty(uncategorizedTransaction.matchedBankTransactions)) {
+    validateUncategorizedTransactionsNotMatched(uncategorizedTransactions);
-      throw new ServiceError(ERRORS.TRANSACTION_ALREADY_MATCHED);
+
-    }
     // Validate the uncategorized transaction is not excluded.
-    if (uncategorizedTransaction.excluded) {
+    validateUncategorizedTransactionsExcluded(uncategorizedTransactions);
-      throw new ServiceError(ERRORS.CANNOT_MATCH_EXCLUDED_TRANSACTION);
+
-    }
     // Validates the given matched transaction.
     const validateMatchedTransaction = async (matchedTransaction) => {
       const getMatchedTransactionsService =
@@ -94,9 +97,12 @@ export class MatchBankTransactions {
     const totalMatchedTranasctions = sumMatchTranasctions(
       validatationResult.results
     );
+    const totalUncategorizedTransactions = sumUncategorizedTransactions(
+      uncategorizedTransactions
+    );
     // Validates the total given matching transcations whether is not equal
     // uncategorized transaction amount.
-    if (totalMatchedTranasctions !== uncategorizedTransaction.amount) {
+    if (totalUncategorizedTransactions !== totalMatchedTranasctions) {
       throw new ServiceError(ERRORS.TOTAL_MATCHING_TRANSACTIONS_INVALID);
     }
   }
@@ -109,23 +115,23 @@ export class MatchBankTransactions {
    */
   public async matchTransaction(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionId: number | Array<number>,
-    matchTransactionsDTO: IMatchTransactionsDTO
+    matchedTransactions: Array<IMatchTransactionDTO>
   ): Promise<void> {
-    const { matchedTransactions } = matchTransactionsDTO;
+    const uncategorizedTransactionIds = castArray(uncategorizedTransactionId);
 
     // Validates the given matching transactions DTO.
     await this.validate(
       tenantId,
-      uncategorizedTransactionId,
+      uncategorizedTransactionIds,
-      matchTransactionsDTO
+      matchedTransactions
     );
     return this.uow.withTransaction(tenantId, async (trx: Knex.Transaction) => {
       // Triggers the event `onBankTransactionMatching`.
       await this.eventPublisher.emitAsync(events.bankMatch.onMatching, {
         tenantId,
-        uncategorizedTransactionId,
+        uncategorizedTransactionIds,
-        matchTransactionsDTO,
+        matchedTransactions,
         trx,
       } as IBankTransactionMatchingEventPayload);
 
@@ -139,17 +145,16 @@ export class MatchBankTransactions {
             );
           await getMatchedTransactionsService.createMatchedTransaction(
             tenantId,
-            uncategorizedTransactionId,
+            uncategorizedTransactionIds,
             matchedTransaction,
             trx
           );
         });
-
       // Triggers the event `onBankTransactionMatched`.
       await this.eventPublisher.emitAsync(events.bankMatch.onMatched, {
         tenantId,
-        uncategorizedTransactionId,
+        uncategorizedTransactionIds,
-        matchTransactionsDTO,
+        matchedTransactions,
         trx,
       } as IBankTransactionMatchedEventPayload);
     });

packages/server/src/services/Banking/Matching/_utils.ts

@@ -1,22 +1,23 @@
 import moment from 'moment';
 import * as R from 'ramda';
 import UncategorizedCashflowTransaction from '@/models/UncategorizedCashflowTransaction';
-import { MatchedTransactionPOJO } from './types';
+import { ERRORS, MatchedTransactionPOJO } from './types';
+import { isEmpty, sumBy } from 'lodash';
+import { ServiceError } from '@/exceptions';
 
 export const sortClosestMatchTransactions = (
-  uncategorizedTransaction: UncategorizedCashflowTransaction,
+  amount: number,
+  date: Date,
   matches: MatchedTransactionPOJO[]
 ) => {
   return R.sortWith([
     // Sort by amount difference (closest to uncategorized transaction amount first)
     R.ascend((match: MatchedTransactionPOJO) =>
-      Math.abs(match.amount - uncategorizedTransaction.amount)
+      Math.abs(match.amount - amount)
     ),
     // Sort by date difference (closest to uncategorized transaction date first)
     R.ascend((match: MatchedTransactionPOJO) =>
-      Math.abs(
+      Math.abs(moment(match.date).diff(moment(date), 'days'))
-        moment(match.date).diff(moment(uncategorizedTransaction.date), 'days')
-      )
     ),
   ])(matches);
 };
@@ -29,3 +30,36 @@ export const sumMatchTranasctions = (transactions: Array<any>) => {
     0
   );
 };
+
+export const sumUncategorizedTransactions = (
+  uncategorizedTransactions: Array<any>
+) => {
+  return sumBy(uncategorizedTransactions, 'amount');
+};
+
+export const validateUncategorizedTransactionsNotMatched = (
+  uncategorizedTransactions: any
+) => {
+  const matchedTransactions = uncategorizedTransactions.filter(
+    (trans) => !isEmpty(trans.matchedBankTransactions)
+  );
+  //
+  if (matchedTransactions.length > 0) {
+    throw new ServiceError(ERRORS.TRANSACTION_ALREADY_MATCHED, '', {
+      matchedTransactionsIds: matchedTransactions?.map((m) => m.id),
+    });
+  }
+};
+
+export const validateUncategorizedTransactionsExcluded = (
+  uncategorizedTransactions: any
+) => {
+  const excludedTransactions = uncategorizedTransactions.filter(
+    (trans) => trans.excluded
+  );
+  if (excludedTransactions.length > 0) {
+    throw new ServiceError(ERRORS.CANNOT_MATCH_EXCLUDED_TRANSACTION, '', {
+      excludedTransactionsIds: excludedTransactions.map((e) => e.id),
+    });
+  }
+};

packages/server/src/services/Banking/Matching/events/DecrementUncategorizedTransactionsOnMatch.ts

@@ -5,6 +5,7 @@ import {
   IBankTransactionUnmatchedEventPayload,
 } from '../types';
 import HasTenancyService from '@/services/Tenancy/TenancyService';
+import PromisePool from '@supercharge/promise-pool';
 
 @Service()
 export class DecrementUncategorizedTransactionOnMatching {
@@ -30,18 +31,24 @@ export class DecrementUncategorizedTransactionOnMatching {
    */
   public async decrementUnCategorizedTransactionsOnMatching({
     tenantId,
-    uncategorizedTransactionId,
+    uncategorizedTransactionIds,
     trx,
   }: IBankTransactionMatchedEventPayload) {
     const { UncategorizedCashflowTransaction, Account } =
       this.tenancy.models(tenantId);
 
-    const transaction = await UncategorizedCashflowTransaction.query().findById(
+    const uncategorizedTransactions =
-      uncategorizedTransactionId
+      await UncategorizedCashflowTransaction.query().whereIn(
-    );
+        'id',
-    await Account.query(trx)
+        uncategorizedTransactionIds
-      .findById(transaction.accountId)
+      );
-      .decrement('uncategorizedTransactions', 1);
+    await PromisePool.withConcurrency(1)
+      .for(uncategorizedTransactions)
+      .process(async (transaction) => {
+        await Account.query(trx)
+          .findById(transaction.accountId)
+          .decrement('uncategorizedTransactions', 1);
+      });
   }
 
   /**

packages/server/src/services/Banking/Matching/types.ts

@@ -2,15 +2,15 @@ import { Knex } from 'knex';
 
 export interface IBankTransactionMatchingEventPayload {
   tenantId: number;
-  uncategorizedTransactionId: number;
+  uncategorizedTransactionIds: Array<number>;
-  matchTransactionsDTO: IMatchTransactionsDTO;
+  matchedTransactions: Array<IMatchTransactionDTO>;
   trx?: Knex.Transaction;
 }
 
 export interface IBankTransactionMatchedEventPayload {
   tenantId: number;
-  uncategorizedTransactionId: number;
+  uncategorizedTransactionIds: Array<number>;
-  matchTransactionsDTO: IMatchTransactionsDTO;
+  matchedTransactions: Array<IMatchTransactionDTO>;
   trx?: Knex.Transaction;
 }
 
@@ -32,6 +32,7 @@ export interface IMatchTransactionDTO {
 }
 
 export interface IMatchTransactionsDTO {
+  uncategorizedTransactionIds: Array<number>;
   matchedTransactions: Array<IMatchTransactionDTO>;
 }
 
@@ -57,6 +58,7 @@ export interface MatchedTransactionPOJO {
 export type MatchedTransactionsPOJO = {
   perfectMatches: Array<MatchedTransactionPOJO>;
   possibleMatches: Array<MatchedTransactionPOJO>;
+  totalPending: number;
 };
 
 export const ERRORS = {

packages/server/src/services/Banking/RegonizeTranasctions/GetAutofillCategorizeTransaction.ts

@@ -0,0 +1,45 @@
+import { Inject, Service } from 'typedi';
+import { castArray, first, uniq } from 'lodash';
+import HasTenancyService from '@/services/Tenancy/TenancyService';
+import { TransformerInjectable } from '@/lib/Transformer/TransformerInjectable';
+import { GetAutofillCategorizeTransctionTransformer } from './GetAutofillCategorizeTransactionTransformer';
+
+@Service()
+export class GetAutofillCategorizeTransaction {
+  @Inject()
+  private tenancy: HasTenancyService;
+
+  @Inject()
+  private transformer: TransformerInjectable;
+
+  /**
+   * Retrieves the autofill values of categorize transactions form.
+   * @param {number} tenantId - Tenant id.
+   * @param {Array<number> | number} uncategorizeTransactionsId - Uncategorized transactions ids.
+   */
+  public async getAutofillCategorizeTransaction(
+    tenantId: number,
+    uncategorizeTransactionsId: Array<number> | number
+  ) {
+    const { UncategorizedCashflowTransaction } = this.tenancy.models(tenantId);
+    const uncategorizeTransactionsIds = uniq(
+      castArray(uncategorizeTransactionsId)
+    );
+    const uncategorizedTransactions =
+      await UncategorizedCashflowTransaction.query()
+        .whereIn('id', uncategorizeTransactionsIds)
+        .withGraphFetched('recognizedTransaction.assignAccount')
+        .withGraphFetched('recognizedTransaction.bankRule')
+        .throwIfNotFound();
+
+    return this.transformer.transform(
+      tenantId,
+      {},
+      new GetAutofillCategorizeTransctionTransformer(),
+      {
+        uncategorizedTransactions,
+        firstUncategorizedTransaction: first(uncategorizedTransactions),
+      }
+    );
+  }
+}

packages/server/src/services/Banking/RegonizeTranasctions/GetAutofillCategorizeTransactionTransformer.ts

@@ -0,0 +1,174 @@
+import { Transformer } from '@/lib/Transformer/Transformer';
+import { sumBy } from 'lodash';
+
+export class GetAutofillCategorizeTransctionTransformer extends Transformer {
+  /**
+   * Included attributes to the object.
+   * @returns {Array}
+   */
+  public includeAttributes = (): string[] => {
+    return [
+      'amount',
+      'formattedAmount',
+      'isRecognized',
+      'date',
+      'formattedDate',
+      'creditAccountId',
+      'debitAccountId',
+      'referenceNo',
+      'transactionType',
+      'recognizedByRuleId',
+      'recognizedByRuleName',
+      'isWithdrawalTransaction',
+      'isDepositTransaction',
+    ];
+  };
+
+  /**
+   * Detarmines whether the transaction is recognized.
+   * @returns {boolean}
+   */
+  public isRecognized() {
+    return !!this.options.firstUncategorizedTransaction?.recognizedTransaction;
+  }
+
+  /**
+   * Retrieves the total amount of uncategorized transactions.
+   * @returns {number}
+   */
+  public amount() {
+    return sumBy(this.options.uncategorizedTransactions, 'amount');
+  }
+
+  /**
+   * Retrieves the formatted total amount of uncategorized transactions.
+   * @returns {string}
+   */
+  public formattedAmount() {
+    return this.formatNumber(this.amount(), {
+      currencyCode: 'USD',
+      money: true,
+    });
+  }
+
+  /**
+   * Detarmines whether the transaction is deposit.
+   * @returns {boolean}
+   */
+  public isDepositTransaction() {
+    const amount = this.amount();
+
+    return amount > 0;
+  }
+
+  /**
+   * Detarmines whether the transaction is withdrawal.
+   * @returns {boolean}
+   */
+  public isWithdrawalTransaction() {
+    const amount = this.amount();
+
+    return amount < 0;
+  }
+
+  /**
+   *
+   * @param {string}
+   */
+  public date() {
+    return this.options.firstUncategorizedTransaction?.date || null;
+  }
+
+  /**
+   * Retrieves the formatted date of uncategorized transaction.
+   * @returns {string}
+   */
+  public formattedDate() {
+    return this.formatDate(this.date());
+  }
+
+  /**
+   *
+   * @param {string}
+   */
+  public referenceNo() {
+    return this.options.firstUncategorizedTransaction?.referenceNo || null;
+  }
+
+  /**
+   *
+   * @returns {number}
+   */
+  public creditAccountId() {
+    return (
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.assignedAccountId || null
+    );
+  }
+
+  /**
+   *
+   * @returns {number}
+   */
+  public debitAccountId() {
+    return this.options.firstUncategorizedTransaction?.accountId || null;
+  }
+
+  /**
+   *
+   * @returns {string}
+   */
+  public transactionType() {
+    const assignCategory =
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.assignCategory || null;
+
+    return assignCategory || this.isDepositTransaction()
+      ? 'other_income'
+      : 'other_expense';
+  }
+
+  /**
+   *
+   * @returns {string}
+   */
+  public payee() {
+    return (
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.assignedPayee || null
+    );
+  }
+
+  /**
+   *
+   * @returns {string}
+   */
+  public memo() {
+    return (
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.assignedMemo || null
+    );
+  }
+
+  /**
+   * Retrieves the rule id the transaction recongized by.
+   * @returns {string}
+   */
+  public recognizedByRuleId() {
+    return (
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.bankRuleId || null
+    );
+  }
+
+  /**
+   * Retrieves the rule name the transaction recongized by.
+   * @returns {string}
+   */
+  public recognizedByRuleName() {
+    return (
+      this.options.firstUncategorizedTransaction?.recognizedTransaction
+        ?.bankRule?.name || null
+    );
+  }
+}

packages/server/src/services/Banking/RegonizeTranasctions/RecognizeTranasctionsService.ts

@@ -1,8 +1,8 @@
 import { Knex } from 'knex';
+import { Inject, Service } from 'typedi';
 import UncategorizedCashflowTransaction from '@/models/UncategorizedCashflowTransaction';
 import HasTenancyService from '@/services/Tenancy/TenancyService';
 import { transformToMapBy } from '@/utils';
-import { Inject, Service } from 'typedi';
 import { PromisePool } from '@supercharge/promise-pool';
 import { BankRule } from '@/models/BankRule';
 import { bankRulesMatchTransaction } from './_utils';

packages/server/src/services/Cashflow/CashflowApplication.ts

@@ -164,12 +164,12 @@ export class CashflowApplication {
    */
   public categorizeTransaction(
     tenantId: number,
-    cashflowTransactionId: number,
+    uncategorizeTransactionIds: Array<number>,
     categorizeDTO: ICategorizeCashflowTransactioDTO
   ) {
     return this.categorizeTransactionService.categorize(
       tenantId,
-      cashflowTransactionId,
+      uncategorizeTransactionIds,
       categorizeDTO
     );
   }

packages/server/src/services/Cashflow/CategorizeCashflowTransaction.ts

@@ -1,4 +1,6 @@
 import { Inject, Service } from 'typedi';
+import { castArray } from 'lodash';
+import { Knex } from 'knex';
 import HasTenancyService from '../Tenancy/TenancyService';
 import events from '@/subscribers/events';
 import { EventPublisher } from '@/lib/EventPublisher/EventPublisher';
@@ -8,12 +10,12 @@ import {
   ICashflowTransactionUncategorizingPayload,
   ICategorizeCashflowTransactioDTO,
 } from '@/interfaces';
-import { Knex } from 'knex';
+import {
-import { transformCategorizeTransToCashflow } from './utils';
+  transformCategorizeTransToCashflow,
+  validateUncategorizedTransactionsNotExcluded,
+} from './utils';
 import { CommandCashflowValidator } from './CommandCasflowValidator';
 import NewCashflowTransactionService from './NewCashflowTransactionService';
-import { ServiceError } from '@/exceptions';
-import { ERRORS } from './constants';
 
 @Service()
 export class CategorizeCashflowTransaction {
@@ -39,27 +41,29 @@ export class CategorizeCashflowTransaction {
    */
   public async categorize(
     tenantId: number,
-    uncategorizedTransactionId: number,
+    uncategorizedTransactionId: number | Array<number>,
     categorizeDTO: ICategorizeCashflowTransactioDTO
   ) {
     const { UncategorizedCashflowTransaction } = this.tenancy.models(tenantId);
+    const uncategorizedTransactionIds = castArray(uncategorizedTransactionId);
 
     // Retrieves the uncategorized transaction or throw an error.
-    const transaction = await UncategorizedCashflowTransaction.query()
+    const oldUncategorizedTransactions =
-      .findById(uncategorizedTransactionId)
+      await UncategorizedCashflowTransaction.query()
-      .throwIfNotFound();
+        .whereIn('id', uncategorizedTransactionIds)
+        .throwIfNotFound();
 
     // Validate cannot categorize excluded transaction.
-    if (transaction.excluded) {
+    validateUncategorizedTransactionsNotExcluded(oldUncategorizedTransactions);
-      throw new ServiceError(ERRORS.CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION);
-    }
-    // Validates the transaction shouldn't be categorized before.
-    this.commandValidators.validateTransactionShouldNotCategorized(transaction);
 
+    // Validates the transaction shouldn't be categorized before.
+    this.commandValidators.validateTransactionsShouldNotCategorized(
+      oldUncategorizedTransactions
+    );
     // Validate the uncateogirzed transaction if it's deposit the transaction direction
     // should `IN` and the same thing if it's withdrawal the direction should be OUT.
     this.commandValidators.validateUncategorizeTransactionType(
-      transaction,
+      oldUncategorizedTransactions,
       categorizeDTO.transactionType
     );
     // Edits the cashflow transaction under UOW env.
@@ -69,12 +73,13 @@ export class CategorizeCashflowTransaction {
         events.cashflow.onTransactionCategorizing,
         {
           tenantId,
+          oldUncategorizedTransactions,
           trx,
         } as ICashflowTransactionUncategorizingPayload
       );
       // Transformes the categorize DTO to the cashflow transaction.
       const cashflowTransactionDTO = transformCategorizeTransToCashflow(
-        transaction,
+        oldUncategorizedTransactions,
         categorizeDTO
       );
       // Creates a new cashflow transaction.
@@ -83,15 +88,20 @@ export class CategorizeCashflowTransaction {
           tenantId,
           cashflowTransactionDTO
         );
+
       // Updates the uncategorized transaction as categorized.
-      const uncategorizedTransaction =
+      await UncategorizedCashflowTransaction.query(trx)
-        await UncategorizedCashflowTransaction.query(trx).patchAndFetchById(
+        .whereIn('id', uncategorizedTransactionIds)
-          uncategorizedTransactionId,
+        .patch({
-          {
+          categorized: true,
-            categorized: true,
+          categorizeRefType: 'CashflowTransaction',
-            categorizeRefType: 'CashflowTransaction',
+          categorizeRefId: cashflowTransaction.id,
-            categorizeRefId: cashflowTransaction.id,
+        });
-          }
+      // Fetch the new updated uncategorized transactions.
+      const uncategorizedTransactions =
+        await UncategorizedCashflowTransaction.query(trx).whereIn(
+          'id',
+          uncategorizedTransactionIds
         );
       // Triggers `onCashflowTransactionCategorized` event.
       await this.eventPublisher.emitAsync(
@@ -99,7 +109,8 @@ export class CategorizeCashflowTransaction {
         {
           tenantId,
           cashflowTransaction,
-          uncategorizedTransaction,
+          uncategorizedTransactions,
+          oldUncategorizedTransactions,
           categorizeDTO,
           trx,
         } as ICashflowTransactionCategorizedPayload

packages/server/src/services/Cashflow/CommandCasflowValidator.ts

@@ -1,5 +1,5 @@
 import { Service } from 'typedi';
-import { includes, camelCase, upperFirst } from 'lodash';
+import { includes, camelCase, upperFirst, sumBy } from 'lodash';
 import { IAccount, IUncategorizedCashflowTransaction } from '@/interfaces';
 import { getCashflowTransactionType } from './utils';
 import { ServiceError } from '@/exceptions';
@@ -68,11 +68,15 @@ export class CommandCashflowValidator {
    * Validate the given transcation shouldn't be categorized.
    * @param {CashflowTransaction} cashflowTransaction
    */
-  public validateTransactionShouldNotCategorized(
+  public validateTransactionsShouldNotCategorized(
-    cashflowTransaction: CashflowTransaction
+    cashflowTransactions: Array<IUncategorizedCashflowTransaction>
   ) {
-    if (cashflowTransaction.uncategorize) {
+    const categorized = cashflowTransactions.filter((t) => t.categorized);
-      throw new ServiceError(ERRORS.TRANSACTION_ALREADY_CATEGORIZED);
+
+    if (categorized?.length > 0) {
+      throw new ServiceError(ERRORS.TRANSACTION_ALREADY_CATEGORIZED, '', {
+        ids: categorized.map((t) => t.id),
+      });
     }
   }
 
@@ -83,17 +87,19 @@ export class CommandCashflowValidator {
    * @throws {ServiceError(ERRORS.UNCATEGORIZED_TRANSACTION_TYPE_INVALID)}
    */
   public validateUncategorizeTransactionType(
-    uncategorizeTransaction: IUncategorizedCashflowTransaction,
+    uncategorizeTransactions: Array<IUncategorizedCashflowTransaction>,
     transactionType: string
   ) {
+    const amount = sumBy(uncategorizeTransactions, 'amount');
+    const isDepositTransaction = amount > 0;
+    const isWithdrawalTransaction = amount <= 0;
+
     const type = getCashflowTransactionType(
-      upperFirst(camelCase(transactionType)) as CASHFLOW_TRANSACTION_TYPE
+      transactionType as CASHFLOW_TRANSACTION_TYPE
     );
     if (
-      (type.direction === CASHFLOW_DIRECTION.IN &&
+      (type.direction === CASHFLOW_DIRECTION.IN && isDepositTransaction) ||
-        uncategorizeTransaction.isDepositTransaction) ||
+      (type.direction === CASHFLOW_DIRECTION.OUT && isWithdrawalTransaction)
-      (type.direction === CASHFLOW_DIRECTION.OUT &&
-        uncategorizeTransaction.isWithdrawalTransaction)
     ) {
       return;
     }

packages/server/src/services/Cashflow/UncategorizeCashflowTransaction.ts

@@ -8,6 +8,7 @@ import {
   ICashflowTransactionUncategorizedPayload,
   ICashflowTransactionUncategorizingPayload,
 } from '@/interfaces';
+import { validateTransactionShouldBeCategorized } from './utils';
 
 @Service()
 export class UncategorizeCashflowTransaction {
@@ -24,11 +25,12 @@ export class UncategorizeCashflowTransaction {
    * Uncategorizes the given cashflow transaction.
    * @param {number} tenantId
    * @param {number} cashflowTransactionId
+   * @returns {Promise<Array<number>>}
    */
   public async uncategorize(
     tenantId: number,
     uncategorizedTransactionId: number
-  ) {
+  ): Promise<Array<number>> {
     const { UncategorizedCashflowTransaction } = this.tenancy.models(tenantId);
 
     const oldUncategorizedTransaction =
@@ -36,6 +38,22 @@ export class UncategorizeCashflowTransaction {
         .findById(uncategorizedTransactionId)
         .throwIfNotFound();
 
+    validateTransactionShouldBeCategorized(oldUncategorizedTransaction);
+
+    const associatedUncategorizedTransactions =
+      await UncategorizedCashflowTransaction.query()
+        .where('categorizeRefId', oldUncategorizedTransaction.categorizeRefId)
+        .where(
+          'categorizeRefType',
+          oldUncategorizedTransaction.categorizeRefType
+        );
+    const oldUncategorizedTransactions = [
+      oldUncategorizedTransaction,
+      ...associatedUncategorizedTransactions,
+    ];
+    const oldUncategoirzedTransactionsIds = oldUncategorizedTransactions.map(
+      (t) => t.id
+    );
     // Updates the transaction under UOW.
     return this.uow.withTransaction(tenantId, async (trx: Knex.Transaction) => {
       // Triggers `onTransactionUncategorizing` event.
@@ -43,30 +61,36 @@ export class UncategorizeCashflowTransaction {
         events.cashflow.onTransactionUncategorizing,
         {
           tenantId,
+          uncategorizedTransactionId,
+          oldUncategorizedTransactions,
           trx,
         } as ICashflowTransactionUncategorizingPayload
       );
       // Removes the ref relation with the related transaction.
-      const uncategorizedTransaction =
+      await UncategorizedCashflowTransaction.query(trx)
-        await UncategorizedCashflowTransaction.query(trx).updateAndFetchById(
+        .whereIn('id', oldUncategoirzedTransactionsIds)
-          uncategorizedTransactionId,
+        .patch({
-          {
+          categorized: false,
-            categorized: false,
+          categorizeRefId: null,
-            categorizeRefId: null,
+          categorizeRefType: null,
-            categorizeRefType: null,
+        });
-          }
+      const uncategorizedTransactions =
+        await UncategorizedCashflowTransaction.query(trx).whereIn(
+          'id',
+          oldUncategoirzedTransactionsIds
         );
       // Triggers `onTransactionUncategorized` event.
       await this.eventPublisher.emitAsync(
         events.cashflow.onTransactionUncategorized,
         {
           tenantId,
-          uncategorizedTransaction,
+          uncategorizedTransactionId,
-          oldUncategorizedTransaction,
+          uncategorizedTransactions,
+          oldUncategorizedTransactions,
           trx,
         } as ICashflowTransactionUncategorizedPayload
       );
-      return uncategorizedTransaction;
+      return oldUncategoirzedTransactionsIds;
     });
   }
 }

packages/server/src/services/Cashflow/constants.ts

@@ -16,7 +16,9 @@ export const ERRORS = {
   CANNOT_DELETE_TRANSACTION_CONVERTED_FROM_UNCATEGORIZED:
     'CANNOT_DELETE_TRANSACTION_CONVERTED_FROM_UNCATEGORIZED',
 
-  CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION: 'CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION'
+  CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION: 'CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION',
+  TRANSACTION_NOT_CATEGORIZED: 'TRANSACTION_NOT_CATEGORIZED'
+
 };
 
 export enum CASHFLOW_DIRECTION {

packages/server/src/services/Cashflow/subscribers/DecrementUncategorizedTransactionOnCategorize.ts

@@ -5,6 +5,7 @@ import {
   ICashflowTransactionCategorizedPayload,
   ICashflowTransactionUncategorizedPayload,
 } from '@/interfaces';
+import PromisePool from '@supercharge/promise-pool';
 
 @Service()
 export class DecrementUncategorizedTransactionOnCategorize {
@@ -34,13 +35,18 @@ export class DecrementUncategorizedTransactionOnCategorize {
    */
   public async decrementUnCategorizedTransactionsOnCategorized({
     tenantId,
-    uncategorizedTransaction,
+    uncategorizedTransactions,
+    trx
   }: ICashflowTransactionCategorizedPayload) {
     const { Account } = this.tenancy.models(tenantId);
 
-    await Account.query()
+    await PromisePool.withConcurrency(1)
-      .findById(uncategorizedTransaction.accountId)
+      .for(uncategorizedTransactions)
-      .decrement('uncategorizedTransactions', 1);
+      .process(async (uncategorizedTransaction) => {
+        await Account.query(trx)
+          .findById(uncategorizedTransaction.accountId)
+          .decrement('uncategorizedTransactions', 1);
+      });
   }
 
   /**
@@ -49,13 +55,18 @@ export class DecrementUncategorizedTransactionOnCategorize {
    */
   public async incrementUnCategorizedTransactionsOnUncategorized({
     tenantId,
-    uncategorizedTransaction,
+    uncategorizedTransactions,
+    trx
   }: ICashflowTransactionUncategorizedPayload) {
     const { Account } = this.tenancy.models(tenantId);
 
-    await Account.query()
+    await PromisePool.withConcurrency(1)
-      .findById(uncategorizedTransaction.accountId)
+      .for(uncategorizedTransactions)
-      .increment('uncategorizedTransactions', 1);
+      .process(async (uncategorizedTransaction) => {
+        await Account.query(trx)
+          .findById(uncategorizedTransaction.accountId)
+          .increment('uncategorizedTransactions', 1);
+      });
   }
 
   /**

packages/server/src/services/Cashflow/subscribers/DeleteCashflowTransactionOnUncategorize.ts

@@ -1,8 +1,10 @@
 import { Inject, Service } from 'typedi';
+import { PromisePool } from '@supercharge/promise-pool';
 import events from '@/subscribers/events';
 import { ICashflowTransactionUncategorizedPayload } from '@/interfaces';
 import { DeleteCashflowTransaction } from '../DeleteCashflowTransactionService';
 import HasTenancyService from '@/services/Tenancy/TenancyService';
+import { ServiceError } from '@/exceptions';
 
 @Service()
 export class DeleteCashflowTransactionOnUncategorize {
@@ -25,18 +27,27 @@ export class DeleteCashflowTransactionOnUncategorize {
    */
   public async deleteCashflowTransactionOnUncategorize({
     tenantId,
-    oldUncategorizedTransaction,
+    oldUncategorizedTransactions,
     trx,
   }: ICashflowTransactionUncategorizedPayload) {
-    // Deletes the cashflow transaction.
+    const _oldUncategorizedTransactions = oldUncategorizedTransactions.filter(
-    if (
+      (transaction) => transaction.categorizeRefType === 'CashflowTransaction'
-      oldUncategorizedTransaction.categorizeRefType === 'CashflowTransaction'
+    );
-    ) {
-      await this.deleteCashflowTransactionService.deleteCashflowTransaction(
-        tenantId,
 
-        oldUncategorizedTransaction.categorizeRefId
+    // Deletes the cashflow transaction.
-      );
+    if (_oldUncategorizedTransactions.length > 0) {
+      const result = await PromisePool.withConcurrency(1)
+        .for(_oldUncategorizedTransactions)
+        .process(async (oldUncategorizedTransaction) => {
+          await this.deleteCashflowTransactionService.deleteCashflowTransaction(
+            tenantId,
+            oldUncategorizedTransaction.categorizeRefId,
+            trx
+          );
+        });
+      if (result.errors.length > 0) {
+        throw new ServiceError('SOMETHING_WRONG');
+      }
     }
   }
 }

packages/server/src/services/Cashflow/utils.ts

@@ -1,7 +1,8 @@
-import { upperFirst, camelCase } from 'lodash';
+import { upperFirst, camelCase, first, sum, sumBy } from 'lodash';
 import {
   CASHFLOW_TRANSACTION_TYPE,
   CASHFLOW_TRANSACTION_TYPE_META,
+  ERRORS,
   ICashflowTransactionTypeMeta,
 } from './constants';
 import {
@@ -9,6 +10,8 @@ import {
   ICategorizeCashflowTransactioDTO,
   IUncategorizedCashflowTransaction,
 } from '@/interfaces';
+import { UncategorizeCashflowTransaction } from './UncategorizeCashflowTransaction';
+import { ServiceError } from '@/exceptions';
 
 /**
  * Ensures the given transaction type to transformed to appropriate format.
@@ -27,7 +30,9 @@ export const transformCashflowTransactionType = (type) => {
 export function getCashflowTransactionType(
   transactionType: CASHFLOW_TRANSACTION_TYPE
 ): ICashflowTransactionTypeMeta {
-  return CASHFLOW_TRANSACTION_TYPE_META[transactionType];
+  const _transactionType = transformCashflowTransactionType(transactionType);
+
+  return CASHFLOW_TRANSACTION_TYPE_META[_transactionType];
 }
 
 /**
@@ -46,22 +51,46 @@ export const getCashflowAccountTransactionsTypes = () => {
  * @returns {ICashflowNewCommandDTO}
  */
 export const transformCategorizeTransToCashflow = (
-  uncategorizeModel: IUncategorizedCashflowTransaction,
+  uncategorizeTransactions: Array<IUncategorizedCashflowTransaction>,
   categorizeDTO: ICategorizeCashflowTransactioDTO
 ): ICashflowNewCommandDTO => {
+  const uncategorizeTransaction = first(uncategorizeTransactions);
+  const amount = sumBy(uncategorizeTransactions, 'amount');
+  const amountAbs = Math.abs(amount);
+
   return {
-    date: uncategorizeModel.date,
+    date: categorizeDTO.date,
-    referenceNo: categorizeDTO.referenceNo || uncategorizeModel.referenceNo,
+    referenceNo: categorizeDTO.referenceNo,
-    description: categorizeDTO.description || uncategorizeModel.description,
+    description: categorizeDTO.description,
-    cashflowAccountId: uncategorizeModel.accountId,
+    cashflowAccountId: uncategorizeTransaction.accountId,
     creditAccountId: categorizeDTO.creditAccountId,
     exchangeRate: categorizeDTO.exchangeRate || 1,
-    currencyCode: uncategorizeModel.currencyCode,
+    currencyCode: categorizeDTO.currencyCode,
-    amount: uncategorizeModel.amount,
+    amount: amountAbs,
     transactionNumber: categorizeDTO.transactionNumber,
     transactionType: categorizeDTO.transactionType,
-    uncategorizedTransactionId: uncategorizeModel.id,
     branchId: categorizeDTO?.branchId,
     publish: true,
   };
 };
+
+export const validateUncategorizedTransactionsNotExcluded = (
+  transactions: Array<UncategorizeCashflowTransaction>
+) => {
+  const excluded = transactions.filter((tran) => tran.excluded);
+
+  if (excluded?.length > 0) {
+    throw new ServiceError(ERRORS.CANNOT_CATEGORIZE_EXCLUDED_TRANSACTION, '', {
+      ids: excluded.map((t) => t.id),
+    });
+  }
+};
+
+
+export const validateTransactionShouldBeCategorized = (
+  uncategorizedTransaction: any
+) => {
+  if (!uncategorizedTransaction.categorized) {
+    throw new ServiceError(ERRORS.TRANSACTION_NOT_CATEGORIZED);
+  }
+};

packages/webapp/src/containers/CashFlow/AccountTransactions/AccountTransactionsActionsBar.tsx

@@ -12,6 +12,7 @@ import {
   PopoverInteractionKind,
   Position,
   Intent,
+  Switch,
   Tooltip,
   MenuDivider,
 } from '@blueprintjs/core';
@@ -44,6 +45,7 @@ import {
   useExcludeUncategorizedTransactions,
   useUnexcludeUncategorizedTransactions,
 } from '@/hooks/query/bank-rules';
+import { withBankingActions } from '../withBankingActions';
 import { withBanking } from '../withBanking';
 import withAlertActions from '@/containers/Alert/withAlertActions';
 import { DialogsName } from '@/constants/dialogs';
@@ -61,6 +63,10 @@ function AccountTransactionsActionsBar({
   // #withBanking
   uncategorizedTransationsIdsSelected,
   excludedTransactionsIdsSelected,
+  openMatchingTransactionAside,
+
+  // #withBankingActions
+  enableMultipleCategorization,
 
   // #withAlerts
   openAlert,
@@ -185,6 +191,10 @@ function AccountTransactionsActionsBar({
       });
   };
 
+  // Handle multi select transactions for categorization or matching.
+  const handleMultipleCategorizingSwitch = (event) => {
+    enableMultipleCategorization(event.currentTarget.checked);
+  }
   // Handle resume bank feeds syncing.
   const handleResumeFeedsSyncing = () => {
     openAlert('resume-feeds-syncing-bank-accounnt', {
@@ -290,6 +300,22 @@ function AccountTransactionsActionsBar({
       </NavbarGroup>
 
       <NavbarGroup align={Alignment.RIGHT}>
+        {openMatchingTransactionAside && (
+          <Tooltip
+            content={
+              'Enables to categorize or matching multiple bank transactions into one transaction.'
+            }
+            position={Position.BOTTOM}
+            minimal
+          >
+            <Switch
+              label={'Multi Select'}
+              inline
+              onChange={handleMultipleCategorizingSwitch}
+            />
+          </Tooltip>
+        )}
+        <NavbarDivider />
         <Popover
           minimal={true}
           interactionKind={PopoverInteractionKind.CLICK}
@@ -352,9 +378,12 @@ export default compose(
     ({
       uncategorizedTransationsIdsSelected,
       excludedTransactionsIdsSelected,
+      openMatchingTransactionAside,
     }) => ({
       uncategorizedTransationsIdsSelected,
       excludedTransactionsIdsSelected,
+      openMatchingTransactionAside,
     }),
   ),
+  withBankingActions,
 )(AccountTransactionsActionsBar);

packages/webapp/src/containers/CashFlow/AccountTransactions/UncategorizedTransactions/AccountTransactionsUncategorizedTable.module.scss

@@ -0,0 +1,15 @@
+
+
+.table :global .td.categorize_include,
+.table :global .th.categorize_include {
+  display: none;  
+}
+
+.table.showCategorizeColumn :global .td.categorize_include,
+.table.showCategorizeColumn :global .th.categorize_include {
+  display: flex;
+}
+
+.categorizeCheckbox:global(.bp4-checkbox) :global .bp4-control-indicator {
+  border-radius: 20px;
+}

packages/webapp/src/containers/CashFlow/AccountTransactions/UncategorizedTransactions/AccountTransactionsUncategorizedTable.tsx

@@ -1,5 +1,6 @@
 // @ts-nocheck
 import React from 'react';
+import clsx from 'classnames';
 import styled from 'styled-components';
 import { Intent } from '@blueprintjs/core';
 import {
@@ -12,17 +13,19 @@ import {
   AppToaster,
 } from '@/components';
 import { TABLES } from '@/constants/tables';
-import { ActionsMenu } from './UncategorizedTransactions/components';
+import { ActionsMenu } from './components';
 
 import withSettings from '@/containers/Settings/withSettings';
-import { withBankingActions } from '../withBankingActions';
+import { withBankingActions } from '../../withBankingActions';
 
 import { useMemorizedColumnsWidths } from '@/hooks';
-import { useAccountUncategorizedTransactionsColumns } from './components';
+import { useAccountUncategorizedTransactionsContext } from '../AllTransactionsUncategorizedBoot';
-import { useAccountUncategorizedTransactionsContext } from './AllTransactionsUncategorizedBoot';
 import { useExcludeUncategorizedTransaction } from '@/hooks/query/bank-rules';
+import { useAccountUncategorizedTransactionsColumns } from './hooks';
 
 import { compose } from '@/utils';
+import { withBanking } from '../../withBanking';
+import styles from './AccountTransactionsUncategorizedTable.module.scss';
 
 /**
  * Account transactions data table.
@@ -31,9 +34,16 @@ function AccountTransactionsDataTable({
   // #withSettings
   cashflowTansactionsTableSize,
 
+  // #withBanking
+  openMatchingTransactionAside,
+  enableMultipleCategorization,
+
   // #withBankingActions
   setUncategorizedTransactionIdForMatching,
   setUncategorizedTransactionsSelected,
+
+  addTransactionsToCategorizeSelected,
+  setTransactionsToCategorizeSelected,
 }) {
   // Retrieve table columns.
   const columns = useAccountUncategorizedTransactionsColumns();
@@ -51,7 +61,11 @@ function AccountTransactionsDataTable({
 
   // Handle cell click.
   const handleCellClick = (cell) => {
-    setUncategorizedTransactionIdForMatching(cell.row.original.id);
+    if (enableMultipleCategorization) {
+      addTransactionsToCategorizeSelected(cell.row.original.id);
+    } else {
+      setTransactionsToCategorizeSelected(cell.row.original.id);
+    }
   };
   // Handles categorize button click.
   const handleCategorizeBtnClick = (transaction) => {
@@ -66,7 +80,7 @@ function AccountTransactionsDataTable({
           message: 'The bank transaction has been excluded successfully.',
         });
       })
-      .catch((error) => {
+      .catch(() => {
         AppToaster.show({
           intent: Intent.DANGER,
           message: 'Something went wrong.',
@@ -74,12 +88,6 @@ function AccountTransactionsDataTable({
       });
   };
 
-  // Handle selected rows change.
-  const handleSelectedRowsChange = (selected) => {
-    const _selectedIds = selected?.map((row) => row.original.id);
-    setUncategorizedTransactionsSelected(_selectedIds);
-  };
-
   return (
     <CashflowTransactionsTable
       noInitialFetch={true}
@@ -106,12 +114,13 @@ function AccountTransactionsDataTable({
       noResults={
         'There is no uncategorized transactions in the current account.'
       }
-      className="table-constrant"
-      onSelectedRowsChange={handleSelectedRowsChange}
       payload={{
         onExclude: handleExcludeTransaction,
         onCategorize: handleCategorizeBtnClick,
       }}
+      className={clsx('table-constrant', styles.table, {
+        [styles.showCategorizeColumn]: enableMultipleCategorization,
+      })}
     />
   );
 }
@@ -121,6 +130,12 @@ export default compose(
     cashflowTansactionsTableSize: cashflowTransactionsSettings?.tableSize,
   })),
   withBankingActions,
+  withBanking(
+    ({ openMatchingTransactionAside, enableMultipleCategorization }) => ({
+      openMatchingTransactionAside,
+      enableMultipleCategorization,
+    }),
+  ),
 )(AccountTransactionsDataTable);
 
 const DashboardConstrantTable = styled(DataTable)`

packages/webapp/src/containers/CashFlow/AccountTransactions/UncategorizedTransactions/AccountUncategorizedTransactionsAll.tsx

@@ -1,6 +1,6 @@
 import * as R from 'ramda';
 import { useEffect } from 'react';
-import AccountTransactionsUncategorizedTable from '../AccountTransactionsUncategorizedTable';
+import AccountTransactionsUncategorizedTable from './AccountTransactionsUncategorizedTable';
 import { AccountUncategorizedTransactionsBoot } from '../AllTransactionsUncategorizedBoot';
 import { AccountTransactionsCard } from './AccountTransactionsCard';
 import {

packages/webapp/src/containers/CashFlow/AccountTransactions/UncategorizedTransactions/hooks.tsx

@@ -0,0 +1,157 @@
+// @ts-nocheck
+import React from 'react';
+import intl from 'react-intl-universal';
+import {
+  Checkbox,
+  Intent,
+  PopoverInteractionKind,
+  Position,
+  Tag,
+  Tooltip,
+} from '@blueprintjs/core';
+import {
+  useAddTransactionsToCategorizeSelected,
+  useIsTransactionToCategorizeSelected,
+  useRemoveTransactionsToCategorizeSelected,
+} from '@/hooks/state/banking';
+import { Box, Icon } from '@/components';
+import styles from './AccountTransactionsUncategorizedTable.module.scss';
+
+function statusAccessor(transaction) {
+  return transaction.is_recognized ? (
+    <Tooltip
+      interactionKind={PopoverInteractionKind.HOVER}
+      position={Position.RIGHT}
+      content={
+        <Box>
+          <span>{transaction.assigned_category_formatted}</span>
+          <Icon
+            icon={'arrowRight'}
+            color={'#8F99A8'}
+            iconSize={12}
+            style={{ marginLeft: 8, marginRight: 8 }}
+          />
+          <span>{transaction.assigned_account_name}</span>
+        </Box>
+      }
+    >
+      <Box>
+        <Tag intent={Intent.SUCCESS} interactive>
+          Recognized
+        </Tag>
+      </Box>
+    </Tooltip>
+  ) : null;
+}
+
+interface TransactionSelectCheckboxProps {
+  transactionId: number;
+}
+
+function TransactionSelectCheckbox({
+  transactionId,
+}: TransactionSelectCheckboxProps) {
+  const addTransactionsToCategorizeSelected =
+    useAddTransactionsToCategorizeSelected();
+
+  const removeTransactionsToCategorizeSelected =
+    useRemoveTransactionsToCategorizeSelected();
+
+  const isTransactionSelected =
+    useIsTransactionToCategorizeSelected(transactionId);
+
+  const handleChange = (event) => {
+    isTransactionSelected
+      ? removeTransactionsToCategorizeSelected(transactionId)
+      : addTransactionsToCategorizeSelected(transactionId);
+  };
+
+  return (
+    <Checkbox
+      large
+      checked={isTransactionSelected}
+      onChange={handleChange}
+      className={styles.categorizeCheckbox}
+    />
+  );
+}
+
+/**
+ * Retrieve account uncategorized transctions table columns.
+ */
+export function useAccountUncategorizedTransactionsColumns() {
+  return React.useMemo(
+    () => [
+      {
+        id: 'date',
+        Header: intl.get('date'),
+        accessor: 'formatted_date',
+        width: 40,
+        clickable: true,
+        textOverview: true,
+      },
+      {
+        id: 'description',
+        Header: 'Description',
+        accessor: 'description',
+        width: 160,
+        textOverview: true,
+        clickable: true,
+      },
+      {
+        id: 'payee',
+        Header: 'Payee',
+        accessor: 'payee',
+        width: 60,
+        clickable: true,
+        textOverview: true,
+      },
+      {
+        id: 'reference_number',
+        Header: 'Ref.#',
+        accessor: 'reference_no',
+        width: 50,
+        clickable: true,
+        textOverview: true,
+      },
+      {
+        id: 'status',
+        Header: 'Status',
+        accessor: statusAccessor,
+      },
+      {
+        id: 'deposit',
+        Header: intl.get('cash_flow.label.deposit'),
+        accessor: 'formatted_deposit_amount',
+        width: 40,
+        className: 'deposit',
+        textOverview: true,
+        align: 'right',
+        clickable: true,
+      },
+      {
+        id: 'withdrawal',
+        Header: intl.get('cash_flow.label.withdrawal'),
+        accessor: 'formatted_withdrawal_amount',
+        className: 'withdrawal',
+        width: 40,
+        textOverview: true,
+        align: 'right',
+        clickable: true,
+      },
+      {
+        id: 'categorize_include',
+        Header: '',
+        accessor: (value) => (
+          <TransactionSelectCheckbox transactionId={value.id} />
+        ),
+        width: 20,
+        minWidth: 20,
+        maxWidth: 20,
+        align: 'right',
+        className: 'categorize_include selection-checkbox',
+      },
+    ],
+    [],
+  );
+}

packages/webapp/src/containers/CashFlow/AccountTransactions/components.tsx

@@ -150,99 +150,3 @@ export function AccountTransactionsProgressBar() {
     <MaterialProgressBar />
   ) : null;
 }
-
-function statusAccessor(transaction) {
-  return transaction.is_recognized ? (
-    <Tooltip
-      compact
-      interactionKind={PopoverInteractionKind.HOVER}
-      position={Position.RIGHT}
-      content={
-        <Box>
-          <span>{transaction.assigned_category_formatted}</span>
-          <Icon
-            icon={'arrowRight'}
-            color={'#8F99A8'}
-            iconSize={12}
-            style={{ marginLeft: 8, marginRight: 8 }}
-          />
-          <span>{transaction.assigned_account_name}</span>
-        </Box>
-      }
-    >
-      <Box>
-        <Tag intent={Intent.SUCCESS} interactive>
-          Recognized
-        </Tag>
-      </Box>
-    </Tooltip>
-  ) : null;
-}
-
-/**
- * Retrieve account uncategorized transctions table columns.
- */
-export function useAccountUncategorizedTransactionsColumns() {
-  return React.useMemo(
-    () => [
-      {
-        id: 'date',
-        Header: intl.get('date'),
-        accessor: 'formatted_date',
-        width: 40,
-        clickable: true,
-        textOverview: true,
-      },
-      {
-        id: 'description',
-        Header: 'Description',
-        accessor: 'description',
-        width: 160,
-        textOverview: true,
-        clickable: true,
-      },
-      {
-        id: 'payee',
-        Header: 'Payee',
-        accessor: 'payee',
-        width: 60,
-        clickable: true,
-        textOverview: true,
-      },
-      {
-        id: 'reference_number',
-        Header: 'Ref.#',
-        accessor: 'reference_no',
-        width: 50,
-        clickable: true,
-        textOverview: true,
-      },
-      {
-        id: 'status',
-        Header: 'Status',
-        accessor: statusAccessor,
-      },
-      {
-        id: 'deposit',
-        Header: intl.get('cash_flow.label.deposit'),
-        accessor: 'formatted_deposit_amount',
-        width: 40,
-        className: 'deposit',
-        textOverview: true,
-        align: 'right',
-        clickable: true,
-      },
-      {
-        id: 'withdrawal',
-        Header: intl.get('cash_flow.label.withdrawal'),
-        accessor: 'formatted_withdrawal_amount',
-        className: 'withdrawal',
-        width: 40,
-        textOverview: true,
-        align: 'right',
-        clickable: true,
-      },
-    ],
-    [],
-  );
-}

packages/webapp/src/containers/CashFlow/CategorizeTransaction/drawers/CategorizeTransactionDrawer/CategorizeTransactionBoot.tsx

@@ -6,10 +6,13 @@ import { useAccounts, useBranches } from '@/hooks/query';
 import { useFeatureCan } from '@/hooks/state';
 import { Features } from '@/constants';
 import { Spinner } from '@blueprintjs/core';
-import { useGetRecognizedBankTransaction } from '@/hooks/query/bank-rules';
+import {
-import { useCategorizeTransactionTabsBoot } from '@/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabsBoot';
+  GetAutofillCategorizeTransaction,
+  useGetAutofillCategorizeTransaction,
+} from '@/hooks/query/bank-rules';
 
 interface CategorizeTransactionBootProps {
+  uncategorizedTransactionsIds: Array<number>;
   children: React.ReactNode;
 }
 
@@ -19,8 +22,8 @@ interface CategorizeTransactionBootValue {
   isBranchesLoading: boolean;
   isAccountsLoading: boolean;
   primaryBranch: any;
-  recognizedTranasction: any;
+  autofillCategorizeValues: null | GetAutofillCategorizeTransaction;
-  isRecognizedTransactionLoading: boolean;
+  isAutofillCategorizeValuesLoading: boolean;
 }
 
 const CategorizeTransactionBootContext =
@@ -32,11 +35,9 @@ const CategorizeTransactionBootContext =
  * Categorize transcation boot.
  */
 function CategorizeTransactionBoot({
+  uncategorizedTransactionsIds,
   ...props
 }: CategorizeTransactionBootProps) {
-  const { uncategorizedTransaction, uncategorizedTransactionId } =
-    useCategorizeTransactionTabsBoot();
-
   // Detarmines whether the feature is enabled.
   const { featureCan } = useFeatureCan();
   const isBranchFeatureCan = featureCan(Features.Branches);
@@ -49,13 +50,11 @@ function CategorizeTransactionBoot({
     {},
     { enabled: isBranchFeatureCan },
   );
-  // Fetches the recognized transaction.
+  // Fetches the autofill values of categorize transaction.
   const {
-    data: recognizedTranasction,
+    data: autofillCategorizeValues,
-    isLoading: isRecognizedTransactionLoading,
+    isLoading: isAutofillCategorizeValuesLoading,
-  } = useGetRecognizedBankTransaction(uncategorizedTransactionId, {
+  } = useGetAutofillCategorizeTransaction(uncategorizedTransactionsIds, {});
-    enabled: !!uncategorizedTransaction.is_recognized,
-  });
 
   // Retrieves the primary branch.
   const primaryBranch = useMemo(
@@ -69,11 +68,11 @@ function CategorizeTransactionBoot({
     isBranchesLoading,
     isAccountsLoading,
     primaryBranch,
-    recognizedTranasction,
+    autofillCategorizeValues,
-    isRecognizedTransactionLoading,
+    isAutofillCategorizeValuesLoading,
   };
   const isLoading =
-    isBranchesLoading || isAccountsLoading || isRecognizedTransactionLoading;
+    isBranchesLoading || isAccountsLoading || isAutofillCategorizeValuesLoading;
 
   if (isLoading) {
     <Spinner size={30} />;

packages/webapp/src/containers/CashFlow/CategorizeTransaction/drawers/CategorizeTransactionDrawer/CategorizeTransactionContent.tsx

@@ -1,15 +1,16 @@
 // @ts-nocheck
 import styled from 'styled-components';
+import * as R from 'ramda';
 import { CategorizeTransactionBoot } from './CategorizeTransactionBoot';
 import { CategorizeTransactionForm } from './CategorizeTransactionForm';
-import { useCategorizeTransactionTabsBoot } from '@/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabsBoot';
+import { withBanking } from '@/containers/CashFlow/withBanking';
-
-export function CategorizeTransactionContent() {
-  const { uncategorizedTransactionId } = useCategorizeTransactionTabsBoot();
 
+function CategorizeTransactionContentRoot({
+  transactionsToCategorizeIdsSelected,
+}) {
   return (
     <CategorizeTransactionBoot
-      uncategorizedTransactionId={uncategorizedTransactionId}
+      uncategorizedTransactionsIds={transactionsToCategorizeIdsSelected}
     >
       <CategorizeTransactionDrawerBody>
         <CategorizeTransactionForm />
@@ -18,6 +19,12 @@ export function CategorizeTransactionContent() {
   );
 }
 
+export const CategorizeTransactionContent = R.compose(
+  withBanking(({ transactionsToCategorizeIdsSelected }) => ({
+    transactionsToCategorizeIdsSelected,
+  })),
+)(CategorizeTransactionContentRoot);
+
 const CategorizeTransactionDrawerBody = styled.div`
   display: flex;
   flex-direction: column;

packages/webapp/src/containers/CashFlow/CategorizeTransaction/drawers/CategorizeTransactionDrawer/CategorizeTransactionForm.tsx

@@ -22,7 +22,7 @@ function CategorizeTransactionFormRoot({
   // #withBankingActions
   closeMatchingTransactionAside,
 }) {
-  const { uncategorizedTransactionId } = useCategorizeTransactionTabsBoot();
+  const { uncategorizedTransactionIds } = useCategorizeTransactionTabsBoot();
   const { mutateAsync: categorizeTransaction } = useCategorizeTransaction();
 
   // Form initial values in create and edit mode.
@@ -30,10 +30,10 @@ function CategorizeTransactionFormRoot({
 
   // Callbacks handles form submit.
   const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
-    const transformedValues = tranformToRequest(values);
+    const _values = tranformToRequest(values, uncategorizedTransactionIds);
 
     setSubmitting(true);
-    categorizeTransaction([uncategorizedTransactionId, transformedValues])
+    categorizeTransaction(_values)
       .then(() => {
         setSubmitting(false);
 

packages/webapp/src/containers/CashFlow/CategorizeTransaction/drawers/CategorizeTransactionDrawer/CategorizeTransactionFormContent.tsx

@@ -6,6 +6,7 @@ import { Box, FFormGroup, FSelect } from '@/components';
 import { getAddMoneyInOptions, getAddMoneyOutOptions } from '@/constants';
 import { useFormikContext } from 'formik';
 import { useCategorizeTransactionTabsBoot } from '@/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabsBoot';
+import { useCategorizeTransactionBoot } from './CategorizeTransactionBoot';
 
 // Retrieves the add money in button options.
 const MoneyInOptions = getAddMoneyInOptions();
@@ -18,16 +19,18 @@ const Title = styled('h3')`
 `;
 
 export function CategorizeTransactionFormContent() {
-  const { uncategorizedTransaction } = useCategorizeTransactionTabsBoot();
+  const { autofillCategorizeValues } = useCategorizeTransactionBoot();
 
-  const transactionTypes = uncategorizedTransaction?.is_deposit_transaction
+  const transactionTypes = autofillCategorizeValues?.isDepositTransaction
     ? MoneyInOptions
     : MoneyOutOptions;
 
+  const formattedAmount = autofillCategorizeValues?.formattedAmount;
+
   return (
     <Box style={{ flex: 1, margin: 20 }}>
       <FormGroup label={'Amount'} inline>
-        <Title>{uncategorizedTransaction.formatted_amount}</Title>
+        <Title>{formattedAmount}</Title>
       </FormGroup>
 
       <FFormGroup name={'category'} label={'Category'} fastField inline>

packages/webapp/src/containers/CashFlow/CategorizeTransaction/drawers/CategorizeTransactionDrawer/_utils.ts

@@ -1,8 +1,8 @@
 // @ts-nocheck
 import * as R from 'ramda';
 import { transformToForm, transfromToSnakeCase } from '@/utils';
-import { useCategorizeTransactionTabsBoot } from '@/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabsBoot';
 import { useCategorizeTransactionBoot } from './CategorizeTransactionBoot';
+import { GetAutofillCategorizeTransaction } from '@/hooks/query/bank-rules';
 
 // Default initial form values.
 export const defaultInitialValues = {
@@ -18,48 +18,28 @@ export const defaultInitialValues = {
 };
 
 export const transformToCategorizeForm = (
-  uncategorizedTransaction: any,
+  autofillCategorizeTransaction: GetAutofillCategorizeTransaction,
-  recognizedTransaction?: any,
 ) => {
-  let defaultValues = {
+  return transformToForm(autofillCategorizeTransaction, defaultInitialValues);
-    debitAccountId: uncategorizedTransaction.account_id,
-    transactionType: uncategorizedTransaction.is_deposit_transaction
-      ? 'other_income'
-      : 'other_expense',
-    amount: uncategorizedTransaction.amount,
-    date: uncategorizedTransaction.date,
-  };
-  if (recognizedTransaction) {
-    const recognizedDefaults = getRecognizedTransactionDefaultValues(
-      recognizedTransaction,
-    );
-    defaultValues = R.merge(defaultValues, recognizedDefaults);
-  }
-  return transformToForm(defaultValues, defaultInitialValues);
 };
 
-export const getRecognizedTransactionDefaultValues = (
+export const tranformToRequest = (
-  recognizedTransaction: any,
+  formValues: Record<string, any>,
+  uncategorizedTransactionIds: Array<number>,
 ) => {
   return {
-    creditAccountId: recognizedTransaction.assignedAccountId || '',
+    uncategorized_transaction_ids: uncategorizedTransactionIds,
-    // transactionType: recognizedTransaction.assignCategory,
+    ...transfromToSnakeCase(formValues),
-    referenceNo: recognizedTransaction.referenceNo || '',
   };
 };
 
-export const tranformToRequest = (formValues: Record<string, any>) => {
-  return transfromToSnakeCase(formValues);
-};
-
 /**
  * Categorize transaction form initial values.
  * @returns
  */
 export const useCategorizeTransactionFormInitialValues = () => {
-  const { primaryBranch, recognizedTranasction } =
+  const { primaryBranch, autofillCategorizeValues } =
     useCategorizeTransactionBoot();
-  const { uncategorizedTransaction } = useCategorizeTransactionTabsBoot();
 
   return {
     ...defaultInitialValues,
@@ -68,10 +48,7 @@ export const useCategorizeTransactionFormInitialValues = () => {
      * values such as `notes` come back from the API as null, so remove those
      * as well.
      */
-    ...transformToCategorizeForm(
+    ...transformToCategorizeForm(autofillCategorizeValues),
-      uncategorizedTransaction,
-      recognizedTranasction,
-    ),
 
     /** Assign the primary branch id as default value. */
     branchId: primaryBranch?.id || null,

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionAside.tsx

@@ -19,20 +19,32 @@ function CategorizeTransactionAsideRoot({
 
   // #withBanking
   selectedUncategorizedTransactionId,
+  resetTransactionsToCategorizeSelected,
+  enableMultipleCategorization,
 }: CategorizeTransactionAsideProps) {
   //
   useEffect(
     () => () => {
+      // Close the reconcile matching form.
       closeReconcileMatchingTransaction();
+
+      // Reset the selected transactions to categorize.
+      resetTransactionsToCategorizeSelected();
+
+      // Disable multi matching.
+      enableMultipleCategorization(false);
     },
-    [closeReconcileMatchingTransaction],
+    [
+      closeReconcileMatchingTransaction,
+      resetTransactionsToCategorizeSelected,
+      enableMultipleCategorization,
+    ],
   );
 
   const handleClose = () => {
     closeMatchingTransactionAside();
-  };
+  }
-  const uncategorizedTransactionId = selectedUncategorizedTransactionId;
+  // Cannot continue if there is no selected transactions.;
-
   if (!selectedUncategorizedTransactionId) {
     return null;
   }
@@ -40,7 +52,7 @@ function CategorizeTransactionAsideRoot({
     <Aside title={'Categorize Bank Transaction'} onClose={handleClose}>
       <Aside.Body>
         <CategorizeTransactionTabsBoot
-          uncategorizedTransactionId={uncategorizedTransactionId}
+          uncategorizedTransactionId={selectedUncategorizedTransactionId}
         >
           <CategorizeTransactionTabs />
         </CategorizeTransactionTabsBoot>
@@ -51,7 +63,7 @@ function CategorizeTransactionAsideRoot({
 
 export const CategorizeTransactionAside = R.compose(
   withBankingActions,
-  withBanking(({ selectedUncategorizedTransactionId }) => ({
+  withBanking(({ transactionsToCategorizeIdsSelected }) => ({
-    selectedUncategorizedTransactionId,
+    selectedUncategorizedTransactionId: transactionsToCategorizeIdsSelected,
   })),
 )(CategorizeTransactionAsideRoot);

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabs.tsx

@@ -2,14 +2,10 @@
 import { Tab, Tabs } from '@blueprintjs/core';
 import { MatchingBankTransaction } from './MatchingTransaction';
 import { CategorizeTransactionContent } from '../CategorizeTransaction/drawers/CategorizeTransactionDrawer/CategorizeTransactionContent';
-import { useCategorizeTransactionTabsBoot } from './CategorizeTransactionTabsBoot';
 import styles from './CategorizeTransactionTabs.module.scss';
 
 export function CategorizeTransactionTabs() {
-  const { uncategorizedTransaction } = useCategorizeTransactionTabsBoot();
+  const defaultSelectedTabId = 'categorize';
-  const defaultSelectedTabId = uncategorizedTransaction?.is_recognized
-    ? 'categorize'
-    : 'matching';
 
   return (
     <Tabs

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/CategorizeTransactionTabsBoot.tsx

@@ -1,16 +1,13 @@
 // @ts-nocheck
-import React from 'react';
+import React, { useMemo } from 'react';
-import { Spinner } from '@blueprintjs/core';
+import { castArray, uniq } from 'lodash';
-import { useUncategorizedTransaction } from '@/hooks/query';
 
 interface CategorizeTransactionTabsValue {
-  uncategorizedTransactionId: number;
+  uncategorizedTransactionIds: Array<number>;
-  isUncategorizedTransactionLoading: boolean;
-  uncategorizedTransaction: any;
 }
 
 interface CategorizeTransactionTabsBootProps {
-  uncategorizedTransactionId: number;
+  uncategorizedTransactionIds: number | Array<number>;
   children: React.ReactNode;
 }
 
@@ -26,28 +23,23 @@ export function CategorizeTransactionTabsBoot({
   uncategorizedTransactionId,
   children,
 }: CategorizeTransactionTabsBootProps) {
-  const {
+  const uncategorizedTransactionIds = useMemo(
-    data: uncategorizedTransaction,
+    () => uniq(castArray(uncategorizedTransactionId)),
-    isLoading: isUncategorizedTransactionLoading,
+    [uncategorizedTransactionId],
-  } = useUncategorizedTransaction(uncategorizedTransactionId);
+  );
 
   const provider = {
-    uncategorizedTransactionId,
+    uncategorizedTransactionIds,
-    uncategorizedTransaction,
-    isUncategorizedTransactionLoading,
   };
-  const isLoading = isUncategorizedTransactionLoading;
+  // Use a key prop to force re-render of children when `uncategorizedTransactionIds` changes
-
-  // Use a key prop to force re-render of children when uncategorizedTransactionId changes
   const childrenPerKey = React.useMemo(() => {
     return React.Children.map(children, (child) =>
-      React.cloneElement(child, { key: uncategorizedTransactionId }),
+      React.cloneElement(child, {
+        key: uncategorizedTransactionIds?.join(','),
+      }),
     );
-  }, [children, uncategorizedTransactionId]);
+  }, [children, uncategorizedTransactionIds]);
 
-  if (isLoading) {
-    return <Spinner size={30} />;
-  }
   return (
     <CategorizeTransactionTabsBootContext.Provider value={provider}>
       {childrenPerKey}

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/MatchingTransaction.tsx

@@ -25,9 +25,9 @@ import {
   WithBankingActionsProps,
   withBankingActions,
 } from '../withBankingActions';
-import styles from './CategorizeTransactionAside.module.scss';
-import { MatchingReconcileTransactionForm } from './MatchingReconcileTransactionAside/MatchingReconcileTransactionForm';
 import { withBanking } from '../withBanking';
+import { MatchingReconcileTransactionForm } from './MatchingReconcileTransactionAside/MatchingReconcileTransactionForm';
+import styles from './CategorizeTransactionAside.module.scss';
 
 const initialValues = {
   matched: {},
@@ -40,8 +40,11 @@ const initialValues = {
 function MatchingBankTransactionRoot({
   // #withBankingActions
   closeMatchingTransactionAside,
+
+  // #withBanking
+  transactionsToCategorizeIdsSelected,
 }) {
-  const { uncategorizedTransactionId } = useCategorizeTransactionTabsBoot();
+  const { uncategorizedTransactionIds } = useCategorizeTransactionTabsBoot();
   const { mutateAsync: matchTransaction } = useMatchUncategorizedTransaction();
 
   // Handles the form submitting.
@@ -49,7 +52,7 @@ function MatchingBankTransactionRoot({
     values: MatchingTransactionFormValues,
     { setSubmitting }: FormikHelpers<MatchingTransactionFormValues>,
   ) => {
-    const _values = transformToReq(values);
+    const _values = transformToReq(values, uncategorizedTransactionIds);
 
     if (_values.matchedTransactions?.length === 0) {
       AppToaster.show({
@@ -59,7 +62,7 @@ function MatchingBankTransactionRoot({
       return;
     }
     setSubmitting(true);
-    matchTransaction({ id: uncategorizedTransactionId, value: _values })
+    matchTransaction(_values)
       .then(() => {
         AppToaster.show({
           intent: Intent.SUCCESS,
@@ -78,7 +81,7 @@ function MatchingBankTransactionRoot({
             message: `The total amount does not equal the uncategorized transaction.`,
             intent: Intent.DANGER,
           });
-
+          setSubmitting(false);
           return;
         }
         AppToaster.show({
@@ -91,7 +94,7 @@ function MatchingBankTransactionRoot({
 
   return (
     <MatchingTransactionBoot
-      uncategorizedTransactionId={uncategorizedTransactionId}
+      uncategorizedTransactionsIds={uncategorizedTransactionIds}
     >
       <Formik initialValues={initialValues} onSubmit={handleSubmit}>
         <MatchingBankTransactionFormContent />
@@ -100,9 +103,12 @@ function MatchingBankTransactionRoot({
   );
 }
 
-export const MatchingBankTransaction = R.compose(withBankingActions)(
+export const MatchingBankTransaction = R.compose(
-  MatchingBankTransactionRoot,
+  withBankingActions,
-);
+  withBanking(({ transactionsToCategorizeIdsSelected }) => ({
+    transactionsToCategorizeIdsSelected,
+  })),
+)(MatchingBankTransactionRoot);
 
 /**
  * Matching bank transaction form content.

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/MatchingTransactionBoot.tsx

@@ -10,6 +10,7 @@ interface MatchingTransactionBootValues {
   possibleMatches: Array<any>;
   perfectMatchesCount: number;
   perfectMatches: Array<any>;
+  totalPending: number;
   matches: Array<any>;
 }
 
@@ -18,12 +19,12 @@ const RuleFormBootContext = createContext<MatchingTransactionBootValues>(
 );
 
 interface RuleFormBootProps {
-  uncategorizedTransactionId: number;
+  uncategorizedTransactionsIds: Array<number>;
   children: React.ReactNode;
 }
 
 function MatchingTransactionBoot({
-  uncategorizedTransactionId,
+  uncategorizedTransactionsIds,
   ...props
 }: RuleFormBootProps) {
   const {
@@ -31,11 +32,12 @@ function MatchingTransactionBoot({
     isLoading: isMatchingTransactionsLoading,
     isFetching: isMatchingTransactionsFetching,
     isSuccess: isMatchingTransactionsSuccess,
-  } = useGetBankTransactionsMatches(uncategorizedTransactionId);
+  } = useGetBankTransactionsMatches(uncategorizedTransactionsIds);
 
   const possibleMatches = defaultTo(matchingTransactions?.possibleMatches, []);
   const perfectMatchesCount = matchingTransactions?.perfectMatches?.length || 0;
   const perfectMatches = defaultTo(matchingTransactions?.perfectMatches, []);
+  const totalPending = defaultTo(matchingTransactions?.totalPending, 0);
 
   const matches = R.concat(perfectMatches, possibleMatches);
 
@@ -46,6 +48,7 @@ function MatchingTransactionBoot({
     possibleMatches,
     perfectMatchesCount,
     perfectMatches,
+    totalPending,
     matches,
   } as MatchingTransactionBootValues;
 

packages/webapp/src/containers/CashFlow/CategorizeTransactionAside/utils.ts

@@ -4,7 +4,10 @@ import { useMatchingTransactionBoot } from './MatchingTransactionBoot';
 import { useCategorizeTransactionTabsBoot } from './CategorizeTransactionTabsBoot';
 import { useMemo } from 'react';
 
-export const transformToReq = (values: MatchingTransactionFormValues) => {
+export const transformToReq = (
+  values: MatchingTransactionFormValues,
+  uncategorizedTransactions: Array<number>,
+) => {
   const matchedTransactions = Object.entries(values.matched)
     .filter(([key, value]) => value)
     .map(([key]) => {
@@ -12,14 +15,13 @@ export const transformToReq = (values: MatchingTransactionFormValues) => {
 
       return { reference_type, reference_id: parseInt(reference_id, 10) };
     });
-
+  return { matchedTransactions, uncategorizedTransactions };
-  return { matchedTransactions };
 };
 
 export const useGetPendingAmountMatched = () => {
   const { values } = useFormikContext<MatchingTransactionFormValues>();
-  const { perfectMatches, possibleMatches } = useMatchingTransactionBoot();
+  const { perfectMatches, possibleMatches, totalPending } =
-  const { uncategorizedTransaction } = useCategorizeTransactionTabsBoot();
+    useMatchingTransactionBoot();
 
   return useMemo(() => {
     const matchedItems = [...perfectMatches, ...possibleMatches].filter(
@@ -34,11 +36,10 @@ export const useGetPendingAmountMatched = () => {
         (item.transactionNormal === 'debit' ? 1 : -1) * parseFloat(item.amount),
       0,
     );
-    const amount = uncategorizedTransaction.amount;
+    const pendingAmount = totalPending - totalMatchedAmount;
-    const pendingAmount = amount - totalMatchedAmount;
 
     return pendingAmount;
-  }, [uncategorizedTransaction, perfectMatches, possibleMatches, values]);
+  }, [totalPending, perfectMatches, possibleMatches, values]);
 };
 
 export const useAtleastOneMatchedSelected = () => {

packages/webapp/src/containers/CashFlow/withBanking.ts

@@ -18,6 +18,10 @@ export const withBanking = (mapState) => {
         state.plaid.uncategorizedTransactionsSelected,
 
       excludedTransactionsIdsSelected: state.plaid.excludedTransactionsSelected,
+      enableMultipleCategorization: state.plaid.enableMultipleCategorization,
+
+      transactionsToCategorizeIdsSelected:
+        state.plaid.transactionsToCategorizeSelected,
     };
     return mapState ? mapState(mapped, state, props) : mapped;
   };

packages/webapp/src/containers/CashFlow/withBankingActions.ts

@@ -8,6 +8,11 @@ import {
   resetUncategorizedTransactionsSelected,
   resetExcludedTransactionsSelected,
   setExcludedTransactionsSelected,
+  resetTransactionsToCategorizeSelected,
+  setTransactionsToCategorizeSelected,
+  enableMultipleCategorization,
+  addTransactionsToCategorizeSelected,
+  removeTransactionsToCategorizeSelected,
 } from '@/store/banking/banking.reducer';
 
 export interface WithBankingActionsProps {
@@ -23,6 +28,13 @@ export interface WithBankingActionsProps {
 
   setExcludedTransactionsSelected: (ids: Array<string | number>) => void;
   resetExcludedTransactionsSelected: () => void;
+
+  setTransactionsToCategorizeSelected: (ids: Array<string | number>) => void;
+  addTransactionsToCategorizeSelected: (id: string | number) => void;
+  removeTransactionsToCategorizeSelected: (id: string | number) => void;
+  resetTransactionsToCategorizeSelected: () => void;
+
+  enableMultipleCategorization: (enable: boolean) => void;
 }
 
 const mapDipatchToProps = (dispatch: any): WithBankingActionsProps => ({
@@ -68,10 +80,46 @@ const mapDipatchToProps = (dispatch: any): WithBankingActionsProps => ({
     ),
 
   /**
-   * Resets the excluded selected transactions
+   * Resets the excluded selected transactions.
    */
   resetExcludedTransactionsSelected: () =>
     dispatch(resetExcludedTransactionsSelected()),
+
+  /**
+   * Sets the selected transactions to categorize or match.
+   * @param {Array<string | number>} ids
+   */
+  setTransactionsToCategorizeSelected: (ids: Array<string | number>) =>
+    dispatch(setTransactionsToCategorizeSelected({ ids })),
+
+  /**
+   * Adds selected transactions to categorize.
+   * @param {string | number} id
+   * @returns
+   */
+  addTransactionsToCategorizeSelected: (id: string | number) =>
+    dispatch(addTransactionsToCategorizeSelected({ id })),
+
+  /**
+   * Removes the selected transactions.
+   * @param {string | number} id
+   * @returns
+   */
+  removeTransactionsToCategorizeSelected: (id: string | number) =>
+    dispatch(removeTransactionsToCategorizeSelected({ id })),
+
+  /**
+   * Resets the selected transactions to categorize or match.
+   */
+  resetTransactionsToCategorizeSelected: () =>
+    dispatch(resetTransactionsToCategorizeSelected()),
+
+  /**
+   * Enables/Disables the multiple selection to categorize or match.
+   * @param {boolean} enable
+   */
+  enableMultipleCategorization: (enable: boolean) =>
+    dispatch(enableMultipleCategorization({ enable })),
 });
 
 export const withBankingActions = connect<

packages/webapp/src/hooks/query/bank-rules.ts

@@ -22,6 +22,7 @@ const QUERY_KEY = {
   RECOGNIZED_BANK_TRANSACTIONS_INFINITY:
     'RECOGNIZED_BANK_TRANSACTIONS_INFINITY',
   BANK_ACCOUNT_SUMMARY_META: 'BANK_ACCOUNT_SUMMARY_META',
+  AUTOFILL_CATEGORIZE_BANK_TRANSACTION: 'AUTOFILL_CATEGORIZE_BANK_TRANSACTION',
 };
 
 const commonInvalidateQueries = (query: QueryClient) => {
@@ -238,10 +239,13 @@ export function useBankRule(
   );
 }
 
-type GetBankTransactionsMatchesValue = number;
+interface GetBankTransactionsMatchesValue {
+  uncategorizeTransactionsIds: Array<number>;
+}
 interface GetBankTransactionsMatchesResponse {
   perfectMatches: Array<any>;
   possibleMatches: Array<any>;
+  totalPending: number;
 }
 
 /**
@@ -250,16 +254,18 @@ interface GetBankTransactionsMatchesResponse {
  * @returns {UseQueryResult<GetBankTransactionsMatchesResponse, Error>}
  */
 export function useGetBankTransactionsMatches(
-  uncategorizedTransactionId: number,
+  uncategorizeTransactionsIds: Array<number>,
   options?: UseQueryOptions<GetBankTransactionsMatchesResponse, Error>,
 ): UseQueryResult<GetBankTransactionsMatchesResponse, Error> {
   const apiRequest = useApiRequest();
 
   return useQuery<GetBankTransactionsMatchesResponse, Error>(
-    [QUERY_KEY.BANK_TRANSACTION_MATCHES, uncategorizedTransactionId],
+    [QUERY_KEY.BANK_TRANSACTION_MATCHES, uncategorizeTransactionsIds],
     () =>
       apiRequest
-        .get(`/cashflow/transactions/${uncategorizedTransactionId}/matches`)
+        .get(`/cashflow/transactions/matches`, {
+          params: { uncategorizeTransactionsIds },
+        })
         .then((res) => transformToCamelCase(res.data)),
     options,
   );
@@ -437,8 +443,8 @@ export function useUnexcludeUncategorizedTransactions(
 }
 
 interface MatchUncategorizedTransactionValues {
-  id: number;
+  uncategorizedTransactions: Array<number>;
-  value: any;
+  matchedTransactions: Array<{ reference_type: string; reference_id: number }>;
 }
 interface MatchUncategorizedTransactionRes {}
 
@@ -465,7 +471,7 @@ export function useMatchUncategorizedTransaction(
     MatchUncategorizedTransactionRes,
     Error,
     MatchUncategorizedTransactionValues
-  >(({ id, value }) => apiRequest.post(`/banking/matches/${id}`, value), {
+  >((value) => apiRequest.post('/banking/matches/match', value), {
     onSuccess: (res, id) => {
       queryClient.invalidateQueries(
         t.CASHFLOW_ACCOUNT_UNCATEGORIZED_TRANSACTIONS_INFINITY,
@@ -581,6 +587,42 @@ export function useGetBankAccountSummaryMeta(
   );
 }
 
+export interface GetAutofillCategorizeTransaction {
+  accountId: number | null;
+  amount: number;
+  category: string | null;
+  date: Date;
+  formattedAmount: string;
+  formattedDate: string;
+  isRecognized: boolean;
+  recognizedByRuleId: number | null;
+  recognizedByRuleName: string | null;
+  referenceNo: null | string;
+  isDepositTransaction: boolean;
+  isWithdrawalTransaction: boolean;
+}
+
+export function useGetAutofillCategorizeTransaction(
+  uncategorizedTransactionIds: number[],
+  options: any,
+) {
+  const apiRequest = useApiRequest();
+
+  return useQuery<GetAutofillCategorizeTransaction, Error>(
+    [
+      QUERY_KEY.AUTOFILL_CATEGORIZE_BANK_TRANSACTION,
+      uncategorizedTransactionIds,
+    ],
+    () =>
+      apiRequest
+        .get(`/banking/categorize/autofill`, {
+          params: { uncategorizedTransactionIds },
+        })
+        .then((res) => transformToCamelCase(res.data?.data)),
+    { ...options },
+  );
+}
+
 /**
  * @returns
  */

packages/webapp/src/hooks/query/cashflowAccounts.tsx

@@ -243,8 +243,7 @@ export function useCategorizeTransaction(props) {
   const apiRequest = useApiRequest();
 
   return useMutation(
-    ([id, values]) =>
+    (values) => apiRequest.post(`cashflow/transactions/categorize`, values),
-      apiRequest.post(`cashflow/transactions/${id}/categorize`, values),
     {
       onSuccess: (res, id) => {
         // Invalidate queries.
@@ -279,7 +278,6 @@ export function useUncategorizeTransaction(props) {
         queryClient.invalidateQueries(
           t.CASHFLOW_ACCOUNT_UNCATEGORIZED_TRANSACTIONS_INFINITY,
         );
-
         // Invalidate bank account summary.
         queryClient.invalidateQueries('BANK_ACCOUNT_SUMMARY_META');
       },

packages/webapp/src/hooks/state/banking.ts

@@ -1,10 +1,17 @@
+import { useDispatch, useSelector } from 'react-redux';
+import { useCallback, useMemo } from 'react';
 import {
   getPlaidToken,
   setPlaidId,
   resetPlaidId,
+  setTransactionsToCategorizeSelected,
+  resetTransactionsToCategorizeSelected,
+  getTransactionsToCategorizeSelected,
+  addTransactionsToCategorizeSelected,
+  removeTransactionsToCategorizeSelected,
+  getOpenMatchingTransactionAside,
+  getTransactionsToCategorizeIdsSelected,
 } from '@/store/banking/banking.reducer';
-import { useCallback } from 'react';
-import { useDispatch, useSelector } from 'react-redux';
 
 export const useSetBankingPlaidToken = () => {
   const dispatch = useDispatch();
@@ -30,3 +37,76 @@ export const useResetBankingPlaidToken = () => {
     dispatch(resetPlaidId());
   }, [dispatch]);
 };
+
+export const useGetTransactionsToCategorizeSelected = () => {
+  const selectedTransactions = useSelector(getTransactionsToCategorizeSelected);
+
+  return useMemo(() => selectedTransactions, [selectedTransactions]);
+};
+
+export const useSetTransactionsToCategorizeSelected = () => {
+  const dispatch = useDispatch();
+
+  return useCallback(
+    (ids: Array<string | number>) => {
+      return dispatch(setTransactionsToCategorizeSelected({ ids }));
+    },
+    [dispatch],
+  );
+};
+
+export const useAddTransactionsToCategorizeSelected = () => {
+  const dispatch = useDispatch();
+
+  return useCallback(
+    (id: string | number) => {
+      return dispatch(addTransactionsToCategorizeSelected({ id }));
+    },
+    [dispatch],
+  );
+};
+
+export const useRemoveTransactionsToCategorizeSelected = () => {
+  const dispatch = useDispatch();
+
+  return useCallback(
+    (id: string | number) => {
+      return dispatch(removeTransactionsToCategorizeSelected({ id }));
+    },
+    [dispatch],
+  );
+};
+
+export const useResetTransactionsToCategorizeSelected = () => {
+  const dispatch = useDispatch();
+
+  return useCallback(() => {
+    dispatch(resetTransactionsToCategorizeSelected());
+  }, [dispatch]);
+};
+
+export const useGetOpenMatchingTransactionAside = () => {
+  const openMatchingTransactionAside = useSelector(
+    getOpenMatchingTransactionAside,
+  );
+
+  return useMemo(
+    () => openMatchingTransactionAside,
+    [openMatchingTransactionAside],
+  );
+};
+
+/**
+ * Returns the detarmined value whether the given transaction id is checked.
+ * @param {number} transactionId
+ * @returns {boolean}
+ */
+export const useIsTransactionToCategorizeSelected = (transactionId: number) => {
+  const transactionsToCategorizeIdsSelected = useSelector(
+    getTransactionsToCategorizeIdsSelected,
+  );
+  return useMemo(
+    () => transactionsToCategorizeIdsSelected.indexOf(transactionId) !== -1,
+    [transactionsToCategorizeIdsSelected, transactionId],
+  );
+};

packages/webapp/src/store/banking/banking.reducer.ts

@@ -1,3 +1,4 @@
+import { castArray, uniq } from 'lodash';
 import { PayloadAction, createSlice } from '@reduxjs/toolkit';
 
 interface StorePlaidState {
@@ -8,6 +9,9 @@ interface StorePlaidState {
 
   uncategorizedTransactionsSelected: Array<number | string>;
   excludedTransactionsSelected: Array<number | string>;
+  transactionsToCategorizeSelected: Array<number | string>;
+
+  enableMultipleCategorization: boolean;
 }
 
 export const PlaidSlice = createSlice({
@@ -22,6 +26,8 @@ export const PlaidSlice = createSlice({
     },
     uncategorizedTransactionsSelected: [],
     excludedTransactionsSelected: [],
+    transactionsToCategorizeSelected: [],
+    enableMultipleCategorization: false,
   } as StorePlaidState,
   reducers: {
     setPlaidId: (state: StorePlaidState, action: PayloadAction<string>) => {
@@ -97,6 +103,79 @@ export const PlaidSlice = createSlice({
     resetExcludedTransactionsSelected: (state: StorePlaidState) => {
       state.excludedTransactionsSelected = [];
     },
+
+    /**
+     * Sets the selected transactions to categorize or match.
+     * @param {StorePlaidState} state
+     * @param {PayloadAction<{ ids: Array<string | number> }>} action
+     */
+    setTransactionsToCategorizeSelected: (
+      state: StorePlaidState,
+      action: PayloadAction<{ ids: Array<string | number> }>,
+    ) => {
+      const ids = castArray(action.payload.ids);
+
+      state.transactionsToCategorizeSelected = ids;
+      state.openMatchingTransactionAside = true;
+    },
+
+    /**
+     * Adds a transaction to selected transactions to categorize or match.
+     * @param {StorePlaidState} state
+     * @param {PayloadAction<{ id: string | number }>} action
+     */
+    addTransactionsToCategorizeSelected: (
+      state: StorePlaidState,
+      action: PayloadAction<{ id: string | number }>,
+    ) => {
+      state.transactionsToCategorizeSelected = uniq([
+        ...state.transactionsToCategorizeSelected,
+        action.payload.id,
+      ]);
+      state.openMatchingTransactionAside = true;
+    },
+
+    /**
+     * Removes a transaction from the selected transactions to categorize or match.
+     * @param {StorePlaidState} state
+     * @param {PayloadAction<{ id: string | number }>} action
+     */
+    removeTransactionsToCategorizeSelected: (
+      state: StorePlaidState,
+      action: PayloadAction<{ id: string | number }>,
+    ) => {
+      state.transactionsToCategorizeSelected =
+        state.transactionsToCategorizeSelected.filter(
+          (t) => t !== action.payload.id,
+        );
+
+      if (state.transactionsToCategorizeSelected.length === 0) {
+        state.openMatchingTransactionAside = false;
+      } else {
+        state.openMatchingTransactionAside = true;
+      }
+    },
+
+    /**
+     * Resets the selected transactions to categorize or match.
+     * @param {StorePlaidState} state
+     */
+    resetTransactionsToCategorizeSelected: (state: StorePlaidState) => {
+      state.transactionsToCategorizeSelected = [];
+      state.openMatchingTransactionAside = false;
+    },
+
+    /**
+     * Enables/Disables the multiple selection to categorize or match.
+     * @param {StorePlaidState} state
+     * @param {PayloadAction<{ enable: boolean }>} action
+     */
+    enableMultipleCategorization: (
+      state: StorePlaidState,
+      action: PayloadAction<{ enable: boolean }>,
+    ) => {
+      state.enableMultipleCategorization = action.payload.enable;
+    },
   },
 });
 
@@ -111,6 +190,22 @@ export const {
   resetUncategorizedTransactionsSelected,
   setExcludedTransactionsSelected,
   resetExcludedTransactionsSelected,
+  setTransactionsToCategorizeSelected,
+  addTransactionsToCategorizeSelected,
+  removeTransactionsToCategorizeSelected,
+  resetTransactionsToCategorizeSelected,
+  enableMultipleCategorization,
 } = PlaidSlice.actions;
 
 export const getPlaidToken = (state: any) => state.plaid.plaidToken;
+export const getTransactionsToCategorizeSelected = (state: any) =>
+  state.plaid.transactionsToCategorizeSelected;
+
+export const getOpenMatchingTransactionAside = (state: any) =>
+  state.plaid.openMatchingTransactionAside;
+
+export const isMultipleCategorization = (state: any) =>
+  state.plaid.enableMultipleCategorization;
+
+export const getTransactionsToCategorizeIdsSelected = (state: any) =>
+  state.plaid.transactionsToCategorizeSelected;

packages/webapp/src/style/components/DataTable/DataTable.scss

@@ -124,7 +124,7 @@
         }
       }
 
-      .bp4-control.bp4-checkbox .bp4-control-indicator {        
+      .bp4-control.bp4-checkbox:not(.bp4-large) .bp4-control-indicator {
         cursor: auto;
 
         &,