Merge pull request #2349 from Civolilah/feature/1876-create-invoice

[Feature] Creating Action For Invoicing "Debit" Transactions
invoiceninja · Feb 10, 2025 · e73123c · e73123c
2 parents d1ba13b + 6d7716e
commit e73123c
Show file tree

Hide file tree

Showing 2 changed files with 60 additions and 6 deletions.
diff --git a/src/pages/invoices/create/Create.tsx b/src/pages/invoices/create/Create.tsx
@@ -110,7 +110,8 @@ export default function Create() {
         searchParams.get('action') !== 'invoice_project' &&
         searchParams.get('action') !== 'invoice_task' &&
         searchParams.get('action') !== 'invoice_expense' &&
-        searchParams.get('action') !== 'invoice_product'
+        searchParams.get('action') !== 'invoice_product' &&
+        searchParams.get('action') !== 'invoice_transaction'
       ) {
         value = undefined;
       }
@@ -145,7 +146,8 @@ export default function Create() {
         searchParams.get('action') !== 'invoice_project' &&
         searchParams.get('action') !== 'invoice_task' &&
         searchParams.get('action') !== 'invoice_expense' &&
-        searchParams.get('action') !== 'invoice_product'
+        searchParams.get('action') !== 'invoice_product' &&
+        searchParams.get('action') !== 'invoice_transaction'
       ) {
         setInvoice(undefined);
       }

diff --git a/src/pages/transactions/common/hooks/useActions.tsx b/src/pages/transactions/common/hooks/useActions.tsx
@@ -8,25 +8,74 @@
  * @license https://www.elastic.co/licensing/elastic-license
  */
 
+import { blankLineItem } from '$app/common/constants/blank-line-item';
 import { EntityState } from '$app/common/enums/entity-state';
+import { ApiTransactionType } from '$app/common/enums/transactions';
 import { getEntityState } from '$app/common/helpers';
 import { useEntityPageIdentifier } from '$app/common/hooks/useEntityPageIdentifier';
 import { Transaction } from '$app/common/interfaces/transactions';
+import { useBlankInvoiceQuery } from '$app/common/queries/invoices';
 import { useBulk } from '$app/common/queries/transactions';
 import { Divider } from '$app/components/cards/Divider';
 import { DropdownElement } from '$app/components/dropdown/DropdownElement';
 import { Icon } from '$app/components/icons/Icon';
 import { Action } from '$app/components/ResourceActions';
+import { invoiceAtom } from '$app/pages/invoices/common/atoms';
+import { useSetAtom } from 'jotai';
+import { cloneDeep } from 'lodash';
 import { useTranslation } from 'react-i18next';
-import { MdArchive, MdDelete, MdLinkOff, MdRestore } from 'react-icons/md';
+import {
+  MdArchive,
+  MdControlPointDuplicate,
+  MdDelete,
+  MdLinkOff,
+  MdRestore,
+} from 'react-icons/md';
+import { useNavigate } from 'react-router-dom';
 
 export function useActions() {
   const [t] = useTranslation();
+
   const bulk = useBulk();
+  const navigate = useNavigate();
 
   const { isEditPage } = useEntityPageIdentifier({ entity: 'transaction' });
 
+  const { data: blankInvoice } = useBlankInvoiceQuery();
+
+  const setInvoice = useSetAtom(invoiceAtom);
+
+  const handleCreateInvoice = (transaction: Transaction) => {
+    if (!blankInvoice) return;
+
+    setInvoice(
+      cloneDeep({
+        ...blankInvoice,
+        line_items: [
+          {
+            ...blankLineItem(),
+            notes: transaction.description,
+            cost: transaction.amount,
+            product_key: transaction.date,
+            quantity: 1,
+          },
+        ],
+      })
+    );
+
+    navigate('/invoices/create?action=invoice_transaction');
+  };
+
   const actions: Action<Transaction>[] = [
+    (transaction) =>
+      transaction.base_type === ApiTransactionType.Credit && (
+        <DropdownElement
+          onClick={() => handleCreateInvoice(transaction)}
+          icon={<Icon element={MdControlPointDuplicate} />}
+        >
+          {t('create_invoice')}
+        </DropdownElement>
+      ),
     (transaction) =>
       transaction.payment_id && (
         <DropdownElement
@@ -36,10 +85,13 @@ export function useActions() {
           {t('unlink')}
         </DropdownElement>
       ),
+
     (transaction) =>
-      Boolean(transaction.payment_id && isEditPage) && (
-        <Divider withoutPadding />
-      ),
+      Boolean(
+        (transaction.payment_id ||
+          transaction.base_type === ApiTransactionType.Credit) &&
+          isEditPage
+      ) && <Divider withoutPadding />,
     (transaction) =>
       getEntityState(transaction) === EntityState.Active &&
       isEditPage && (