Merge branch 'develop' into main

CHANGELOG.md

@@ -2,6 +2,47 @@
 
 All notable changes to Bigcapital server-side will be in this file.
 
+## [1.7.1-rc.2] - 30-03-2022
+
+## Added
+ - `BIG-141` Add inactive status to item drawer details.
+ - `BIG-278` Add created at date on expense details.
+ - `BIG-350` Add empty status content of warehouse transfers service.
+ - `BIG-344` Add branch details to manual journal and expense details.
+## Fixed
+ - `BIG-221` Remove Non-inventory radio choice on item form.
+ - `BIG-236` Validate estimate expiration date should be equal or bigger than estimate date.
+ - `BIG-237` Validate invoice due date should be equal or bigger than invoice date.
+ - `BIG-238` Validate bill due date should be equal or bigger than bill date.
+ - `BIG-280` Optimize style of multi-select accounts menu.
+ - `BIG-284` Cashflow statement loading bar.
+ - `BIG-296` Creating a new child account from accounts list.
+ - `BIG-301` Navigation bar divider on actions bar hide with permissions control.
+ - `BIG-304` Adding cash or bank account from cash flow service.
+ - `BIG-351` Invalid date in the inventory adjustment detail.
+ - `BIG-352` Fix terms and notes fields on footer of all services.
+ - `BIG-354` Validate the warehouse transfer quantity should be above zero.
+
+## [1.7.0-rc.1] - 24-03-2022
+
+## Added 
+ - Multiply currencies with foreign currencies.
+ - Multiply warehouses to track inventory items.
+ - Multiply branches to track organization transactions.
+ - Transfer orders between warehouses.
+ - Integrate financial reports with multiply branches.
+ - Integrate inventory reports with multiply warehouses.
+
+## Changes
+ - Optimize style of sale invoice form.
+ - Optimize style of sale receipt form.
+ - Optimize style of credit note form.
+ - Optimize style of payment receive form.
+ - Optimize style of bill form.
+ - Optimize style of payment made form.
+ - Optimize style of manual journal form.
+ - Optimize style of expense form.
+
 ## [1.6.3] - 21-02-2022
 
 ### Fixed

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bigcapital-client",
- "version": "1.6.3",
+ "version": "1.7.1",
  "private": true,
  "dependencies": {
  "@babel/core": "7.8.4",

src/components/Accounts/AccountMultiSelect.js

@@ -0,0 +1,73 @@
+import React from 'react';
+import styled from 'styled-components';
+import { MenuItem } from '@blueprintjs/core';
+import { FMultiSelect } from '../Forms';
+import classNames from 'classnames';
+import { Classes } from '@blueprintjs/popover2';
+
+/**
+ *
+ * @param {*} query
+ * @param {*} account
+ * @param {*} _index
+ * @param {*} exactMatch
+ * @returns
+ */
+const accountItemPredicate = (query, account, _index, exactMatch) => {
+ const normalizedTitle = account.name.toLowerCase();
+ const normalizedQuery = query.toLowerCase();
+
+ if (exactMatch) {
+ return normalizedTitle === normalizedQuery;
+ } else {
+ return `${account.code}. ${normalizedTitle}`.indexOf(normalizedQuery) >= 0;
+ }
+};
+
+/**
+ *
+ * @param {*} account
+ * @param {*} param1
+ * @returns
+ */
+const accountItemRenderer = (
+ account,
+ { handleClick, modifiers, query },
+ { isSelected },
+) => {
+ return (
+ <MenuItem
+ icon={isSelected ? 'tick' : 'blank'}
+ text={account.name}
+ label={account.code}
+ key={account.id}
+ onClick={handleClick}
+ />
+ );
+};
+
+const accountSelectProps = {
+ itemPredicate: accountItemPredicate,
+ itemRenderer: accountItemRenderer,
+ valueAccessor: (item) => item.id,
+ labelAccessor: (item) => item.code,
+ tagRenderer: (item) => item.name,
+};
+
+/**
+ * branches mulit select.
+ * @param {*} param0
+ * @returns {JSX.Element}
+ */
+export function AccountMultiSelect({ accounts, ...rest }) {
+ return (
+ <FMultiSelect
+ items={accounts}
+ popoverProps={{
+ minimal: true,
+ }}
+ {...accountSelectProps}
+ {...rest}
+ />
+ );
+}

src/components/Accounts/index.js

@@ -0,0 +1 @@
+export * from './AccountMultiSelect';

src/components/index.js

@@ -104,6 +104,7 @@ export * from './Warehouses';
 export * from './Currencies';
 export * from './FormTopbar'
 export * from './Paper';
+export * from './Accounts'
 
 const Hint = FieldHint;
 

src/containers/Accounting/MakeJournal/components.js

@@ -4,7 +4,12 @@ import { Popover2 } from '@blueprintjs/popover2';
 import { useFormikContext } from 'formik';
 import intl from 'react-intl-universal';
 
-import { ExchangeRateInputGroup, Icon, Hint, FormattedMessage as T } from 'components';
+import {
+ ExchangeRateInputGroup,
+ Icon,
+ Hint,
+ FormattedMessage as T,
+} from 'components';
 import {
  AccountsListFieldCell,
  MoneyFieldCell,
@@ -63,7 +68,10 @@ export const ActionsCellRenderer = ({
  };
  const exampleMenu = (
  <Menu>
- <MenuItem onClick={handleClickRemoveRole} text="Remove line" />
+ <MenuItem
+ onClick={handleClickRemoveRole}
+ text={intl.get('make_journal.entries.remove_row')}
+ />
  </Menu>
  );
  return (

src/containers/Drawers/BillDrawer/BillDetailActionsBar.js

@@ -95,9 +95,9 @@ function BillDetailActionsBar({
  onClick={handleQuickBillPayment}
  />
  </If>
- <NavbarDivider />
  </Can>
  <Can I={BillAction.Delete} a={AbilitySubject.Bill}>
+ <NavbarDivider />
  <Button
  className={Classes.MINIMAL}
  icon={<Icon icon={'trash-16'} iconSize={16} />}

src/containers/Drawers/CustomerDetailsDrawer/CustomerDetailsActionsBar.js

@@ -131,17 +131,17 @@ function CustomerDetailsActionsBar({
  />
  </Popover>
 
- <NavbarDivider />
  <Can I={CustomerAction.Edit} a={AbilitySubject.Customer}>
+ <NavbarDivider />
  <Button
  className={Classes.MINIMAL}
  icon={<Icon icon="pen-18" />}
  text={intl.get('customer.drawer.action.edit')}
  onClick={handleEditContact}
  />
- <NavbarDivider />
  </Can>
  <Can I={CustomerAction.Delete} a={AbilitySubject.Customer}>
+ <NavbarDivider />
  <Button
  className={Classes.MINIMAL}
  icon={<Icon icon={'trash-16'} iconSize={16} />}

src/containers/Drawers/EstimateDetailDrawer/EstimateDetailActionsBar.js

@@ -96,9 +96,9 @@ function EstimateDetailActionsBar({
  intent={Intent.DANGER}
  onClick={handleDeleteEstimate}
  />
- <NavbarDivider />
  </Can>
  <Can I={SaleEstimateAction.NotifyBySms} a={AbilitySubject.Estimate}>
+ <NavbarDivider />
  <MoreMenuItems
  payload={{
  onNotifyViaSMS: handleNotifyViaSMS,

src/containers/Drawers/ExpenseDrawer/ExpenseDrawerActionBar.js

@@ -55,9 +55,9 @@ function ExpenseDrawerActionBar({
  text={<T id={'edit_expense'} />}
  onClick={handleEditExpense}
  />
- <NavbarDivider />
  </Can>
  <Can I={ExpenseAction.Delete} a={AbilitySubject.Expense}>
+ <NavbarDivider />
  <Button
  className={Classes.MINIMAL}
  icon={<Icon icon="trash-16" iconSize={16} />}

src/containers/Drawers/ExpenseDrawer/ExpenseDrawerHeader.js

@@ -10,6 +10,7 @@ import {
  Col,
  DetailItem,
  DetailsMenu,
+ FormatDate,
  ExchangeRateDetailItem,
  FormattedMessage as T,
 } from 'components';
@@ -64,10 +65,12 @@ export default function ExpenseDrawerHeader() {
  minLabelSize={'180px'}
  >
  <DetailItem label={<T id={'published_at'} />}>
- {moment(expense.published_at).format('YYYY MMM DD')}
+ <FormatDate value={expense.published_at} />
  </DetailItem>
 
- <DetailItem label={<T id={'created_at'} />}>2021 Aug 24</DetailItem>
+ <DetailItem label={<T id={'created_at'} />}>
+ <FormatDate value={expense.created_at} />
+ </DetailItem>
  </DetailsMenu>
  </Col>
  </Row>

src/containers/Drawers/ExpenseDrawer/ExpenseDrawerProvider.js

@@ -1,13 +1,19 @@
 import React from 'react';
+import intl from 'react-intl-universal';
 import { useExpense } from 'hooks/query';
-import { DrawerLoading } from 'components';
+import { DrawerHeaderContent, DrawerLoading } from 'components';
+import { Features } from 'common';
+import { useFeatureCan } from 'hooks/state';
 
 const ExpenseDrawerDrawerContext = React.createContext();
 
 /**
  * Expense drawer provider.
  */
 function ExpenseDrawerProvider({ expenseId, ...props }) {
+ // Features guard.
+ const { featureCan } = useFeatureCan();
+
  // Fetch the expense details.
  const {
  data: expense,
@@ -28,6 +34,17 @@ function ExpenseDrawerProvider({ expenseId, ...props }) {
 
  return (
  <DrawerLoading loading={isExpenseLoading}>
+ <DrawerHeaderContent
+ name="expense-drawer"
+ title={intl.get('expense.drawer.title')}
+ subTitle={
+ featureCan(Features.Branches)
+ ? intl.get('expense.drawer.subtitle', {
+ value: expense.branch?.name,
+ })
+ : null
+ }
+ />
  <ExpenseDrawerDrawerContext.Provider value={provider} {...props} />
  </DrawerLoading>
  );

src/containers/Drawers/ExpenseDrawer/index.js

@@ -1,6 +1,4 @@
 import React, { lazy } from 'react';
-import intl from 'react-intl-universal';
-
 import { Drawer, DrawerSuspense } from 'components';
 import withDrawers from 'containers/Drawer/withDrawers';
 
@@ -22,7 +20,6 @@ function ExpenseDrawer({
  <Drawer
  isOpen={isOpen}
  name={name}
- title={intl.get('expense.drawer.title')}
  size={'65%'}
  style={{ minWidth: '700px', maxWidth: '900px' }}
  >

src/containers/Drawers/InventoryAdjustmentDetailDrawer/InventoryAdjustmentDetailHeader.js

@@ -5,7 +5,7 @@ import intl from 'react-intl-universal';
 import { defaultTo } from 'lodash';
 import clsx from 'classnames';
 
-import { DetailsMenu, DetailItem } from 'components';
+import { DetailsMenu, DetailItem, FormatDate } from 'components';
 import { useInventoryAdjustmentDrawerContext } from './InventoryAdjustmentDrawerProvider';
 
 import InventoryAdjustmentDrawerCls from 'style/components/Drawers/InventoryAdjustmentDrawer.module.scss';
@@ -20,7 +20,7 @@ export default function InventoryAdjustmentDetailHeader() {
  <div className={clsx(InventoryAdjustmentDrawerCls.detail_panel_header)}>
  <DetailsMenu direction={'horizantal'} minLabelSize={'180px'}>
  <DetailItem label={intl.get('date')}>
- {moment(inventoryAdjustment.date).format('YYYY MMM DD')}
+ <FormatDate value={inventoryAdjustment.date} />
  </DetailItem>
 
  <DetailItem label={intl.get('type')}>
@@ -36,15 +36,15 @@ export default function InventoryAdjustmentDetailHeader() {
  </DetailItem>
 
  <DetailItem label={intl.get('published_at')}>
- {moment(inventoryAdjustment.published_at).format('YYYY MMM DD')}
+ <FormatDate value={inventoryAdjustment.published_at} />
  </DetailItem>
 
  <DetailItem label={intl.get('reason')}>
  {defaultTo(inventoryAdjustment.reason, '—')}
  </DetailItem>
 
  <DetailItem label={intl.get('created_at')}>
- {moment(inventoryAdjustment.created_at).format('YYYY MMM DD')}
+ <FormatDate value={inventoryAdjustment.created_at} />
  </DetailItem>
  </DetailsMenu>
  </div>

src/containers/Drawers/ItemDetailDrawer/ItemDetailActionsBar.js

@@ -55,10 +55,9 @@ function ItemDetailActionsBar({
  text={<T id={'edit_item'} />}
  onClick={handleEditItem}
  />
-
- <NavbarDivider />
  </Can>
  <Can I={ItemAction.Delete} a={AbilitySubject.Item}>
+ <NavbarDivider />
  <Button
  className={Classes.MINIMAL}
  icon={<Icon icon={'trash-16'} iconSize={16} />}

src/containers/Drawers/ItemDetailDrawer/ItemDetailDrawerProvider.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import { DrawerHeaderContent, DrawerLoading } from 'components';
 import { useItem } from 'hooks/query';
+import { inactiveStatus } from './utlis';
 
 const ItemDetailDrawerContext = React.createContext();
 
@@ -27,7 +28,10 @@ function ItemDetailDrawerProvider({ itemId, ...props }) {
 
  return (
  <DrawerLoading loading={isItemLoading}>
- <DrawerHeaderContent name="item-detail-drawer" title={item?.name} />
+ <DrawerHeaderContent
+ name="item-detail-drawer"
+ title={inactiveStatus(item)}
+ />
  <ItemDetailDrawerContext.Provider value={provider} {...props} />
  </DrawerLoading>
  );

src/containers/Drawers/ItemDetailDrawer/utlis.js

@@ -0,0 +1,27 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Intent, Tag } from '@blueprintjs/core';
+import { Choose, FormattedMessage as T } from '../../../components';
+
+/**
+ * items inactive status.
+ * @returns {React.JSX}
+ */
+export function inactiveStatus(item) {
+ return (
+ <Choose>
+ <Choose.When condition={!item.active}>
+ {item.name}
+ <StatusTag intent={Intent.NONE} minimal={true} round={true}>
+ <T id={'item.details.inactive'} />
+ </StatusTag>
+ </Choose.When>
+ <Choose.Otherwise>{item.name}</Choose.Otherwise>
+ </Choose>
+ );
+}
+
+const StatusTag = styled(Tag)`
+ font-size: 11px;
+ margin-left: 10px;
+`;