diff --git a/src/common/cashflowOptions.js b/src/common/cashflowOptions.js
index 6ff7401f5..480b71162 100644
--- a/src/common/cashflowOptions.js
+++ b/src/common/cashflowOptions.js
@@ -3,29 +3,30 @@ import intl from 'react-intl-universal';
export const addMoneyIn = [
{
name: intl.get('cash_flow.option_owner_contribution'),
- type: 'OWNER_CONTRIBUTION',
+ value: 'owner_contribution',
},
{
name: intl.get('cash_flow.option_other_income'),
type: 'OTHER_INCOME',
+ value: 'other_income',
},
{
name: intl.get('cash_flow.option_transfer_form_account'),
- type: 'TRANSFER_FROM_ACCOUNT',
+ value: 'transfer_from_account',
},
];
export const addMoneyOut = [
{
name: intl.get('cash_flow.option_owner_drawings'),
- type: 'ONWERS_DRAWING',
+ value: 'onwers_drawing',
},
{
name: intl.get('cash_flow.option_expenses'),
- type: 'OTHER_EXPENSE',
+ value: 'other_expense',
},
{
name: intl.get('cash_flow.option_transfer_to_account'),
- type: 'TRANSFER_TO_ACCOUNT',
+ value: 'transfer_to_account',
},
];
diff --git a/src/components/Dashboard/GlobalHotkeys.js b/src/components/Dashboard/GlobalHotkeys.js
index 3ca7a2b0b..2bf734b9e 100644
--- a/src/components/Dashboard/GlobalHotkeys.js
+++ b/src/components/Dashboard/GlobalHotkeys.js
@@ -3,11 +3,16 @@ import { useHotkeys } from 'react-hotkeys-hook';
import { useHistory } from 'react-router-dom';
import { getDashboardRoutes } from 'routes/dashboard';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
+import withDialogActions from 'containers/Dialog/withDialogActions';
+
import { compose } from 'utils';
function GlobalHotkeys({
// #withDashboardActions
toggleSidebarExpend,
+
+ // #withDialogActions
+ openDialog,
}) {
const history = useHistory();
const routes = getDashboardRoutes();
@@ -16,8 +21,8 @@ function GlobalHotkeys({
.filter(({ hotkey }) => hotkey)
.map(({ hotkey }) => hotkey)
.toString();
-
- const handleSidebarToggleBtn = () => {
+
+ const handleSidebarToggleBtn = () => {
toggleSidebarExpend();
};
useHotkeys(
@@ -32,7 +37,9 @@ function GlobalHotkeys({
[history],
);
useHotkeys('ctrl+/', (event, handle) => handleSidebarToggleBtn());
+ useHotkeys('shift+q', (event, handle) => openDialog('money-in', {}));
+ useHotkeys('shift+d', (event, handle) => openDialog('money-out', {}));
return
;
}
-export default compose(withDashboardActions)(GlobalHotkeys);
+export default compose(withDashboardActions, withDialogActions)(GlobalHotkeys);
diff --git a/src/containers/CashFlow/AccountTransactions/AccountTransactionsActionsBar.js b/src/containers/CashFlow/AccountTransactions/AccountTransactionsActionsBar.js
index 27fab2255..34d322fc6 100644
--- a/src/containers/CashFlow/AccountTransactions/AccountTransactionsActionsBar.js
+++ b/src/containers/CashFlow/AccountTransactions/AccountTransactionsActionsBar.js
@@ -40,17 +40,17 @@ function AccountTransactionsActionsBar({
const { accountId } = useAccountTransactionsContext();
// Handle money in form
- const handleMoneyInFormTransaction = (value) => {
+ const handleMoneyInFormTransaction = (account) => {
openDialog('money-in', {
- account_type: value.type,
+ account_type: account,
account_id: accountId,
});
};
// Handle money out form
- const handlMoneyOutFormTransaction = (value) => {
+ const handlMoneyOutFormTransaction = (account) => {
openDialog('money-out', {
- account_type: value.type,
+ account_type: account,
account_id: accountId,
});
};
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInContentFields.js b/src/containers/Dialogs/MoneyInDialog/MoneyInContentFields.js
new file mode 100644
index 000000000..838c173aa
--- /dev/null
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInContentFields.js
@@ -0,0 +1,23 @@
+import React from 'react';
+import OwnerContributionFormFields from './OwnerContribution/OwnerContributionFormFields';
+import OtherIncomeFormFields from './OtherIncome/OtherIncomeFormFields';
+import TransferFromAccountFormFields from './TransferFromAccount/TransferFromAccountFormFields';
+
+export default function MoneyInContentFields({ accountType }) {
+ const handleTransactionType = () => {
+ switch (accountType) {
+ case 'owner_contribution':
+ return ;
+
+ case 'other_income':
+ return ;
+
+ case 'transfer_from_account':
+ return ;
+ default:
+ break;
+ }
+ };
+
+ return {handleTransactionType()};
+}
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogContent.js b/src/containers/Dialogs/MoneyInDialog/MoneyInDialogContent.js
index 959490ded..7eee4f501 100644
--- a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogContent.js
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInDialogContent.js
@@ -1,7 +1,7 @@
import React from 'react';
import { MoneyInDialogProvider } from './MoneyInDialogProvider';
-import MoneyInDialogForm from './MoneyInDialogForm';
+import MoneyInForm from './MoneyInForm';
/**
* Money in dialog content.
@@ -13,8 +13,12 @@ export default function MoneyInDialogContent({
accountType,
}) {
return (
-
-
+
+
);
}
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogForm.js b/src/containers/Dialogs/MoneyInDialog/MoneyInDialogForm.js
deleted file mode 100644
index 6ea90e77a..000000000
--- a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogForm.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import React from 'react';
-import OwnerContributionForm from './OwnerContribution/OwnerContributionForm';
-import OtherIncomeForm from './OtherIncome/OtherIncomeForm';
-import TransferFromAccountForm from './TransferFromAccount/TransferFromAccountForm';
-
-export default function MoneyInDialogForm({ accountType }) {
- // Handle from transaction.
- const handleFromTransaction = () => {
- switch (accountType) {
- case 'OWNER_CONTRIBUTION':
- return ;
-
- case 'OTHER_INCOME':
- return ;
-
- case 'TRANSFER_FROM_ACCOUNT':
- return ;
- default:
- break;
- }
- };
-
- return {handleFromTransaction()};
-}
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogProvider.js b/src/containers/Dialogs/MoneyInDialog/MoneyInDialogProvider.js
index 0525c8edf..8d365451d 100644
--- a/src/containers/Dialogs/MoneyInDialog/MoneyInDialogProvider.js
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInDialogProvider.js
@@ -1,16 +1,29 @@
import React from 'react';
import { DialogContent } from 'components';
-import { useCreateCashflowTransaction, useAccounts } from 'hooks/query';
+import {
+ useCreateCashflowTransaction,
+ useAccounts,
+ useCashflowAccounts,
+} from 'hooks/query';
const MoneyInDialogContent = React.createContext();
/**
* Money in dialog provider.
*/
-function MoneyInDialogProvider({ accountId, dialogName, ...props }) {
+function MoneyInDialogProvider({
+ accountId,
+ accountType,
+ dialogName,
+ ...props
+}) {
// Fetches accounts list.
const { isFetching: isAccountsLoading, data: accounts } = useAccounts();
+ // Fetch cash flow list .
+ const { data: cashflowAccounts, isLoading: isCashFlowAccountsLoading } =
+ useCashflowAccounts({}, { keepPreviousData: true });
+
const { mutateAsync: createCashflowTransactionMutate } =
useCreateCashflowTransaction();
@@ -21,8 +34,11 @@ function MoneyInDialogProvider({ accountId, dialogName, ...props }) {
const provider = {
accounts,
accountId,
+ accountType,
isAccountsLoading,
+ cashflowAccounts,
+
submitPayload,
dialogName,
@@ -31,7 +47,7 @@ function MoneyInDialogProvider({ accountId, dialogName, ...props }) {
};
return (
-
+
);
diff --git a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.js b/src/containers/Dialogs/MoneyInDialog/MoneyInForm.js
similarity index 77%
rename from src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.js
rename to src/containers/Dialogs/MoneyInDialog/MoneyInForm.js
index 3f47fc31b..dfe4ab7fe 100644
--- a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.js
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInForm.js
@@ -8,10 +8,11 @@ import intl from 'react-intl-universal';
import 'style/pages/CashFlow/CashflowTransactionForm.scss';
import { AppToaster } from 'components';
-import { CreateOtherIncomeFormSchema } from './OtherIncomeForm.schema';
-import OtherIncomeFormContent from './OtherIncomeFormContent';
-import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
+import MoneyInFormContent from './MoneyInFormContent';
+import { CreateMoneyInFormSchema } from './MoneyInForm.schema';
+
+import { useMoneyInDailogContext } from './MoneyInDialogProvider';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
@@ -22,7 +23,7 @@ const defaultInitialValues = {
date: moment(new Date()).format('YYYY-MM-DD'),
amount: '',
transaction_number: '',
- transaction_type: 'other_income',
+ transaction_type: '',
reference_no: '',
cashflow_account_id: '',
credit_account_id: '',
@@ -30,10 +31,7 @@ const defaultInitialValues = {
published: '',
};
-/**
- * Other income form.
- */
-function OtherIncomeForm({
+function MoneyInForm({
// #withDialogActions
closeDialog,
@@ -43,6 +41,7 @@ function OtherIncomeForm({
const {
dialogName,
accountId,
+ accountType,
createCashflowTransactionMutate,
submitPayload,
} = useMoneyInDailogContext();
@@ -51,6 +50,7 @@ function OtherIncomeForm({
const initialValues = {
...defaultInitialValues,
currency_code: base_currency,
+ transaction_type: accountType,
cashflow_account_id: accountId,
};
@@ -76,17 +76,19 @@ function OtherIncomeForm({
};
return (
-
-
-
+
+
+
+
+
);
}
export default compose(
withDialogActions,
withCurrentOrganization(),
-)(OtherIncomeForm);
+)(MoneyInForm);
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.schema.js b/src/containers/Dialogs/MoneyInDialog/MoneyInForm.schema.js
similarity index 80%
rename from src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.schema.js
rename to src/containers/Dialogs/MoneyInDialog/MoneyInForm.schema.js
index 39b71ab31..63711f142 100644
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.schema.js
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInForm.schema.js
@@ -8,9 +8,7 @@ const Schema = Yup.object().shape({
transaction_number: Yup.string(),
transaction_type: Yup.string().required(),
reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('account')),
+ credit_account_id: Yup.number().required(),
cashflow_account_id: Yup.string().required(),
description: Yup.string()
.min(3)
@@ -19,4 +17,4 @@ const Schema = Yup.object().shape({
published: Yup.boolean(),
});
-export const CreateTransferToAccountFormSchema = Schema;
+export const CreateMoneyInFormSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInFormContent.js b/src/containers/Dialogs/MoneyInDialog/MoneyInFormContent.js
new file mode 100644
index 000000000..c3e01b84e
--- /dev/null
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInFormContent.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import { Form } from 'formik';
+
+import MoneyInFormFields from './MoneyInFormFields';
+import MoneyInFloatingActions from './MoneyInFloatingActions';
+
+/**
+ * Money In form content.
+ */
+export default function MoneyInFormContent() {
+ return (
+
+ );
+}
diff --git a/src/containers/Dialogs/MoneyInDialog/MoneyInFormFields.js b/src/containers/Dialogs/MoneyInDialog/MoneyInFormFields.js
new file mode 100644
index 000000000..08fcab957
--- /dev/null
+++ b/src/containers/Dialogs/MoneyInDialog/MoneyInFormFields.js
@@ -0,0 +1,30 @@
+import React from 'react';
+import { useFormikContext } from 'formik';
+import { Classes } from '@blueprintjs/core';
+
+import { If } from 'components';
+
+import MoneyInContentFields from './MoneyInContentFields';
+import TransactionTypeFields from './TransactionTypeFields';
+import { useMoneyInDailogContext } from './MoneyInDialogProvider';
+
+/**
+ * Money in form fields.
+ */
+function MoneyInFormFields() {
+ const { values } = useFormikContext();
+
+ // Money in dialog context.
+ const { accountId } = useMoneyInDailogContext();
+
+ return (
+
+
+
+
+
+
+ );
+}
+
+export default MoneyInFormFields;
diff --git a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormContent.js b/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormContent.js
deleted file mode 100644
index e05f48788..000000000
--- a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormContent.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import OtherIncomeFormFields from './OtherIncomeFormFields';
-import MoneyInFloatingActions from '../MoneyInFloatingActions';
-
-/**
- * Other income form content.
- */
-export default function OtherIncomeFormContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js b/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
index 0a2544b96..f0e10f72a 100644
--- a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeFormFields.js
@@ -41,7 +41,7 @@ function OtherIncomeFormFields() {
const amountFieldRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -187,7 +187,7 @@ function OtherIncomeFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.js b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.js
deleted file mode 100644
index e7ff7bfaf..000000000
--- a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import React from 'react';
-import moment from 'moment';
-import { Intent } from '@blueprintjs/core';
-import { Formik } from 'formik';
-import { omit } from 'lodash';
-import intl from 'react-intl-universal';
-
-import 'style/pages/CashFlow/CashflowTransactionForm.scss';
-
-import { AppToaster } from 'components';
-import { CreateOwnerContributionFormSchema } from './OwnerContributionForm.schema';
-import OwnerContributionFormContent from './OwnerContributionFormContent';
-
-import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
-
-import { compose } from 'utils';
-
-const defaultInitialValues = {
- date: moment(new Date()).format('YYYY-MM-DD'),
- amount: '',
- transaction_number: '',
- transaction_type: 'owner_contribution',
- reference_no: '',
- cashflow_account_id: '',
- credit_account_id: '',
- description: '',
- published: '',
-};
-
-/**
- * Owner contribution form
- */
-function OwnerContributionForm({
- // #withDialogActions
- closeDialog,
-
- // #withCurrentOrganization
- organization: { base_currency },
-}) {
- const {
- dialogName,
- accountId,
- submitPayload,
- createCashflowTransactionMutate,
- } = useMoneyInDailogContext();
-
- // Initial form values.
- const initialValues = {
- ...defaultInitialValues,
- currency_code: base_currency,
- cashflow_account_id: accountId,
- };
-
- // Handles the form submit.
- const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
- const form = {
- ...omit(values, ['currency_code']),
- published: submitPayload.publish,
- };
- setSubmitting(true);
- createCashflowTransactionMutate(form)
- .then(() => {
- closeDialog(dialogName);
-
- AppToaster.show({
- message: intl.get('cash_flow_transaction_success_message'),
- intent: Intent.SUCCESS,
- });
- })
- .finally(() => {
- setSubmitting(true);
- });
- };
-
- return (
-
-
-
- );
-}
-
-export default compose(
- withDialogActions,
- withCurrentOrganization(),
-)(OwnerContributionForm);
diff --git a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.schema.js b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.schema.js
deleted file mode 100644
index b877c0e26..000000000
--- a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionForm.schema.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as Yup from 'yup';
-import intl from 'react-intl-universal';
-import { DATATYPES_LENGTH } from 'common/dataTypes';
-
-const Schema = Yup.object().shape({
- date: Yup.date().required().label(intl.get('date')),
- amount: Yup.number().required().label(intl.get('amount')),
- transaction_number: Yup.string(),
- transaction_type: Yup.string().required(),
- reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('cash_flow_transaction.label_equity_account')),
- cashflow_account_id: Yup.string().required(),
- description: Yup.string()
- .min(3)
- .max(DATATYPES_LENGTH.TEXT)
- .label(intl.get('description')),
- published: Yup.boolean(),
-});
-
-export const CreateOwnerContributionFormSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormContent.js b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormContent.js
deleted file mode 100644
index 27932fc3b..000000000
--- a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormContent.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import OwnerContributionFormFields from './OwnerContributionFormFields';
-import MoneyInFloatingActions from '../MoneyInFloatingActions';
-
-/**
- * Owner contribution form content.
- */
-export default function OwnerContributionFormContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
index 6bcea0830..203e5387f 100644
--- a/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/OwnerContribution/OwnerContributionFormFields.js
@@ -39,7 +39,7 @@ function OwnerContributionFormFields() {
const amountFieldRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -183,7 +183,7 @@ function OwnerContributionFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyInDialog/TransactionTypeFields.js b/src/containers/Dialogs/MoneyInDialog/TransactionTypeFields.js
new file mode 100644
index 000000000..ecc3b0bb0
--- /dev/null
+++ b/src/containers/Dialogs/MoneyInDialog/TransactionTypeFields.js
@@ -0,0 +1,94 @@
+import React from 'react';
+import { FastField, Field, ErrorMessage } from 'formik';
+import { Classes, FormGroup } from '@blueprintjs/core';
+import classNames from 'classnames';
+import {
+ FormattedMessage as T,
+ AccountsSuggestField,
+ FieldRequiredHint,
+ ListSelect,
+ Col,
+ Row,
+} from 'components';
+
+import { inputIntent } from 'utils';
+import { CLASSES } from 'common/classes';
+import { addMoneyIn } from '../../../common/cashflowOptions';
+
+import { useMoneyInDailogContext } from './MoneyInDialogProvider';
+
+/**
+ * Transaction type fields.
+ */
+export default function TransactionTypeFields() {
+ // Money in dialog context.
+ const { cashflowAccounts } = useMoneyInDailogContext();
+
+ return (
+
+
+
+ {/*------------ Current account -----------*/}
+
+ {({ form, field: { value }, meta: { error, touched } }) => (
+ }
+ labelInfo={}
+ intent={inputIntent({ error, touched })}
+ helperText={}
+ minimal={true}
+ className={classNames(
+ CLASSES.FILL,
+ 'form-group--cashflow_account_id',
+ )}
+ >
+
+ form.setFieldValue('cashflow_account_id', id)
+ }
+ inputProps={{
+ intent: inputIntent({ error, touched }),
+ }}
+ />
+
+ )}
+
+ {/*------------ Transaction type -----------*/}
+
+
+
+ {({
+ form: { values, setFieldValue },
+ field: { value },
+ meta: { error, touched },
+ }) => (
+ }
+ labelInfo={}
+ helperText={}
+ intent={inputIntent({ error, touched })}
+ className={classNames(
+ CLASSES.FILL,
+ 'form-group--transaction_type',
+ )}
+ >
+ {
+ setFieldValue('transaction_type', type.value);
+ }}
+ filterable={false}
+ selectedItem={value}
+ selectedItemProp={'value'}
+ textProp={'name'}
+ popoverProps={{ minimal: true }}
+ />
+
+ )}
+
+
+
+
+ );
+}
diff --git a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.js b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.js
deleted file mode 100644
index 17636469a..000000000
--- a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import React from 'react';
-import moment from 'moment';
-import { Intent } from '@blueprintjs/core';
-import { Formik } from 'formik';
-import { omit } from 'lodash';
-import intl from 'react-intl-universal';
-
-import 'style/pages/CashFlow/CashflowTransactionForm.scss';
-
-import { AppToaster } from 'components';
-import { CreateTransferFromAccountFormSchema } from './TransferFromAccountForm.schema';
-import TransferFromAccountFormContent from './TransferFromAccountFormContent';
-
-import { useMoneyInDailogContext } from '../MoneyInDialogProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
-
-import { compose } from 'utils';
-
-const defaultInitialValues = {
- date: moment(new Date()).format('YYYY-MM-DD'),
- amount: '',
- transaction_number: '',
- transaction_type: 'transfer_from_account',
- reference_no: '',
- cashflow_account_id: '',
- credit_account_id: '',
- description: '',
- published: '',
-};
-
-/**
- * Transfer from account form.
- */
-function TransferFromAccountForm({
- // #withDialogActions
- closeDialog,
-
- // #withCurrentOrganization
- organization: { base_currency },
-}) {
- const {
- dialogName,
- accountId,
- createCashflowTransactionMutate,
- submitPayload,
- } = useMoneyInDailogContext();
-
- // Initial form values.
- const initialValues = {
- ...defaultInitialValues,
- currency_code: base_currency,
- cashflow_account_id: accountId,
- };
-
- // Handles the form submit.
- const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
- const form = {
- ...omit(values, ['currency_code']),
- published: submitPayload.publish,
- };
- setSubmitting(true);
- createCashflowTransactionMutate(form)
- .then(() => {
- closeDialog(dialogName);
-
- AppToaster.show({
- message: intl.get('cash_flow_transaction_success_message'),
- intent: Intent.SUCCESS,
- });
- })
- .finally(() => {
- setSubmitting(true);
- });
- };
-
- return (
-
-
-
- );
-}
-
-export default compose(
- withDialogActions,
- withCurrentOrganization(),
-)(TransferFromAccountForm);
diff --git a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.schema.js b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.schema.js
deleted file mode 100644
index 3e1786695..000000000
--- a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountForm.schema.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as Yup from 'yup';
-import intl from 'react-intl-universal';
-import { DATATYPES_LENGTH } from 'common/dataTypes';
-
-const Schema = Yup.object().shape({
- date: Yup.date().required().label(intl.get('date')),
- amount: Yup.number().required().label(intl.get('amount')),
- transaction_number: Yup.string(),
- transaction_type: Yup.string().required(),
- reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('cash_flow_transaction.label_transfer_account')),
- cashflow_account_id: Yup.string().required(),
- description: Yup.string()
- .min(3)
- .max(DATATYPES_LENGTH.TEXT)
- .label(intl.get('description')),
- published: Yup.boolean(),
-});
-
-export const CreateTransferFromAccountFormSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormContent.js b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormContent.js
deleted file mode 100644
index 073a893e2..000000000
--- a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormContent.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import TransferFromAccountFormFields from './TransferFromAccountFormFields';
-import MoneyInFloatingActions from '../MoneyInFloatingActions';
-
-export default function TransferFromAccountFormContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
index 118f71e0c..7925e3c48 100644
--- a/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
+++ b/src/containers/Dialogs/MoneyInDialog/TransferFromAccount/TransferFromAccountFormFields.js
@@ -41,7 +41,7 @@ function TransferFromAccountFormFields() {
const amountFieldRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -190,7 +190,7 @@ function TransferFromAccountFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyInDialog/index.js b/src/containers/Dialogs/MoneyInDialog/index.js
index a751b3934..d5098a413 100644
--- a/src/containers/Dialogs/MoneyInDialog/index.js
+++ b/src/containers/Dialogs/MoneyInDialog/index.js
@@ -1,7 +1,8 @@
import React from 'react';
-import { FormattedMessage as T } from 'components';
+import intl from 'react-intl-universal';
import { Dialog, DialogSuspense } from 'components';
import withDialogRedux from 'components/DialogReduxConnect';
+
import { compose } from 'redux';
const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent'));
@@ -11,13 +12,16 @@ const MoneyInDialogContent = React.lazy(() => import('./MoneyInDialogContent'));
*/
function MoneyInDialog({
dialogName,
- payload = { action: '', account_type: null, account_id: null },
+ payload = { account_type: null, account_id: null },
isOpen,
}) {
+
return (
}
+ title={intl.get('cash_flow_transaction.money_in', {
+ value: payload.account_type?.name,
+ })}
isOpen={isOpen}
canEscapeJeyClose={true}
autoFocus={true}
@@ -27,7 +31,7 @@ function MoneyInDialog({
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutContentFields.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutContentFields.js
new file mode 100644
index 000000000..536af6d0c
--- /dev/null
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutContentFields.js
@@ -0,0 +1,26 @@
+import React from 'react';
+
+import OtherExpnseFormFields from './OtherExpense/OtherExpnseFormFields';
+import OwnerDrawingsFormFields from './OwnerDrawings/OwnerDrawingsFormFields';
+import TransferToAccountFormFields from './TransferToAccount/TransferToAccountFormFields';
+
+function MoneyOutContentFields({ accountType }) {
+ const handleTransactionType = () => {
+ switch (accountType) {
+ case 'onwers_drawing':
+ return ;
+
+ case 'other_expense':
+ return ;
+
+ case 'transfer_to_account':
+ return ;
+ default:
+ break;
+ }
+ };
+
+ return {handleTransactionType()};
+}
+
+export default MoneyOutContentFields;
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogContent.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogContent.js
index 3c8ad3ac8..70ec9424e 100644
--- a/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogContent.js
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogContent.js
@@ -1,6 +1,6 @@
import React from 'react';
-import { MoneyOutProvider } from './MoneyOutProvider';
-import MoneyOutDialogForm from './MoneyOutDialogForm';
+import { MoneyOutProvider } from './MoneyOutDialogProvider';
+import MoneyOutForm from './MoneyOutForm';
/**
* Money out dailog content.
@@ -12,8 +12,12 @@ export default function MoneyOutDialogContent({
accountType,
}) {
return (
-
-
+
+
);
}
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogForm.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogForm.js
deleted file mode 100644
index 11880eacd..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogForm.js
+++ /dev/null
@@ -1,24 +0,0 @@
-import React from 'react';
-import OwnerDrawingsForm from './OwnerDrawings/OwnerDrawingsForm';
-import OtherExpenseForm from './OtherExpense/OtherExpenseForm';
-import TransferToAccountForm from './TransferToAccount/TransferToAccountForm';
-
-export default function MoneyOutDialogForm({ accountType }) {
- // Handle from transaction.
- const handleFromTransaction = () => {
- switch (accountType) {
- case 'ONWERS_DRAWING':
- return ;
-
- case 'OTHER_EXPENSE':
- return ;
-
- case 'TRANSFER_TO_ACCOUNT':
- return ;
- default:
- break;
- }
- };
-
- return {handleFromTransaction()};
-}
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutProvider.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogProvider.js
similarity index 60%
rename from src/containers/Dialogs/MoneyOutDialog/MoneyOutProvider.js
rename to src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogProvider.js
index e0564ab5a..fb11f772a 100644
--- a/src/containers/Dialogs/MoneyOutDialog/MoneyOutProvider.js
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutDialogProvider.js
@@ -1,19 +1,23 @@
import React from 'react';
import { DialogContent } from 'components';
-import { useAccounts, useCreateCashflowTransaction } from 'hooks/query';
+import {
+ useAccounts,
+ useCreateCashflowTransaction,
+ useCashflowAccounts,
+} from 'hooks/query';
const MoneyInDialogContent = React.createContext();
/**
* Money out dialog provider.
*/
-function MoneyOutProvider({ accountId, dialogName, ...props }) {
+function MoneyOutProvider({ accountId, accountType, dialogName, ...props }) {
// Fetches accounts list.
- const {
- isFetching: isAccountFetching,
- isLoading: isAccountsLoading,
- data: accounts,
- } = useAccounts();
+ const { isLoading: isAccountsLoading, data: accounts } = useAccounts();
+
+ // Fetch cash flow list .
+ const { data: cashflowAccounts, isLoading: isCashFlowAccountsLoading } =
+ useCashflowAccounts({}, { keepPreviousData: true });
const { mutateAsync: createCashflowTransactionMutate } =
useCreateCashflowTransaction();
@@ -25,8 +29,11 @@ function MoneyOutProvider({ accountId, dialogName, ...props }) {
const provider = {
accounts,
accountId,
+ accountType,
isAccountsLoading,
+ cashflowAccounts,
+
submitPayload,
dialogName,
@@ -35,7 +42,7 @@ function MoneyOutProvider({ accountId, dialogName, ...props }) {
};
return (
-
+
);
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFloatingActions.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFloatingActions.js
similarity index 86%
rename from src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFloatingActions.js
rename to src/containers/Dialogs/MoneyOutDialog/MoneyOutFloatingActions.js
index b8ed31d47..cd7b987e7 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFloatingActions.js
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFloatingActions.js
@@ -3,15 +3,17 @@ import { Intent, Button, Classes } from '@blueprintjs/core';
import { useFormikContext } from 'formik';
import { FormattedMessage as T } from 'components';
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
+import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
import withDialogActions from 'containers/Dialog/withDialogActions';
+import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
+
import { compose } from 'utils';
/**
- * Owner drawings floating actions.
+ * Money out floating actions.
*/
-function OwnerDrawingsFloatingActions({
+function MoneyOutFloatingActions({
// #withDialogActions
closeDialog,
}) {
@@ -73,4 +75,4 @@ function OwnerDrawingsFloatingActions({
);
}
-export default compose(withDialogActions)(OwnerDrawingsFloatingActions);
+export default compose(withDialogActions)(MoneyOutFloatingActions);
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.js
similarity index 77%
rename from src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.js
rename to src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.js
index 13513022e..6a5c08dcb 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.js
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.js
@@ -8,10 +8,11 @@ import intl from 'react-intl-universal';
import 'style/pages/CashFlow/CashflowTransactionForm.scss';
import { AppToaster } from 'components';
-import { CreateOtherExpenseFormSchema } from './OtherExpenseForm.schema';
-import OtherExpenseFormContent from './OtherExpenseFormContent';
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
+import MoneyOutFormContent from './MoneyOutFormContent';
+import { CreateMoneyOutSchema } from './MoneyOutForm.schema';
+
+import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
import withDialogActions from 'containers/Dialog/withDialogActions';
import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
@@ -22,7 +23,7 @@ const defaultInitialValues = {
date: moment(new Date()).format('YYYY-MM-DD'),
amount: '',
transaction_number: '',
- transaction_type: 'other_expense',
+ transaction_type: '',
reference_no: '',
cashflow_account_id: '',
credit_account_id: '',
@@ -30,10 +31,7 @@ const defaultInitialValues = {
published: '',
};
-/**
- * Other expense form.
- */
-function OtherExpenseForm({
+function MoneyOutForm({
// #withDialogActions
closeDialog,
@@ -43,6 +41,7 @@ function OtherExpenseForm({
const {
dialogName,
accountId,
+ accountType,
createCashflowTransactionMutate,
submitPayload,
} = useMoneyOutDialogContext();
@@ -51,6 +50,7 @@ function OtherExpenseForm({
const initialValues = {
...defaultInitialValues,
currency_code: base_currency,
+ transaction_type: accountType,
cashflow_account_id: accountId,
};
@@ -74,19 +74,20 @@ function OtherExpenseForm({
setSubmitting(true);
});
};
-
return (
-
-
-
+
+
+
+
+
);
}
export default compose(
withDialogActions,
withCurrentOrganization(),
-)(OtherExpenseForm);
+)(MoneyOutForm);
diff --git a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.schema.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.schema.js
similarity index 79%
rename from src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.schema.js
rename to src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.schema.js
index 300f98511..08228e2b6 100644
--- a/src/containers/Dialogs/MoneyInDialog/OtherIncome/OtherIncomeForm.schema.js
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutForm.schema.js
@@ -8,9 +8,7 @@ const Schema = Yup.object().shape({
transaction_number: Yup.string(),
transaction_type: Yup.string().required(),
reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('other_income_account')),
+ credit_account_id: Yup.number().required(),
cashflow_account_id: Yup.string().required(),
description: Yup.string()
.min(3)
@@ -19,4 +17,4 @@ const Schema = Yup.object().shape({
published: Yup.boolean(),
});
-export const CreateOtherIncomeFormSchema = Schema;
+export const CreateMoneyOutSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormContent.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormContent.js
new file mode 100644
index 000000000..b44581433
--- /dev/null
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormContent.js
@@ -0,0 +1,17 @@
+import React from 'react';
+import { Form } from 'formik';
+
+import MoneyOutFormFields from './MoneyOutFormFields';
+import MoneyOutFloatingActions from './MoneyOutFloatingActions';
+
+/**
+ * Money out form content.
+ */
+export default function MoneyOutFormContent() {
+ return (
+
+ );
+}
diff --git a/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormFields.js b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormFields.js
new file mode 100644
index 000000000..f3a97913a
--- /dev/null
+++ b/src/containers/Dialogs/MoneyOutDialog/MoneyOutFormFields.js
@@ -0,0 +1,29 @@
+import React from 'react';
+import { useFormikContext } from 'formik';
+import { Classes } from '@blueprintjs/core';
+
+import { If } from 'components';
+
+import MoneyOutContentFields from './MoneyOutContentFields';
+import TransactionTypeFields from './TransactionTypeFields';
+import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
+
+/**
+ * Money out form fields.
+ */
+function MoneyOutFormFields() {
+ // Money in dialog context.
+ const { accountId } = useMoneyOutDialogContext();
+
+ const { values } = useFormikContext();
+ return (
+
+
+
+
+
+
+ );
+}
+
+export default MoneyOutFormFields;
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFloatingActions.js b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFloatingActions.js
deleted file mode 100644
index acd9877e9..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFloatingActions.js
+++ /dev/null
@@ -1,76 +0,0 @@
-import React from 'react';
-import { Intent, Button, Classes } from '@blueprintjs/core';
-import { useFormikContext } from 'formik';
-import { FormattedMessage as T } from 'components';
-
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import { compose } from 'utils';
-
-/**
- * Other expense floating actions.
- */
-function OtherExpenseFloatingActions({
- // #withDialogActions
- closeDialog,
-}) {
- // Formik context.
- const { isSubmitting, submitForm } = useFormikContext();
- // money in dialog context.
- const { dialogName, setSubmitPayload, submitPayload } =
- useMoneyOutDialogContext();
-
- // handle submit as draft button click.
- const handleSubmitDraftBtnClick = (event) => {
- setSubmitPayload({ publish: false });
- submitForm();
- };
-
- // Handle submit button click.
- const handleSubmittBtnClick = (event) => {
- setSubmitPayload({ publish: true });
- submitForm();
- };
-
- // Handle close button click.
- const handleCloseBtnClick = (event) => {
- closeDialog(dialogName);
- };
-
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-export default compose(withDialogActions)(OtherExpenseFloatingActions);
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.schema.js b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.schema.js
deleted file mode 100644
index fc4d58460..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseForm.schema.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as Yup from 'yup';
-import intl from 'react-intl-universal';
-import { DATATYPES_LENGTH } from 'common/dataTypes';
-
-const Schema = Yup.object().shape({
- date: Yup.date().required().label(intl.get('date')),
- amount: Yup.number().required().label(intl.get('amount')),
- transaction_number: Yup.string(),
- transaction_type: Yup.string().required(),
- reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('other_expense_account')),
- cashflow_account_id: Yup.string().required(),
- description: Yup.string()
- .min(3)
- .max(DATATYPES_LENGTH.TEXT)
- .label(intl.get('description')),
- published: Yup.boolean(),
-});
-
-export const CreateOtherExpenseFormSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFormContent.js b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFormContent.js
deleted file mode 100644
index 4f578485a..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpenseFormContent.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import OtherExpnseFormFields from './OtherExpnseFormFields';
-import OtherExpenseFloatingActions from './OtherExpenseFloatingActions';
-
-/**
- * Other expense form content.
- */
-export default function OtherExpenseFormContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
index 93cabd62d..39833ff96 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/OtherExpense/OtherExpnseFormFields.js
@@ -29,7 +29,7 @@ import {
handleDateChange,
} from 'utils';
import { CLASSES } from 'common/classes';
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
+import { useMoneyOutDialogContext } from '../MoneyOutDialogProvider';
/**
* Other expense form fields.
@@ -41,7 +41,7 @@ function OtherExpnseFormFields() {
const amountFieldRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -188,7 +188,7 @@ function OtherExpnseFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.js b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.js
deleted file mode 100644
index 267ad4284..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.js
+++ /dev/null
@@ -1,91 +0,0 @@
-import React from 'react';
-import moment from 'moment';
-import { Intent } from '@blueprintjs/core';
-import { Formik } from 'formik';
-import { omit } from 'lodash';
-import intl from 'react-intl-universal';
-
-import 'style/pages/CashFlow/CashflowTransactionForm.scss';
-
-import { AppToaster } from 'components';
-import { CreateOwnerDrawingsFormSchema } from './OwnerDrawingsForm.schema';
-import OwnerDrawingsFormContent from './OwnerDrawingsFormContent';
-
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
-
-import { compose } from 'utils';
-
-const defaultInitialValues = {
- date: moment(new Date()).format('YYYY-MM-DD'),
- amount: '',
- transaction_number: '',
- transaction_type: 'onwers_drawing',
- reference_no: '',
- cashflow_account_id: '',
- credit_account_id: '',
- description: '',
- published: '',
-};
-
-/**
- * Owner drawings form.
- */
-function OwnerDrawingsForm({
- // #withDialogActions
- closeDialog,
-
- // #withCurrentOrganization
- organization: { base_currency },
-}) {
- const {
- dialogName,
- accountId,
- submitPayload,
- createCashflowTransactionMutate,
- } = useMoneyOutDialogContext();
-
- // Initial form values.
- const initialValues = {
- ...defaultInitialValues,
- currency_code: base_currency,
- cashflow_account_id: accountId,
- };
- // Handles the form submit.
- const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
- const form = {
- ...omit(values, ['currency_code']),
- published: submitPayload.publish,
- };
- setSubmitting(true);
- createCashflowTransactionMutate(form)
- .then(() => {
- closeDialog(dialogName);
-
- AppToaster.show({
- message: intl.get('cash_flow_transaction_success_message'),
- intent: Intent.SUCCESS,
- });
- })
- .finally(() => {
- setSubmitting(true);
- });
- };
-
- return (
-
-
-
- );
-}
-
-export default compose(
- withDialogActions,
- withCurrentOrganization(),
-)(OwnerDrawingsForm);
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.schema.js b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.schema.js
deleted file mode 100644
index dfc02dc6e..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsForm.schema.js
+++ /dev/null
@@ -1,22 +0,0 @@
-import * as Yup from 'yup';
-import intl from 'react-intl-universal';
-import { DATATYPES_LENGTH } from 'common/dataTypes';
-
-const Schema = Yup.object().shape({
- date: Yup.date().required().label(intl.get('date')),
- amount: Yup.number().required().label(intl.get('amount')),
- transaction_number: Yup.string(),
- transaction_type: Yup.string().required(),
- reference_no: Yup.string(),
- credit_account_id: Yup.number()
- .required()
- .label(intl.get('cash_flow_transaction.label_equity_account')),
- cashflow_account_id: Yup.string().required(),
- description: Yup.string()
- .min(3)
- .max(DATATYPES_LENGTH.TEXT)
- .label(intl.get('description')),
- published: Yup.boolean(),
-});
-
-export const CreateOwnerDrawingsFormSchema = Schema;
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormContent.js b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormContent.js
deleted file mode 100644
index cab946864..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormContent.js
+++ /dev/null
@@ -1,17 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import OwnerDrawingsFormFields from './OwnerDrawingsFormFields';
-import OwnerDrawingsFloatingActions from './OwnerDrawingsFloatingActions';
-
-/**
- * Owner drawings form content.
- */
-export default function OwnerDrawingsFormContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
index b3e08aedc..d38611321 100644
--- a/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/OwnerDrawings/OwnerDrawingsFormFields.js
@@ -28,7 +28,7 @@ import {
handleDateChange,
} from 'utils';
import { CLASSES } from 'common/classes';
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
+import { useMoneyOutDialogContext } from '../MoneyOutDialogProvider';
/**
* Owner drawings form fields.
@@ -40,7 +40,7 @@ function OwnerDrawingsFormFields() {
const amountFieldRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -112,7 +112,6 @@ function OwnerDrawingsFormFields() {
onChange={(amount) => {
setFieldValue('amount', amount);
}}
-
inputRef={(ref) => (amountFieldRef.current = ref)}
intent={inputIntent({ error, touched })}
/>
@@ -185,7 +184,7 @@ function OwnerDrawingsFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransactionTypeFields.js b/src/containers/Dialogs/MoneyOutDialog/TransactionTypeFields.js
new file mode 100644
index 000000000..e00d7e512
--- /dev/null
+++ b/src/containers/Dialogs/MoneyOutDialog/TransactionTypeFields.js
@@ -0,0 +1,96 @@
+import React from 'react';
+import { FastField, Field, ErrorMessage } from 'formik';
+import { FormGroup } from '@blueprintjs/core';
+import classNames from 'classnames';
+import {
+ FormattedMessage as T,
+ AccountsSuggestField,
+ FieldRequiredHint,
+ ListSelect,
+ Col,
+ Row,
+} from 'components';
+
+import { inputIntent } from 'utils';
+import { CLASSES } from 'common/classes';
+import { addMoneyOut } from '../../../common/cashflowOptions';
+
+import { useMoneyOutDialogContext } from './MoneyOutDialogProvider';
+
+/**
+ * Transaction type fields.
+ */
+function TransactionTypeFields() {
+ // Money in dialog context.
+ const { cashflowAccounts } = useMoneyOutDialogContext();
+
+ return (
+
+
+
+ {/*------------ Current account -----------*/}
+
+ {({ form, field: { value }, meta: { error, touched } }) => (
+ }
+ labelInfo={}
+ intent={inputIntent({ error, touched })}
+ helperText={}
+ minimal={true}
+ className={classNames(
+ CLASSES.FILL,
+ 'form-group--cashflow_account_id',
+ )}
+ >
+
+ form.setFieldValue('cashflow_account_id', id)
+ }
+ inputProps={{
+ intent: inputIntent({ error, touched }),
+ }}
+ />
+
+ )}
+
+ {/*------------ Transaction type -----------*/}
+
+
+
+ {({
+ form: { values, setFieldValue },
+ field: { value },
+ meta: { error, touched },
+ }) => (
+ }
+ labelInfo={}
+ helperText={}
+ intent={inputIntent({ error, touched })}
+ className={classNames(
+ CLASSES.FILL,
+ 'form-group--transaction_type',
+ )}
+ >
+ {
+ setFieldValue('transaction_type', type.value);
+ }}
+ filterable={false}
+ selectedItem={value}
+ selectedItemProp={'value'}
+ textProp={'name'}
+ popoverProps={{ minimal: true }}
+ />
+
+ )}
+
+
+
+
+ );
+}
+
+export default TransactionTypeFields;
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFloatingActions.js b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFloatingActions.js
deleted file mode 100644
index ce428f017..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFloatingActions.js
+++ /dev/null
@@ -1,73 +0,0 @@
-import React from 'react';
-import { Intent, Button, Classes } from '@blueprintjs/core';
-import { useFormikContext } from 'formik';
-import { FormattedMessage as T } from 'components';
-
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import { compose } from 'utils';
-
-function TransferToAccountFloatingActions({
- // #withDialogActions
- closeDialog,
-}) {
- // Formik context.
- const { isSubmitting, submitForm } = useFormikContext();
- // money in dialog context.
- const { dialogName, setSubmitPayload, submitPayload } =
- useMoneyOutDialogContext();
-
- // handle submit as draft button click.
- const handleSubmitDraftBtnClick = (event) => {
- setSubmitPayload({ publish: false });
- submitForm();
- };
-
- // Handle submit button click.
- const handleSubmittBtnClick = (event) => {
- setSubmitPayload({ publish: true });
- submitForm();
- };
-
- // Handle close button click.
- const handleCloseBtnClick = (event) => {
- closeDialog(dialogName);
- };
-
- return (
-
-
-
-
-
-
-
-
- );
-}
-
-export default compose(withDialogActions)(TransferToAccountFloatingActions);
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.js b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.js
deleted file mode 100644
index d2b4b16e3..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountForm.js
+++ /dev/null
@@ -1,92 +0,0 @@
-import React from 'react';
-import moment from 'moment';
-import { Intent } from '@blueprintjs/core';
-import { Formik } from 'formik';
-import { omit } from 'lodash';
-import intl from 'react-intl-universal';
-
-import 'style/pages/CashFlow/CashflowTransactionForm.scss';
-
-import { AppToaster } from 'components';
-import { CreateTransferToAccountFormSchema } from './TransferToAccountForm.schema';
-import TransferToAccountFromContent from './TransferToAccountFromContent';
-
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
-
-import withDialogActions from 'containers/Dialog/withDialogActions';
-import withCurrentOrganization from 'containers/Organization/withCurrentOrganization';
-
-import { compose } from 'utils';
-
-const defaultInitialValues = {
- date: moment(new Date()).format('YYYY-MM-DD'),
- amount: '',
- transaction_number: '',
- transaction_type: 'transfer_from_account',
- reference_no: '',
- cashflow_account_id: '',
- credit_account_id: '',
- description: '',
- published: '',
-};
-
-/**
- * Transfer to account form.
- */
-function TransferToAccountForm({
- // #withDialogActions
- closeDialog,
-
- // #withCurrentOrganization
- organization: { base_currency },
-}) {
- const {
- dialogName,
- accountId,
- createCashflowTransactionMutate,
- submitPayload,
- } = useMoneyOutDialogContext();
-
- // Initial form values.
- const initialValues = {
- ...defaultInitialValues,
- currency_code: base_currency,
- cashflow_account_id: accountId,
- };
-
- // Handles the form submit.
- const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
- const form = {
- ...omit(values, ['currency_code']),
- published: submitPayload.publish,
- };
- setSubmitting(true);
- createCashflowTransactionMutate(form)
- .then(() => {
- closeDialog(dialogName);
-
- AppToaster.show({
- message: intl.get('cash_flow_transaction_success_message'),
- intent: Intent.SUCCESS,
- });
- })
- .finally(() => {
- setSubmitting(true);
- });
- };
-
- return (
-
-
-
- );
-}
-
-export default compose(
- withDialogActions,
- withCurrentOrganization(),
-)(TransferToAccountForm);
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
index 5bf120c87..7863a0637 100644
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
+++ b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFormFields.js
@@ -29,7 +29,7 @@ import {
handleDateChange,
} from 'utils';
import { CLASSES } from 'common/classes';
-import { useMoneyOutDialogContext } from '../MoneyOutProvider';
+import { useMoneyOutDialogContext } from '../MoneyOutDialogProvider';
/**
* Transfer to account form fields.
@@ -41,7 +41,7 @@ function TransferToAccountFormFields() {
const accountRef = useAutofocus();
return (
-
+
{/*------------ Date -----------*/}
@@ -190,7 +190,7 @@ function TransferToAccountFormFields() {
)}
-
+
);
}
diff --git a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFromContent.js b/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFromContent.js
deleted file mode 100644
index 508f0b330..000000000
--- a/src/containers/Dialogs/MoneyOutDialog/TransferToAccount/TransferToAccountFromContent.js
+++ /dev/null
@@ -1,14 +0,0 @@
-import React from 'react';
-import { Form } from 'formik';
-
-import TransferToAccountFormFields from './TransferToAccountFormFields';
-import TransferToAccountFloatingActions from './TransferToAccountFloatingActions';
-
-export default function TransferToAccountFromContent() {
- return (
-
- );
-}
diff --git a/src/containers/Dialogs/MoneyOutDialog/index.js b/src/containers/Dialogs/MoneyOutDialog/index.js
index d7fd6e5d0..2cf31320e 100644
--- a/src/containers/Dialogs/MoneyOutDialog/index.js
+++ b/src/containers/Dialogs/MoneyOutDialog/index.js
@@ -1,5 +1,5 @@
import React from 'react';
-import { FormattedMessage as T } from 'components';
+import intl from 'react-intl-universal';
import { Dialog, DialogSuspense } from 'components';
import withDialogRedux from 'components/DialogReduxConnect';
import { compose } from 'redux';
@@ -13,13 +13,15 @@ const MoneyOutDialogContent = React.lazy(() =>
*/
function MoneyOutDialog({
dialogName,
- payload = { action: '', account_type: null, account_id: null },
+ payload = { account_type: null, account_id: null },
isOpen,
}) {
return (
}
+ title={intl.get('cash_flow_transaction.money_out', {
+ value: payload.account_type?.name,
+ })}
isOpen={isOpen}
canEscapeJeyClose={true}
autoFocus={true}
@@ -29,7 +31,7 @@ function MoneyOutDialog({
diff --git a/src/lang/en/index.json b/src/lang/en/index.json
index f2333197a..41a8cc2b6 100644
--- a/src/lang/en/index.json
+++ b/src/lang/en/index.json
@@ -1382,13 +1382,14 @@
"cash_flow_transaction.label_equity_account":"Equity account",
"cash_flow_transaction.label_expense_account":"Expense account",
"cash_flow_transaction_success_message":" The cashflow transaction has been created successfully.",
- "cash_flow_transaction.money_in":"Money In",
- "cash_flow_transaction.money_out":"Money Out",
+ "cash_flow_transaction.money_in":"Money In {value}",
+ "cash_flow_transaction.money_out":"Money Out {value}",
"cash_flow_transaction.other_income_account":"Other income account",
"cash_flow_transaction.other_expense_account":"Other expense account",
"save_and_publish": "Save & Publish",
"cash_flow_transaction.label_transfer_from_account":"Transfer from account",
- "cash_flow_transaction.label_transfer_to_account":"Transfer to account"
+ "cash_flow_transaction.label_transfer_to_account":"Transfer to account",
+ "cash_flow_transaction.label_current_account":"Current account"
}
diff --git a/src/style/pages/CashFlow/CashflowTransactionForm.scss b/src/style/pages/CashFlow/CashflowTransactionForm.scss
index 81c9c1671..db852724d 100644
--- a/src/style/pages/CashFlow/CashflowTransactionForm.scss
+++ b/src/style/pages/CashFlow/CashflowTransactionForm.scss
@@ -25,6 +25,12 @@
}
}
+ .trasnaction-type-fileds {
+ margin-bottom: 18px;
+ padding: 16px 0px 12px 0px;
+ border-bottom: 2px solid #e9e9e9;
+ }
+
.bp3-dialog-footer {
padding-top: 10px;
}