Fix: FloatingActions.

client/src/containers/Accounting/MakeJournalEntriesFooter.js

@@ -1,58 +1,199 @@
 import React from 'react';
-import { Intent, Button } from '@blueprintjs/core';
+import {
+  Intent,
+  Button,
+  ButtonGroup,
+  Popover,
+  PopoverInteractionKind,
+  Position,
+  Menu,
+  MenuItem,
+} from '@blueprintjs/core';
 import { FormattedMessage as T } from 'react-intl';
+import { CLASSES } from 'common/classes';
+import classNames from 'classnames';
+import { saveInvoke } from 'utils';
+import { If, Icon } from 'components';
 
+/**
+ * Make Journal floating actions bar.
+ */
 export default function MakeJournalEntriesFooter({
   isSubmitting,
   onSubmitClick,
   onCancelClick,
   manualJournalId,
+  onSubmitForm,
+  onResetForm,
+  manualJournalPublished,
 }) {
+  const handleSubmitPublishBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: true,
+    });
+  };
+
+  const handleSubmitPublishAndNewBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitPublishContinueEditingBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
+
+  const handleSubmitDraftBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: false,
+    });
+  };
+
+  const handleSubmitDraftAndNewBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+    });
+  };
+
+  const handleCancelBtnClick = (event) => {
+    saveInvoke(onCancelClick, event);
+  };
+
+  const handleClearBtnClick = (event) => {
+    // saveInvoke(onClearClick, event);
+    onResetForm();
+  };
+
   return (
-    <div>
+    <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <div class="form__floating-footer">
+      {/* ----------- Save And Publish ----------- */}
-        <Button
+      <If condition={!manualJournalId || !manualJournalPublished}>
-          disabled={isSubmitting}
+        <ButtonGroup>
-          intent={Intent.PRIMARY}
+          <Button
-          name={'save'}
+            disabled={isSubmitting}
-          onClick={() => {
+            intent={Intent.PRIMARY}
-            onSubmitClick({ publish: true, redirect: true });
+            type="submit"
-          }}
+            onClick={handleSubmitPublishBtnClick}
-        >
+            text={<T id={'save_publish'} />}
-          {manualJournalId ? <T id={'edit'} /> : <T id={'save'} />}
+          />
-        </Button>
+          <Popover
-
+            content={
-        <Button
+              <Menu>
-          disabled={isSubmitting}
+                <MenuItem
-          intent={Intent.PRIMARY}
+                  text={<T id={'publish_and_new'} />}
-          className={'ml1'}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-          name={'save_and_new'}
+                />
-          onClick={() => {
+                <MenuItem
-            onSubmitClick({ publish: true, redirect: false });
+                  text={<T id={'publish_continue_editing'} />}
-          }}
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
-        >
+                />
-          <T id={'save_new'} />
+              </Menu>
-        </Button>
+            }
-
+            minimal={true}
-        <Button
+            interactionKind={PopoverInteractionKind.CLICK}
-          disabled={isSubmitting}
+            position={Position.BOTTOM_LEFT}
-          className={'button-secondary ml1'}
+          >
-          onClick={() => {
+            <Button
-            onSubmitClick({ publish: false, redirect: true });
+              intent={Intent.PRIMARY}
-          }}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
-        >
+            />
-          <T id={'save_as_draft'} />
+          </Popover>
-        </Button>
+        </ButtonGroup>
-
+        {/* ----------- Save As Draft ----------- */}
-        <Button
+        <ButtonGroup>
-          className={'button-secondary ml1'}
+          <Button
-          onClick={() => {
+            disabled={isSubmitting}
-            onCancelClick && onCancelClick();
+            className={'ml1'}
-          }}
+            type="submit"
-        >
+            onClick={handleSubmitDraftBtnClick}
-          <T id={'cancel'} />
+            text={<T id={'save_as_draft'} />}
-        </Button>
+          />
-      </div>
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitDraftAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'save_continue_editing'} />}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Save and New ----------- */}
+      <If condition={manualJournalId && manualJournalPublished}>
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            intent={Intent.PRIMARY}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={manualJournalId ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }

client/src/containers/Accounting/MakeJournalEntriesForm.js

@@ -11,6 +11,7 @@ import moment from 'moment';
 import { Intent } from '@blueprintjs/core';
 import { useIntl } from 'react-intl';
 import { pick, setWith } from 'lodash';
+import { useHistory } from 'react-router-dom';
 
 import MakeJournalEntriesHeader from './MakeJournalEntriesHeader';
 import MakeJournalEntriesFooter from './MakeJournalEntriesFooter';
@@ -77,6 +78,9 @@ function MakeJournalEntriesForm({
   onCancelForm,
 }) {
   const { formatMessage } = useIntl();
+  const history = useHistory();
+  const [submitPayload, setSubmitPayload] = useState({});
+
   const {
     setFiles,
     saveMedia,
@@ -163,8 +167,6 @@ function MakeJournalEntriesForm({
     [onFormSubmit],
   );
 
-  const [payload, setPayload] = useState({});
-
   const defaultEntry = useMemo(
     () => ({
       index: 0,
@@ -183,6 +185,7 @@ function MakeJournalEntriesForm({
       date: moment(new Date()).format('YYYY-MM-DD'),
       description: '',
       reference: '',
+      status:'',
       currency_code: '',
       entries: [...repeatValue(defaultEntry, 4)],
     }),
@@ -289,6 +292,8 @@ function MakeJournalEntriesForm({
     setFieldValue,
     handleSubmit,
     getFieldProps,
+    submitForm,
+    resetForm,
     touched,
     isSubmitting,
   } = useFormik({
@@ -327,7 +332,7 @@ function MakeJournalEntriesForm({
         setSubmitting(false);
         return;
       }
-      const form = { ...values, status: payload.publish, entries };
+      const form = { ...values, status: submitPayload.publish, entries };
 
       const saveJournal = (mediaIds) =>
         new Promise((resolve, reject) => {
@@ -344,7 +349,7 @@ function MakeJournalEntriesForm({
                   intent: Intent.SUCCESS,
                 });
                 setSubmitting(false);
-                saveInvokeSubmit({ action: 'update', ...payload });
+                saveInvokeSubmit({ action: 'update', ...submitPayload });
                 clearSavedMediaIds([]);
                 resetForm();
                 resolve(response);
@@ -364,9 +369,11 @@ function MakeJournalEntriesForm({
                   intent: Intent.SUCCESS,
                 });
                 setSubmitting(false);
-                saveInvokeSubmit({ action: 'new', ...payload });
+                saveInvokeSubmit({ action: 'new', ...submitPayload });
                 clearSavedMediaIds();
-                resetForm();
+                if (submitPayload.resetForm) {
+                  resetForm();
+                }
                 resolve(response);
               })
               .catch((errors) => {
@@ -407,20 +414,15 @@ function MakeJournalEntriesForm({
   ]);
 
   const handleSubmitClick = useCallback(
-    (payload) => {
+    (event, payload) => {
-      setPayload(payload);
+      setSubmitPayload({ ...payload });
-      // formik.resetForm();
-      handleSubmit();
     },
-    [setPayload, handleSubmit],
+    [setSubmitPayload],
   );
 
-  const handleCancelClick = useCallback(
+  const handleCancelClick = useCallback(() => {
-    (payload) => {
+    history.goBack();
-      onCancelForm && onCancelForm(payload);
+  }, [history]);
-    },
-    [onCancelForm],
-  );
 
   const handleDeleteFile = useCallback(
     (_deletedFiles) => {
@@ -453,11 +455,12 @@ function MakeJournalEntriesForm({
   const handleJournalNumberChanged = useCallback(
     (journalNumber) => {
       changePageSubtitle(
-        defaultToTransform(journalNumber, `No. ${journalNumber}`, '')
+        defaultToTransform(journalNumber, `No. ${journalNumber}`, ''),
       );
     },
     [changePageSubtitle],
   );
+
   return (
     <div class="make-journal-entries">
       <form onSubmit={handleSubmit}>
@@ -482,7 +485,10 @@ function MakeJournalEntriesForm({
           isSubmitting={isSubmitting}
           onSubmitClick={handleSubmitClick}
           onCancelClick={handleCancelClick}
-          manualJournal={manualJournalId}
+          manualJournalId={manualJournalId}
+          manualJournalPublished={values.status}
+          onSubmitForm={submitForm}
+          onResetForm={resetForm}
         />
       </form>
 

client/src/containers/Expenses/ExpenseFloatingActions.js

@@ -14,7 +14,7 @@ import { FormattedMessage as T } from 'react-intl';
 import { CLASSES } from 'common/classes';
 import classNames from 'classnames';
 import { saveInvoke } from 'utils';
-import { Icon } from 'components';
+import { Icon, If } from 'components';
 
 /**
  * Expense form floating actions.
@@ -25,11 +25,18 @@ export default function ExpenseFloatingFooter({
   onCancelClick,
   onDraftClick,
   onClearClick,
-  onSubmitAndNewClick,
   onSubmitForm,
   onResetForm,
   expense,
+  expensePublished,
 }) {
+  const handleSubmitPublishBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: true,
+    });
+  };
+
   const handleSubmitPublishAndNewBtnClick = (event) => {
     onSubmitForm();
     saveInvoke(onSubmitClick, event, {
@@ -47,6 +54,13 @@ export default function ExpenseFloatingFooter({
     });
   };
 
+  const handleSubmitDraftBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: false,
+    });
+  };
+
   const handleSubmitDraftAndNewBtnClick = (event) => {
     onSubmitForm();
     saveInvoke(onSubmitClick, event, {
@@ -60,106 +74,129 @@ export default function ExpenseFloatingFooter({
     onSubmitForm();
     saveInvoke(onSubmitClick, event, {
       redirect: false,
-      publish: true,
+      publish: false,
     });
   };
 
+  const handleCancelBtnClick = (event) => {
+    saveInvoke(onCancelClick, event);
+  };
+
+  const handleClearBtnClick = (event) => {
+    // saveInvoke(onClearClick, event);
+    onResetForm();
+  };
+
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <ButtonGroup>
+      {/* ----------- Save And Publish ----------- */}
-        {/* ----------- Save And Publish ----------- */}
+      <If condition={!expense}>
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
-          intent={Intent.PRIMARY}
-          type="submit"
-          onClick={(event) => {
-            saveInvoke(onSubmitClick, event, {
-              redirect: true,
-              publish: true,
-            });
-          }}
-          text={
-            expense && expense.id ? (
-              <T id={'edit'} />
-            ) : (
-              <T id={'save_publish'} />
-            )
-          }
-        />
-        <Popover
-          content={
-            <Menu>
-              <MenuItem
-                text={<T id={'publish_and_new'} />}
-                onClick={handleSubmitPublishAndNewBtnClick}
-              />
-              <MenuItem
-                text={<T id={'publish_continue_editing'} />}
-                onClick={handleSubmitPublishContinueEditingBtnClick}
-              />
-            </Menu>
-          }
-          minimal={true}
-          interactionKind={PopoverInteractionKind.CLICK}
-          position={Position.BOTTOM_LEFT}
-        >
           <Button
+            disabled={isSubmitting}
             intent={Intent.PRIMARY}
-            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save_publish'} />}
           />
-        </Popover>
+          <Popover
-
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'publish_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'publish_continue_editing'} />}
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
         {/* ----------- Save As Draft ----------- */}
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
+          <Button
-          className={'ml1'}
+            disabled={isSubmitting}
-          type="submit"
+            className={'ml1'}
-          onClick={(event) => {
+            type="submit"
-            saveInvoke(onSubmitClick, event, {
+            onClick={handleSubmitDraftBtnClick}
-              redirect: true,
+            text={<T id={'save_as_draft'} />}
-              publish: false,
+          />
-            });
+          <Popover
-          }}
+            content={
-          text={<T id={'save_as_draft'} />}
+              <Menu>
-        />
+                <MenuItem
-        <Popover
+                  text={<T id={'save_and_new'} />}
-          content={
+                  onClick={handleSubmitDraftAndNewBtnClick}
-            <Menu>
+                />
-              <MenuItem
+                <MenuItem
-                text={<T id={'save_and_new'} />}
+                  text={<T id={'save_continue_editing'} />}
-                onClick={handleSubmitDraftAndNewBtnClick}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
-              />
+                />
-              <MenuItem
+              </Menu>
-                text={<T id={'save_continue_editing'} />}
+            }
-                onClick={handleSubmitDraftContinueEditingBtnClick}
+            minimal={true}
-              />
+            interactionKind={PopoverInteractionKind.CLICK}
-            </Menu>
+            position={Position.BOTTOM_LEFT}
-          }
+          >
-          minimal={true}
+            <Button
-          interactionKind={PopoverInteractionKind.CLICK}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
-          position={Position.BOTTOM_LEFT}
+            />
-        >
+          </Popover>
-          <Button rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />} />
+        </ButtonGroup>
-        </Popover>
+      </If>
-        {/* ----------- Clear ----------- */}
+      {/* ----------- Save and New ----------- */}
-        <Button
+      <If condition={expense && expensePublished}>
-          className={'ml1'}
+        <ButtonGroup>
-          disabled={isSubmitting}
+          <Button
-          onClick={(event) => {
+            disabled={isSubmitting}
-            onResetForm();
+            intent={Intent.PRIMARY}
-            saveInvoke(onClearClick, event);
+            type="submit"
-          }}
+            onClick={handleSubmitPublishBtnClick}
-          text={expense && expense.id ? <T id={'reset'} /> : <T id={'clear'} />}
+            text={<T id={'save'} />}
-        />
+          />
-        {/* ----------- Cancel ----------- */}
+          <Popover
-        <Button
+            content={
-          className={'ml1'}
+              <Menu>
-          onClick={(event) => {
+                <MenuItem
-            saveInvoke(onCancelClick, event);
+                  text={<T id={'save_and_new'} />}
-          }}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-          text={<T id={'cancel'} />}
+                />
-        />
+              </Menu>
-      </ButtonGroup>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={expense ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }

client/src/containers/Expenses/ExpenseForm.js

@@ -304,7 +304,6 @@ function ExpenseForm({
     history.goBack();
   }, [history]);
 
-
   const handleDeleteFile = useCallback(
     (_deletedFiles) => {
       _deletedFiles.forEach((deletedFile) => {
@@ -332,7 +331,7 @@ function ExpenseForm({
       ]),
     );
   };
-
+  
   return (
     <div className={'expense-form'}>
       <form onSubmit={handleSubmit}>
@@ -374,7 +373,8 @@ function ExpenseForm({
           onCancelClick={handleCancelClick}
           onSubmitForm={submitForm}
           onResetForm={resetForm}
-          expense={expense}
+          expense={expenseId}
+          expensePublished={true}
         />
       </form>
     </div>

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

@@ -1,8 +1,24 @@
 import React from 'react';
-import { Intent, Button } from '@blueprintjs/core';
+import {
+  Intent,
+  Button,
+  ButtonGroup,
+  Popover,
+  PopoverInteractionKind,
+  Position,
+  Menu,
+  MenuItem,
+} from '@blueprintjs/core';
+import { useFormikContext } from 'formik';
 import { FormattedMessage as T } from 'react-intl';
+import { CLASSES } from 'common/classes';
+import classNames from 'classnames';
 import { saveInvoke } from 'utils';
+import { If, Icon } from 'components';
 
+/**
+ * Bill floating actions bar.
+ */
 export default function BillFloatingActions({
   isSubmitting,
   onSubmitClick,
@@ -10,53 +26,176 @@ export default function BillFloatingActions({
   onCancelClick,
   onClearClick,
   billId,
+  billPublished,
 }) {
+  const { resetForm, submitForm } = useFormikContext();
+
+  const handleSubmitPublishBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+    });
+  };
+
+  const handleSubmitPublishAndNewBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitPublishContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
+
+  const handleSubmitDraftBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: false,
+    });
+  };
+
+  const handleSubmitDraftAndNewBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
+
+  const handleCancelBtnClick = (event) => {
+    saveInvoke(onCancelClick, event);
+  };
+
+  const handleClearBtnClick = (event) => {
+    // saveInvoke(onClearClick, event);
+    resetForm();
+  };
+
   return (
-    <div className={'form__floating-footer'}>
+    <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <Button
+      {/* ----------- Save And Publish ----------- */}
-        disabled={isSubmitting}
+      <If condition={!billId}>
-        loading={isSubmitting}
+        <ButtonGroup>
-        intent={Intent.PRIMARY}
+          <Button
-        type="submit"
+            disabled={isSubmitting}
-        onClick={(event) => {
+            intent={Intent.PRIMARY}
-          saveInvoke(onSubmitClick, event);
+            type="submit"
-        }}
+            onClick={handleSubmitPublishBtnClick}
-      >
+            text={<T id={'save_publish'} />}
-        {billId ? <T id={'edit'} /> : <T id={'save'} />}
+          />
-      </Button>
+          <Popover
-
+            content={
-      <Button
+              <Menu>
-        disabled={isSubmitting}
+                <MenuItem
-        loading={isSubmitting}
+                  text={<T id={'publish_and_new'} />}
-        intent={Intent.PRIMARY}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-        className={'ml1'}
+                />
-        type="submit"
+                <MenuItem
-        onClick={(event) => {
+                  text={<T id={'publish_continue_editing'} />}
-          saveInvoke(onSubmitAndNewClick, event);
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
-        }}
+                />
-      >
+              </Menu>
-        <T id={'save_new'} />
+            }
-      </Button>
+            minimal={true}
-
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Save and New ----------- */}
+      <If condition={billId && billPublished}>
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            intent={Intent.PRIMARY}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+        {/* ----------- Save As Draft ----------- */}
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            className={'ml1'}
+            type="submit"
+            onClick={handleSubmitDraftBtnClick}
+            text={<T id={'save_as_draft'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitDraftAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'save_continue_editing'} />}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Clear & Reset----------- */}
       <Button
         className={'ml1'}
         disabled={isSubmitting}
-        onClick={(event) => {
+        onClick={handleClearBtnClick}
-          saveInvoke(onClearClick, event);
+        text={billId ? <T id={'reset'} /> : <T id={'clear'} />}
-        }}
+      />
-      >
+      {/* ----------- Cancel ----------- */}
-        <T id={'clear'} />
-      </Button>
-
       <Button
         className={'ml1'}
-        type="submit"
+        onClick={handleCancelBtnClick}
-        onClick={(event) => {
+        text={<T id={'cancel'} />}
-          saveInvoke(onCancelClick, event);
+      />
-        }}
-      >
-        <T id={'close'} />
-      </Button>
     </div>
   );
 }

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

@@ -22,7 +22,12 @@ import withBillDetail from './withBillDetail';
 import { AppToaster } from 'components';
 
 import { ERROR } from 'common/errors';
-import { compose, repeatValue, defaultToTransform, orderingLinesIndexes } from 'utils';
+import {
+  compose,
+  repeatValue,
+  defaultToTransform,
+  orderingLinesIndexes,
+} from 'utils';
 
 const MIN_LINES_NUMBER = 5;
 
@@ -154,11 +159,13 @@ function BillForm({
       });
       setSubmitting(false);
 
-      resetForm();
       changePageSubtitle('');
 
       if (submitPayload.redirect) {
-        history.go('/bills');
+        history.push('/bills');
+      }
+      if (submitPayload.resetForm) {
+        resetForm();
       }
     };
     // Handle the request error.
@@ -189,9 +196,12 @@ function BillForm({
     [changePageSubtitle],
   );
 
-  const handleSubmitClick = useCallback(() => {
+  const handleSubmitClick = useCallback(
-    setSubmitPayload({ redirect: true });
+    (event, payload) => {
-  }, [setSubmitPayload]);
+      setSubmitPayload({ ...payload });
+    },
+    [setSubmitPayload],
+  );
 
   const handleCancelClick = useCallback(() => {
     history.goBack();
@@ -218,6 +228,7 @@ function BillForm({
             <BillFloatingActions
               isSubmitting={isSubmitting}
               billId={billId}
+              billPublished={true}
               onSubmitClick={handleSubmitClick}
               onCancelForm={handleCancelClick}
             />

client/src/containers/Purchases/PaymentMades/PaymentMadeFloatingActions.js

@@ -1,9 +1,19 @@
 import React from 'react';
-import { Intent, Button } from '@blueprintjs/core';
+import {
+  Intent,
+  Button,
+  ButtonGroup,
+  Popover,
+  PopoverInteractionKind,
+  Position,
+  Menu,
+  MenuItem,
+} from '@blueprintjs/core';
 import { FormattedMessage as T } from 'react-intl';
 import classNames from 'classnames';
-
 import { CLASSES } from 'common/classes';
+import { saveInvoke } from 'utils';
+import { Icon } from 'components';
 
 /**
  * Payment made floating actions bar.
@@ -13,56 +23,85 @@ export default function PaymentMadeFloatingActions({
   onSubmitClick,
   onCancelClick,
   onClearBtnClick,
+  onSubmitForm,
+  paymentMadeId,
 }) {
+  const handleSubmitBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+    });
+  };
+
   const handleClearBtnClick = (event) => {
     onClearBtnClick && onClearBtnClick(event);
   };
 
-  const handleSubmitClick = (event) => {
+  const handleCancelBtnClick = (event) => {
-    onSubmitClick && onSubmitClick(event, { redirect: true });
-  };
-
-  const handleCancelClick = (event) => {
     onCancelClick && onCancelClick(event);
+    saveInvoke(onCancelClick, event);
   };
 
+  const handleSubmitAndNewClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+    });
+  };
+
+  const handleSubmitContinueEditingBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <Button
+      {/* ----------- Save and New ----------- */}
-        disabled={isSubmitting}
+      <ButtonGroup>
-        intent={Intent.PRIMARY}
+        <Button
-        type="submit"
+          disabled={isSubmitting}
-        onClick={handleSubmitClick}
+          intent={Intent.PRIMARY}
-      >
+          type="submit"
-        <T id={'save_send'} />
+          onClick={handleSubmitBtnClick}
-      </Button>
+          text={paymentMadeId ? <T id={'edit'} /> : <T id={'save'} />}
-
+        />
-      <Button
+        <Popover
-        disabled={isSubmitting}
+          content={
-        intent={Intent.PRIMARY}
+            <Menu>
-        className={'ml1'}
+              <MenuItem
-        name={'save'}
+                text={<T id={'save_and_new'} />}
-        type="submit"
+                onClick={handleSubmitAndNewClick}
-        onClick={handleSubmitClick}
+              />
-      >
+              <MenuItem
-        <T id={'save'} />
+                text={<T id={'save_continue_editing'} />}
-      </Button>
+                onClick={handleSubmitContinueEditingBtnClick}
-
+              />
+            </Menu>
+          }
+          minimal={true}
+          interactionKind={PopoverInteractionKind.CLICK}
+          position={Position.BOTTOM_LEFT}
+        >
+          <Button
+            intent={Intent.PRIMARY}
+            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+          />
+        </Popover>
+      </ButtonGroup>
+      {/* ----------- Clear & Reset----------- */}
       <Button
         className={'ml1'}
         disabled={isSubmitting}
         onClick={handleClearBtnClick}
-      >
+        text={paymentMadeId ? <T id={'reset'} /> : <T id={'clear'} />}
-        <T id={'clear'} />
+      />
-      </Button>
+      {/* ----------- Cancel  ----------- */}
-
       <Button
         className={'ml1'}
-        type="submit"
+        onClick={handleCancelBtnClick}
-        onClick={handleCancelClick}
+        text={<T id={'cancel'} />}
-      >
+      />
-        <T id={'close'} />
-      </Button>
     </div>
   );
 }

client/src/containers/Purchases/PaymentMades/PaymentMadeForm.js

@@ -81,6 +81,7 @@ function PaymentMadeForm({
   const [clearLinesAlert, setClearLinesAlert] = useState(false);
   const [clearFormAlert, setClearFormAlert] = useState(false);
   const [fullAmount, setFullAmount] = useState(null);
+  const [submitPayload, setSubmitPayload] = useState({});
 
   const [localPaymentEntries, setLocalPaymentEntries] = useState(
     paymentMadeEntries,
@@ -96,7 +97,7 @@ function PaymentMadeForm({
   const validationSchema = isNewMode
     ? CreatePaymentMadeFormSchema
     : EditPaymentMadeFormSchema;
-    
+
   // Form initial values.
   const initialValues = useMemo(
     () => ({
@@ -155,8 +156,13 @@ function PaymentMadeForm({
         intent: Intent.SUCCESS,
       });
       setSubmitting(false);
-      resetForm();
+      // resetForm();
       changePageSubtitle('');
+
+      if (submitPayload.redirect) {
+        history.push('/payment-mades');
+      }
+
     };
 
     const onError = (errors) => {
@@ -187,6 +193,7 @@ function PaymentMadeForm({
     values,
     handleSubmit,
     isSubmitting,
+    submitForm,
   } = useFormik({
     validationSchema,
     initialValues,
@@ -300,6 +307,14 @@ function PaymentMadeForm({
     [values.entries],
   );
 
+  const handleSubmitClick = useCallback(
+    (event, payload) => {
+      setSubmitPayload({ ...payload });
+    },
+    [setSubmitPayload],
+  );
+
+
   return (
     <div
       className={classNames(CLASSES.PAGE_FORM, CLASSES.PAGE_FORM_PAYMENT_MADE)}
@@ -372,8 +387,11 @@ function PaymentMadeForm({
 
         <PaymentMadeFloatingActions
           isSubmitting={isSubmitting}
+          paymentMadeId={paymentMadeId}
+          onSubmitClick={handleSubmitClick}
           onCancelClick={handleCancelClick}
           onClearBtnClick={handleClearBtnClick}
+          onSubmitForm={submitForm}
         />
 
         {/* <Dragzone

client/src/containers/Sales/Estimate/EstimateFloatingActions.js

@@ -14,7 +14,7 @@ import { CLASSES } from 'common/classes';
 import classNames from 'classnames';
 import { useFormikContext } from 'formik';
 import { saveInvoke } from 'utils';
-import { Icon } from 'components';
+import { If, Icon } from 'components';
 
 /**
  * Estimate floating actions bar.
@@ -25,12 +25,55 @@ export default function EstimateFloatingActions({
   onCancelClick,
   onClearClick,
   estimateId,
+  estimatePublished,
 }) {
   const { resetForm, submitForm } = useFormikContext();
 
-  const handleSubmitBtnClick = (event) => {
+  const handleSubmitPublishBtnClick = (event) => {
     saveInvoke(onSubmitClick, event, {
       redirect: true,
+      publish: true
+    });
+  };
+
+  const handleSubmitPublishAndNewBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitPublishContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
+
+  const handleSubmitDraftBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: false,
+    });
+  };
+
+  const handleSubmitDraftAndNewBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
     });
   };
 
@@ -43,56 +86,117 @@ export default function EstimateFloatingActions({
     resetForm();
   };
 
-  const handleSubmitAndNewClick = (event) => {
-    submitForm();
-    saveInvoke(onSubmitClick, event, {
-      redirect: false,
-    });
-  };
-
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <ButtonGroup>
+      {/* ----------- Save And Publish ----------- */}
-        {/* ----------- Save and New ----------- */}
+      <If condition={!estimateId}>
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
-          intent={Intent.PRIMARY}
-          type="submit"
-          onClick={handleSubmitBtnClick}
-          text={estimateId ? <T id={'edit'} /> : <T id={'save'} />}
-        />
-        <Popover
-          content={
-            <Menu>
-              <MenuItem
-                text={<T id={'save_and_new'} />}
-                onClick={handleSubmitAndNewClick}
-              />
-            </Menu>
-          }
-          minimal={true}
-          interactionKind={PopoverInteractionKind.CLICK}
-          position={Position.BOTTOM_LEFT}
-        >
           <Button
+            disabled={isSubmitting}
             intent={Intent.PRIMARY}
-            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save_publish'} />}
           />
-        </Popover>
+          <Popover
-        {/* ----------- Clear & Reset----------- */}
+            content={
-        <Button
+              <Menu>
-          className={'ml1'}
+                <MenuItem
-          disabled={isSubmitting}
+                  text={<T id={'publish_and_new'} />}
-          onClick={handleClearBtnClick}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-          text={estimateId ? <T id={'reset'} /> : <T id={'clear'} />}
+                />
-        />
+                <MenuItem
-        {/* ----------- Cancel  ----------- */}
+                  text={<T id={'publish_continue_editing'} />}
-        <Button
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
-          className={'ml1'}
+                />
-          onClick={handleCancelBtnClick}
+              </Menu>
-          text={<T id={'cancel'} />}
+            }
-        />
+            minimal={true}
-      </ButtonGroup>
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+        {/* ----------- Save As Draft ----------- */}
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            className={'ml1'}
+            type="submit"
+            onClick={handleSubmitDraftBtnClick}
+            text={<T id={'save_as_draft'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitDraftAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'save_continue_editing'} />}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Save and New ----------- */}
+      <If condition={estimateId && estimatePublished}>
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            intent={Intent.PRIMARY}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={estimateId ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }

client/src/containers/Sales/Estimate/EstimateForm.js

@@ -103,9 +103,9 @@ const EstimateForm = ({
     : estimateNextNumber;
 
   useEffect(() => {
-    const transNumber = !isNewMode ? estimate.estimate_number  : estimateNumber;
+    const transNumber = !isNewMode ? estimate.estimate_number : estimateNumber;
 
-    if (isNewMode) {
+    if (!isNewMode) {
       changePageTitle(formatMessage({ id: 'edit_estimate' }));
     } else {
       changePageTitle(formatMessage({ id: 'new_estimate' }));
@@ -199,11 +199,13 @@ const EstimateForm = ({
         intent: Intent.SUCCESS,
       });
       setSubmitting(false);
-      resetForm();
 
       if (submitPayload.redirect) {
         history.push('/estimates');
       }
+      if (submitPayload.resetForm) {
+        resetForm();
+      }
     };
 
     const onError = (errors) => {
@@ -263,8 +265,8 @@ const EstimateForm = ({
               estimateId={estimateId}
               onSubmitClick={handleSubmitClick}
               onCancelClick={handleCancelClick}
+              estimatePublished={true}
             />
-      
           </Form>
         )}
       </Formik>

client/src/containers/Sales/Invoice/InvoiceFloatingActions.js

@@ -14,8 +14,7 @@ import { FormattedMessage as T } from 'react-intl';
 import { CLASSES } from 'common/classes';
 import classNames from 'classnames';
 import { saveInvoke } from 'utils';
-import { Icon } from 'components';
+import { If, Icon } from 'components';
-
 
 /**
  * Invoice floating actions bar.
@@ -26,151 +25,178 @@ export default function InvoiceFloatingActions({
   onCancelClick,
   onClearClick,
   invoice,
+  invoicePublished,
 }) {
   const { resetForm, submitForm } = useFormikContext();
 
-  const handleSubmitPublishAndNewBtnClick = useCallback(
+  const handleSubmitPublishBtnClick = (event) => {
-    (event) => {
+    saveInvoke(onSubmitClick, event, {
-      submitForm();
+      redirect: true,
-      saveInvoke(onSubmitClick, event, {
+      publish: true
-        redirect: false,
+    });
-        publish: true,
+  };
-        resetForm: true,
-      });
-    },
-    [submitForm],
-  );
 
-  const handleSubmitPublishContinueEditingBtnClick = useCallback(
+  const handleSubmitPublishAndNewBtnClick = (event) => {
-    (event) => {
+    submitForm();
-      submitForm();
+    saveInvoke(onSubmitClick, event, {
-      saveInvoke(onSubmitClick, event, {
+      redirect: false,
-        redirect: false,
+      publish: true,
-        publish: true,
+      resetForm: true,
-      });
+    });
-    },
+  };
-    [submitForm],
-  );
 
-  const handleSubmitDraftAndNewBtnClick = useCallback(
+  const handleSubmitPublishContinueEditingBtnClick = (event) => {
-    (event) => {
+    submitForm();
-      submitForm();
+    saveInvoke(onSubmitClick, event, {
-      saveInvoke(onSubmitClick, event, {
+      redirect: false,
-        redirect: false,
+      publish: true,
-        publish: false,
+    });
-        resetForm: true,
+  };
-      });
-    },
-    [submitForm],
-  );
 
-  const handleSubmitDraftContinueEditingBtnClick = useCallback(
+  const handleSubmitDraftBtnClick = (event) => {
-    (event) => {
+    saveInvoke(onSubmitClick, event, {
-      submitForm();
+      redirect: true,
-      saveInvoke(onSubmitClick, event, {
+      publish: false,
-        redirect: false,
+    });
-        publish: true,
+  };
-      });
+
-    },
+  const handleSubmitDraftAndNewBtnClick = (event) => {
-    [submitForm],
+    submitForm();
-  );
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+    });
+  };
+
+  const handleCancelBtnClick = (event) => {
+    saveInvoke(onCancelClick, event);
+  };
+
+  const handleClearBtnClick = (event) => {
+    // saveInvoke(onClearClick, event);
+    resetForm();
+  };
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <ButtonGroup>
+      {/* ----------- Save And Publish ----------- */}
-        {/* ----------- Save And Publish ----------- */}
+      <If condition={!invoice}>
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
-          intent={Intent.PRIMARY}
-          type="submit"
-          onClick={(event) => {
-            saveInvoke(onSubmitClick, event, {
-              redirect: true,
-              publish: true,
-            });
-          }}
-          text={
-            invoice && invoice.id ? (
-              <T id={'edit'} />
-            ) : (
-              <T id={'save_publish'} />
-            )
-          }
-        />
-        <Popover
-          content={
-            <Menu>
-              <MenuItem
-                text={<T id={'publish_and_new'} />}
-                onClick={handleSubmitPublishAndNewBtnClick}
-              />
-              <MenuItem
-                text={<T id={'publish_continue_editing'} />}
-                onClick={handleSubmitPublishContinueEditingBtnClick}
-              />
-            </Menu>
-          }
-          minimal={true}
-          interactionKind={PopoverInteractionKind.CLICK}
-          position={Position.BOTTOM_LEFT}
-        >
           <Button
+            disabled={isSubmitting}
             intent={Intent.PRIMARY}
-            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save_publish'} />}
           />
-        </Popover>
+          <Popover
-
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'publish_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'publish_continue_editing'} />}
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
         {/* ----------- Save As Draft ----------- */}
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
+          <Button
-          className={'ml1'}
+            disabled={isSubmitting}
-          type="submit"
+            className={'ml1'}
-          onClick={(event) => {
+            type="submit"
-            saveInvoke(onSubmitClick, event, {
+            onClick={handleSubmitDraftBtnClick}
-              redirect: true,
+            text={<T id={'save_as_draft'} />}
-              publish: false,
+          />
-            });
+          <Popover
-          }}
+            content={
-          text={<T id={'save_as_draft'} />}
+              <Menu>
-        />
+                <MenuItem
-        <Popover
+                  text={<T id={'save_and_new'} />}
-          content={
+                  onClick={handleSubmitDraftAndNewBtnClick}
-            <Menu>
+                />
-              <MenuItem
+                <MenuItem
-                text={<T id={'save_and_new'} />}
+                  text={<T id={'save_continue_editing'} />}
-                onClick={handleSubmitDraftAndNewBtnClick}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
-              />
+                />
-              <MenuItem
+              </Menu>
-                text={<T id={'save_continue_editing'} />}
+            }
-                onClick={handleSubmitDraftContinueEditingBtnClick}
+            minimal={true}
-              />
+            interactionKind={PopoverInteractionKind.CLICK}
-            </Menu>
+            position={Position.BOTTOM_LEFT}
-          }
+          >
-          minimal={true}
+            <Button
-          interactionKind={PopoverInteractionKind.CLICK}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
-          position={Position.BOTTOM_LEFT}
+            />
-        >
+          </Popover>
-          <Button rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />} />
+        </ButtonGroup>
-        </Popover>
+      </If>
-        {/* ----------- Clear ----------- */}
+      {/* ----------- Save and New ----------- */}
-        <Button
+      <If condition={invoice && invoicePublished}>
-          className={'ml1'}
+        <ButtonGroup>
-          disabled={isSubmitting}
+          <Button
-          onClick={(event) => {
+            disabled={isSubmitting}
-            resetForm();
+            intent={Intent.PRIMARY}
-            saveInvoke(onClearClick, event);
+            type="submit"
-          }}
+            onClick={handleSubmitPublishBtnClick}
-          text={invoice && invoice.id ? <T id={'reset'} /> : <T id={'clear'} />}
+            text={<T id={'save'} />}
-        />
+          />
-        {/* ----------- Cancel ----------- */}
+          <Popover
-        <Button
+            content={
-          className={'ml1'}
+              <Menu>
-          onClick={(event) => {
+                <MenuItem
-            saveInvoke(onCancelClick, event);
+                  text={<T id={'save_and_new'} />}
-          }}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-          text={<T id={'cancel'} />}
+                />
-        />
+              </Menu>
-      </ButtonGroup>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={invoice ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }

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

@@ -186,7 +186,6 @@ function InvoiceForm({
         intent: Intent.SUCCESS,
       });
       setSubmitting(false);
-      resetForm();
 
       if (submitPayload.redirect) {
         history.push('/invoices');
@@ -230,7 +229,7 @@ function InvoiceForm({
     },
     [changePageSubtitle],
   );
-
+  
   return (
     <div className={classNames(CLASSES.PAGE_FORM, CLASSES.PAGE_FORM_INVOICE)}>
       <Formik
@@ -253,9 +252,10 @@ function InvoiceForm({
             <InvoiceFormFooter />
             <InvoiceFloatingActions
               isSubmitting={isSubmitting}
-              invoice={invoice}
+              invoice={invoiceId}
               onCancelClick={handleCancelClick}
               onSubmitClick={handleSubmitClick}
+              invoicePublished={true}
             />
           </Form>
         )}

client/src/containers/Sales/PaymentReceive/PaymentReceiveFloatingActions.js

@@ -46,19 +46,28 @@ export default function PaymentReceiveFormFloatingActions({
     onSubmitForm();
     saveInvoke(onSubmitClick, event, {
       redirect: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitContinueEditingBtnClick = (event) => {
+    onSubmitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
     });
   };
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
+      {/* ----------- Save and New ----------- */}
       <ButtonGroup>
-        {/* ----------- Save and New ----------- */}
         <Button
           disabled={isSubmitting}
           intent={Intent.PRIMARY}
           type="submit"
           onClick={handleSubmitBtnClick}
-          text={paymentReceiveId ? <T id={'edit'} /> : <T id={'save_and_send'} />}
+          text={paymentReceiveId ? <T id={'edit'} /> : <T id={'save'} />}
         />
         <Popover
           content={
@@ -67,6 +76,10 @@ export default function PaymentReceiveFormFloatingActions({
                 text={<T id={'save_and_new'} />}
                 onClick={handleSubmitAndNewClick}
               />
+              <MenuItem
+                text={<T id={'save_continue_editing'} />}
+                onClick={handleSubmitContinueEditingBtnClick}
+              />
             </Menu>
           }
           minimal={true}
@@ -78,20 +91,20 @@ export default function PaymentReceiveFormFloatingActions({
             rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
           />
         </Popover>
-        {/* ----------- Clear & Reset----------- */}
-        <Button
-          className={'ml1'}
-          disabled={isSubmitting}
-          onClick={handleClearBtnClick}
-          text={paymentReceiveId ? <T id={'reset'} /> : <T id={'clear'} />}
-        />
-        {/* ----------- Cancel  ----------- */}
-        <Button
-          className={'ml1'}
-          onClick={handleCancelBtnClick}
-          text={<T id={'cancel'} />}
-        />
       </ButtonGroup>
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={paymentReceiveId ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel  ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }

client/src/containers/Sales/PaymentReceive/PaymentReceiveForm.js

@@ -190,11 +190,13 @@ function PaymentReceiveForm({
         intent: Intent.SUCCESS,
       });
       setSubmitting(false);
-      resetForm();
 
       if (submitPayload.redirect) {
         history.push('/payment-receives');
       }
+      if (submitPayload.resetForm) {
+        resetForm();
+      }
     };
     // Handle request response errors.
     const onError = (errors) => {
@@ -366,7 +368,7 @@ function PaymentReceiveForm({
   const handleCancelClick = useCallback(() => {
     history.goBack();
   }, [history]);
-
+  
   return (
     <div
       className={classNames(

client/src/containers/Sales/Receipt/ReceiptForm.js

@@ -201,11 +201,13 @@ function ReceiptForm({
         intent: Intent.SUCCESS,
       });
       setSubmitting(false);
-      resetForm();
 
       if (submitPayload.redirect) {
         history.push('/receipts');
       }
+      if (submitPayload.resetForm) {
+        resetForm();
+      }
     };
 
     // Handle the request error.
@@ -243,7 +245,7 @@ function ReceiptForm({
     },
     [history],
   );
-
+  
   return (
     <div className={classNames(CLASSES.PAGE_FORM_RECEIPT, CLASSES.PAGE_FORM)}>
       <Formik
@@ -264,6 +266,7 @@ function ReceiptForm({
             <ReceiptFormFloatingActions
               isSubmitting={isSubmitting}
               receiptId={receiptId}
+              receiptPublished={true}
               onSubmitClick={handleSubmitClick}
               onCancelClick={handleCancelClick}
             />

client/src/containers/Sales/Receipt/ReceiptFormFloatingActions.js

@@ -14,7 +14,7 @@ import { useFormikContext } from 'formik';
 import classNames from 'classnames';
 import { CLASSES } from 'common/classes';
 import { saveInvoke } from 'utils';
-import { Icon } from 'components';
+import { If, Icon } from 'components';
 
 /**
  * Receipt floating actions bar.
@@ -22,21 +22,60 @@ import { Icon } from 'components';
 export default function ReceiptFormFloatingActions({
   isSubmitting,
   receiptId,
+  receiptPublished,
   onSubmitClick,
   onCancelClick,
   onClearClick,
 }) {
   const { resetForm, submitForm } = useFormikContext();
 
-  const handleSubmitAndNewClick = useCallback(
+  const handleSubmitPublishBtnClick = (event) => {
-    (event) => {
+    saveInvoke(onSubmitClick, event, {
-      submitForm();
+      redirect: true,
-      saveInvoke(onSubmitClick, event, {
+      publish: true,
-        redirect: false,
+    });
-      });
+  };
-    },
+
-    [submitForm],
+  const handleSubmitPublishAndNewBtnClick = (event) => {
-  );
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitPublishContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: true,
+    });
+  };
+
+  const handleSubmitDraftBtnClick = (event) => {
+    saveInvoke(onSubmitClick, event, {
+      redirect: true,
+      publish: false,
+    });
+  };
+
+  const handleSubmitDraftAndNewBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+      resetForm: true,
+    });
+  };
+
+  const handleSubmitDraftContinueEditingBtnClick = (event) => {
+    submitForm();
+    saveInvoke(onSubmitClick, event, {
+      redirect: false,
+      publish: false,
+    });
+  };
 
   const handleCancelBtnClick = (event) => {
     saveInvoke(onCancelClick, event);
@@ -49,51 +88,114 @@ export default function ReceiptFormFloatingActions({
 
   return (
     <div className={classNames(CLASSES.PAGE_FORM_FLOATING_ACTIONS)}>
-      <ButtonGroup>
+      {/* ----------- Save And Publish ----------- */}
-        {/* ----------- Save and New ----------- */}
+      <If condition={!receiptId}>
-        <Button
+        <ButtonGroup>
-          disabled={isSubmitting}
-          intent={Intent.PRIMARY}
-          type="submit"
-          onClick={(event) => {
-            saveInvoke(onSubmitClick, event, {
-              redirect: true,
-            });
-          }}
-          text={receiptId ? <T id={'edit'} /> : <T id={'save'} />}
-        />
-        <Popover
-          content={
-            <Menu>
-              <MenuItem
-                text={<T id={'save_and_new'} />}
-                onClick={handleSubmitAndNewClick}
-              />
-            </Menu>
-          }
-          minimal={true}
-          interactionKind={PopoverInteractionKind.CLICK}
-          position={Position.BOTTOM_LEFT}
-        >
           <Button
+            disabled={isSubmitting}
             intent={Intent.PRIMARY}
-            rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save_publish'} />}
           />
-        </Popover>
+          <Popover
-        {/* ----------- Clear & Reset----------- */}
+            content={
-        <Button
+              <Menu>
-          className={'ml1'}
+                <MenuItem
-          disabled={isSubmitting}
+                  text={<T id={'publish_and_new'} />}
-          onClick={handleClearBtnClick}
+                  onClick={handleSubmitPublishAndNewBtnClick}
-          text={receiptId ? <T id={'reset'} /> : <T id={'clear'} />}
+                />
-        />
+                <MenuItem
-        {/* ----------- Cancel  ----------- */}
+                  text={<T id={'publish_continue_editing'} />}
-        <Button
+                  onClick={handleSubmitPublishContinueEditingBtnClick}
-          className={'ml1'}
+                />
-          onClick={handleCancelBtnClick}
+              </Menu>
-          text={<T id={'cancel'} />}
+            }
-        />
+            minimal={true}
-      </ButtonGroup>
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+        {/* ----------- Save As Draft ----------- */}
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            className={'ml1'}
+            type="submit"
+            onClick={handleSubmitDraftBtnClick}
+            text={<T id={'save_as_draft'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitDraftAndNewBtnClick}
+                />
+                <MenuItem
+                  text={<T id={'save_continue_editing'} />}
+                  onClick={handleSubmitDraftContinueEditingBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Save and New ----------- */}
+      <If condition={receiptId && receiptPublished}>
+        <ButtonGroup>
+          <Button
+            disabled={isSubmitting}
+            intent={Intent.PRIMARY}
+            type="submit"
+            onClick={handleSubmitPublishBtnClick}
+            text={<T id={'save'} />}
+          />
+          <Popover
+            content={
+              <Menu>
+                <MenuItem
+                  text={<T id={'save_and_new'} />}
+                  onClick={handleSubmitPublishAndNewBtnClick}
+                />
+              </Menu>
+            }
+            minimal={true}
+            interactionKind={PopoverInteractionKind.CLICK}
+            position={Position.BOTTOM_LEFT}
+          >
+            <Button
+              intent={Intent.PRIMARY}
+              rightIcon={<Icon icon="arrow-drop-up-16" iconSize={20} />}
+            />
+          </Popover>
+        </ButtonGroup>
+      </If>
+      {/* ----------- Clear & Reset----------- */}
+      <Button
+        className={'ml1'}
+        disabled={isSubmitting}
+        onClick={handleClearBtnClick}
+        text={receiptId ? <T id={'reset'} /> : <T id={'clear'} />}
+      />
+      {/* ----------- Cancel ----------- */}
+      <Button
+        className={'ml1'}
+        onClick={handleCancelBtnClick}
+        text={<T id={'cancel'} />}
+      />
     </div>
   );
 }