fix: logo style.

fix: page forms style.
feat: auto-fill items entries from item details.
fix: hiding dashboard copyright bar.

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceForm.js

@@ -123,7 +123,11 @@ function InvoiceForm({
     };
 
     // Handle the request error.
-    const onError = ({ response: { data: { errors } } }) => {
+    const onError = ({
+      response: {
+        data: { errors },
+      },
+    }) => {
       if (errors) {
         handleErrors(errors, { setErrors });
       }
@@ -146,6 +150,7 @@ function InvoiceForm({
       )}
     >
       <Formik
+        enableReinitialize={true}
         validationSchema={
           isNewMode ? CreateInvoiceFormSchema : EditInvoiceFormSchema
         }
@@ -154,10 +159,7 @@ function InvoiceForm({
       >
         <Form>
           <InvoiceFormHeader />
-
-          <div className={classNames(CLASSES.PAGE_FORM_BODY)}>
-            <InvoiceItemsEntriesEditorField />
-          </div>
+          <InvoiceItemsEntriesEditorField />
           <InvoiceFormFooter />
           <InvoiceFloatingActions />
           <InvoiceFormDialogs />

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormDialogs.js

@@ -11,6 +11,9 @@ export default function InvoiceFormDialogs() {
 
   // Update the form once the invoice number form submit confirm.
   const handleInvoiceNumberFormConfirm = (values) => {
+    debugger;
+    console.log(values, 'XX');
+
     setFieldValue(
       'invoice_no',
       transactionNumber(values.number_prefix, values.next_number),

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormFooter.js

@@ -4,7 +4,7 @@ import classNames from 'classnames';
 import { FormGroup, TextArea } from '@blueprintjs/core';
 import { FormattedMessage as T } from 'react-intl';
 import { CLASSES } from 'common/classes';
-import { Row, Col } from 'components';
+import { Row, Col, Postbox } from 'components';
 import Dragzone from 'components/Dragzone';
 
 import { inputIntent } from 'utils';
@@ -12,44 +12,46 @@ import { inputIntent } from 'utils';
 export default function InvoiceFormFooter() {
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FOOTER)}>
-      <Row>
-        <Col md={8}>
-          {/* --------- Invoice message --------- */}
-          <FastField name={'invoice_message'}>
-            {({ field, meta: { error, touched } }) => (
-              <FormGroup
-                label={<T id={'invoice_message'} />}
-                className={'form-group--invoice_message'}
-                intent={inputIntent({ error, touched })}
-              >
-                <TextArea growVertically={true} {...field} />
-              </FormGroup>
-            )}
-          </FastField>
+      <Postbox title={'Invoice details'} defaultOpen={false}>
+        <Row>
+          <Col md={8}>
+            {/* --------- Invoice message --------- */}
+            <FastField name={'invoice_message'}>
+              {({ field, meta: { error, touched } }) => (
+                <FormGroup
+                  label={<T id={'invoice_message'} />}
+                  className={'form-group--invoice_message'}
+                  intent={inputIntent({ error, touched })}
+                >
+                  <TextArea growVertically={true} {...field} />
+                </FormGroup>
+              )}
+            </FastField>
 
-          {/* --------- Terms and conditions --------- */}
-          <FastField name={'terms_conditions'}>
-            {({ field, meta: { error, touched } }) => (
-              <FormGroup
-                label={<T id={'terms_conditions'} />}
-                className={'form-group--terms_conditions'}
-                intent={inputIntent({ error, touched })}
-              >
-                <TextArea growVertically={true} {...field} />
-              </FormGroup>
-            )}
-          </FastField>
-        </Col>
+            {/* --------- Terms and conditions --------- */}
+            <FastField name={'terms_conditions'}>
+              {({ field, meta: { error, touched } }) => (
+                <FormGroup
+                  label={<T id={'terms_conditions'} />}
+                  className={'form-group--terms_conditions'}
+                  intent={inputIntent({ error, touched })}
+                >
+                  <TextArea growVertically={true} {...field} />
+                </FormGroup>
+              )}
+            </FastField>
+          </Col>
 
-        <Col md={4}>
-          <Dragzone
-            initialFiles={[]}
-            // onDrop={handleDropFiles}
-            // onDeleteFile={handleDeleteFile}
-            hint={'Attachments: Maxiumum size: 20MB'}
-          />
-        </Col>
-      </Row>
+          <Col md={4}>
+            <Dragzone
+              initialFiles={[]}
+              // onDrop={handleDropFiles}
+              // onDeleteFile={handleDeleteFile}
+              hint={'Attachments: Maxiumum size: 20MB'}
+            />
+          </Col>
+        </Row>
+      </Postbox>
     </div>
   );
 }

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormHeaderFields.js

@@ -45,7 +45,7 @@ function InvoiceFormHeaderFields({
           <FormGroup
             label={<T id={'customer_name'} />}
             inline={true}
-            className={classNames('form-group--customer-name', CLASSES.FILL)}
+            className={classNames('form-group--customer-name', 'form-group--select-list', CLASSES.FILL)}
             labelInfo={<FieldRequiredHint />}
             intent={inputIntent({ error, touched })}
             helperText={<ErrorMessage name={'customer_id'} />}

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceFormPage.js

@@ -1,9 +1,9 @@
 import React from 'react';
 import { useParams } from 'react-router-dom';
 
-import InvoiceForm from './InvoiceForm';
-
 import 'style/pages/SaleInvoice/PageForm.scss';
+
+import InvoiceForm from './InvoiceForm';
 import { InvoiceFormProvider } from './InvoiceFormProvider';
 
 /**

client/src/containers/Sales/Invoices/InvoiceForm/InvoiceItemsEntriesEditorField.js

@@ -1,5 +1,7 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import { FastField } from 'formik';
+import classNames from 'classnames';
+import { CLASSES } from 'common/classes';
 import ItemsEntriesTable from 'containers/Entries/ItemsEntriesTable';
 import { useInvoiceFormContext } from './InvoiceFormProvider';
 
@@ -8,20 +10,22 @@ import { useInvoiceFormContext } from './InvoiceFormProvider';
  */
 export default function InvoiceItemsEntriesEditorField() {
   const { items } = useInvoiceFormContext();
- 
+
   return (
-    <FastField name={'entries'}>
-      {({ form, field: { value }, meta: { error, touched } }) => (
-        <ItemsEntriesTable
-          entries={value}
-          onUpdateData={(entries) => {
-            form.setFieldValue('entries', entries);
-          }}
-          items={items}
-          errors={error}
-          linesNumber={4}
-        />
-      )}
-    </FastField>
+    <div className={classNames(CLASSES.PAGE_FORM_BODY)}>
+      <FastField name={'entries'}>
+        {({ form, field: { value }, meta: { error, touched } }) => (
+          <ItemsEntriesTable
+            entries={value}
+            onUpdateData={(entries) => {
+              form.setFieldValue('entries', entries);
+            }}
+            items={items}
+            errors={error}
+            linesNumber={4}
+          />
+        )}
+      </FastField>
+    </div>
   );
 }

client/src/containers/Sales/Invoices/InvoiceForm/utils.js

@@ -9,8 +9,8 @@ export const defaultInvoiceEntry = {
   index: 0,
   item_id: '',
   rate: '',
-  discount: 0,
-  quantity: 1,
+  discount: '',
+  quantity: '',
   description: '',
   total: 0,
 };

client/src/containers/Sales/Invoices/InvoicesLanding/components.js

@@ -118,6 +118,7 @@ export function ActionsMenu({
         />
       </If>
       <MenuItem
+        icon={<Icon icon={'receipt-24'} iconSize={16} />}
         text={formatMessage({ id: 'invoice_paper' })}
         onClick={() => onDrawer()}
       />