fix: auto-increment settings

packages/webapp/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormDialogs.tsx

@@ -1,25 +1,24 @@
 // @ts-nocheck
 import React from 'react';
-import CreditNoteNumberDialog from '@/containers/Dialogs/CreditNoteNumberDialog';
 import { useFormikContext } from 'formik';
+import CreditNoteNumberDialog from '@/containers/Dialogs/CreditNoteNumberDialog';
 
 /**
  * Credit note form dialogs.
  */
 export default function CreditNoteFormDialogs() {
+  const { setFieldValue } = useFormikContext();
+ 
   // Update the form once the credit number form submit confirm.
-  const handleCreditNumberFormConfirm = ({ incrementNumber, manually }) => {
-    setFieldValue('credit_note_number', incrementNumber || '');
-    setFieldValue('credit_note_no_manually', manually);
+  const handleCreditNumberFormConfirm = (settings) => {
+    setFieldValue('credit_note_number', settings.transactionNumber);
+    setFieldValue('credit_note_no_manually', settings.transactionNumber);
   };
 
-  const { setFieldValue } = useFormikContext();
   return (
-    <React.Fragment>
-      <CreditNoteNumberDialog
-        dialogName={'credit-number-form'}
-        onConfirm={handleCreditNumberFormConfirm}
-      />
-    </React.Fragment>
+    <CreditNoteNumberDialog
+      dialogName={'credit-number-form'}
+      onConfirm={handleCreditNumberFormConfirm}
+    />
   );
 }

packages/webapp/src/containers/Sales/CreditNotes/CreditNoteForm/CreditNoteFormHeaderFields.tsx

@@ -1,5 +1,6 @@
 // @ts-nocheck
 import React from 'react';
+import * as R from 'ramda';
 import classNames from 'classnames';
 import styled from 'styled-components';
 import {
@@ -9,7 +10,8 @@ import {
   ControlGroup,
 } from '@blueprintjs/core';
 import { DateInput } from '@blueprintjs/datetime';
-import { FastField, Field, ErrorMessage } from 'formik';
+import { FastField, Field, ErrorMessage, useFormikContext } from 'formik';
+
 import { CLASSES } from '@/constants/classes';
 import {
   CustomerSelectField,
@@ -18,10 +20,9 @@ import {
   Icon,
   FormattedMessage as T,
   CustomerDrawerLink,
+  FFormGroup,
 } from '@/components';
-import {
-  customerNameFieldShouldUpdate,
-} from './utils';
+import { customerNameFieldShouldUpdate } from './utils';
 
 import { useCreditNoteFormContext } from './CreditNoteFormProvider';
 import withSettings from '@/containers/Settings/withSettings';
@@ -29,44 +30,93 @@ import withDialogActions from '@/containers/Dialog/withDialogActions';
 import { CreditNoteExchangeRateInputField } from './components';
 import {
   momentFormatter,
-  compose,
   tansformDateValue,
   inputIntent,
   handleDateChange,
 } from '@/utils';
 
+/**
+ * Credit note transaction number field.
+ */
+const CreditNoteTransactionNoField = R.compose(
+  withDialogActions,
+  withSettings(({ creditNoteSettings }) => ({
+    creditAutoIncrement: creditNoteSettings?.autoIncrement,
+    creditNextNumber: creditNoteSettings?.nextNumber,
+    creditNumberPrefix: creditNoteSettings?.numberPrefix,
+  })),
+)(
+  ({
+    // #withDialogActions
+    openDialog,
+
+    // #withSettings
+    creditAutoIncrement,
+  }) => {
+    const { values, setFieldValue } = useFormikContext();
+
+    // Handle credit number changing.
+    const handleCreditNumberChange = () => {
+      openDialog('credit-number-form');
+    };
+    // Handle credit no. field blur.
+    const handleCreditNoBlur = (event) => {
+      const newValue = event.target.value;
+
+      if (values.credit_note_no !== newValue && creditAutoIncrement) {
+        openDialog('credit-number-form', {
+          initialFormValues: {
+            onceManualNumber: newValue,
+            incrementMode: 'manual-transaction',
+          },
+        });
+      }
+      if (!creditAutoIncrement) {
+        setFieldValue('credit_note_number', newValue);
+        setFieldValue('credit_note_number_manually', newValue);
+      }
+    };
+
+    return (
+      <FFormGroup
+        name={'credit_note_number'}
+        label={<T id={'credit_note.label_credit_note'} />}
+        labelInfo={<FieldRequiredHint />}
+        inline={true}
+      >
+        <ControlGroup fill={true}>
+          <InputGroup
+            minimal={true}
+            value={values.credit_note_number}
+            asyncControl={true}
+            onBlur={handleCreditNoBlur}
+          />
+          <InputPrependButton
+            buttonProps={{
+              onClick: handleCreditNumberChange,
+              icon: <Icon icon={'settings-18'} />,
+            }}
+            tooltip={true}
+            tooltipProps={{
+              content: (
+                <T id={'setting_your_auto_generated_credit_note_number'} />
+              ),
+              position: Position.BOTTOM_LEFT,
+            }}
+          />
+        </ControlGroup>
+      </FFormGroup>
+    );
+  },
+);
+
 /**
  * Credit note form header fields.
  */
-function CreditNoteFormHeaderFields({
-  // #withDialogActions
-  openDialog,
-
-  // #withSettings
-  creditAutoIncrement,
-}) {
+export default function CreditNoteFormHeaderFields({}) {
   // Credit note form context.
   const { customers } = useCreditNoteFormContext();
 
-  // Handle credit number changing.
-  const handleCreditNumberChange = () => {
-    openDialog('credit-number-form');
-  };
-
-  // Handle credit no. field blur.
-  const handleCreditNoBlur = (form, field) => (event) => {
-    const newValue = event.target.value;
-
-    if (field.value !== newValue && creditAutoIncrement) {
-      openDialog('credit-number-form', {
-        initialFormValues: {
-          manualTransactionNo: newValue,
-          incrementMode: 'manual-transaction',
-        },
-      });
-    }
-  };
-
   return (
     <div className={classNames(CLASSES.PAGE_FORM_HEADER_FIELDS)}>
       {/* ----------- Customer name ----------- */}
@@ -140,43 +190,8 @@ function CreditNoteFormHeaderFields({
         )}
       </FastField>
       {/* ----------- Credit note # ----------- */}
-      <Field name={'credit_note_number'}>
-        {({ form, field, meta: { error, touched } }) => (
-          <FormGroup
-            label={<T id={'credit_note.label_credit_note'} />}
-            labelInfo={<FieldRequiredHint />}
-            inline={true}
-            className={classNames(
-              'form-group--credit_note_number',
-              CLASSES.FILL,
-            )}
-            intent={inputIntent({ error, touched })}
-            helperText={<ErrorMessage name="credit_note_number" />}
-          >
-            <ControlGroup fill={true}>
-              <InputGroup
-                minimal={true}
-                value={field.value}
-                asyncControl={true}
-                onBlur={handleCreditNoBlur(form, field)}
-              />
-              <InputPrependButton
-                buttonProps={{
-                  onClick: handleCreditNumberChange,
-                  icon: <Icon icon={'settings-18'} />,
-                }}
-                tooltip={true}
-                tooltipProps={{
-                  content: (
-                    <T id={'setting_your_auto_generated_credit_note_number'} />
-                  ),
-                  position: Position.BOTTOM_LEFT,
-                }}
-              />
-            </ControlGroup>
-          </FormGroup>
-        )}
-      </Field>
+      <CreditNoteTransactionNoField />
+
       {/* ----------- Reference ----------- */}
       <FastField name={'reference_no'}>
         {({ field, meta: { error, touched } }) => (
@@ -194,14 +209,6 @@ function CreditNoteFormHeaderFields({
     </div>
   );
 }
-export default compose(
-  withDialogActions,
-  withSettings(({ creditNoteSettings }) => ({
-    creditAutoIncrement: creditNoteSettings?.autoIncrement,
-    creditNextNumber: creditNoteSettings?.nextNumber,
-    creditNumberPrefix: creditNoteSettings?.numberPrefix,
-  })),
-)(CreditNoteFormHeaderFields);
 
 const CustomerButtonLink = styled(CustomerDrawerLink)`
   font-size: 11px;