feat: refactoring alerts.

src/containers/Sales/Estimates/EstimatesAlerts.js

@@ -1,19 +1,36 @@
 import React from 'react';
-import EstimateDeleteAlert from 'containers/Alerts/Estimates/EstimateDeleteAlert';
-import EstimateDeliveredAlert from 'containers/Alerts/Estimates/EstimateDeliveredAlert';
-import EstimateApproveAlert from 'containers/Alerts/Estimates/EstimateApproveAlert';
-import EstimateRejectAlert from 'containers/Alerts/Estimates/EstimateRejectAlert';
+
+const EstimateDeleteAlert = React.lazy(() =>
+  import('containers/Alerts/Estimates/EstimateDeleteAlert'),
+);
+const EstimateDeliveredAlert = React.lazy(() =>
+  import('containers/Alerts/Estimates/EstimateDeliveredAlert'),
+);
+const EstimateApproveAlert = React.lazy(() =>
+  import('containers/Alerts/Estimates/EstimateApproveAlert'),
+);
+const EstimateRejectAlert = React.lazy(() =>
+  import('containers/Alerts/Estimates/EstimateRejectAlert'),
+);
 
 /**
  * Estimates alert.
  */
-export default function EstimatesAlerts() {
-  return (
-    <div>
-      <EstimateDeleteAlert name={'estimate-delete'} />
-      <EstimateDeliveredAlert name={'estimate-deliver'} />
-      <EstimateApproveAlert name={'estimate-Approve'} />
-      <EstimateRejectAlert name={'estimate-reject'} />
-    </div>
-  );
-}
+export default [
+  {
+    name: 'estimate-delete',
+    component: EstimateDeleteAlert,
+  },
+  {
+    name: 'estimate-deliver',
+    component: EstimateDeliveredAlert,
+  },
+  {
+    name: 'estimate-Approve',
+    component: EstimateApproveAlert,
+  },
+  {
+    name: 'estimate-reject',
+    component: EstimateRejectAlert,
+  },
+];

src/containers/Sales/Estimates/EstimatesLanding/EstimatesList.js

@@ -4,7 +4,6 @@ import { DashboardContentTable, DashboardPageContent } from 'components';
 import 'style/pages/SaleEstimate/List.scss';
 
 import EstimatesActionsBar from './EstimatesActionsBar';
-import EstimatesAlerts from '../EstimatesAlerts';
 import EstimatesViewTabs from './EstimatesViewTabs';
 import EstimatesDataTable from './EstimatesDataTable';
 
@@ -45,7 +44,6 @@ function EstimatesList({
         <EstimatesDataTable />
       </DashboardPageContent>
 
-      <EstimatesAlerts />
     </EstimatesListProvider>
   );
 }

src/containers/Sales/Invoices/InvoicesAlerts.js

@@ -1,15 +1,16 @@
 import React from 'react';
-import InvoiceDeleteAlert from 'containers/Alerts/Invoices/InvoiceDeleteAlert';
-import InvoiceDeliverAlert from 'containers/Alerts/Invoices/InvoiceDeliverAlert';
+
+const InvoiceDeleteAlert = React.lazy(() =>
+  import('../../Alerts/Invoices/InvoiceDeleteAlert'),
+);
+const InvoiceDeliverAlert = React.lazy(() =>
+  import('../../Alerts/Invoices/InvoiceDeliverAlert'),
+);
 
 /**
  * Invoices alert.
  */
-export default function ItemsAlerts() {
-  return (
-    <div>
-      <InvoiceDeleteAlert name={'invoice-delete'} />
-      <InvoiceDeliverAlert name={'invoice-deliver'} />
-    </div>
-  );
-}
+export default [
+  { name: 'invoice-delete', component: InvoiceDeleteAlert },
+  { name: 'invoice-deliver', component: InvoiceDeliverAlert },
+];

src/containers/Sales/Invoices/InvoicesLanding/InvoicesList.js

@@ -8,7 +8,6 @@ import { InvoicesListProvider } from './InvoicesListProvider';
 
 import InvoiceViewTabs from './InvoiceViewTabs';
 import InvoicesDataTable from './InvoicesDataTable';
-import InvoicesAlerts from '../InvoicesAlerts';
 
 import withInvoices from './withInvoices';
 import withInvoiceActions from './withInvoiceActions';
@@ -46,8 +45,6 @@ function InvoicesList({
         <InvoiceViewTabs />
         <InvoicesDataTable />
       </DashboardPageContent>
-
-      <InvoicesAlerts />
     </InvoicesListProvider>
   );
 }

src/containers/Sales/PaymentReceives/PaymentReceiveAlerts.js

@@ -1,13 +1,12 @@
 import React from 'react';
-import PaymentReceiveDeleteAlert from 'containers/Alerts/PaymentReceives/PaymentReceiveDeleteAlert';
+
+const PaymentReceiveDeleteAlert = React.lazy(() =>
+  import('../../Alerts/PaymentReceives/PaymentReceiveDeleteAlert'),
+);
 
 /**
  * PaymentReceives alert.
  */
-export default function EstimatesAlerts() {
-  return (
-    <div>
-      <PaymentReceiveDeleteAlert name={'payment-receive-delete'} />
-    </div>
-  );
-}
+export default [
+  { name: 'payment-receive-delete', component: PaymentReceiveDeleteAlert },
+];

src/containers/Sales/PaymentReceives/PaymentsLanding/PaymentReceivesList.js

@@ -4,7 +4,6 @@ import 'style/pages/PaymentReceive/List.scss';
 
 import { DashboardContentTable, DashboardPageContent } from 'components';
 import PaymentReceiveActionsBar from './PaymentReceiveActionsBar';
-import PaymentReceiveAlerts from '../PaymentReceiveAlerts';
 import { PaymentReceivesListProvider } from './PaymentReceiptsListProvider';
 import PaymentReceiveViewTabs from './PaymentReceiveViewTabs';
 import PaymentReceivesTable from './PaymentReceivesTable';
@@ -44,8 +43,6 @@ function PaymentReceiveList({
         <PaymentReceiveViewTabs />
         <PaymentReceivesTable />
       </DashboardPageContent>
-
-      <PaymentReceiveAlerts />
     </PaymentReceivesListProvider>
   );
 }

src/containers/Sales/Receipts/ReceiptsAlerts.js

@@ -1,15 +1,16 @@
 import React from 'react';
-import ReceiptDeleteAlert from 'containers/Alerts/Receipts/ReceiptDeleteAlert';
-import ReceiptCloseAlert from 'containers/Alerts/Receipts/ReceiptCloseAlert';
+
+const ReceiptDeleteAlert = React.lazy(() =>
+  import('../../Alerts/Receipts/ReceiptDeleteAlert'),
+);
+const ReceiptCloseAlert = React.lazy(() =>
+  import('../../Alerts/Receipts/ReceiptCloseAlert'),
+);
 
 /**
  * Receipts alerts.
  */
-export default function ReceiptsAlerts() {
-  return (
-    <div>
-      <ReceiptDeleteAlert name={'receipt-delete'} />
-      <ReceiptCloseAlert name={'receipt-close'} />
-    </div>
-  );
-}
+export default [
+  { name: 'receipt-delete', component: ReceiptDeleteAlert },
+  { name: 'receipt-close', component: ReceiptCloseAlert },
+];

src/containers/Sales/Receipts/ReceiptsLanding/ReceiptsList.js

@@ -5,7 +5,6 @@ import 'style/pages/SaleReceipt/List.scss';
 
 import ReceiptActionsBar from './ReceiptActionsBar';
 import ReceiptViewTabs from './ReceiptViewTabs';
-import ReceiptsAlerts from '../ReceiptsAlerts';
 import ReceiptsTable from './ReceiptsTable';
 
 import withReceipts from './withReceipts';
@@ -46,7 +45,6 @@ function ReceiptsList({
           <ReceiptsTable />
         </DashboardPageContent>
 
-        <ReceiptsAlerts />
       </DashboardPageContent>
     </ReceiptsListProvider>
   );