diff --git a/src/config/interfaces.tsx b/src/config/interfaces.tsx
new file mode 100644
index 000000000..db265d6f4
--- /dev/null
+++ b/src/config/interfaces.tsx
@@ -0,0 +1,45 @@
+export enum ISidebarMenuItemType {
+  Label = 'label',
+  Link = 'link',
+  Group = 'group',
+  Overlay = 'overlay'
+}
+
+export interface ISidebarMenuItemOverlay extends ISidebarMenuItemCommon {
+  type: ISidebarMenuItemType.Overlay;
+}
+
+export interface ISidebarMenuItemLink extends ISidebarMenuItemCommon {
+  text: string | JSX.Element;
+  href: string;
+  type: ISidebarMenuItemType.Link;
+  matchExact?: boolean;
+}
+
+export interface ISidebarMenuItemLabel extends ISidebarMenuItemCommon {
+  text?: string;
+  type: ISidebarMenuItemType.Label;
+}
+
+export interface ISidebarMenuItemGroup extends ISidebarMenuItemCommon {
+  type: ISidebarMenuItemType.Group;
+}
+
+export interface ISidebarMenuItemPermission {
+  subject: string;
+  ability: string;
+}
+
+export interface ISidebarMenuItemCommon {
+  ability?: ISidebarMenuItemPermission | ISidebarMenuItemPermission[];
+  feature?: string;
+  disabled?: boolean;
+  children?: ISidebarMenuItem[];
+  onlySubscriptionExpired?: boolean;
+}
+
+export type ISidebarMenuItem =
+  | ISidebarMenuItemLink
+  | ISidebarMenuItemLabel
+  | ISidebarMenuItemGroup
+  | ISidebarMenuItemOverlay;
diff --git a/src/containers/Drawers/ExpenseDrawer/utils.js b/src/containers/Drawers/ExpenseDrawer/utils.js
index 4e8911e49..97ab017ad 100644
--- a/src/containers/Drawers/ExpenseDrawer/utils.js
+++ b/src/containers/Drawers/ExpenseDrawer/utils.js
@@ -19,6 +19,7 @@ export const useExpenseReadEntriesColumns = () => {
       {
         Header: intl.get('expense_account'),
         accessor: 'expense_account.name',
+        Cell: TextOverviewTooltipCell,
         width: 110,
         disableSortBy: true,
         textOverview: true,
diff --git a/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerTable.js b/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerTable.js
index 19bada867..924a4ce81 100644
--- a/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerTable.js
+++ b/src/containers/Drawers/ManualJournalDrawer/ManualJournalDrawerTable.js
@@ -10,7 +10,10 @@ import { TableStyle } from '../../../common';
  * Manual journal drawer table.
  */
 export default function ManualJournalDrawerTable() {
+  // Retrieves the readonly manual journal entries columns.
   const columns = useManualJournalEntriesColumns();
+
+  // Manual journal drawer context.
   const { manualJournal } = useManualJournalDrawerContext();
 
   return (
diff --git a/src/containers/Drawers/ManualJournalDrawer/utils.js b/src/containers/Drawers/ManualJournalDrawer/utils.js
index 43d8b7d87..9a5b1e338 100644
--- a/src/containers/Drawers/ManualJournalDrawer/utils.js
+++ b/src/containers/Drawers/ManualJournalDrawer/utils.js
@@ -49,19 +49,19 @@ export const useManualJournalEntriesColumns = () => {
     () => [
       {
         Header: intl.get('account_name'),
+        Cell: TextOverviewTooltipCell,
         accessor: 'account.name',
         width: 130,
         disableSortBy: true,
         textOverview: true,
-        className: 'account',
       },
       {
         Header: intl.get('contact'),
         accessor: 'contact.display_name',
-        width: 130,
+        Cell: TextOverviewTooltipCell,
+        width: 100,
         disableSortBy: true,
         textOverview: true,
-        className: 'contact',
       },
       {
         Header: intl.get('note'),
@@ -69,16 +69,15 @@ export const useManualJournalEntriesColumns = () => {
         Cell: TextOverviewTooltipCell,
         disableSortBy: true,
         textOverview: true,
-        className: 'note',
+        width: 100,
       },
       ...(featureCan(Features.Branches)
         ? [
             {
               Header: intl.get('branch'),
-              width: 130,
+              width: 100,
               accessor: 'branch.name',
               disableSortBy: true,
-              className: 'branch',
             },
           ]
         : []),
@@ -94,7 +93,6 @@ export const useManualJournalEntriesColumns = () => {
         disableSortBy: true,
         textOverview: true,
         formatNumber: { noZero: true },
-        className: 'credit',
         align: 'right',
       },
       {
@@ -109,10 +107,9 @@ export const useManualJournalEntriesColumns = () => {
         textOverview: true,
         disableSortBy: true,
         formatNumber: { noZero: true },
-        className: 'debit',
         align: 'right',
       },
     ],
-    [featureCan],
+    [],
   );
 };
diff --git a/src/containers/Drawers/WarehouseTransferDetailDrawer/utils.js b/src/containers/Drawers/WarehouseTransferDetailDrawer/utils.js
index d23a84656..cfa88bd19 100644
--- a/src/containers/Drawers/WarehouseTransferDetailDrawer/utils.js
+++ b/src/containers/Drawers/WarehouseTransferDetailDrawer/utils.js
@@ -11,6 +11,9 @@ import {
   Choose,
 } from '../../../components';
 
+/**
+ * Retrieves the readonly warehouse transfer entries columns.
+ */
 export const useWarehouseTransferReadOnlyEntriesColumns = () => {
   const {
     warehouseTransfer: { entries },
@@ -50,6 +53,7 @@ export const useWarehouseTransferReadOnlyEntriesColumns = () => {
     [],
   );
 };
+
 /**
  * Warehouses transfer details status.
  * @returns {React.JSX}
diff --git a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryProvider.js b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryProvider.js
index 79ff52a59..665d31ca2 100644
--- a/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryProvider.js
+++ b/src/containers/FinancialStatements/VendorsBalanceSummary/VendorsBalanceSummaryProvider.js
@@ -12,7 +12,6 @@ function VendorsBalanceSummaryProvider({ filter, ...props }) {
   const query = React.useMemo(() => transformFilterFormToQuery(filter), [
     filter,
   ]);
-
   // Fetching vendors balance summary report based on the given query.
   const {
     data: VendorBalanceSummary,