Skip to content

Commit

Permalink
Merge pull request #86 from bigcapitalhq/BIG-421-account-form-issues
Browse files Browse the repository at this point in the history 
fix: BIG-421 account form issues
  • Loading branch information
@abouolia
abouolia authored Feb 15, 2023
2 parents a371fd4 + f093239 commit e488c0e
Show file tree
Hide file tree
Showing 4 changed files with 82 additions and 50 deletions.
9 changes: 8 additions & 1 deletion packages/server/src/services/Accounts/GetAccounts.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -5,6 +5,7 @@ import TenancyService from '@/services/Tenancy/TenancyService';
import DynamicListingService from '@/services/DynamicListing/DynamicListService';
import { AccountTransformer } from './AccountTransform';
import { TransformerInjectable } from '@/lib/Transformer/TransformerInjectable';
import { flatToNestedArray } from '@/utils';

@Service()
export class GetAccounts {
Expand Down Expand Up @@ -53,11 +54,17 @@ export class GetAccounts {
builder.modify('inactiveMode', filter.inactiveMode);
});
// Retrievs the formatted accounts collection.
const transformedAccounts = await this.transformer.transform(
const preTransformedAccounts = await this.transformer.transform(
tenantId,
accounts,
new AccountTransformer()
);
// Transform accounts to nested array.
const transformedAccounts = flatToNestedArray(preTransformedAccounts, {
id: 'id',
parentId: 'parentAccountId',
});

return {
accounts: transformedAccounts,
filterMeta: dynamicList.getResponseMeta(),
Expand Down
17 changes: 9 additions & 8 deletions packages/webapp/src/containers/Dialogs/AccountDialog/AccountDialogForm.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,6 @@ import React, { useCallback } from 'react';
import intl from 'react-intl-universal';
import { Intent } from '@blueprintjs/core';
import { Formik } from 'formik';
import { omit } from 'lodash';
import { AppToaster } from '@/components';

import AccountDialogFormContent from './AccountDialogFormContent';
Expand All @@ -14,7 +13,11 @@ import {
CreateAccountFormSchema,
} from './AccountForm.schema';
import { compose, transformToForm } from '@/utils';
import { transformApiErrors, transformAccountToForm } from './utils';
import {
transformApiErrors,
transformAccountToForm,
transformFormToReq,
} from './utils';

import '@/style/pages/Accounts/AccountFormDialog.scss';
import { useAccountDialogContext } from './AccountDialogProvider';
Expand All @@ -26,7 +29,7 @@ const defaultInitialValues = {
name: '',
code: '',
description: '',
currency_code:'',
currency_code: '',
subaccount: false,
};

Expand All @@ -43,7 +46,6 @@ function AccountFormDialogContent({
createAccountMutate,
account,

accountId,
payload,
isNewMode,
dialogName,
Expand All @@ -56,7 +58,7 @@ function AccountFormDialogContent({

// Callbacks handles form submit.
const handleFormSubmit = (values, { setSubmitting, setErrors }) => {
const form = omit(values, ['subaccount']);
const form = transformFormToReq(values);
const toastAccountName = values.code
? `${values.code} - ${values.name}`
: values.name;
Expand Down Expand Up @@ -90,8 +92,8 @@ function AccountFormDialogContent({
setErrors({ ...errorsTransformed });
setSubmitting(false);
};
if (accountId) {
editAccountMutate([accountId, form])
if (payload.accountId) {
editAccountMutate([payload.accountId, form])
.then(handleSuccess)
.catch(handleError);
} else {
Expand All @@ -113,7 +115,6 @@ function AccountFormDialogContent({
defaultInitialValues,
),
};

// Handles dialog close.
const handleClose = useCallback(() => {
closeDialog(dialogName);
Expand Down
69 changes: 32 additions & 37 deletions packages/webapp/src/containers/Dialogs/AccountDialog/AccountDialogFormContent.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -26,6 +26,7 @@ import { inputIntent, compose } from '@/utils';
import { useAutofocus } from '@/hooks';
import { FOREIGN_CURRENCY_ACCOUNTS } from '@/constants/accountTypes';
import { useAccountDialogContext } from './AccountDialogProvider';
import { parentAccountShouldUpdate } from './utils';

/**
* Account form dialogs fields.
Expand Down Expand Up @@ -115,50 +116,44 @@ function AccountFormDialogFields({
>
<Checkbox
inline={true}
label={
<>
<T id={'sub_account'} />
<Hint />
</>
}
label={<T id={'sub_account'} />}
name={'subaccount'}
{...field}
/>
</FormGroup>
)}
</Field>

<If condition={values.subaccount}>
<FastField name={'parent_account_id'}>
{({
form: { values, setFieldValue },
field: { value },
meta: { error, touched },
}) => (
<FormGroup
label={<T id={'parent_account'} />}
className={classNames(
'form-group--parent-account',
Classes.FILL,
)}
inline={true}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="parent_account_id" />}
>
<AccountsSelectList
accounts={accounts}
onAccountSelected={(account) => {
setFieldValue('parent_account_id', account.id);
}}
defaultSelectText={<T id={'select_parent_account'} />}
selectedAccountId={value}
popoverFill={true}
filterByTypes={values.account_type}
/>
</FormGroup>
)}
</FastField>
</If>
<FastField
name={'parent_account_id'}
shouldUpdate={parentAccountShouldUpdate}
>
{({
form: { values, setFieldValue },
field: { value },
meta: { error, touched },
}) => (
<FormGroup
label={<T id={'parent_account'} />}
className={classNames('form-group--parent-account', Classes.FILL)}
inline={true}
intent={inputIntent({ error, touched })}
helperText={<ErrorMessage name="parent_account_id" />}
>
<AccountsSelectList
accounts={accounts}
onAccountSelected={(account) => {
setFieldValue('parent_account_id', account.id);
}}
defaultSelectText={<T id={'select_parent_account'} />}
selectedAccountId={value}
popoverFill={true}
filterByTypes={values.account_type}
disabled={!values.subaccount}
/>
</FormGroup>
)}
</FastField>

<If condition={FOREIGN_CURRENCY_ACCOUNTS.includes(values.account_type)}>
{/*------------ Currency -----------*/}
Expand Down
37 changes: 33 additions & 4 deletions packages/webapp/src/containers/Dialogs/AccountDialog/utils.tsx
View file
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
import intl from 'react-intl-universal';
import * as R from 'ramda';
import { isUndefined } from 'lodash';
import { defaultFastFieldShouldUpdate } from '@/utils';

export const AccountDialogAction = {
Edit: 'edit',
Expand Down Expand Up @@ -33,7 +34,7 @@ export const transformApiErrors = (errors) => {
/**
* Payload transformer in account edit mode.
*/
function tranformNewChildAccountPayload(payload) {
function tranformNewChildAccountPayload(account, payload) {
return {
parent_account_id: payload.parentAccountId || '',
account_type: payload.accountType || '',
Expand All @@ -44,7 +45,7 @@ function tranformNewChildAccountPayload(payload) {
/**
* Payload transformer in new account with defined type.
*/
function transformNewDefinedTypePayload(payload) {
function transformNewDefinedTypePayload(account, payload) {
return {
account_type: payload.accountType || '',
};
Expand All @@ -63,7 +64,9 @@ const mergeWithAccount = R.curry((transformed, account) => {
/**
* Default account payload transformer.
*/
const defaultPayloadTransform = () => ({});
const defaultPayloadTransform = (account, payload) => ({
subaccount: !!account.parent_account_id,
});

/**
* Defined payload transformers.
Expand All @@ -89,7 +92,7 @@ export const transformAccountToForm = (account, payload) => {

return [
condition[0] === payload.action ? R.T : R.F,
mergeWithAccount(transformer(payload)),
mergeWithAccount(transformer(account, payload)),
];
});
return R.cond(results)(account);
Expand All @@ -106,3 +109,29 @@ export const getDisabledFormFields = (account, payload) => {
payload.action === AccountDialogAction.NewDefinedType,
};
};

/**
* Detarmines whether should update the parent account field.
* @param newProps
* @param oldProps
* @returns {boolean}
*/
export const parentAccountShouldUpdate = (newProps, oldProps) => {
return (
newProps.formik.values.subaccount !== oldProps.formik.values.subaccount ||
defaultFastFieldShouldUpdate(newProps, oldProps)
);
};

/**
* Transformes the form values to the request.
*/
export const transformFormToReq = (form) => {
return R.compose(
R.omit(['subaccount']),
R.when(
R.propSatisfies(R.equals(R.__, false), 'subaccount'),
R.assoc(['parent_account_id'], ''),
),
)(form);
};

0 comments on commit e488c0e

Please sign in to comment.