BIG-26: fix items preferences form.

This commit is contained in:
a.bouhuolia
2021-09-12 13:14:15 +02:00
parent b3a96ace71
commit cdc75a01af
17 changed files with 195 additions and 145 deletions

View File

@@ -1,14 +0,0 @@
import React from 'react';
import ItemFormPage from './ItemFormPage';
import { ItemFormProvider } from './ItemFormProvider';
/**
* items preferences.
*/
export default function ItemsPreferences() {
return (
<ItemFormProvider>
<ItemFormPage />
</ItemFormProvider>
);
}

View File

@@ -1,9 +0,0 @@
import * as Yup from 'yup';
const Schema = Yup.object().shape({
sell_account: Yup.number().nullable(),
cost_account: Yup.number().nullable(),
inventory_account: Yup.number().nullable(),
});
export const ItemPreferencesSchema = Schema;

View File

@@ -0,0 +1,9 @@
import * as Yup from 'yup';
const Schema = Yup.object().shape({
preferred_sell_account: Yup.number().nullable(),
preferred_cost_account: Yup.number().nullable(),
preferred_inventory_account: Yup.number().nullable(),
});
export const ItemPreferencesSchema = Schema;

View File

@@ -1,21 +1,23 @@
import React from 'react';
import { Form, FastField, useFormikContext } from 'formik';
import { FormGroup, Button, Intent } from '@blueprintjs/core';
import { AccountsSelectList, FieldRequiredHint } from 'components';
import { FormattedMessage as T } from 'components';
import intl from 'react-intl-universal';
import { useHistory } from 'react-router-dom';
import {
AccountsSelectList,
FieldRequiredHint,
FormattedMessage as T,
} from 'components';
import { inputIntent } from 'utils';
import { ACCOUNT_PARENT_TYPE, ACCOUNT_TYPE } from 'common/accountTypes';
import { useItemFormContext } from './ItemFormProvider';
import { useItemPreferencesFormContext } from './ItemPreferencesFormProvider';
/**
* item form preferences.
* Item preferences form.
*/
export default function ItemForm() {
const history = useHistory();
const { accounts } = useItemFormContext();
const { accounts } = useItemPreferencesFormContext();
const { isSubmitting } = useFormikContext();
@@ -26,7 +28,7 @@ export default function ItemForm() {
return (
<Form>
{/* ----------- preferred sell account ----------- */}
<FastField name={'sell_account'}>
<FastField name={'preferred_sell_account'}>
{({
form: { values, setFieldValue },
field: { value },
@@ -51,7 +53,7 @@ export default function ItemForm() {
<AccountsSelectList
accounts={accounts}
onAccountSelected={({ id }) => {
setFieldValue('sell_account', id);
setFieldValue('preferred_sell_account', id);
}}
selectedAccountId={value}
defaultSelectText={<T id={'select_payment_account'} />}
@@ -62,7 +64,7 @@ export default function ItemForm() {
</FastField>
{/* ----------- preferred cost account ----------- */}
<FastField name={'cost_account'}>
<FastField name={'preferred_cost_account'}>
{({
form: { values, setFieldValue },
field: { value },
@@ -87,7 +89,7 @@ export default function ItemForm() {
<AccountsSelectList
accounts={accounts}
onAccountSelected={({ id }) => {
setFieldValue('cost_account', id);
setFieldValue('preferred_cost_account', id);
}}
selectedAccountId={value}
defaultSelectText={<T id={'select_payment_account'} />}
@@ -98,7 +100,7 @@ export default function ItemForm() {
</FastField>
{/* ----------- preferred inventory account ----------- */}
<FastField name={'inventory_account'}>
<FastField name={'preferred_inventory_account'}>
{({
form: { values, setFieldValue },
field: { value },
@@ -123,7 +125,7 @@ export default function ItemForm() {
<AccountsSelectList
accounts={accounts}
onAccountSelected={({ id }) => {
setFieldValue('inventory_account', id);
setFieldValue('preferred_inventory_account', id);
}}
selectedAccountId={value}
defaultSelectText={<T id={'select_payment_account'} />}

View File

@@ -3,10 +3,10 @@ import { Formik } from 'formik';
import { Intent } from '@blueprintjs/core';
import { AppToaster } from 'components';
import intl from 'react-intl-universal';
import { ItemPreferencesSchema } from './Item.schema';
import ItemForm from './ItemForm';
import { ItemPreferencesSchema } from './ItemPreferences.schema';
import ItemPreferencesForm from './ItemPreferencesForm';
import { useItemFormContext } from './ItemFormProvider';
import { useItemPreferencesFormContext } from './ItemPreferencesFormProvider';
import withDashboardActions from 'containers/Dashboard/withDashboardActions';
import withSettings from 'containers/Settings/withSettings';
import { compose, optionsMapToArray, transformGeneralSettings } from 'utils';
@@ -14,20 +14,20 @@ import { compose, optionsMapToArray, transformGeneralSettings } from 'utils';
import 'style/pages/Preferences/Accounting.scss';
// item form page preferences.
function ItemFormPage({
function ItemPreferencesFormPage({
// #withSettings
itemsSettings,
// #withDashboardActions
changePreferencesPageTitle,
}) {
const { saveSettingMutate } = useItemFormContext();
const { saveSettingMutate } = useItemPreferencesFormContext();
// Initial values.
const initialValues = {
sell_account: '',
cost_account: '',
inventory_account: '',
preferred_sell_account: '',
preferred_cost_account: '',
preferred_inventory_account: '',
...transformGeneralSettings(itemsSettings),
};
@@ -59,7 +59,7 @@ function ItemFormPage({
initialValues={initialValues}
validationSchema={ItemPreferencesSchema}
onSubmit={handleFormSubmit}
component={ItemForm}
component={ItemPreferencesForm}
/>
);
}
@@ -67,4 +67,4 @@ function ItemFormPage({
export default compose(
withSettings(({ itemsSettings }) => ({ itemsSettings })),
withDashboardActions,
)(ItemFormPage);
)(ItemPreferencesFormPage);

View File

@@ -2,7 +2,7 @@ import React, { useContext, createContext } from 'react';
import classNames from 'classnames';
import { CLASSES } from 'common/classes';
import { useAccounts, useSaveSettings } from 'hooks/query';
import { useSettingsItems, useAccounts, useSaveSettings } from 'hooks/query';
import PreferencesPageLoader from '../PreferencesPageLoader';
const ItemFormContext = createContext();
@@ -11,10 +11,15 @@ const ItemFormContext = createContext();
* Item data provider.
*/
function ItemFormProvider({ ...props }) {
function ItemPreferencesFormProvider({ ...props }) {
// Fetches the accounts list.
const { isLoading: isAccountsLoading, data: accounts } = useAccounts();
const {
isLoading: isItemsSettingsLoading,
isFetching: isItemsSettingsFetching,
} = useSettingsItems();
// Save Organization Settings.
const { mutateAsync: saveSettingMutate } = useSaveSettings();
@@ -24,7 +29,7 @@ function ItemFormProvider({ ...props }) {
saveSettingMutate,
};
const isLoading = isAccountsLoading;
const isLoading = isAccountsLoading || isItemsSettingsLoading;
return (
<div
@@ -44,6 +49,6 @@ function ItemFormProvider({ ...props }) {
);
}
const useItemFormContext = () => useContext(ItemFormContext);
const useItemPreferencesFormContext = () => useContext(ItemFormContext);
export { useItemFormContext, ItemFormProvider };
export { useItemPreferencesFormContext, ItemPreferencesFormProvider };

View File

@@ -0,0 +1,14 @@
import React from 'react';
import ItemPreferencesFormPage from './ItemPreferencesFormPage';
import { ItemPreferencesFormProvider } from './ItemPreferencesFormProvider';
/**
* items preferences.
*/
export default function ItemsPreferences() {
return (
<ItemPreferencesFormProvider>
<ItemPreferencesFormPage />
</ItemPreferencesFormProvider>
);
}