- the great reformat

Signed-off-by: Dave Richer <dave@imexsystems.ca>

client/src/components/owner-detail-form/owner-detail-form.component.jsx

@@ -1,109 +1,107 @@
-import { Form, Input, Switch } from "antd";
+import {Form, Input, Switch} from "antd";
 import React from "react";
-import { useTranslation } from "react-i18next";
+import {useTranslation} from "react-i18next";
 import FormFieldsChanged from "../form-fields-changed-alert/form-fields-changed-alert.component";
 import FormItemEmail from "../form-items-formatted/email-form-item.component";
-import FormItemPhone, {
-  PhoneItemFormatterValidation,
-} from "../form-items-formatted/phone-form-item.component";
+import FormItemPhone, {PhoneItemFormatterValidation,} from "../form-items-formatted/phone-form-item.component";
 import LayoutFormRow from "../layout-form-row/layout-form-row.component";
 
-export default function OwnerDetailFormComponent({ form, loading }) {
-  const { t } = useTranslation();
-  const { getFieldValue } = form;
-  return (
-    <div>
-      <FormFieldsChanged form={form} />
-      <LayoutFormRow header={t("owners.forms.name")}>
-        <Form.Item label={t("owners.fields.ownr_title")} name="ownr_title">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_ln")} name="ownr_ln">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_fn")} name="ownr_fn">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_co_nm")} name="ownr_co_nm">
-          <Input />
-        </Form.Item>
-      </LayoutFormRow>
-      <LayoutFormRow header={t("owners.forms.address")}>
-        <Form.Item label={t("owners.fields.ownr_addr1")} name="ownr_addr1">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_addr2")} name="ownr_addr2">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_city")} name="ownr_city">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_st")} name="ownr_st">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_zip")} name="ownr_zip">
-          <Input />
-        </Form.Item>
-        <Form.Item label={t("owners.fields.ownr_ctry")} name="ownr_ctry">
-          <Input />
-        </Form.Item>
-      </LayoutFormRow>
-      <LayoutFormRow header={t("owners.forms.contact")}>
-        <Form.Item
-          label={t("owners.fields.allow_text_message")}
-          name="allow_text_message"
-          valuePropName="checked"
-        >
-          <Switch />
-        </Form.Item>
-        <Form.Item
-          label={t("owners.fields.ownr_ea")}
-          name="ownr_ea"
-          rules={[
-            {
-              type: "email",
-              message: "This is not a valid email address.",
-            },
-          ]}
-        >
-          <FormItemEmail email={getFieldValue("ownr_ea")} />
-        </Form.Item>
-        <Form.Item
-          label={t("owners.fields.ownr_ph1")}
-          name="ownr_ph1"
-          rules={[
-            ({ getFieldValue }) =>
-              PhoneItemFormatterValidation(getFieldValue, "ownr_ph1"),
-          ]}
-        >
-          <FormItemPhone />
-        </Form.Item>
-        <Form.Item
-          label={t("owners.fields.ownr_ph2")}
-          name="ownr_ph2"
-          rules={[
-            ({ getFieldValue }) =>
-              PhoneItemFormatterValidation(getFieldValue, "ownr_ph2"),
-          ]}
-        >
-          <FormItemPhone />
-        </Form.Item>
-        <Form.Item
-          label={t("owners.fields.preferred_contact")}
-          name="preferred_contact"
-        >
-          <Input />
-        </Form.Item>
-        <Form.Item
-          label={t("owners.fields.tax_number")}
-          name="tax_number"
-        >
-          <Input />
-        </Form.Item>
-      </LayoutFormRow>
-      <Form.Item label={t("owners.fields.note")} name="note">
-        <Input.TextArea rows={4} />
-      </Form.Item>
-    </div>
-  );
+export default function OwnerDetailFormComponent({form, loading}) {
+    const {t} = useTranslation();
+    const {getFieldValue} = form;
+    return (
+        <div>
+            <FormFieldsChanged form={form}/>
+            <LayoutFormRow header={t("owners.forms.name")}>
+                <Form.Item label={t("owners.fields.ownr_title")} name="ownr_title">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_ln")} name="ownr_ln">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_fn")} name="ownr_fn">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_co_nm")} name="ownr_co_nm">
+                    <Input/>
+                </Form.Item>
+            </LayoutFormRow>
+            <LayoutFormRow header={t("owners.forms.address")}>
+                <Form.Item label={t("owners.fields.ownr_addr1")} name="ownr_addr1">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_addr2")} name="ownr_addr2">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_city")} name="ownr_city">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_st")} name="ownr_st">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_zip")} name="ownr_zip">
+                    <Input/>
+                </Form.Item>
+                <Form.Item label={t("owners.fields.ownr_ctry")} name="ownr_ctry">
+                    <Input/>
+                </Form.Item>
+            </LayoutFormRow>
+            <LayoutFormRow header={t("owners.forms.contact")}>
+                <Form.Item
+                    label={t("owners.fields.allow_text_message")}
+                    name="allow_text_message"
+                    valuePropName="checked"
+                >
+                    <Switch/>
+                </Form.Item>
+                <Form.Item
+                    label={t("owners.fields.ownr_ea")}
+                    name="ownr_ea"
+                    rules={[
+                        {
+                            type: "email",
+                            message: "This is not a valid email address.",
+                        },
+                    ]}
+                >
+                    <FormItemEmail email={getFieldValue("ownr_ea")}/>
+                </Form.Item>
+                <Form.Item
+                    label={t("owners.fields.ownr_ph1")}
+                    name="ownr_ph1"
+                    rules={[
+                        ({getFieldValue}) =>
+                            PhoneItemFormatterValidation(getFieldValue, "ownr_ph1"),
+                    ]}
+                >
+                    <FormItemPhone/>
+                </Form.Item>
+                <Form.Item
+                    label={t("owners.fields.ownr_ph2")}
+                    name="ownr_ph2"
+                    rules={[
+                        ({getFieldValue}) =>
+                            PhoneItemFormatterValidation(getFieldValue, "ownr_ph2"),
+                    ]}
+                >
+                    <FormItemPhone/>
+                </Form.Item>
+                <Form.Item
+                    label={t("owners.fields.preferred_contact")}
+                    name="preferred_contact"
+                >
+                    <Input/>
+                </Form.Item>
+                <Form.Item
+                    label={t("owners.fields.tax_number")}
+                    name="tax_number"
+                >
+                    <Input/>
+                </Form.Item>
+            </LayoutFormRow>
+            <Form.Item label={t("owners.fields.note")} name="note">
+                <Input.TextArea rows={4}/>
+            </Form.Item>
+        </div>
+    );
 }

client/src/components/owner-detail-form/owner-detail-form.container.jsx

@@ -1,108 +1,109 @@
-import { Button, Form, notification, Popconfirm } from "antd";
+import {Button, Form, notification, Popconfirm} from "antd";
 import {PageHeader} from "@ant-design/pro-layout";
 
-import React, { useState } from "react";
-import { useNavigate } from "react-router-dom";
-import { useMutation } from "@apollo/client";
-import { useTranslation } from "react-i18next";
-import { DELETE_OWNER, UPDATE_OWNER } from "../../graphql/owners.queries";
+import React, {useState} from "react";
+import {useNavigate} from "react-router-dom";
+import {useMutation} from "@apollo/client";
+import {useTranslation} from "react-i18next";
+import {DELETE_OWNER, UPDATE_OWNER} from "../../graphql/owners.queries";
 import OwnerDetailFormComponent from "./owner-detail-form.component";
 
-function OwnerDetailFormContainer({ owner, refetch }) {
-  const { t } = useTranslation();
-  const [form] = Form.useForm();
-  const history = useNavigate();
-  const [loading, setLoading] = useState(false);
-  const [updateOwner] = useMutation(UPDATE_OWNER);
-  const [deleteOwner] = useMutation(DELETE_OWNER);
+function OwnerDetailFormContainer({owner, refetch}) {
+    const {t} = useTranslation();
+    const [form] = Form.useForm();
+    const history = useNavigate();
+    const [loading, setLoading] = useState(false);
+    const [updateOwner] = useMutation(UPDATE_OWNER);
+    const [deleteOwner] = useMutation(DELETE_OWNER);
 
-  const handleDelete = async () => {
-    setLoading(true);
-    const result = await deleteOwner({
-      variables: { id: owner.id },
-    });
-    console.log(result);
-    if (result.errors) {
-      notification["error"]({
-        message: t("owners.errors.deleting", {
-          error: JSON.stringify(result.errors),
-        }),
-      });
-      setLoading(false);
-    } else {
-      notification["success"]({
-        message: t("owners.successes.delete"),
-      });
-      setLoading(false);
-      history(`/manage/owners`);
-    }
-  };
+    const handleDelete = async () => {
+        setLoading(true);
+        const result = await deleteOwner({
+            variables: {id: owner.id},
+        });
+        console.log(result);
+        if (result.errors) {
+            notification["error"]({
+                message: t("owners.errors.deleting", {
+                    error: JSON.stringify(result.errors),
+                }),
+            });
+            setLoading(false);
+        } else {
+            notification["success"]({
+                message: t("owners.successes.delete"),
+            });
+            setLoading(false);
+            history(`/manage/owners`);
+        }
+    };
 
-  const handleFinish = async (values) => {
-    setLoading(true);
-    const result = await updateOwner({
-      variables: { ownerId: owner.id, owner: values },
-    });
+    const handleFinish = async (values) => {
+        setLoading(true);
+        const result = await updateOwner({
+            variables: {ownerId: owner.id, owner: values},
+        });
 
-    if (!!result.errors) {
-      notification["error"]({
-        message: t("owners.errors.saving", {
-          error: JSON.stringify(result.errors),
-        }),
-      });
-      setLoading(false);
-      return;
-    }
+        if (!!result.errors) {
+            notification["error"]({
+                message: t("owners.errors.saving", {
+                    error: JSON.stringify(result.errors),
+                }),
+            });
+            setLoading(false);
+            return;
+        }
 
-    notification["success"]({
-      message: t("owners.successes.save"),
-    });
+        notification["success"]({
+            message: t("owners.successes.save"),
+        });
 
-    if (refetch) await refetch();
-    form.resetFields();
-    form.resetFields();
-    setLoading(false);
-  };
+        if (refetch) await refetch();
+        form.resetFields();
+        form.resetFields();
+        setLoading(false);
+    };
 
-  return (
-    <>
-      <PageHeader
-        title={t("menus.header.owners")}
-        extra={[
-          <Popconfirm
-            trigger="click"
-            onConfirm={handleDelete}
-            disabled={owner.jobs.length !== 0}
-            title={t("owners.labels.deleteconfirm")}
-          >
-            <Button
-              type="primary"
-              danger
-              loading={loading}
-              disabled={owner.jobs.length !== 0}
+    return (
+        <>
+            <PageHeader
+                title={t("menus.header.owners")}
+                extra={[
+                    <Popconfirm
+                        trigger="click"
+                        onConfirm={handleDelete}
+                        disabled={owner.jobs.length !== 0}
+                        title={t("owners.labels.deleteconfirm")}
+                    >
+                        <Button
+                            type="primary"
+                            danger
+                            loading={loading}
+                            disabled={owner.jobs.length !== 0}
+                        >
+                            {t("general.actions.delete")}
+                        </Button>
+                    </Popconfirm>,
+                    <Button
+                        type="primary"
+                        loading={loading}
+                        onClick={() => form.submit()}
+                    >
+                        {t("general.actions.save")}
+                    </Button>,
+                ]}
+            />
+            <Form
+                form={form}
+                onFinish={handleFinish}
+                autoComplete="off"
+                layout="vertical"
+                initialValues={owner}
             >
-              {t("general.actions.delete")}
-            </Button>
-          </Popconfirm>,
-          <Button
-            type="primary"
-            loading={loading}
-            onClick={() => form.submit()}
-          >
-            {t("general.actions.save")}
-          </Button>,
-        ]}
-      />
-      <Form
-        form={form}
-        onFinish={handleFinish}
-        autoComplete="off"
-        layout="vertical"
-        initialValues={owner}
-      >
-        <OwnerDetailFormComponent loading={loading} form={form} />
-      </Form>
-    </>
-  );
+                <OwnerDetailFormComponent loading={loading} form={form}/>
+            </Form>
+        </>
+    );
 }
+
 export default OwnerDetailFormContainer;