Additional WIP on enter invoice modal

client/src/components/invoice-add-line-button/invoice-add-line-button.component.jsx

@@ -0,0 +1,49 @@
+import React, { useState } from "react";
+import { Button, Popover, Icon, Input, InputNumber, Form } from "antd";
+import { useTranslation } from "react-i18next";
+
+export default function InvoiceAddLineButton({
+  jobLine,
+  invoiceLineState,
+  form,
+  discount
+}) {
+  const [visibility, setVisibility] = useState(false);
+  const { t } = useTranslation();
+  const { getFieldDecorator } = form;
+
+  const popContent = (
+    <div style={{ display: "flex" }}>
+      <Form.Item label={t("joblines.fields.line_desc")}>
+        {getFieldDecorator("line_desc", {
+          initialValue: jobLine.line_desc
+        })(<Input name="line_desc" />)}
+      </Form.Item>
+      <Form.Item label={t("joblines.fields.oem_partno")}>
+        {getFieldDecorator("oem_partno", {
+          initialValue: jobLine.oem_partno
+        })(<Input name="oem_partno" />)}
+      </Form.Item>
+      <Form.Item label={t("invoicelines.fields.retail")}>
+        {getFieldDecorator("retail", { initialValue: jobLine.act_price })(
+          <InputNumber precision={2} name="retail" />
+        )}
+      </Form.Item>
+      <Form.Item label={t("invoicelines.fields.actual")}>
+        {getFieldDecorator("actual", {
+          initialValue: jobLine.act_price * (discount ? 1 - discount : 1)
+        })(<InputNumber precision={2} name="actual" />)}
+      </Form.Item>
+      DISSC: {discount}
+      <Button onClick={() => setVisibility(false)}>??</Button>
+    </div>
+  );
+
+  return (
+    <Popover content={popContent} visible={visibility}>
+      <Button onClick={() => setVisibility(true)}>
+        <Icon type="select" />
+      </Button>
+    </Popover>
+  );
+}