feat: rename item sku to code.

feat: fix sidebar current tab issue.

client/src/components/MenuItemLabel.js

@@ -3,5 +3,5 @@ import React from 'react';
 export default function MenuItemLabel({
   text
 }) {
-  return (<span class="bp3-menu-item-label">{ text }</span>);
+  return (<span class="bp3-menu-item-labeler">{ text }</span>);
 }

client/src/components/Sidebar/SidebarMenu.js

@@ -1,5 +1,5 @@
-import React from 'react';
-import { Menu, MenuDivider } from '@blueprintjs/core';
+import React, { useMemo } from 'react';
+import { Menu, MenuDivider, Button } from '@blueprintjs/core';
 import { useHistory, useLocation } from 'react-router-dom';
 import sidebarMenuList from 'config/sidebarMenu';
 import Icon from 'components/Icon';
@@ -16,16 +16,31 @@ export default function SidebarMenu() {
       const children = Array.isArray(item.children)
         ? menuItemsMapper(item.children)
         : null;
-      const isActive =
-        (item.href && item.href === location.pathname) ||
-        (item.children &&
-          item.children.some((c) => c.href === location.pathname));
+
+      const matchPath = (pathname, path) => {
+        return item.matchExact ? pathname === path : pathname.indexOf(path) !== -1;
+      };
+      const isActive = (item.children) ?
+        item.children.some((c) => matchPath(location.pathname, c.href)) :
+        (item.href && matchPath(location.pathname, item.href));
 
       const handleItemClick = () => {
         if (item.href) {
           history.push(item.href);
         }
       };
+
+      const maybeRenderLabel = (item) => item.newTabHref ? (
+        <Button
+          className="menu-item__add-btn"
+          icon={<Icon icon={'plus'} iconSize={16} />}
+          onClick={(event) => {
+            history.push(item.newTabHref);
+            event.stopPropagation();
+          }}
+        />
+      ) : null;
+
       return item.spacer ? (
         <div class="bp3-menu-spacer"></div>
       ) : item.divider ? (
@@ -38,7 +53,7 @@ export default function SidebarMenu() {
           active={isActive}
           icon={<Icon icon={item.icon} iconSize={item.iconSize} />}
           text={item.text}
-          label={item.label}
+          label={maybeRenderLabel(item)}
           disabled={item.disabled}
           children={children}
           dropdownType={item.dropdownType || 'collapse'}

client/src/config/sidebarMenu.js

@@ -1,4 +1,4 @@
-import React from 'react';
+  import React from 'react';
 import { FormattedMessage as T } from 'react-intl';
 
 export default [
@@ -13,7 +13,6 @@ export default [
   {
     divider: true,
   },
-
   {
     text: 'Sales & inventory',
     label: true,
@@ -41,16 +40,18 @@ export default [
       {
         text: <T id={'estimates'} />,
         href: '/estimates',
+        newTabHref: '/estimates/new',
       },
-
       {
         text: <T id={'invocies'} />,
         href: '/invoices',
+        newTabHref: '/invoices/new',
       },
 
       {
         text: <T id={'payment_receives'} />,
         href: '/payment-receives',
+        newTabHref: '/payment-receives/new',
       },
       {
         divider: true,
@@ -58,6 +59,7 @@ export default [
       {
         text: <T id={'receipts'} />,
         href: '/receipts',
+        newTabHref: '/receipts/new',
       },
     ],
   },
@@ -67,11 +69,12 @@ export default [
       {
         text: <T id={'bills'} />,
         href: '/bills',
+        newTabHref: '/bills/new',
       },
-
       {
         text: <T id={'payment_made'} />,
         href: '/payment-mades',
+        newTabHref: '/payment-mades/new',
       },
     ],
   },
@@ -81,10 +84,12 @@ export default [
       {
         text: <T id={'customers'} />,
         href: '/customers',
+        newTabHref: '/customers/new',
       },
       {
         text: <T id={'vendors'} />,
         href: '/vendors',
+        newTabHref: '/vendors/new',
       },
     ],
   },
@@ -139,6 +144,7 @@ export default [
       {
         text: <T id={'all_reports'} />,
         href: '/financial-reports',
+        matchExact: true,
       },
       {
         divider: true,

client/src/containers/Entries/EditableItemsEntriesTable.js

@@ -9,6 +9,9 @@ export default function EditableItemsEntriesTable({
   defaultEntry,
   minLinesNumber = 2,
   linesNumber = 5,
+
+  filterSellableItems = false,
+  filterPurchasableItems = false,
 }) {
   const { setFieldValue, values } = useFormikContext();
   const [clearLinesAlert, setClearLinesAlert] = useState(false);
@@ -58,6 +61,8 @@ export default function EditableItemsEntriesTable({
             }}
             entries={value}
             errors={error}
+            filterPurchasableItems={filterPurchasableItems}
+            filterSellableItems={filterSellableItems}
             onClickAddNewRow={handleClickAddNewRow}
             onClickClearAllLines={handleClearAllLines}
             onClickRemoveRow={handleClickRemoveLine}

client/src/containers/Entries/ItemsEntriesTable.js

@@ -91,6 +91,8 @@ function ItemsEntriesTable({
   onClickRemoveRow,
   onClickAddNewRow,
   onClickClearAllLines,
+  filterPurchasableItems = false,
+  filterSellableItems = false,
 }) {
   const [rows, setRows] = useState([]);
   const { formatMessage } = useIntl();
@@ -117,6 +119,8 @@ function ItemsEntriesTable({
         Cell: ItemsListCell,
         disableSortBy: true,
         width: 180,
+        filterPurchasable: filterPurchasableItems,
+        filterSellable: filterSellableItems,
       },
       {
         Header: formatMessage({ id: 'description' }),

client/src/containers/Items/ItemForm.js

@@ -33,7 +33,7 @@ const defaultInitialValues = {
   active: true,
   name: '',
   type: 'service',
-  sku: '',
+  code: '',
   cost_price: '',
   sell_price: '',
   cost_account_id: '',

client/src/containers/Items/ItemForm.schema.js

@@ -1,4 +1,5 @@
 import * as Yup from 'yup';
+import { defaultTo } from 'lodash';
 import { formatMessage } from 'services/intl';
 import { DATATYPES_LENGTH } from 'common/dataTypes';
 
@@ -15,7 +16,7 @@ const Schema = Yup.object().shape({
     .min(0)
     .max(DATATYPES_LENGTH.STRING)
     .label(formatMessage({ id: 'item_type_' })),
-  sku: Yup.string().trim().min(0).max(DATATYPES_LENGTH.STRING),
+  code: Yup.string().trim().min(0).max(DATATYPES_LENGTH.STRING),
   cost_price: Yup.number().when(['purchasable'], {
     is: true,
     then: Yup.number()
@@ -61,8 +62,8 @@ const Schema = Yup.object().shape({
 export const transformItemFormData = (item, defaultValue) => {
   return {
     ...item,
-    sellable: item?.sellable ? Boolean(item.sellable) : defaultValue.sellable,
-    purchasable: item?.purchasable ? Boolean(item.purchasable) : defaultValue.purchasable,
+    sellable: !!defaultTo(item?.sellable, defaultValue.sellable),
+    purchasable: !!defaultTo(item?.purchasable, defaultValue.purchasable),
   };
 }
 

client/src/containers/Items/ItemFormBody.js

@@ -27,7 +27,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
         <Col xs={6}>
           {/*------------- Purchasable checbox ------------- */}
           <FastField name={'sellable'} type="checkbox">
-            {({ field }) => (
+            {({ form, field }) => (
               <FormGroup inline={true} className={'form-group--sellable'}>
                 <Checkbox
                   inline={true}
@@ -44,7 +44,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
           </FastField>
 
           {/*------------- Selling price ------------- */}
-          <Field name={'sell_price'}>
+          <FastField name={'sell_price'}>
             {({ form, field: { value }, meta: { error, touched } }) => (
               <FormGroup
                 label={<T id={'selling_price'} />}
@@ -67,7 +67,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
                 </ControlGroup>
               </FormGroup>
             )}
-          </Field>
+          </FastField>
 
           {/*------------- Selling account ------------- */}
           <FastField name={'sell_account_id'}>
@@ -93,6 +93,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
                   selectedAccountId={value}
                   disabled={!form.values.sellable}
                   filterByTypes={['income']}
+                  popoverFill={true}
                 />
               </FormGroup>
             )}
@@ -118,7 +119,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
           </FastField>
 
           {/*------------- Cost price ------------- */}
-          <Field name={'cost_price'}>
+          <FastField name={'cost_price'}>
             {({ field, form, field: { value }, meta: { error, touched } }) => (
               <FormGroup
                 label={<T id={'cost_price'} />}
@@ -141,7 +142,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
                 </ControlGroup>
               </FormGroup>
             )}
-          </Field>
+          </FastField>
 
           {/*------------- Cost account ------------- */}
           <FastField name={'cost_account_id'}>
@@ -167,6 +168,7 @@ function ItemFormBody({ accountsList, baseCurrency }) {
                   selectedAccountId={value}
                   disabled={!form.values.purchasable}
                   filterByTypes={['cost_of_goods_sold']}
+                  popoverFill={true}
                 />
               </FormGroup>
             )}

client/src/containers/Items/ItemFormPrimarySection.js

@@ -135,7 +135,7 @@ function ItemFormPrimarySection({
           </FastField>
 
           {/*----------- Item category ----------*/}
-          <FastField name={'type'}>
+          <FastField name={'category_id'}>
             {({ form, field: { value }, meta: { error, touched } }) => (
               <FormGroup
                 label={<T id={'category'} />}
@@ -143,7 +143,6 @@ function ItemFormPrimarySection({
                 intent={inputIntent({ error, touched })}
                 helperText={<ErrorMessage name="category_id" />}
                 className={classNames(
-                  'form-group--select-list',
                   'form-group--category',
                   Classes.FILL,
                 )}
@@ -154,7 +153,6 @@ function ItemFormPrimarySection({
                   onCategorySelected={(category) => {
                     form.setFieldValue('category_id', category.id);
                   }}
-                  popoverProps={{ minimal: true }}
                 />
               </FormGroup>
             )}

client/src/containers/Items/ItemsDataTable.js

@@ -111,8 +111,8 @@ function ItemsDataTable({
       },
       {
         Header: formatMessage({ id: 'item_code' }),
-        accessor: 'sku',
-        className: 'sku',
+        accessor: 'code',
+        className: 'code',
         width: 120,
       },
       {

client/src/containers/Purchases/Bill/BillForm.js

@@ -22,7 +22,7 @@ import withBillDetail from './withBillDetail';
 import { AppToaster } from 'components';
 
 import { ERROR } from 'common/errors';
-import { compose, repeatValue, orderingLinesIndexes } from 'utils';
+import { compose, repeatValue, defaultToTransform, orderingLinesIndexes } from 'utils';
 
 const MIN_LINES_NUMBER = 5;
 
@@ -207,7 +207,10 @@ function BillForm({
         {({ isSubmitting, values }) => (
           <Form>
             <BillFormHeader onBillNumberChanged={handleBillNumberChanged} />
-            <EditableItemsEntriesTable defaultEntry={defaultBill} />
+            <EditableItemsEntriesTable
+              defaultEntry={defaultBill}
+              filterPurchasableItems={true}
+            />
             <BillFormFooter
               oninitialFiles={[]}
               // onDropFiles={handleDeleteFile}

client/src/containers/Purchases/Bill/BillFormHeader.js

@@ -54,6 +54,7 @@ function BillFormHeader({
                 onContactSelected={(contact) => {
                   form.setFieldValue('vendor_id', contact.id);
                 }}
+                popoverFill={true}
               />
             </FormGroup>
           )}

client/src/index.js

@@ -9,14 +9,6 @@ import * as serviceWorker from 'serviceWorker';
 import { store, persistor } from 'store/createStore';
 import AppProgress from 'components/NProgress/AppProgress';
 
-import whyDidYouRender from '@welldone-software/why-did-you-render';
-
-whyDidYouRender(React, {
-  onlyLogs: true,
-  titleColor: 'green',
-  diffNameColor: 'aqua',
-});
-
 ReactDOM.render(
   <Provider store={store}>
     <PersistGate loading={null} persistor={persistor}>

client/src/routes/dashboard.js

@@ -259,7 +259,6 @@ export default [
     }),
     breadcrumb: 'Edit',
   },
-
   {
     path: `/invoices/new`,
     component: LazyLoader({
@@ -298,10 +297,9 @@ export default [
     breadcrumb: 'Receipt List',
   },
 
-  // Payment Receives
-
+  // Payment receives
   {
-    path: `/payment-receive/:id/edit`,
+    path: `/payment-receives/:id/edit`,
     component: LazyLoader({
       loader: () =>
         import('containers/Sales/PaymentReceive/PaymentReceiveFormPage'),
@@ -309,7 +307,7 @@ export default [
     breadcrumb: 'Edit',
   },
   {
-    path: `/payment-receive/new`,
+    path: `/payment-receives/new`,
     component: LazyLoader({
       loader: () =>
         import('containers/Sales/PaymentReceive/PaymentReceiveFormPage'),
@@ -364,14 +362,14 @@ export default [
   },
   // Payment mades.
   {
-    path: `/payment-made/:id/edit`,
+    path: `/payment-mades/:id/edit`,
     component: LazyLoader({
       loader: () => import('containers/Purchases/PaymentMades/PaymentMade'),
     }),
     breadcrumb: 'Edit',
   },
   {
-    path: `/payment-made/new`,
+    path: `/payment-mades/new`,
     component: LazyLoader({
       loader: () => import('containers/Purchases/PaymentMades/PaymentMade'),
     }),