From 5fddd080fd455c1fcf94c002cb28fcf7fe336fea Mon Sep 17 00:00:00 2001 From: Ahmed Bouhuolia Date: Wed, 30 Oct 2024 13:10:56 +0200 Subject: [PATCH] feat: wip send invoice mail receipt --- .../CreditNoteCustomizeDrawer.tsx | 7 +++- .../EstimateCustomizeDrawer.tsx | 7 +++- .../InvoiceCustomizeDrawer.tsx | 7 +++- .../InvoiceCustomizeMailReceiptPreview.tsx | 2 +- .../InvoiceSendMailDrawer.tsx | 7 +++- .../InvoiceSendMailFields.tsx | 34 +++++++++---------- .../InvoiceSendMailForm.tsx | 5 +-- .../InvoiceSendMailHeaderPreview.tsx | 21 +++++------- .../Invoices/InvoiceSendMailDrawer/_types.ts | 1 + .../ReceiptCustomizeDrawer.tsx | 7 +++- packages/webapp/src/hooks/query/invoices.tsx | 4 +-- 11 files changed, 63 insertions(+), 39 deletions(-) diff --git a/packages/webapp/src/containers/Sales/CreditNotes/CreditNoteCustomize/CreditNoteCustomizeDrawer.tsx b/packages/webapp/src/containers/Sales/CreditNotes/CreditNoteCustomize/CreditNoteCustomizeDrawer.tsx index 42159714e..863c8c4ef 100644 --- a/packages/webapp/src/containers/Sales/CreditNotes/CreditNoteCustomize/CreditNoteCustomizeDrawer.tsx +++ b/packages/webapp/src/containers/Sales/CreditNotes/CreditNoteCustomize/CreditNoteCustomizeDrawer.tsx @@ -19,7 +19,12 @@ function CreditNoteCustomizeDrawerRoot({ payload, }) { return ( - + diff --git a/packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeDrawer.tsx b/packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeDrawer.tsx index 35bd969ea..66d0db268 100644 --- a/packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeDrawer.tsx +++ b/packages/webapp/src/containers/Sales/Estimates/EstimateCustomize/EstimateCustomizeDrawer.tsx @@ -20,7 +20,12 @@ function EstimateCustomizeDrawerRoot({ payload, }) { return ( - + diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeDrawer.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeDrawer.tsx index 7c6ae6589..8ecf93b5a 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeDrawer.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeDrawer.tsx @@ -17,7 +17,12 @@ function InvoiceCustomizeDrawerRoot({ payload, }) { return ( - + diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeMailReceiptPreview.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeMailReceiptPreview.tsx index 9037c3638..3bafdb5a7 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeMailReceiptPreview.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceCustomize/InvoiceCustomizeMailReceiptPreview.tsx @@ -1,8 +1,8 @@ import * as R from 'ramda'; +import { useFormikContext } from 'formik'; import { InvoicePaymentPagePreviewProps } from '@/containers/PaymentPortal/InvoicePaymentPagePreview'; import { InvoiceCustomizeFormValues } from './types'; import { useElementCustomizeContext } from '@/containers/ElementCustomize/ElementCustomizeProvider'; -import { useFormikContext } from 'formik'; import { InvoiceMailReceiptPreview } from './InvoiceMailReceiptPreview'; import { Box } from '@/components'; diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailDrawer.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailDrawer.tsx index 908109714..237f37149 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailDrawer.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailDrawer.tsx @@ -23,7 +23,12 @@ function InvoiceSendMailDrawerRoot({ payload, }: InvoiceSendMailDrawerProps) { return ( - + diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailFields.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailFields.tsx index 72fc9cd34..c6a761fbe 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailFields.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailFields.tsx @@ -1,11 +1,11 @@ // @ts-nocheck -import { useRef, useState } from 'react'; import { Button, Intent, MenuItem, Position } from '@blueprintjs/core'; +import { useRef, useState, useMemo, useCallback } from 'react'; import { useFormikContext } from 'formik'; +import { SelectOptionProps } from '@blueprintjs-formik/select'; import { css } from '@emotion/css'; -import { x } from '@xstyled/emotion'; -import { unique, chain } from 'lodash'; import { + FCheckbox, FFormGroup, FInputGroup, FMultiSelect, @@ -17,7 +17,6 @@ import { } from '@/components'; import { useDrawerContext } from '@/components/Drawer/DrawerProvider'; import { useDrawerActions } from '@/hooks/state'; -import { SelectOptionProps } from '@blueprintjs-formik/select'; import { useInvoiceMailItems } from './_hooks'; // Create new account renderer. @@ -62,7 +61,7 @@ const fieldsWrapStyle = css` export function InvoiceSendMailFields() { const [showCCField, setShowCCField] = useState(false); const [showBccField, setShowBccField] = useState(false); - const textareaRef = useRef(null); + const textareaRef = useRef(null); const { values, setFieldValue } = useFormikContext(); const items = useInvoiceMailItems(); @@ -92,7 +91,7 @@ export function InvoiceSendMailFields() { setFieldValue('bcc', [...values?.bcc, value?.name]); }; - const rightElementsToField = ( + const rightElementsToField = useMemo(() => ( - ); + ), []); - const handleTextareaChange = () => { + const handleTextareaChange = useCallback((item: SelectOptionProps) => { const textarea = textareaRef.current; if (!textarea) return; - const { selectionStart, selectionEnd } = textarea; - const insertText = '{Variable}'; - - // Insert the text at the cursor position + const { selectionStart, selectionEnd, value: text } = textarea; + const insertText = item.value; const message = text.substring(0, selectionStart) + insertText + @@ -139,10 +136,9 @@ export function InvoiceSendMailFields() { setTimeout(() => { textarea.selectionStart = textarea.selectionEnd = selectionStart + insertText.length; - textarea.focus(); }, 0); - }; + }, [setFieldValue]); return ( + + + + diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailForm.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailForm.tsx index 263ab405a..c938d34e5 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailForm.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailForm.tsx @@ -10,12 +10,13 @@ import { useDrawerActions } from '@/hooks/state'; import { useDrawerContext } from '@/components/Drawer/DrawerProvider'; import { transformToForm } from '@/utils'; -const initialValues = { +const initialValues: InvoiceSendMailFormValues = { subject: '', message: '', to: [], cc: [], bcc: [], + attachPdf: true, }; interface InvoiceSendMailFormProps { @@ -28,7 +29,7 @@ export function InvoiceSendMailForm({ children }: InvoiceSendMailFormProps) { const { name } = useDrawerContext(); const { closeDrawer } = useDrawerActions(); - const _initialValues = { + const _initialValues: InvoiceSendMailFormValues = { ...initialValues, ...transformToForm(invoiceMailOptions, initialValues), }; diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailHeaderPreview.tsx b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailHeaderPreview.tsx index cbafd6070..0cf30d3ea 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailHeaderPreview.tsx +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/InvoiceSendMailHeaderPreview.tsx @@ -1,4 +1,3 @@ -import { css } from '@emotion/css'; import { x } from '@xstyled/emotion'; import { Box, Group, Stack } from '@/components'; import React from 'react'; @@ -27,17 +26,15 @@ export function InvoiceSendMailHeaderPreview() { A diff --git a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/_types.ts b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/_types.ts index fbb7dc204..6681c2238 100644 --- a/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/_types.ts +++ b/packages/webapp/src/containers/Sales/Invoices/InvoiceSendMailDrawer/_types.ts @@ -4,4 +4,5 @@ export interface InvoiceSendMailFormValues { to: string[]; cc: string[]; bcc: string[]; + attachPdf: boolean; } diff --git a/packages/webapp/src/containers/Sales/Receipts/ReceiptCustomize/ReceiptCustomizeDrawer.tsx b/packages/webapp/src/containers/Sales/Receipts/ReceiptCustomize/ReceiptCustomizeDrawer.tsx index 7c54cf61d..c4e8ed82d 100644 --- a/packages/webapp/src/containers/Sales/Receipts/ReceiptCustomize/ReceiptCustomizeDrawer.tsx +++ b/packages/webapp/src/containers/Sales/Receipts/ReceiptCustomize/ReceiptCustomizeDrawer.tsx @@ -19,7 +19,12 @@ function ReceiptCustomizeDrawerRoot({ payload, }) { return ( - + diff --git a/packages/webapp/src/hooks/query/invoices.tsx b/packages/webapp/src/hooks/query/invoices.tsx index 9e2c72e8c..dcd24ba52 100644 --- a/packages/webapp/src/hooks/query/invoices.tsx +++ b/packages/webapp/src/hooks/query/invoices.tsx @@ -320,7 +320,7 @@ export function useInvoicePaymentTransactions(invoiceId, props) { ); } -interface SendSaleInvoiceMailValues { +export interface SendSaleInvoiceMailValues { id: number; values: { subject: string; @@ -331,7 +331,7 @@ interface SendSaleInvoiceMailValues { attachInvoice?: boolean; }; } -interface SendSaleInvoiceMailResponse {} +export interface SendSaleInvoiceMailResponse { } /** * Sends the sale invoice mail. * @param {UseMutationOptions}