@voplus/morpho-csp 4.0.5 → 4.0.6

package/es/modules/self-registration/clda-form/incorporation/agm/index.js

@@ -1,289 +1,289 @@
-import React, { useEffect, useState } from "react";
-import { Spin, Form, Row, Col, Button, Empty, Popconfirm, Checkbox } from "antd";
-import { useCLDAForm, useCLDAFormStore } from "../../../../../data/clda-form";
-import { IncorporationFormContext, State } from "../context";
-import { ValidationCollections, ValidationCollectionsContext } from "@voplus/morpho-data";
-import { observe, InlineEdit } from "@voplus/morpho-ui";
-import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
-import { faTableRows, faInfo } from "@fortawesome/pro-solid-svg-icons";
-import { faTrashCan } from "@fortawesome/pro-light-svg-icons";
-import { ColumnItem, ColumnItemCol } from "@voplus/morpho-ui/es/controls/ColumnItem";
-import { Scrollbars } from "react-custom-scrollbars";
-import AddDirectorFeeDialog from "../AddDirectorFeeDialog";
-import CurrencyView from "../../../../../components/CurrencyView";
-import DescriptionEditor from "@voplus/morpho-document/es/controls/DescriptionEditor";
-import DateInputEditor from "@voplus/morpho-ui/es/controls/InlineEdit/editors/DateInputEditor";
-import CorporateSelect from "../../../../corporate/components/CorporateSelect";
-import CorporateOfficerSelect from "../../../../corporate/company/components/CorporateOfficerSelect";
-import Section from "../../../controls/Section";
-import classnames from "classnames";
-import dayjs from "dayjs";
-import styles from "./index.less";
-const AGMForm = (props) => {
-    const [validations] = useState(new ValidationCollections());
-    const [state] = useState(new State());
-    const [addDirectorVisible, setAddDirectorVisible] = useState(false);
-    const [companyEditable, setCompanyEditable] = useState(false);
-    const [showEditIcon, setShowEditIcon] = useState(true);
-    const [showDirector1EditIcon, setShowDirector1EditIcon] = useState(true);
-    const [director1Editable, setDirector1Editable] = useState(false);
-    const [showDirector2EditIcon, setShowDirector2EditIcon] = useState(true);
-    const [director2Editable, setDirector2Editable] = useState(false);
-    const [showAuditorEditIcon, setShowAuditorEditIcon] = useState(true);
-    const [auditorEditable, setAuditorEditable] = useState(false);
-    const incorporation = useCLDAForm(props.id, { reload: true });
-    const store = useCLDAFormStore();
-    const clickEvent = (e) => {
-        if (!e.target.className.toString())
-            return;
-        if (!e.target.className.toString().includes("ant-select")) {
-            setCompanyEditable(false);
-            setShowEditIcon(true);
-            setDirector1Editable(false);
-            setShowDirector1EditIcon(true);
-            setDirector2Editable(false);
-            setShowDirector2EditIcon(true);
-            setAuditorEditable(false);
-            setShowAuditorEditIcon(true);
-        }
-    };
-    useEffect(() => {
-        if (companyEditable || director1Editable || director2Editable || auditorEditable) {
-            window.addEventListener("click", clickEvent, true);
-        }
-        return () => {
-            window.removeEventListener("click", clickEvent, true);
-        };
-    }, [companyEditable, director1Editable, director2Editable, auditorEditable]);
-    const content = observe(() => {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
-        return (React.createElement("div", { className: classnames("incorporation-form-view", styles["incorporation-from-review"]) },
-            React.createElement(Spin, { spinning: !incorporation.loaded }, incorporation.loaded && (React.createElement(ValidationCollectionsContext.Provider, { value: validations },
-                React.createElement(Section, { title: React.createElement(React.Fragment, null,
-                        React.createElement(FontAwesomeIcon, { icon: faTableRows }),
-                        "Annual General Meeting Form") },
-                    React.createElement("div", { style: { fontSize: "16px" } },
-                        React.createElement("p", null, "Kindly fill up the Incorporation form below. It should take you up to 10-15 minutes to complete the form."),
-                        React.createElement("ul", null,
-                            React.createElement("li", null,
-                                React.createElement("p", null, "All the *fields are mandatory to fill up.")),
-                            React.createElement("li", null,
-                                React.createElement("p", null,
-                                    "You may hover over the",
-                                    React.createElement("span", { style: { fontSize: "1.2em", color: "#9D9D9D", margin: "0 5px" } },
-                                        React.createElement(FontAwesomeIcon, { icon: faInfo, size: "sm" })),
-                                    "icon beside each heading to see more details.")),
-                            React.createElement("li", null,
-                                React.createElement("p", null, "This is an AUTO SAVE form. If you wish to re-edit any details, simply re-open the form and amend the information."))))),
-                React.createElement(Section, { title: "Company" },
-                    React.createElement(InlineEdit, { showEditIcon: showEditIcon, defaultValue: (_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.name, editable: false, content: (v) => {
-                            var _a, _b;
-                            return companyEditable ? (React.createElement(CorporateSelect, { defaultValue: (_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.name, onChange: (c) => store
-                                    .edit(props.id, { data: { Corporate: { Id: c.id, Name: c.name } } })
-                                    .then(() => {
-                                    setShowEditIcon(true);
-                                    setCompanyEditable(false);
-                                }) })) : ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.name) ? (React.createElement("span", null, incorporation.content.corporate.name)) : (React.createElement("span", { className: "add-info-style" }, "Please click here to enter the corporate"));
-                        }, onEditIconClick: () => {
-                            setCompanyEditable(true);
-                            setShowEditIcon(false);
-                        } })),
-                React.createElement(Section, { title: "Financial Year" },
-                    React.createElement(Form, { layout: "horizontal", labelAlign: "left", labelCol: { span: 8 } },
-                        React.createElement(Form.Item, { label: "Start" },
-                            React.createElement(InlineEdit, { defaultValue: dayjs(incorporation.content.periodStart !== ""
-                                    ? incorporation.content.periodStart
-                                    : undefined), content: (v) => incorporation.content.periodStart ? (React.createElement("span", null, dayjs(incorporation.content.periodStart).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Period Start")), editor: DateInputEditor, onSave: (date) => {
-                                    if (incorporation.content.periodStart &&
-                                        dayjs(date).isSame(incorporation.content.periodStart, "day"))
-                                        return;
-                                    store.edit(props.id, {
-                                        data: {
-                                            PeriodStart: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
-                                        },
-                                    });
-                                } })),
-                        React.createElement(Form.Item, { label: "End" },
-                            React.createElement(InlineEdit, { defaultValue: dayjs(incorporation.content.periodEnd !== ""
-                                    ? incorporation.content.periodEnd
-                                    : undefined), content: (v) => incorporation.content.periodEnd ? (React.createElement("span", null, dayjs(incorporation.content.periodEnd).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Period End")), editor: DateInputEditor, onSave: (date) => {
-                                    if (incorporation.content.periodEnd &&
-                                        dayjs(date).isSame(incorporation.content.periodEnd, "day"))
-                                        return;
-                                    store.edit(props.id, {
-                                        data: {
-                                            PeriodEnd: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
-                                        },
-                                    });
-                                } })))),
-                React.createElement(Section, { title: "Director Statements" },
-                    React.createElement(Form, { layout: "vertical" },
-                        React.createElement(Form.Item, { label: "Director 1" },
-                            React.createElement(InlineEdit, { defaultValue: (_b = incorporation.content.director1) === null || _b === void 0 ? void 0 : _b.name, showEditIcon: showDirector1EditIcon, editable: false, onEditIconClick: () => {
-                                    setDirector1Editable(true);
-                                    setShowDirector1EditIcon(false);
-                                }, content: (v) => {
-                                    var _a, _b, _c;
-                                    return director1Editable ? (React.createElement(CorporateOfficerSelect, { disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
-                                            .edit(props.id, {
-                                            data: { Director1: { Id: o.contact.id, Name: o.contact.name } },
-                                        })
-                                            .then(() => {
-                                            setShowDirector1EditIcon(true);
-                                            setDirector1Editable(false);
-                                        }) })) : ((_c = incorporation.content.director1) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, incorporation.content.director1.name)) : (React.createElement("span", { className: "add-info-style" }, "Select director"));
-                                } })),
-                        React.createElement(Form.Item, { label: "Director 2" },
-                            React.createElement(InlineEdit, { defaultValue: (_c = incorporation.content.director2) === null || _c === void 0 ? void 0 : _c.name, showEditIcon: showDirector2EditIcon, editable: false, onEditIconClick: () => {
-                                    setDirector2Editable(true);
-                                    setShowDirector2EditIcon(false);
-                                }, content: (v) => {
-                                    var _a, _b, _c, _d;
-                                    return director2Editable ? (React.createElement(CorporateOfficerSelect, { disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
-                                            .edit(props.id, {
-                                            data: { Director2: { Id: o.contact.id, Name: o.contact.name } },
-                                        })
-                                            .then(() => {
-                                            setShowDirector2EditIcon(true);
-                                            setDirector2Editable(false);
-                                        }) })) : ((_c = incorporation.content.director2) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, (_d = incorporation.content.director2) === null || _d === void 0 ? void 0 : _d.name)) : (React.createElement("span", { className: "add-info-style" }, "Select director2"));
-                                } })))),
-                React.createElement(Section, { title: "Auditor" },
-                    React.createElement(Form, { layout: "vertical" },
-                        React.createElement(Form.Item, { label: "Auditor" },
-                            React.createElement(InlineEdit, { defaultValue: (_d = incorporation.content.auditor) === null || _d === void 0 ? void 0 : _d.name, showEditIcon: showAuditorEditIcon, editable: false, onEditIconClick: () => {
-                                    setAuditorEditable(true);
-                                    setShowAuditorEditIcon(false);
-                                }, content: (v) => {
-                                    var _a, _b, _c, _d;
-                                    return auditorEditable ? (React.createElement(CorporateOfficerSelect, { isFilterAuditor: true, disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
-                                            .edit(props.id, {
-                                            data: { Auditor: { Id: o.contact.id, Name: o.contact.name } },
-                                        })
-                                            .then(() => {
-                                            setShowAuditorEditIcon(true);
-                                            setAuditorEditable(false);
-                                        }) })) : ((_c = incorporation.content.auditor) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, (_d = incorporation.content.auditor) === null || _d === void 0 ? void 0 : _d.name)) : (React.createElement("span", { className: "add-info-style" }, "Select Auditor"));
-                                } })))),
-                React.createElement(Section, { title: "Final Dividend" },
-                    React.createElement(Form, { layout: "horizontal", labelAlign: "left", labelCol: { span: 8 } },
-                        React.createElement(Form.Item, { label: "Dividend Per Sahre" },
-                            React.createElement(Row, null,
-                                React.createElement(Col, { span: 12 },
-                                    React.createElement(CurrencyView, { currency: (_e = incorporation.content.dividend) === null || _e === void 0 ? void 0 : _e.currency, onChange: (c) => {
-                                            var _a, _b;
-                                            return store.edit(props.id, {
-                                                data: {
-                                                    Dividend: {
-                                                        Currency: c,
-                                                        Amount: (_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.amount,
-                                                        PaymentDate: (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate,
-                                                    },
-                                                },
-                                            });
-                                        } })),
-                                React.createElement(Col, { span: 12 },
-                                    React.createElement(InlineEdit, { defaultValue: (_f = incorporation.content.dividend) === null || _f === void 0 ? void 0 : _f.amount, content: (v) => {
-                                            var _a, _b;
-                                            return ((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.amount) ? (React.createElement("span", null, (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.amount)) : (React.createElement("span", { className: "add-info-style" }, "Add Amount"));
-                                        }, onSave: (v) => {
-                                            var _a, _b;
-                                            store.edit(props.id, {
-                                                data: {
-                                                    Dividend: {
-                                                        Amount: Number(v),
-                                                        Currency: (_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.currency,
-                                                        PaymentDate: (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate,
-                                                    },
-                                                },
-                                            });
-                                        } })))),
-                        React.createElement(Form.Item, { label: "Payment Date" },
-                            React.createElement(InlineEdit, { defaultValue: dayjs(((_g = incorporation.content.dividend) === null || _g === void 0 ? void 0 : _g.paymentDate) !== ""
-                                    ? (_h = incorporation.content.dividend) === null || _h === void 0 ? void 0 : _h.paymentDate
-                                    : undefined), content: (v) => {
-                                    var _a, _b;
-                                    return ((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.paymentDate) ? (React.createElement("span", null, dayjs((_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Payment Date"));
-                                }, editor: DateInputEditor, onSave: (date) => {
-                                    var _a, _b, _c, _d;
-                                    if (((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.paymentDate) &&
-                                        dayjs(date).isSame((_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate, "day"))
-                                        return;
-                                    store.edit(props.id, {
-                                        data: {
-                                            Dividend: {
-                                                PaymentDate: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
-                                                Currency: (_c = incorporation.content.dividend) === null || _c === void 0 ? void 0 : _c.currency,
-                                                Amount: (_d = incorporation.content.dividend) === null || _d === void 0 ? void 0 : _d.amount,
-                                            },
-                                        },
-                                    });
-                                } })))),
-                React.createElement(Section, { title: "Directors Fee" },
-                    React.createElement("div", { className: "directors-fee-list" },
-                        React.createElement(Scrollbars, { autoHide: true }, ((_k = (_j = incorporation.content) === null || _j === void 0 ? void 0 : _j.directorsFees) === null || _k === void 0 ? void 0 : _k.length) ? ((_l = incorporation.content) === null || _l === void 0 ? void 0 : _l.directorsFees.map((d, i) => (React.createElement("div", { className: "directors-fee-item", key: d.key || i },
-                            React.createElement(ColumnItem, null,
-                                React.createElement(ColumnItemCol, { span: 12, title: "Director " },
-                                    React.createElement("div", { className: "directors-fee-item-col-val" }, d.director.name)),
-                                React.createElement(ColumnItemCol, { span: 8, title: "Director Fee" },
-                                    React.createElement("div", { className: "directors-fee-item-col-val" },
-                                        d.currency,
-                                        " ",
-                                        d.amount.toLocaleString(undefined, {
-                                            minimumFractionDigits: 2,
-                                            maximumFractionDigits: 2,
-                                        }))),
-                                React.createElement(ColumnItemCol, { span: 4, align: "flex-end" },
-                                    React.createElement(Popconfirm, { title: "Delete the Director Fee", description: "Are you sure to delete this?", onConfirm: () => deleteDirectorsFees(d.key), okText: "Yes", cancelText: "No" },
-                                        React.createElement(Button, { type: "link", icon: React.createElement(FontAwesomeIcon, { icon: faTrashCan }) })))))))) : (React.createElement(Empty, null)))),
-                    React.createElement(Button, { onClick: () => setAddDirectorVisible(true) }, "Add Director Fee"),
-                    addDirectorVisible && (React.createElement(AddDirectorFeeDialog, { corporateId: ((_m = incorporation.content.corporate) === null || _m === void 0 ? void 0 : _m.id) || "", onCancel: () => setAddDirectorVisible(false), onSubmit: (data) => {
-                            store.edit(props.id, {
-                                data: {
-                                    DirectorsFees: [data].concat(transferDirectorsFees(incorporation.content.directorsFees)),
-                                },
-                            });
-                        } }))),
-                React.createElement(Section, { title: "Other Businesses", className: "agm-form-businesses-descript" },
-                    React.createElement(DescriptionEditor, { id: props.id, description: incorporation.content.others, padding: "0 0 0.75rem 0", onSave: (description) => store.edit(props.id, {
-                            data: { Others: description || "" },
-                        }) })),
-                props.type === "draftView" && (React.createElement(Section, { title: "Internal Use" },
-                    React.createElement("div", { className: "margin-bottom-10" },
-                        React.createElement(Checkbox, { checked: incorporation.content.includeNotice, onChange: (e) => store.edit(props.id, {
-                                data: { IncludeNotice: e.target.checked },
-                            }) }, "Include notice to AGM")),
-                    React.createElement("div", { className: "margin-bottom-10" },
-                        React.createElement(Checkbox, { checked: incorporation.content.includeDispenseResolutions, onChange: (e) => store.edit(props.id, {
-                                data: { IncludeDispenseResolutions: e.target.checked },
-                            }) }, "Include Dispense Resolution")),
-                    React.createElement("div", { className: "margin-bottom-10" },
-                        React.createElement(Checkbox, { disabled: true }, "Include Statement from Nominee Director")),
-                    React.createElement("div", { className: "margin-bottom-10" },
-                        React.createElement(Checkbox, { checked: incorporation.content.includeDirectorsStatement, onChange: (e) => store.edit(props.id, {
-                                data: { IncludeDirectorsStatement: e.target.checked },
-                            }) }, "Include Directors Statement")))))))));
-    });
-    return observe(() => (React.createElement(IncorporationFormContext.Provider, { value: state }, content)));
-    function transferDirectorsFees(directorsFees) {
-        let DirectorsFees = [];
-        directorsFees === null || directorsFees === void 0 ? void 0 : directorsFees.map((d) => DirectorsFees.push({
-            Director: { Id: d.director.id, Name: d.director.name },
-            Currency: d.currency,
-            Amount: d.amount,
-        }));
-        return DirectorsFees;
-    }
-    async function deleteDirectorsFees(key) {
-        var _a;
-        const directorsFeeList = (_a = incorporation.content.directorsFees) === null || _a === void 0 ? void 0 : _a.filter((d) => d.key !== key);
-        let DirectorsFeesDelete = transferDirectorsFees(directorsFeeList);
-        await store.edit(props.id, {
-            data: {
-                DirectorsFees: DirectorsFeesDelete,
-            },
-        });
-    }
-};
-export default AGMForm;
+import React, { useEffect, useState } from "react";
+import { Spin, Form, Row, Col, Button, Empty, Popconfirm, Checkbox } from "antd";
+import { useCLDAForm, useCLDAFormStore } from "../../../../../data/clda-form";
+import { IncorporationFormContext, State } from "../context";
+import { ValidationCollections, ValidationCollectionsContext } from "@voplus/morpho-data";
+import { observe, InlineEdit } from "@voplus/morpho-ui";
+import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
+import { faTableRows, faInfo } from "@fortawesome/pro-solid-svg-icons";
+import { faTrashCan } from "@fortawesome/pro-light-svg-icons";
+import { ColumnItem, ColumnItemCol } from "@voplus/morpho-ui/es/controls/ColumnItem";
+import { Scrollbars } from "react-custom-scrollbars";
+import AddDirectorFeeDialog from "../AddDirectorFeeDialog";
+import CurrencyView from "../../../../../components/CurrencyView";
+import DescriptionEditor from "@voplus/morpho-document/es/controls/DescriptionEditor";
+import DateInputEditor from "@voplus/morpho-ui/es/controls/InlineEdit/editors/DateInputEditor";
+import CorporateSelect from "../../../../corporate/components/CorporateSelect";
+import CorporateOfficerSelect from "../../../../corporate/company/components/CorporateOfficerSelect";
+import Section from "../../../controls/Section";
+import classnames from "classnames";
+import dayjs from "dayjs";
+import styles from "./index.less";
+const AGMForm = (props) => {
+    const [validations] = useState(new ValidationCollections());
+    const [state] = useState(new State());
+    const [addDirectorVisible, setAddDirectorVisible] = useState(false);
+    const [companyEditable, setCompanyEditable] = useState(false);
+    const [showEditIcon, setShowEditIcon] = useState(true);
+    const [showDirector1EditIcon, setShowDirector1EditIcon] = useState(true);
+    const [director1Editable, setDirector1Editable] = useState(false);
+    const [showDirector2EditIcon, setShowDirector2EditIcon] = useState(true);
+    const [director2Editable, setDirector2Editable] = useState(false);
+    const [showAuditorEditIcon, setShowAuditorEditIcon] = useState(true);
+    const [auditorEditable, setAuditorEditable] = useState(false);
+    const incorporation = useCLDAForm(props.id, { reload: true });
+    const store = useCLDAFormStore();
+    const clickEvent = (e) => {
+        if (!e.target.className.toString())
+            return;
+        if (!e.target.className.toString().includes("ant-select")) {
+            setCompanyEditable(false);
+            setShowEditIcon(true);
+            setDirector1Editable(false);
+            setShowDirector1EditIcon(true);
+            setDirector2Editable(false);
+            setShowDirector2EditIcon(true);
+            setAuditorEditable(false);
+            setShowAuditorEditIcon(true);
+        }
+    };
+    useEffect(() => {
+        if (companyEditable || director1Editable || director2Editable || auditorEditable) {
+            window.addEventListener("click", clickEvent, true);
+        }
+        return () => {
+            window.removeEventListener("click", clickEvent, true);
+        };
+    }, [companyEditable, director1Editable, director2Editable, auditorEditable]);
+    const content = observe(() => {
+        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m;
+        return (React.createElement("div", { className: classnames("incorporation-form-view", styles["incorporation-from-review"]) },
+            React.createElement(Spin, { spinning: !incorporation.loaded }, incorporation.loaded && (React.createElement(ValidationCollectionsContext.Provider, { value: validations },
+                React.createElement(Section, { title: React.createElement(React.Fragment, null,
+                        React.createElement(FontAwesomeIcon, { icon: faTableRows }),
+                        "Annual General Meeting Form") },
+                    React.createElement("div", { style: { fontSize: "16px" } },
+                        React.createElement("p", null, "Kindly fill up the Incorporation form below. It should take you up to 10-15 minutes to complete the form."),
+                        React.createElement("ul", null,
+                            React.createElement("li", null,
+                                React.createElement("p", null, "All the *fields are mandatory to fill up.")),
+                            React.createElement("li", null,
+                                React.createElement("p", null,
+                                    "You may hover over the",
+                                    React.createElement("span", { style: { fontSize: "1.2em", color: "#9D9D9D", margin: "0 5px" } },
+                                        React.createElement(FontAwesomeIcon, { icon: faInfo, size: "sm" })),
+                                    "icon beside each heading to see more details.")),
+                            React.createElement("li", null,
+                                React.createElement("p", null, "This is an AUTO SAVE form. If you wish to re-edit any details, simply re-open the form and amend the information."))))),
+                React.createElement(Section, { title: "Company" },
+                    React.createElement(InlineEdit, { showEditIcon: showEditIcon, defaultValue: (_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.name, editable: false, content: (v) => {
+                            var _a, _b;
+                            return companyEditable ? (React.createElement(CorporateSelect, { defaultValue: (_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.name, onChange: (c) => store
+                                    .edit(props.id, { data: { Corporate: { Id: c.id, Name: c.name } } })
+                                    .then(() => {
+                                    setShowEditIcon(true);
+                                    setCompanyEditable(false);
+                                }) })) : ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.name) ? (React.createElement("span", null, incorporation.content.corporate.name)) : (React.createElement("span", { className: "add-info-style" }, "Please click here to enter the corporate"));
+                        }, onEditIconClick: () => {
+                            setCompanyEditable(true);
+                            setShowEditIcon(false);
+                        } })),
+                React.createElement(Section, { title: "Financial Year" },
+                    React.createElement(Form, { layout: "horizontal", labelAlign: "left", labelCol: { span: 8 } },
+                        React.createElement(Form.Item, { label: "Start" },
+                            React.createElement(InlineEdit, { defaultValue: dayjs(incorporation.content.periodStart !== ""
+                                    ? incorporation.content.periodStart
+                                    : undefined), content: (v) => incorporation.content.periodStart ? (React.createElement("span", null, dayjs(incorporation.content.periodStart).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Period Start")), editor: DateInputEditor, onSave: (date) => {
+                                    if (incorporation.content.periodStart &&
+                                        dayjs(date).isSame(incorporation.content.periodStart, "day"))
+                                        return;
+                                    store.edit(props.id, {
+                                        data: {
+                                            PeriodStart: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
+                                        },
+                                    });
+                                } })),
+                        React.createElement(Form.Item, { label: "End" },
+                            React.createElement(InlineEdit, { defaultValue: dayjs(incorporation.content.periodEnd !== ""
+                                    ? incorporation.content.periodEnd
+                                    : undefined), content: (v) => incorporation.content.periodEnd ? (React.createElement("span", null, dayjs(incorporation.content.periodEnd).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Period End")), editor: DateInputEditor, onSave: (date) => {
+                                    if (incorporation.content.periodEnd &&
+                                        dayjs(date).isSame(incorporation.content.periodEnd, "day"))
+                                        return;
+                                    store.edit(props.id, {
+                                        data: {
+                                            PeriodEnd: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
+                                        },
+                                    });
+                                } })))),
+                React.createElement(Section, { title: "Director Statements" },
+                    React.createElement(Form, { layout: "vertical" },
+                        React.createElement(Form.Item, { label: "Director 1" },
+                            React.createElement(InlineEdit, { defaultValue: (_b = incorporation.content.director1) === null || _b === void 0 ? void 0 : _b.name, showEditIcon: showDirector1EditIcon, editable: false, onEditIconClick: () => {
+                                    setDirector1Editable(true);
+                                    setShowDirector1EditIcon(false);
+                                }, content: (v) => {
+                                    var _a, _b, _c;
+                                    return director1Editable ? (React.createElement(CorporateOfficerSelect, { disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
+                                            .edit(props.id, {
+                                            data: { Director1: { Id: o.contact.id, Name: o.contact.name } },
+                                        })
+                                            .then(() => {
+                                            setShowDirector1EditIcon(true);
+                                            setDirector1Editable(false);
+                                        }) })) : ((_c = incorporation.content.director1) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, incorporation.content.director1.name)) : (React.createElement("span", { className: "add-info-style" }, "Select director"));
+                                } })),
+                        React.createElement(Form.Item, { label: "Director 2" },
+                            React.createElement(InlineEdit, { defaultValue: (_c = incorporation.content.director2) === null || _c === void 0 ? void 0 : _c.name, showEditIcon: showDirector2EditIcon, editable: false, onEditIconClick: () => {
+                                    setDirector2Editable(true);
+                                    setShowDirector2EditIcon(false);
+                                }, content: (v) => {
+                                    var _a, _b, _c, _d;
+                                    return director2Editable ? (React.createElement(CorporateOfficerSelect, { disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
+                                            .edit(props.id, {
+                                            data: { Director2: { Id: o.contact.id, Name: o.contact.name } },
+                                        })
+                                            .then(() => {
+                                            setShowDirector2EditIcon(true);
+                                            setDirector2Editable(false);
+                                        }) })) : ((_c = incorporation.content.director2) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, (_d = incorporation.content.director2) === null || _d === void 0 ? void 0 : _d.name)) : (React.createElement("span", { className: "add-info-style" }, "Select director2"));
+                                } })))),
+                React.createElement(Section, { title: "Auditor" },
+                    React.createElement(Form, { layout: "vertical" },
+                        React.createElement(Form.Item, { label: "Auditor" },
+                            React.createElement(InlineEdit, { defaultValue: (_d = incorporation.content.auditor) === null || _d === void 0 ? void 0 : _d.name, showEditIcon: showAuditorEditIcon, editable: false, onEditIconClick: () => {
+                                    setAuditorEditable(true);
+                                    setShowAuditorEditIcon(false);
+                                }, content: (v) => {
+                                    var _a, _b, _c, _d;
+                                    return auditorEditable ? (React.createElement(CorporateOfficerSelect, { isFilterAuditor: true, disable: !((_a = incorporation.content.corporate) === null || _a === void 0 ? void 0 : _a.id), corporateId: ((_b = incorporation.content.corporate) === null || _b === void 0 ? void 0 : _b.id) || "", onChange: (o) => store
+                                            .edit(props.id, {
+                                            data: { Auditor: { Id: o.contact.id, Name: o.contact.name } },
+                                        })
+                                            .then(() => {
+                                            setShowAuditorEditIcon(true);
+                                            setAuditorEditable(false);
+                                        }) })) : ((_c = incorporation.content.auditor) === null || _c === void 0 ? void 0 : _c.name) ? (React.createElement("span", null, (_d = incorporation.content.auditor) === null || _d === void 0 ? void 0 : _d.name)) : (React.createElement("span", { className: "add-info-style" }, "Select Auditor"));
+                                } })))),
+                React.createElement(Section, { title: "Final Dividend" },
+                    React.createElement(Form, { layout: "horizontal", labelAlign: "left", labelCol: { span: 8 } },
+                        React.createElement(Form.Item, { label: "Dividend Per Sahre" },
+                            React.createElement(Row, null,
+                                React.createElement(Col, { span: 12 },
+                                    React.createElement(CurrencyView, { currency: (_e = incorporation.content.dividend) === null || _e === void 0 ? void 0 : _e.currency, onChange: (c) => {
+                                            var _a, _b;
+                                            return store.edit(props.id, {
+                                                data: {
+                                                    Dividend: {
+                                                        Currency: c,
+                                                        Amount: (_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.amount,
+                                                        PaymentDate: (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate,
+                                                    },
+                                                },
+                                            });
+                                        } })),
+                                React.createElement(Col, { span: 12 },
+                                    React.createElement(InlineEdit, { defaultValue: (_f = incorporation.content.dividend) === null || _f === void 0 ? void 0 : _f.amount, content: (v) => {
+                                            var _a, _b;
+                                            return ((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.amount) ? (React.createElement("span", null, (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.amount)) : (React.createElement("span", { className: "add-info-style" }, "Add Amount"));
+                                        }, onSave: (v) => {
+                                            var _a, _b;
+                                            store.edit(props.id, {
+                                                data: {
+                                                    Dividend: {
+                                                        Amount: Number(v),
+                                                        Currency: (_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.currency,
+                                                        PaymentDate: (_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate,
+                                                    },
+                                                },
+                                            });
+                                        } })))),
+                        React.createElement(Form.Item, { label: "Payment Date" },
+                            React.createElement(InlineEdit, { defaultValue: dayjs(((_g = incorporation.content.dividend) === null || _g === void 0 ? void 0 : _g.paymentDate) !== ""
+                                    ? (_h = incorporation.content.dividend) === null || _h === void 0 ? void 0 : _h.paymentDate
+                                    : undefined), content: (v) => {
+                                    var _a, _b;
+                                    return ((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.paymentDate) ? (React.createElement("span", null, dayjs((_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate).format("YYYY-MM-DD"))) : (React.createElement("span", { className: "add-info-style" }, "Add Payment Date"));
+                                }, editor: DateInputEditor, onSave: (date) => {
+                                    var _a, _b, _c, _d;
+                                    if (((_a = incorporation.content.dividend) === null || _a === void 0 ? void 0 : _a.paymentDate) &&
+                                        dayjs(date).isSame((_b = incorporation.content.dividend) === null || _b === void 0 ? void 0 : _b.paymentDate, "day"))
+                                        return;
+                                    store.edit(props.id, {
+                                        data: {
+                                            Dividend: {
+                                                PaymentDate: date !== null ? dayjs(date).format("YYYY-MM-DD") : "",
+                                                Currency: (_c = incorporation.content.dividend) === null || _c === void 0 ? void 0 : _c.currency,
+                                                Amount: (_d = incorporation.content.dividend) === null || _d === void 0 ? void 0 : _d.amount,
+                                            },
+                                        },
+                                    });
+                                } })))),
+                React.createElement(Section, { title: "Directors Fee" },
+                    React.createElement("div", { className: "directors-fee-list" },
+                        React.createElement(Scrollbars, { autoHide: true }, ((_k = (_j = incorporation.content) === null || _j === void 0 ? void 0 : _j.directorsFees) === null || _k === void 0 ? void 0 : _k.length) ? ((_l = incorporation.content) === null || _l === void 0 ? void 0 : _l.directorsFees.map((d, i) => (React.createElement("div", { className: "directors-fee-item", key: d.key || i },
+                            React.createElement(ColumnItem, null,
+                                React.createElement(ColumnItemCol, { span: 12, title: "Director " },
+                                    React.createElement("div", { className: "directors-fee-item-col-val" }, d.director.name)),
+                                React.createElement(ColumnItemCol, { span: 8, title: "Director Fee" },
+                                    React.createElement("div", { className: "directors-fee-item-col-val" },
+                                        d.currency,
+                                        " ",
+                                        d.amount.toLocaleString(undefined, {
+                                            minimumFractionDigits: 2,
+                                            maximumFractionDigits: 2,
+                                        }))),
+                                React.createElement(ColumnItemCol, { span: 4, align: "flex-end" },
+                                    React.createElement(Popconfirm, { title: "Delete the Director Fee", description: "Are you sure to delete this?", onConfirm: () => deleteDirectorsFees(d.key), okText: "Yes", cancelText: "No" },
+                                        React.createElement(Button, { type: "link", icon: React.createElement(FontAwesomeIcon, { icon: faTrashCan }) })))))))) : (React.createElement(Empty, null)))),
+                    React.createElement(Button, { onClick: () => setAddDirectorVisible(true) }, "Add Director Fee"),
+                    addDirectorVisible && (React.createElement(AddDirectorFeeDialog, { corporateId: ((_m = incorporation.content.corporate) === null || _m === void 0 ? void 0 : _m.id) || "", onCancel: () => setAddDirectorVisible(false), onSubmit: (data) => {
+                            store.edit(props.id, {
+                                data: {
+                                    DirectorsFees: [data].concat(transferDirectorsFees(incorporation.content.directorsFees)),
+                                },
+                            });
+                        } }))),
+                React.createElement(Section, { title: "Other Businesses", className: "agm-form-businesses-descript" },
+                    React.createElement(DescriptionEditor, { id: props.id, description: incorporation.content.others, padding: "0 0 0.75rem 0", onSave: (description) => store.edit(props.id, {
+                            data: { Others: description || "" },
+                        }) })),
+                props.type === "draftView" && (React.createElement(Section, { title: "Internal Use" },
+                    React.createElement("div", { className: "margin-bottom-10" },
+                        React.createElement(Checkbox, { checked: incorporation.content.includeNotice, onChange: (e) => store.edit(props.id, {
+                                data: { IncludeNotice: e.target.checked },
+                            }) }, "Include notice to AGM")),
+                    React.createElement("div", { className: "margin-bottom-10" },
+                        React.createElement(Checkbox, { checked: incorporation.content.includeDispenseResolutions, onChange: (e) => store.edit(props.id, {
+                                data: { IncludeDispenseResolutions: e.target.checked },
+                            }) }, "Include Dispense Resolution")),
+                    React.createElement("div", { className: "margin-bottom-10" },
+                        React.createElement(Checkbox, { disabled: true }, "Include Statement from Nominee Director")),
+                    React.createElement("div", { className: "margin-bottom-10" },
+                        React.createElement(Checkbox, { checked: incorporation.content.includeDirectorsStatement, onChange: (e) => store.edit(props.id, {
+                                data: { IncludeDirectorsStatement: e.target.checked },
+                            }) }, "Include Directors Statement")))))))));
+    });
+    return observe(() => (React.createElement(IncorporationFormContext.Provider, { value: state }, content)));
+    function transferDirectorsFees(directorsFees) {
+        let DirectorsFees = [];
+        directorsFees === null || directorsFees === void 0 ? void 0 : directorsFees.map((d) => DirectorsFees.push({
+            Director: { Id: d.director.id, Name: d.director.name },
+            Currency: d.currency,
+            Amount: d.amount,
+        }));
+        return DirectorsFees;
+    }
+    async function deleteDirectorsFees(key) {
+        var _a;
+        const directorsFeeList = (_a = incorporation.content.directorsFees) === null || _a === void 0 ? void 0 : _a.filter((d) => d.key !== key);
+        let DirectorsFeesDelete = transferDirectorsFees(directorsFeeList);
+        await store.edit(props.id, {
+            data: {
+                DirectorsFees: DirectorsFeesDelete,
+            },
+        });
+    }
+};
+export default AGMForm;
 //# sourceMappingURL=index.js.map