feat: configuring import services on more resources

packages/webapp/src/containers/Sales/PaymentReceives/PaymentReceivesImport.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 PaymentsReceiveImport() {
+  const history = useHistory();
+
+  const handleCancelBtnClick = () => {
+    history.push('/');
+  };
+  const handleImportSuccess = () => {
+    history.push('/accounts');
+  };
+
+  return (
+    <DashboardInsider name={'import-accounts'}>
+      <ImportView
+        resource={'payment_receive'}
+        onCancelClick={handleCancelBtnClick}
+        onImportSuccess={handleImportSuccess}
+      />
+    </DashboardInsider>
+  );
+}

packages/webapp/src/containers/Sales/PaymentReceives/PaymentsLanding/PaymentReceiveActionsBar.tsx

@@ -26,7 +26,10 @@ import withPaymentReceives from './withPaymentReceives';
 import withPaymentReceivesActions from './withPaymentReceivesActions';
 import withSettings from '@/containers/Settings/withSettings';
 import withSettingsActions from '@/containers/Settings/withSettingsActions';
-import { PaymentReceiveAction, AbilitySubject } from '@/constants/abilityOption';
+import {
+  PaymentReceiveAction,
+  AbilitySubject,
+} from '@/constants/abilityOption';
 import { usePaymentReceivesListContext } from './PaymentReceiptsListProvider';
 import { useRefreshPaymentReceive } from '@/hooks/query/paymentReceives';
 import { compose } from '@/utils';
@@ -75,6 +78,10 @@ function PaymentReceiveActionsBar({
   const handleTableRowSizeChange = (size) => {
     addSetting('paymentReceives', 'tableSize', size);
   };
+  // Handle the import button click.
+  const handleImportBtnClick = () => {
+    history.push('/payment-receives/import');
+  };
 
   return (
     <DashboardActionsBar>
@@ -126,6 +133,7 @@ function PaymentReceiveActionsBar({
           className={Classes.MINIMAL}
           icon={<Icon icon={'file-import-16'} />}
           text={<T id={'import'} />}
+          onClick={handleImportBtnClick}
         />
         <Button
           className={Classes.MINIMAL}