diff --git a/client/package.json b/client/package.json
index a73054c21..87266a85b 100644
--- a/client/package.json
+++ b/client/package.json
@@ -4,7 +4,7 @@
"private": true,
"dependencies": {
"@babel/core": "7.8.4",
- "@blueprintjs/core": "^3.23.1",
+ "@blueprintjs/core": "^3.38.1",
"@blueprintjs/datetime": "^3.15.2",
"@blueprintjs/select": "^3.11.2",
"@blueprintjs/table": "^3.8.3",
diff --git a/client/src/components/DataTableCells/AccountsListFieldCell.js b/client/src/components/DataTableCells/AccountsListFieldCell.js
index c5c2a6dcc..58fac50c1 100644
--- a/client/src/components/DataTableCells/AccountsListFieldCell.js
+++ b/client/src/components/DataTableCells/AccountsListFieldCell.js
@@ -1,11 +1,14 @@
-import React, { useCallback, useMemo } from 'react';
-import AccountsSuggestField from 'components/AccountsSuggestField';
-// import AccountsSelectList from 'components/AccountsSelectList';
+import React, { useRef, useCallback, useMemo } from 'react';
import classNames from 'classnames';
+import { useCellAutoFocus } from 'hooks';
+
+import AccountsSuggestField from 'components/AccountsSuggestField';
+
+// import AccountsSelectList from 'components/AccountsSelectList';
import { FormGroup, Classes, Intent } from '@blueprintjs/core';
// Account cell renderer.
-const AccountCellRenderer = ({
+export default function AccountCellRenderer({
column: {
id,
accountsDataProp,
@@ -18,9 +21,14 @@ const AccountCellRenderer = ({
accounts: defaultAccounts,
updateData,
errors,
+ autoFocus,
...restPayloadProps
},
-}) => {
+}) {
+ const accountRef = useRef();
+
+ useCellAutoFocus(accountRef, autoFocus, id, index);
+
const handleAccountSelected = useCallback(
(account) => {
updateData(index, id, account.id);
@@ -49,9 +57,12 @@ const AccountCellRenderer = ({
selectedAccountId={initialValue}
filterByRootTypes={filterAccountsByRootType}
filterByTypes={filterAccountsByTypes}
+ inputProps={{
+ inputRef: (ref) => (accountRef.current = ref),
+ }}
+ openOnKeyDown={true}
+ blurOnSelectClose={false}
/>
);
-};
-
-export default AccountCellRenderer;
+}
diff --git a/client/src/components/DataTableCells/ItemsListCell.js b/client/src/components/DataTableCells/ItemsListCell.js
index ba77db9c3..77e3970fc 100644
--- a/client/src/components/DataTableCells/ItemsListCell.js
+++ b/client/src/components/DataTableCells/ItemsListCell.js
@@ -1,15 +1,23 @@
-import React, { useCallback } from 'react';
+import React, { useCallback, useRef } from 'react';
// import ItemsListField from 'components/ItemsListField';
import ItemsSuggestField from 'components/ItemsSuggestField';
import classNames from 'classnames';
+
import { FormGroup, Classes, Intent } from '@blueprintjs/core';
+import { useCellAutoFocus } from 'hooks';
+
export default function ItemsListCell({
column: { id, filterSellable, filterPurchasable },
row: { index },
cell: { value: initialValue },
- payload: { items, updateData, errors },
+ payload: { items, updateData, errors, autoFocus },
}) {
+ const fieldRef = useRef();
+
+ // Auto-focus the items list input field.
+ useCellAutoFocus(fieldRef, autoFocus, id, index);
+
const handleItemSelected = useCallback(
(item) => {
updateData(index, id, item.id);
@@ -30,6 +38,11 @@ export default function ItemsListCell({
selectedItemId={initialValue}
sellable={filterSellable}
purchasable={filterPurchasable}
+ inputProps={{
+ inputRef: (ref) => (fieldRef.current = ref),
+ }}
+ openOnKeyDown={true}
+ blurOnSelectClose={false}
/>
);
diff --git a/client/src/containers/Accounting/MakeJournalEntriesTable.js b/client/src/containers/Accounting/MakeJournalEntriesTable.js
index f522a8f2a..d9ecba07c 100644
--- a/client/src/containers/Accounting/MakeJournalEntriesTable.js
+++ b/client/src/containers/Accounting/MakeJournalEntriesTable.js
@@ -2,11 +2,7 @@ import React, { useState, useMemo, useEffect, useCallback } from 'react';
import { Button } from '@blueprintjs/core';
import { FormattedMessage as T, useIntl } from 'react-intl';
import { omit } from 'lodash';
-import classNames from 'classnames';
-
-import { CLASSES } from 'common/classes';
-import DataTable from 'components/DataTable';
-import { compose, transformUpdatedRows, saveInvoke } from 'utils';
+import { compose, saveInvoke } from 'utils';
import {
AccountsListFieldCell,
MoneyFieldCell,
@@ -21,9 +17,12 @@ import {
NoteCellRenderer,
} from './components';
import { DataTableEditable } from 'components';
+
import withAccounts from 'containers/Accounts/withAccounts';
import withCustomers from 'containers/Customers/withCustomers';
+import { updateDataReducer } from './utils';
+
/**
* Make journal entries table component.
*/
@@ -126,8 +125,9 @@ function MakeJournalEntriesTable({
};
// Handles update datatable data.
- const handleUpdateData = (rowIndex, columnIdOrObj, value) => {
- const newRows = transformUpdatedRows(rows, rowIndex, columnIdOrObj, value);
+ const handleUpdateData = (rowIndex, columnId, value) => {
+ const newRows = updateDataReducer(rows, rowIndex, columnId, value);
+
saveInvoke(
onChange,
newRows
@@ -185,6 +185,7 @@ function MakeJournalEntriesTable({
contact_type: 'customer',
})),
],
+ autoFocus: ['account_id', 0],
}}
actions={
<>
diff --git a/client/src/containers/Accounting/MakeJournalFormFloatingActions.js b/client/src/containers/Accounting/MakeJournalFormFloatingActions.js
index 2be8dfa2a..4df73ae9e 100644
--- a/client/src/containers/Accounting/MakeJournalFormFloatingActions.js
+++ b/client/src/containers/Accounting/MakeJournalFormFloatingActions.js
@@ -91,7 +91,6 @@ export default function MakeJournalFloatingAction({
}
/>
@@ -123,7 +122,6 @@ export default function MakeJournalFloatingAction({
}
/>
@@ -156,7 +154,6 @@ export default function MakeJournalFloatingAction({
}
/>
diff --git a/client/src/containers/Accounting/utils.js b/client/src/containers/Accounting/utils.js
index d33496c1b..9024aabf0 100644
--- a/client/src/containers/Accounting/utils.js
+++ b/client/src/containers/Accounting/utils.js
@@ -1,8 +1,9 @@
import React from 'react';
import { Intent } from '@blueprintjs/core';
+import { get, sumBy, setWith, toSafeInteger } from 'lodash';
import { AppToaster } from 'components';
import { formatMessage } from 'services/intl';
-import { setWith } from 'lodash';
+import { transformUpdatedRows } from 'utils';
const ERROR = {
JOURNAL_NUMBER_ALREADY_EXISTS: 'JOURNAL.NUMBER.ALREADY.EXISTS',
@@ -15,6 +16,46 @@ const ERROR = {
ENTRIES_SHOULD_ASSIGN_WITH_CONTACT: 'ENTRIES_SHOULD_ASSIGN_WITH_CONTACT',
};
+
+function adjustmentEntries(entries) {
+ const credit = sumBy(entries, e => toSafeInteger(e.credit));
+ const debit = sumBy(entries, e => toSafeInteger(e.debit));
+
+ return {
+ debit: Math.max(credit - debit, 0),
+ credit: Math.max(debit - credit, 0),
+ }
+}
+
+export const updateDataReducer = (rows, rowIndex, columnId, value) => {
+ let newRows = transformUpdatedRows(rows, rowIndex, columnId, value);
+
+ const oldCredit = get(rows, `[${rowIndex}].credit`);
+ const oldDebit = get(rows, `[${rowIndex}].debit`);
+
+ if (columnId === 'account_id' && !oldCredit && !oldDebit) {
+ const adjustment = adjustmentEntries(rows);
+
+ if (adjustment.credit) {
+ newRows = transformUpdatedRows(
+ newRows,
+ rowIndex,
+ 'credit',
+ adjustment.credit,
+ );
+ }
+ if (adjustment.debit) {
+ newRows = transformUpdatedRows(
+ newRows,
+ rowIndex,
+ 'debit',
+ adjustment.debit,
+ );
+ }
+ }
+ return newRows;
+};
+
// Transform API errors in toasts messages.
export const transformErrors = (resErrors, { setErrors, errors }) => {
const getError = (errorType) => resErrors.find((e) => e.type === errorType);
diff --git a/client/src/containers/Entries/ItemsEntriesTable.js b/client/src/containers/Entries/ItemsEntriesTable.js
index 385e19b5c..7d1938437 100644
--- a/client/src/containers/Entries/ItemsEntriesTable.js
+++ b/client/src/containers/Entries/ItemsEntriesTable.js
@@ -233,6 +233,7 @@ function ItemsEntriesTable({
errors: errors || [],
updateData: handleUpdateData,
removeRow: handleRemoveRow,
+ autoFocus: ['item_id', 0],
}}
actions={
<>
diff --git a/client/src/hooks/index.js b/client/src/hooks/index.js
index 66a6c87bf..a59a58bdd 100644
--- a/client/src/hooks/index.js
+++ b/client/src/hooks/index.js
@@ -1,4 +1,4 @@
-import {useRef, useEffect} from 'react';
+import {useRef, useEffect, useMemo } from 'react';
import useAsync from './async';
import useAutofocus from './useAutofocus';
@@ -35,7 +35,37 @@ export function useIsValuePassed(value, compatatorValue) {
return cache.current.indexOf(compatatorValue) !== -1;
}
+const isCurrentFocus = (autoFocus, columnId, rowIndex) => {
+ let _columnId;
+ let _rowIndex;
+
+ if (Array.isArray(autoFocus)) {
+ _columnId = autoFocus[0];
+ _rowIndex = autoFocus[1] || 0;
+ }
+ _rowIndex = parseInt(_rowIndex, 10);
+
+ return columnId === _columnId && _rowIndex === rowIndex;
+};
+
+export function useCellAutoFocus(ref, autoFocus, columnId, rowIndex) {
+ const focus = useMemo(() => isCurrentFocus(autoFocus, columnId, rowIndex), [
+ autoFocus,
+ columnId,
+ rowIndex,
+ ]);
+ useEffect(() => {
+ if (ref.current && focus) {
+ ref.current.focus();
+ }
+ }, [ref, focus]);
+
+ return ref;
+}
+
+
export {
useAsync,
useAutofocus,
-}
\ No newline at end of file
+}
+
diff --git a/client/src/hooks/useAutofocus.js b/client/src/hooks/useAutofocus.js
index 0546956f2..42fc3615c 100644
--- a/client/src/hooks/useAutofocus.js
+++ b/client/src/hooks/useAutofocus.js
@@ -1,13 +1,13 @@
import { useRef, useEffect } from 'react';
-export default function useAutofocus() {
+export default function useAutofocus(focus = true) {
const ref = useRef();
useEffect(() => {
- if (ref.current) {
+ if (ref.current && focus) {
ref.current.focus();
}
- }, [ref]);
+ }, [ref, focus]);
return ref;
}