QT/bigcapital
1
0
Fork 0
mirror of https://github.com/bigcapitalhq/bigcapital.git synced 2026-02-17 13:20:31 +00:00
Code Issues Packages Projects Releases Wiki Activity

chore(webapp): move components in separate files

Browse Source
This commit is contained in:
Ahmed Bouhuolia
2023-06-22 01:30:05 +02:00
parent 532ad61500
commit 1f3adf4879
12 changed files with 596 additions and 553 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
packages/webapp/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormHeaderFields.tsx
View File

@@ -2,16 +2,9 @@
import React, { useCallback } from 'react';
import styled from 'styled-components';
import classNames from 'classnames';
import {
FormGroup,
InputGroup,
Position,
Classes,
ControlGroup,
} from '@blueprintjs/core';
import { FormGroup, InputGroup, Position, Classes } from '@blueprintjs/core';
import { DateInput } from '@blueprintjs/datetime';
import { FastField, ErrorMessage, useFormikContext } from 'formik';
import * as R from 'ramda';
import { FastField, ErrorMessage } from 'formik';
import { CLASSES } from '@/constants/classes';
import { ACCOUNT_TYPE } from '@/constants/accountTypes';
@@ -22,11 +15,9 @@ import {
CustomerSelectField,
FieldRequiredHint,
Icon,
InputPrependButton,
CustomerDrawerLink,
FormattedMessage as T,
FeatureCan,
FInputGroup,
} from '@/components';
import { ProjectsSelect } from '@/containers/Projects/components';
import {
@@ -41,90 +32,7 @@ import {
ReceiptExchangeRateInputField,
ReceiptProjectSelectButton,
} from './components';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* Receipt number field of receipt form.
*/
const ReceiptFormReceiptNumberField = R.compose(
withDialogActions,
withSettings(({ receiptSettings }) => ({
receiptAutoIncrement: receiptSettings?.autoIncrement,
})),
)(
({
// #withDialogActions
openDialog,
// #withSettings
receiptAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
const handleReceiptNumberChange = () => {
openDialog('receipt-number-form', {});
};
const handleReceiptNoBlur = (event) => {
const newValue = event.target.value;
// Show the confirmation dialog if the value has changed and auto-increment
// mode is enabled.
if (values.receipt_number !== newValue && receiptAutoIncrement) {
openDialog('receipt-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
// Setting the receipt number to the form will be manually in case
// auto-increment is disable.
if (!receiptAutoIncrement) {
setFieldValue('receipt_number', newValue);
setFieldValue('receipt_number_manually', newValue);
}
};
return (
<FFormGroup
name={'receipt_number'}
label={<T id={'receipt'} />}
inline={true}
labelInfo={<FieldRequiredHint />}
>
<ControlGroup fill={true}>
<FInputGroup
name={'receipt_number'}
minimal={true}
value={values.receipt_number}
asyncControl={true}
onBlur={handleReceiptNoBlur}
onChange={() => {}}
/>
<InputPrependButton
buttonProps={{
onClick: handleReceiptNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_payment_receive_number'} />
),
position: Position.BOTTOM_LEFT,
}}
inputProps={{
leftIcon: <Icon icon={'date-range'} />,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
import { ReceiptFormReceiptNumberField } from './ReceiptFormReceiptNumberField';
/**
* Receipt form header fields.

99
packages/webapp/src/containers/Sales/Receipts/ReceiptForm/ReceiptFormReceiptNumberField.tsx Normal file
View File

@@ -0,0 +1,99 @@
// @ts-nocheck
import React from 'react';
import { Position, ControlGroup } from '@blueprintjs/core';
import { useFormikContext } from 'formik';
import * as R from 'ramda';
import {
FFormGroup,
FieldRequiredHint,
Icon,
InputPrependButton,
FormattedMessage as T,
FInputGroup,
} from '@/components';
import withSettings from '@/containers/Settings/withSettings';
import withDialogActions from '@/containers/Dialog/withDialogActions';
/**
* Receipt number field of receipt form.
*/
export const ReceiptFormReceiptNumberField = R.compose(
withDialogActions,
withSettings(({ receiptSettings }) => ({
receiptAutoIncrement: receiptSettings?.autoIncrement,
})),
)(
({
// #withDialogActions
openDialog,
// #withSettings
receiptAutoIncrement,
}) => {
const { values, setFieldValue } = useFormikContext();
const handleReceiptNumberChange = () => {
openDialog('receipt-number-form', {});
};
const handleReceiptNoBlur = (event) => {
const newValue = event.target.value;
// Show the confirmation dialog if the value has changed and auto-increment
// mode is enabled.
if (values.receipt_number !== newValue && receiptAutoIncrement) {
openDialog('receipt-number-form', {
initialFormValues: {
onceManualNumber: newValue,
incrementMode: 'manual-transaction',
},
});
}
// Setting the receipt number to the form will be manually in case
// auto-increment is disable.
if (!receiptAutoIncrement) {
setFieldValue('receipt_number', newValue);
setFieldValue('receipt_number_manually', newValue);
}
};
return (
<FFormGroup
name={'receipt_number'}
label={<T id={'receipt'} />}
inline={true}
labelInfo={<FieldRequiredHint />}
>
<ControlGroup fill={true}>
<FInputGroup
name={'receipt_number'}
minimal={true}
value={values.receipt_number}
asyncControl={true}
onBlur={handleReceiptNoBlur}
onChange={() => {}}
/>
<InputPrependButton
buttonProps={{
onClick: handleReceiptNumberChange,
icon: <Icon icon={'settings-18'} />,
}}
tooltip={true}
tooltipProps={{
content: (
<T id={'setting_your_auto_generated_payment_receive_number'} />
),
position: Position.BOTTOM_LEFT,
}}
inputProps={{
leftIcon: <Icon icon={'date-range'} />,
}}
/>
</ControlGroup>
</FFormGroup>
);
},
);
ReceiptFormReceiptNumberField.displayName = 'ReceiptFormReceiptNumberField';