- feat: Filter expense and payment accounts on expense form.

- feat: Make journal errors with receivable and payable accounts.
- fix: Handle database big numbers.
- fix: Indexing lines when add a new line on make journal form.
- fix: Abstruct accounts type component.

client/src/components/DataTableCells/AccountsListFieldCell.js

@@ -1,44 +1,43 @@
-import React, {useCallback, useMemo} from 'react';
+import React, { useCallback, useMemo } from 'react';
 import AccountsSelectList from 'components/AccountsSelectList';
 import classNames from 'classnames';
-import {
-  FormGroup,
-  Classes,
-  Intent,
-} from '@blueprintjs/core';
+import { FormGroup, Classes, Intent } from '@blueprintjs/core';
 
 // Account cell renderer.
 const AccountCellRenderer = ({
-  column: { id },
+  column: { id, accountsDataProp },
   row: { index, original },
   cell: { value: initialValue },
-  payload: { accounts, updateData, errors },
+  payload: { accounts: defaultAccounts, updateData, errors, ...restProps },
 }) => {
-  const handleAccountSelected = useCallback((account) => {
-    updateData(index, id, account.id);
-  }, [updateData, index, id]);
-
-  const { account_id = false } = (errors[index] || {});
-
-  // const initialAccount = useMemo(() => 
-  //   accounts.find(a => a.id === initialValue),
-  //   [accounts, initialValue]);
+  const handleAccountSelected = useCallback(
+    (account) => {
+      updateData(index, id, account.id);
+    },
+    [updateData, index, id],
+  );
+  const error = errors?.[index]?.[id];
 
+  const accounts = useMemo(
+    () => restProps[accountsDataProp] || defaultAccounts,
+    [restProps, defaultAccounts, accountsDataProp],
+  );
   return (
     <FormGroup
-      intent={account_id ? Intent.DANGER : ''}
+      intent={error ? Intent.DANGER : null}
       className={classNames(
         'form-group--select-list',
         'form-group--account',
-        Classes.FILL)}
-      >
+        Classes.FILL,
+      )}
+    >
       <AccountsSelectList
         accounts={accounts}
         onAccountSelected={handleAccountSelected}
-        error={account_id}
-        selectedAccountId={initialValue} />
+        selectedAccountId={initialValue}
+      />
     </FormGroup>
   );
 };
 
-export default AccountCellRenderer;
+export default AccountCellRenderer;

client/src/components/DataTableCells/ContactsListFieldCell.js

@@ -1,5 +1,5 @@
 import React, { useCallback, useMemo } from 'react';
-import { FormGroup, Classes } from "@blueprintjs/core";
+import { FormGroup, Intent, Classes } from "@blueprintjs/core";
 import classNames from 'classnames';
 import ContactsListField from 'components/ContactsListField';
 
@@ -20,8 +20,11 @@ export default function ContactsListCellRenderer({
     return contacts.find(c => c.id === initialValue);
   }, [contacts, initialValue]);
 
+  const error = errors?.[index]?.[id];
+
   return (
     <FormGroup
+      intent={error ? Intent.DANGER : null}
       className={classNames(
         'form-group--select-list',
         'form-group--contacts-list',
@@ -32,6 +35,7 @@ export default function ContactsListCellRenderer({
         contacts={contacts}
         onContactSelected={handleContactSelected}
         initialContact={initialContact}
+        
       />
     </FormGroup>
   )

client/src/components/DataTableCells/InputGroupCell.js

@@ -1,31 +1,35 @@
-import React, {useState, useEffect} from 'react';
-import {
-  InputGroup
-} from '@blueprintjs/core';
+import React, { useState, useEffect } from 'react';
+import classNames from 'classnames';
+import { Classes, InputGroup, FormGroup } from '@blueprintjs/core';
 
 const InputEditableCell = ({
   row: { index },
-  column: { id,  },
+  column: { id },
   cell: { value: initialValue },
   payload,
 }) => {
-  const [value, setValue] = useState(initialValue)
+  const [value, setValue] = useState(initialValue);
 
-  const onChange = e => {
-    setValue(e.target.value)
-  }
+  const onChange = (e) => {
+    setValue(e.target.value);
+  };
   const onBlur = () => {
-    payload.updateData(index, id, value)
-  }
+    payload.updateData(index, id, value);
+  };
   useEffect(() => {
-    setValue(initialValue)
-  }, [initialValue])
+    setValue(initialValue);
+  }, [initialValue]);
 
-  return (<InputGroup
-    value={value}
-    onChange={onChange}
-    onBlur={onBlur}
-    fill={true} />);
+  return (
+    <FormGroup>
+      <InputGroup
+        value={value}
+        onChange={onChange}
+        onBlur={onBlur}
+        fill={true}
+      />
+    </FormGroup>
+  );
 };
 
 export default InputEditableCell;

client/src/components/DataTableCells/MoneyFieldCell.js

@@ -1,4 +1,5 @@
 import React, { useCallback, useState, useEffect } from 'react';
+import { FormGroup, Intent } from '@blueprintjs/core';
 import MoneyInputGroup from 'components/MoneyInputGroup';
 
 // Input form cell renderer.
@@ -6,7 +7,7 @@ const MoneyFieldCellRenderer = ({
   row: { index },
   column: { id },
   cell: { value: initialValue },
-  payload
+  payload: { errors, updateData },
 }) => {
   const [value, setValue] = useState(initialValue);
 
@@ -15,26 +16,36 @@ const MoneyFieldCellRenderer = ({
   }, []);
 
   function isNumeric(data) {
-    return !isNaN(parseFloat(data)) && isFinite(data) && data.constructor !== Array;
+    return (
+      !isNaN(parseFloat(data)) && isFinite(data) && data.constructor !== Array
+    );
   }
 
   const onBlur = () => {
     const updateValue = isNumeric(value) ? parseFloat(value) : value;
-    payload.updateData(index, id, updateValue);
+    updateData(index, id, updateValue);
   };
 
   useEffect(() => {
     setValue(initialValue);
-  }, [initialValue])
+  }, [initialValue]);
 
-  return (<MoneyInputGroup
-    value={value}
-    prefix={'$'}
-    onChange={handleFieldChange}
-    inputGroupProps={{
-      fill: true,
-      onBlur,
-    }} />)
+  const error = errors?.[index]?.[id];
+
+  return (
+    <FormGroup
+      intent={error ? Intent.DANGER : null}>
+      <MoneyInputGroup
+        value={value}
+        prefix={'$'}
+        onChange={handleFieldChange}
+        inputGroupProps={{
+          fill: true,
+          onBlur,
+        }}
+      />
+    </FormGroup>
+  );
 };
 
-export default MoneyFieldCellRenderer;
+export default MoneyFieldCellRenderer;