feat: more resources support importing

packages/webapp/src/containers/Expenses/ExpensesImport.tsx

@@ -0,0 +1,25 @@
+// @ts-nocheck
+import { useHistory } from 'react-router-dom';
+import { DashboardInsider } from '@/components';
+import { ImportView } from '../Import/ImportView';
+
+export default function ExpensesImport() {
+  const history = useHistory();
+
+  const handleCancelBtnClick = () => {
+    history.push('/expenses');
+  };
+  const handleImportSuccess = () => {
+    history.push('/expenses');
+  };
+
+  return (
+    <DashboardInsider name={'import-expenses'}>
+      <ImportView
+        resource={'expenses'}
+        onCancelClick={handleCancelBtnClick}
+        onImportSuccess={handleImportSuccess}
+      />
+    </DashboardInsider>
+  );
+}

packages/webapp/src/containers/Expenses/ExpensesLanding/ExpenseActionsBar.tsx

@@ -79,6 +79,11 @@ function ExpensesActionsBar({
     refresh();
   };
 
+  // Handle the import button click.
+  const handleImportBtnClick = () => {
+    history.push('/expenses/import');
+  }
+
   // Handle table row size change.
   const handleTableRowSizeChange = (size) => {
     addSetting('expenses', 'tableSize', size);
@@ -135,6 +140,7 @@ function ExpensesActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon="file-import-16" iconSize={16} />}
           text={<T id={'import'} />}
+          onClick={handleImportBtnClick}
         />
         <Button
           className={Classes.MINIMAL}

packages/webapp/src/containers/Import/_utils.ts

@@ -1,5 +1,6 @@
+// @ts-nocheck
 import { useMemo } from 'react';
-import { chain, isEmpty, lowerCase, head, last, set } from 'lodash';
+import { chain, isEmpty, lowerCase, head, last, set, get } from 'lodash';
 import { useImportFileContext } from './ImportFileProvider';
 import { useImportFileMapBootContext } from './ImportFileMappingBoot';
 import { deepdash, transformToForm } from '@/utils';
@@ -21,7 +22,7 @@ export const transformValueToReq = (
 ): { mapping: ImportFileMappingRes[] } => {
   const mapping = chain(value)
     .thru(deepdash.index)
-    .pickBy((_value, key) => !isEmpty(_.get(value, key)))
+    .pickBy((_value, key) => !isEmpty(get(value, key)))
     .map((from, key) => ({
       from,
       to: key.includes('.') ? last(key.split('.')) : key,

packages/webapp/src/containers/Purchases/PaymentMades/PaymentMadesImport.tsx

@@ -0,0 +1,25 @@
+// @ts-nocheck
+import { useHistory } from 'react-router-dom';
+import { DashboardInsider } from '@/components';
+import { ImportView } from '@/containers/Import';
+
+export default function PaymentMadesImport() {
+  const history = useHistory();
+
+  const handleCancelBtnClick = () => {
+    history.push('/payment-mades');
+  };
+  const handleImportSuccess = () => {
+    history.push('/payment-mades');
+  };
+
+  return (
+    <DashboardInsider name={'import-payment-mades'}>
+      <ImportView
+        resource={'bill_payment'}
+        onCancelClick={handleCancelBtnClick}
+        onImportSuccess={handleImportSuccess}
+      />
+    </DashboardInsider>
+  );
+}

packages/webapp/src/containers/Purchases/PaymentMades/PaymentsLanding/PaymentMadeActionsBar.tsx

@@ -78,6 +78,11 @@ function PaymentMadeActionsBar({
     addSetting('billPayments', 'tableSize', size);
   };
 
+  // Handle the import button click.
+  const handleImportBtnClick = () => {
+    history.push('/payment-mades/import');
+  }
+
   return (
     <DashboardActionsBar>
       <NavbarGroup>
@@ -128,6 +133,7 @@ function PaymentMadeActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon={'file-import-16'} />}
           text={<T id={'import'} />}
+          onClick={handleImportBtnClick}
         />
         <Button
           className={Classes.MINIMAL}

packages/webapp/src/containers/Sales/Estimates/EstimatesImport.tsx

@@ -0,0 +1,25 @@
+// @ts-nocheck
+import { useHistory } from 'react-router-dom';
+import { DashboardInsider } from '@/components';
+import { ImportView } from '@/containers/Import';
+
+export default function EstimatesImport() {
+  const history = useHistory();
+
+  const handleCancelBtnClick = () => {
+    history.push('/estimates');
+  };
+  const handleImportSuccess = () => {
+    history.push('/estimates');
+  };
+
+  return (
+    <DashboardInsider name={'import-accounts'}>
+      <ImportView
+        resource={'sale_estimate'}
+        onCancelClick={handleCancelBtnClick}
+        onImportSuccess={handleImportSuccess}
+      />
+    </DashboardInsider>
+  );
+}

packages/webapp/src/containers/Sales/Estimates/EstimatesLanding/EstimatesActionsBar.tsx

@@ -77,6 +77,11 @@ function EstimateActionsBar({
     addSetting('salesEstimates', 'tableSize', size);
   };
 
+  // Handle the import button click.
+  const handleImportBtnClick = () => {
+    history.push('/estimates/import');
+  }
+
   return (
     <DashboardActionsBar>
       <NavbarGroup>
@@ -130,6 +135,7 @@ function EstimateActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon={'file-import-16'} />}
           text={<T id={'import'} />}
+          onClick={handleImportBtnClick}
         />
         <Button
           className={Classes.MINIMAL}

packages/webapp/src/containers/Sales/Invoices/InvoicesImport.tsx

@@ -0,0 +1,25 @@
+// @ts-nocheck
+import { useHistory } from 'react-router-dom';
+import { DashboardInsider } from '@/components';
+import { ImportView } from '@/containers/Import';
+
+export default function InvoicesImport() {
+  const history = useHistory();
+
+  const handleCancelBtnClick = () => {
+    history.push('/invoices');
+  };
+  const handleImportSuccess = () => {
+    history.push('/invoices');
+  };
+
+  return (
+    <DashboardInsider name={'import-invoices'}>
+      <ImportView
+        resource={'sale_invoice'}
+        onCancelClick={handleCancelBtnClick}
+        onImportSuccess={handleImportSuccess}
+      />
+    </DashboardInsider>
+  );
+}

packages/webapp/src/containers/Sales/Invoices/InvoicesLanding/InvoicesActionsBar.tsx

@@ -74,6 +74,11 @@ function InvoiceActionsBar({
     addSetting('salesInvoices', 'tableSize', size);
   };
 
+  // Handle the import button click.
+  const handleImportBtnClick = () => {
+    history.push('/invoices/import');
+  };
+
   return (
     <DashboardActionsBar>
       <NavbarGroup>
@@ -124,6 +129,7 @@ function InvoiceActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon={'file-import-16'} />}
           text={<T id={'import'} />}
+          onClick={handleImportBtnClick}
         />
         <Button
           className={Classes.MINIMAL}

packages/webapp/src/routes/dashboard.tsx

@@ -507,6 +507,16 @@ export const getDashboardRoutes = () => [
     subscriptionActive: [SUBSCRIPTION_TYPE.MAIN],
   },
   // Expenses.
+  {
+    path: `/expenses/import`,
+    component: lazy(() => import('@/containers/Expenses/ExpensesImport')),
+    breadcrumb: 'Expenses Import',
+    hotkey: 'ctrl+shift+x',
+    pageTitle: 'Expenses Import',
+    sidebarExpand: false,
+    backLink: true,
+    subscriptionActive: [SUBSCRIPTION_TYPE.MAIN],
+  },
   {
     path: `/expenses/new`,
     component: lazy(
@@ -657,6 +667,19 @@ export const getDashboardRoutes = () => [
   },
 
   // Estimates
+  {
+    path: `/estimates/import`,
+    component: lazy(
+      () => import('@/containers/Sales/Estimates/EstimatesImport'),
+    ),
+    name: 'estimate-edit',
+    breadcrumb: 'Estimates Import',
+    pageTitle: 'Estimates Import',
+    backLink: true,
+    sidebarExpand: false,
+    defaultSearchResource: RESOURCES_TYPES.ESTIMATE,
+    subscriptionActive: [SUBSCRIPTION_TYPE.MAIN],
+  },
   {
     path: `/estimates/:id/edit`,
     component: lazy(
@@ -715,6 +738,17 @@ export const getDashboardRoutes = () => [
   },
 
   // Invoices.
+  {
+    path: `/invoices/import`,
+    component: lazy(() => import('@/containers/Sales/Invoices/InvoicesImport')),
+    name: 'invoice-edit',
+    breadcrumb: 'Invoices Import',
+    pageTitle: 'Invoices Import',
+    sidebarExpand: false,
+    backLink: true,
+    defaultSearchResource: RESOURCES_TYPES.INVOICE,
+    subscriptionActive: [SUBSCRIPTION_TYPE.MAIN],
+  },
   {
     path: `/invoices/:id/edit`,
     component: lazy(
@@ -1025,6 +1059,19 @@ export const getDashboardRoutes = () => [
     subscriptionInactive: [SUBSCRIPTION_TYPE.MAIN],
   },
   // Payment modes.
+  {
+    path: `/payment-mades/import`,
+    component: lazy(
+      () => import('@/containers/Purchases/PaymentMades/PaymentMadesImport'),
+    ),
+    name: 'payment-made-edit',
+    breadcrumb: intl.get('edit'),
+    pageTitle: 'Bills Payments Import',
+    sidebarExpand: false,
+    backLink: true,
+    defaultSearchResource: RESOURCES_TYPES.PAYMENT_MADE,
+    subscriptionActive: [SUBSCRIPTION_TYPE.MAIN],
+  },
   {
     path: `/payment-mades/:id/edit`,
     component: lazy(