Actualización de los totales cuando se cambia algún item

modules/customer-invoices/src/web/components/editor/invoice-totals.tsx

@@ -20,17 +20,12 @@ export const InvoiceTotals = (props: ComponentProps<"fieldset">) => {
   const { control, getValues } = useFormContext<InvoiceFormData>();
   const { currency_code, language_code, readOnly, taxCatalog } = useInvoiceContext();
 
-  const displayTaxes = useWatch({
+  const displayTaxes = useWatch({ control, name: "taxes", defaultValue: [] });
-    control,
+  const subtotal_amount = useWatch({ control, name: "subtotal_amount", defaultValue: 0 });
-    name: "taxes",
+  const discount_amount = useWatch({ control, name: "discount_amount", defaultValue: 0 });
-    defaultValue: [],
+  const taxable_amount = useWatch({ control, name: "taxable_amount", defaultValue: 0 });
-  });
+  const taxes_amount = useWatch({ control, name: "taxes_amount", defaultValue: 0 });
-
+  const total_amount = useWatch({ control, name: "total_amount", defaultValue: 0 });
-  const subtotal_amount = useWatch({
-    control,
-    name: "subtotal_amount",
-    defaultValue: 0,
-  });
 
   return (
     <FieldSet {...props}>
@@ -66,7 +61,7 @@ export const InvoiceTotals = (props: ComponentProps<"fieldset">) => {
               />
             </div>
             <span className='font-medium text-destructive tabular-nums'>
-              -{formatCurrency(getValues("discount_amount"), 2, currency_code, language_code)}
+              -{formatCurrency(discount_amount, 2, currency_code, language_code)}
             </span>
           </div>
 
@@ -74,7 +69,7 @@ export const InvoiceTotals = (props: ComponentProps<"fieldset">) => {
           <div className='flex justify-between text-sm'>
             <span className='text-foreground'>Base imponible</span>
             <span className='font-medium tabular-nums'>
-              {formatCurrency(getValues("taxable_amount"), 2, currency_code, language_code)}
+              {formatCurrency(taxable_amount, 2, currency_code, language_code)}
             </span>
           </div>
         </div>
@@ -126,7 +121,7 @@ export const InvoiceTotals = (props: ComponentProps<"fieldset">) => {
           <div className='flex justify-between text-sm mt-3'>
             <span className='text-foreground'>Total de impuestos</span>
             <span className='font-medium tabular-nums'>
-              {formatCurrency(getValues("taxes_amount"), 2, currency_code, language_code)}
+              {formatCurrency(taxes_amount, 2, currency_code, language_code)}
             </span>
           </div>
         </div>
@@ -136,7 +131,7 @@ export const InvoiceTotals = (props: ComponentProps<"fieldset">) => {
         <div className='flex justify-between text-sm '>
           <span className='font-bold text-foreground'>Total de la factura</span>
           <span className='font-bold tabular-nums'>
-            {formatCurrency(getValues("total_amount"), 2, currency_code, language_code)}
+            {formatCurrency(total_amount, 2, currency_code, language_code)}
           </span>
         </div>
       </FieldGroup>