From cd8f64dfdc72cd7df124692334ac2837581d1d7e Mon Sep 17 00:00:00 2001
From: "a.nasouf" <a.m.nasouf@gmail.com>
Date: Sat, 10 Feb 2024 21:04:54 +0200
Subject: [PATCH 1/3] feat(webapp): add mark as delivered to action bar of
 invoice details drawer

---
 .../InvoiceDetailDrawer/InvoiceDetailActionsBar.tsx      | 6 ++++++
 .../src/containers/Drawers/InvoiceDetailDrawer/utils.tsx | 9 ++++++++-
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailActionsBar.tsx b/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailActionsBar.tsx
index 4a2482165..678517ef4 100644
--- a/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailActionsBar.tsx
+++ b/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/InvoiceDetailActionsBar.tsx
@@ -57,6 +57,11 @@ function InvoiceDetailActionsBar({
     closeDrawer(DRAWERS.INVOICE_DETAILS);
   };
 
+  // Hanlde deliver sale invoice.
+  const handleDeliverInvoice = ({ id }) => {
+    openAlert('invoice-deliver', { invoiceId });
+  };
+
   // Handle convert to invoice.
   const handleConvertToCreitNote = () => {
     history.push(`/credit-notes/new?from_invoice_id=${invoiceId}`, {
@@ -153,6 +158,7 @@ function InvoiceDetailActionsBar({
               onCancelBadDebt: handleCancelBadDebtInvoice,
               onNotifyViaSMS: handleNotifyViaSMS,
               onConvert: handleConvertToCreitNote,
+              onDeliver: handleDeliverInvoice,
             }}
           />
         </Can>
diff --git a/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/utils.tsx b/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/utils.tsx
index fc2d3d1b4..bb7f8ebc8 100644
--- a/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/utils.tsx
+++ b/packages/webapp/src/containers/Drawers/InvoiceDetailDrawer/utils.tsx
@@ -19,6 +19,7 @@ import {
   FormattedMessage as T,
   Choose,
   Can,
+  If,
   TextOverviewTooltipCell,
 } from '@/components';
 import { SaleInvoiceAction, AbilitySubject } from '@/constants/abilityOption';
@@ -94,7 +95,7 @@ export const useInvoiceReadonlyEntriesColumns = () => {
  * @returns {React.JSX}
  */
 export const BadDebtMenuItem = ({
-  payload: { onCancelBadDebt, onBadDebt, onNotifyViaSMS, onConvert },
+  payload: { onCancelBadDebt, onBadDebt, onNotifyViaSMS, onConvert, onDeliver },
 }) => {
   const { invoice } = useInvoiceDetailDrawerContext();
 
@@ -108,6 +109,12 @@ export const BadDebtMenuItem = ({
       }}
       content={
         <Menu>
+          <If condition={!invoice.is_delivered}>
+            <MenuItem
+              onClick={onDeliver}
+              text={<T id={'mark_as_delivered'} />}
+            />
+          </If>
           <Choose>
             <Choose.When condition={!invoice.is_writtenoff}>
               <MenuItem

From a8671a8d999a9d7882f2f3a5419b310947fadd45 Mon Sep 17 00:00:00 2001
From: "a.nasouf" <a.m.nasouf@gmail.com>
Date: Sat, 10 Feb 2024 22:18:13 +0200
Subject: [PATCH 2/3] feat(webapp): add convert to invoice on estimate drawer
 toolbar

---
 .../EstimateDetailActionsBar.tsx                  | 15 +++++++++++++++
 1 file changed, 15 insertions(+)

diff --git a/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx b/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
index 3ac2b1b75..02ebed97c 100644
--- a/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
+++ b/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
@@ -52,6 +52,15 @@ function EstimateDetailActionsBar({
     history.push(`/estimates/${estimateId}/edit`);
     closeDrawer(DRAWERS.ESTIMATE_DETAILS);
   };
+
+  // Handle convert to invoice.
+  const handleConvertEstimate = () => {
+    history.push(`/invoices/new?from_estimate_id=${estimateId}`, {
+      action: estimateId,
+    });
+    closeDrawer(DRAWERS.ESTIMATE_DETAILS);
+  };
+
   // Handle delete sale estimate.
   const handleDeleteEstimate = () => {
     openAlert('estimate-delete', { estimateId });
@@ -84,6 +93,12 @@ function EstimateDetailActionsBar({
         </Can>
 
         <Can I={SaleEstimateAction.View} a={AbilitySubject.Estimate}>
+          <Button
+            className={Classes.MINIMAL}
+            icon={<Icon icon="convert_to" />}
+            text={<T id={'convert_to_invoice'} />}
+            onClick={handleConvertEstimate}
+          />
           <Button
             className={Classes.MINIMAL}
             icon={<Icon icon="envelope" />}

From ab7eb40ea95d84de4c196f549105efed2af85e2d Mon Sep 17 00:00:00 2001
From: Ahmed Bouhuolia <a.bouhuolia@gmail.com>
Date: Mon, 26 Feb 2024 15:29:51 +0200
Subject: [PATCH 3/3] feat(webapp): add icon to convert to invoice button

---
 .../EstimateDetailActionsBar.tsx              | 29 ++++++++++++-------
 packages/webapp/src/static/json/icons.tsx     |  6 ++++
 .../src/style/pages/Dashboard/Dashboard.scss  | 10 +++++++
 3 files changed, 35 insertions(+), 10 deletions(-)

diff --git a/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx b/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
index 02ebed97c..a01be889d 100644
--- a/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
+++ b/packages/webapp/src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.tsx
@@ -14,14 +14,18 @@ import { useEstimateDetailDrawerContext } from './EstimateDetailDrawerProvider';
 import withDialogActions from '@/containers/Dialog/withDialogActions';
 import withAlertsActions from '@/containers/Alert/withAlertActions';
 import withDrawerActions from '@/containers/Drawer/withDrawerActions';
-import { SaleEstimateAction, AbilitySubject } from '@/constants/abilityOption';
+import {
+  SaleEstimateAction,
+  AbilitySubject,
+  SaleInvoiceAction,
+} from '@/constants/abilityOption';
 import { EstimateMoreMenuItems } from './components';
 import {
   DrawerActionsBar,
   Icon,
   FormattedMessage as T,
   Can,
-  Choose,
+  If,
 } from '@/components';
 
 import { compose } from '@/utils';
@@ -42,7 +46,7 @@ function EstimateDetailActionsBar({
   closeDrawer,
 }) {
   // Estimate details drawer context.
-  const { estimateId } = useEstimateDetailDrawerContext();
+  const { estimateId, estimate } = useEstimateDetailDrawerContext();
 
   // History.
   const history = useHistory();
@@ -91,14 +95,19 @@ function EstimateDetailActionsBar({
           />
           <NavbarDivider />
         </Can>
-
+        <Can I={SaleInvoiceAction.Create} a={AbilitySubject.Invoice}>
+          <If condition={!estimate.is_converted_to_invoice}>
+            <Button
+              className={Classes.MINIMAL}
+              intent={Intent.SUCCESS}
+              icon={<Icon icon="tick" />}
+              text={<T id={'convert_to_invoice'} />}
+              onClick={handleConvertEstimate}
+            />
+            <NavbarDivider />
+          </If>
+        </Can>
         <Can I={SaleEstimateAction.View} a={AbilitySubject.Estimate}>
-          <Button
-            className={Classes.MINIMAL}
-            icon={<Icon icon="convert_to" />}
-            text={<T id={'convert_to_invoice'} />}
-            onClick={handleConvertEstimate}
-          />
           <Button
             className={Classes.MINIMAL}
             icon={<Icon icon="envelope" />}
diff --git a/packages/webapp/src/static/json/icons.tsx b/packages/webapp/src/static/json/icons.tsx
index e60213bb8..5bfafa141 100644
--- a/packages/webapp/src/static/json/icons.tsx
+++ b/packages/webapp/src/static/json/icons.tsx
@@ -382,6 +382,12 @@ export default {
     ],
     viewBox: '0 0 20 20',
   },
+  tick: {
+    path: [
+      'M14,3c-0.28,0-0.53,0.11-0.71,0.29L6,10.59L2.71,7.29C2.53,7.11,2.28,7,2,7C1.45,7,1,7.45,1,8c0,0.28,0.11,0.53,0.29,0.71l4,4C5.47,12.89,5.72,13,6,13s0.53-0.11,0.71-0.29l8-8C14.89,4.53,15,4.28,15,4C15,3.45,14.55,3,14,3z',
+    ],
+    viewBox: '0 0 16 16',
+  },
   'swap-vert': {
     path: [
       'M10.6,10.9V5.4H9v5.5H6.7L9.8,14l3.1-3.1ZM5.1,0,2,3.1H4.3V8.6H5.9V3.1H8.2Z',
diff --git a/packages/webapp/src/style/pages/Dashboard/Dashboard.scss b/packages/webapp/src/style/pages/Dashboard/Dashboard.scss
index b45ead46a..13edd6d11 100644
--- a/packages/webapp/src/style/pages/Dashboard/Dashboard.scss
+++ b/packages/webapp/src/style/pages/Dashboard/Dashboard.scss
@@ -212,6 +212,16 @@ $dashboard-views-bar-height: 44px;
             background: rgba(219, 55, 55, 0.1);
           }
         }
+        &.#{$ns}-minimal.#{$ns}-intent-success{
+          color: #1c6e42;
+
+          &:hover,
+          &:focus {
+            background: rgba(35, 133, 81, 0.1);
+            color: #1c6e42;
+          }
+        }
+
 
         &.button--blue-highlight {
           background-color: #ebfaff;