- fix: store children accounts with Redux store.

- fix: store expense payment date with transactions.
- fix: Total assets, liabilities and equity on balance sheet.
- tweaks: dashboard content and sidebar style.
- fix: reset form with contact list on journal entry form.
- feat: Add hints to filter accounts in financial statements.

client/src/components/ContactsListField.js

@@ -1,43 +1,51 @@
-import React, { useCallback, useState } from 'react';
-import {
-  MenuItem,
-  Button,
-} from '@blueprintjs/core';
+import React, { useCallback, useMemo } from 'react';
+import { MenuItem, Button } from '@blueprintjs/core';
 import ListSelect from 'components/ListSelect';
 import { FormattedMessage as T } from 'react-intl';
 
 export default function ContactsListField({
   contacts,
   onContactSelected,
-  error,
-  initialContact,
-  defautlSelectText = (<T id={'select_contact'} />)
+  selectedContactId,
+  selectedContactType,
+  defautlSelectText = <T id={'select_contact'} />,
 }) {
-  const [selectedContact, setSelectedContact] = useState(
-    initialContact || null
+  // Contact item of select accounts field.
+  const contactRenderer = useCallback(
+    (item, { handleClick, modifiers, query }) => (
+      <MenuItem text={item.display_name} key={item.id} onClick={handleClick} />
+    ),
+    [],
   );
 
-  // Contact item of select accounts field.
-  const contactItem = useCallback((item, { handleClick, modifiers, query }) => (
-    <MenuItem text={item.display_name} key={item.id} onClick={handleClick} />
-  ), []);
+  const onContactSelect = useCallback(
+    (contact) => {
+      onContactSelected && onContactSelected(contact);
+    },
+    [onContactSelected],
+  );
 
-  const onContactSelect = useCallback((contact) => {
-    setSelectedContact(contact.id);
-    onContactSelected && onContactSelected(contact);
-  }, [setSelectedContact, onContactSelected]);
+  const items = useMemo(
+    () =>
+      contacts.map((contact) => ({
+        ...contact,
+        _id: `${contact.id}_${contact.contact_type}`,
+      })),
+    [contacts],
+  );
 
   return (
     <ListSelect
-      items={contacts}
-      noResults={<MenuItem disabled={true} text='No results.' />}
-      itemRenderer={contactItem}
+      items={items}
+      noResults={<MenuItem disabled={true} text="No results." />}
+      itemRenderer={contactRenderer}
       popoverProps={{ minimal: true }}
       filterable={true}
       onItemSelect={onContactSelect}
       labelProp={'display_name'}
-      selectedItem={selectedContact}
-      selectedItemProp={'id'} 
-      defaultText={defautlSelectText} />
+      selectedItem={`${selectedContactId}_${selectedContactType}`}
+      selectedItemProp={'_id'}
+      defaultText={defautlSelectText}
+    />
   );
-}
+}