Added enter again on invoice modal.

client/src/components/invoice-enter-modal/invoice-enter-modal.container.jsx

@@ -1,6 +1,6 @@
 import { useLazyQuery, useMutation, useQuery } from "@apollo/react-hooks";
-import { Form, Modal, notification } from "antd";
-import React from "react";
+import { Form, Modal, notification, Button } from "antd";
+import React, { useState, useEffect } from "react";
 import { useTranslation } from "react-i18next";
 import { connect } from "react-redux";
 import { createStructuredSelector } from "reselect";
@@ -12,6 +12,7 @@ import { toggleModalVisible } from "../../redux/modals/modals.actions";
 import { selectInvoiceEnterModal } from "../../redux/modals/modals.selectors";
 import { selectBodyshop } from "../../redux/user/user.selectors";
 import InvoiceEnterModalComponent from "./invoice-enter-modal.component";
+import { setModalContext } from "../../redux/modals/modals.actions";
 
 const mapStateToProps = createStructuredSelector({
   invoiceEnterModal: selectInvoiceEnterModal,
@@ -19,16 +20,19 @@ const mapStateToProps = createStructuredSelector({
 });
 const mapDispatchToProps = (dispatch) => ({
   toggleModalVisible: () => dispatch(toggleModalVisible("invoiceEnter")),
+  setInvoiceEnterContext: (context) =>
+    dispatch(setModalContext({ context: context, modal: "invoiceEnter" })),
 });
 
 function InvoiceEnterModalContainer({
   invoiceEnterModal,
   toggleModalVisible,
   bodyshop,
+  setInvoiceEnterContext,
 }) {
   const [form] = Form.useForm();
   const { t } = useTranslation();
-
+  const [enterAgain, setEnterAgain] = useState(false);
   const [insertInvoice] = useMutation(INSERT_NEW_INVOICE);
 
   const { data: RoAutoCompleteData } = useQuery(ACTIVE_JOBS_FOR_AUTOCOMPLETE, {
@@ -69,9 +73,15 @@ function InvoiceEnterModalContainer({
         if (invoiceEnterModal.actions.refetch)
           invoiceEnterModal.actions.refetch();
 
-        toggleModalVisible();
+        if (enterAgain) {
+          form.resetFields();
+        } else {
+          toggleModalVisible();
+        }
+        setEnterAgain(false);
       })
       .catch((error) => {
+        setEnterAgain(false);
         notification["error"]({
           message: t("invoices.errors.creating", {
             message: JSON.stringify(error),
@@ -84,6 +94,10 @@ function InvoiceEnterModalContainer({
     toggleModalVisible();
   };
 
+  useEffect(() => {
+    if (enterAgain) form.submit();
+  }, [enterAgain, form]);
+
   return (
     <Modal
       title={
@@ -96,12 +110,35 @@ function InvoiceEnterModalContainer({
       okText={t("general.actions.save")}
       onOk={() => form.submit()}
       onCancel={handleCancel}
+      afterClose={() => form.resetFields()}
+      footer={
+        <span>
+          <Button onClick={handleCancel}>{t("general.actions.cancel")}</Button>
+          <Button onClick={() => form.submit()}>
+            {t("general.actions.save")}
+          </Button>
+          {invoiceEnterModal.context && invoiceEnterModal.context.id ? null : (
+            <Button
+              type="primary"
+              onClick={() => {
+                setEnterAgain(true);
+              }}
+            >
+              {t("general.actions.saveandnew")}
+            </Button>
+          )}
+        </span>
+      }
       destroyOnClose
     >
       <Form
         onFinish={handleFinish}
         autoComplete={"off"}
         form={form}
+        onFinishFailed={() => {
+          setEnterAgain(false);
+          console.log("Finish failed");
+        }}
         initialValues={{
           jobid:
             (invoiceEnterModal.context.job &&

client/src/components/invoice-enter-modal/invoice-enter-modal.lines.component.jsx

@@ -31,7 +31,7 @@ export default function InvoiceEnterModalLinesComponent({
 
   return (
     <div>
-      <Form.List name="invoicelines">
+      <Form.List name="invoicelines" >
         {(fields, { add, remove }) => {
           return (
             <div>