- the great reformat

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

client/src/components/shop-employees/shop-employees-add-vacation.component.jsx

@@ -1,125 +1,125 @@
-import { useMutation } from "@apollo/client";
-import { Button, Card, Form, notification, Popover, Space } from "antd";
+import {useMutation} from "@apollo/client";
+import {Button, Card, Form, notification, Popover, Space} from "antd";
 import dayjs from "../../utils/day";
-import React, { useState } from "react";
-import { useTranslation } from "react-i18next";
-import { logImEXEvent } from "../../firebase/firebase.utils";
-import { INSERT_VACATION } from "../../graphql/employees.queries";
+import React, {useState} from "react";
+import {useTranslation} from "react-i18next";
+import {logImEXEvent} from "../../firebase/firebase.utils";
+import {INSERT_VACATION} from "../../graphql/employees.queries";
 import FormDatePicker from "../form-date-picker/form-date-picker.component";
 
-export default function ShopEmployeeAddVacation({ employee }) {
-  const { t } = useTranslation();
-  const [insertVacation] = useMutation(INSERT_VACATION);
+export default function ShopEmployeeAddVacation({employee}) {
+    const {t} = useTranslation();
+    const [insertVacation] = useMutation(INSERT_VACATION);
 
-  const [loading, setLoading] = useState(false);
-  const [form] = Form.useForm();
-  const [visibility, setVisibility] = useState(false);
+    const [loading, setLoading] = useState(false);
+    const [form] = Form.useForm();
+    const [visibility, setVisibility] = useState(false);
 
-  const handleFinish = async (values) => {
-    logImEXEvent("employee_add_vacation");
+    const handleFinish = async (values) => {
+        logImEXEvent("employee_add_vacation");
 
-    setLoading(true);
-    let result;
+        setLoading(true);
+        let result;
 
-    result = await insertVacation({
-      variables: { vacation: { ...values, employeeid: employee.id } },
-      update(cache, { data }) {
-        cache.modify({
-          id: cache.identify({ id: employee.id, __typename: "employees" }),
-          fields: {
-            employee_vacations(ex) {
-              return [data.insert_employee_vacation_one, ...ex];
+        result = await insertVacation({
+            variables: {vacation: {...values, employeeid: employee.id}},
+            update(cache, {data}) {
+                cache.modify({
+                    id: cache.identify({id: employee.id, __typename: "employees"}),
+                    fields: {
+                        employee_vacations(ex) {
+                            return [data.insert_employee_vacation_one, ...ex];
+                        },
+                    },
+                });
             },
-          },
         });
-      },
-    });
 
-    if (!!result.errors) {
-      notification["error"]({
-        message: t("employees.errors.adding", {
-          message: JSON.stringify(result.errors),
-        }),
-      });
-    } else {
-      notification["success"]({
-        message: t("employees.successes.vacationadded"),
-      });
-    }
-    form.resetFields();
-    setLoading(false);
-    setVisibility(false);
-  };
+        if (!!result.errors) {
+            notification["error"]({
+                message: t("employees.errors.adding", {
+                    message: JSON.stringify(result.errors),
+                }),
+            });
+        } else {
+            notification["success"]({
+                message: t("employees.successes.vacationadded"),
+            });
+        }
+        form.resetFields();
+        setLoading(false);
+        setVisibility(false);
+    };
 
-  const overlay = (
-    <Card>
-      <Form form={form} layout="vertical" onFinish={handleFinish}>
-        <Form.Item
-          label={t("employees.fields.vacation.start")}
-          name="start"
-          rules={[
-            {
-              required: true,
-              //message: t("general.validation.required"),
-            },
-          ]}
-        >
-          <FormDatePicker />
-        </Form.Item>
-        <Form.Item
-          label={t("employees.fields.vacation.end")}
-          name="end"
-          rules={[
-            {
-              required: true,
-              //message: t("general.validation.required"),
-            },
-            ({ getFieldValue }) => ({
-              async validator(rule, value) {
-                if (value) {
-                  const { start } = form.getFieldsValue();
-                  if (dayjs(start).isAfter(dayjs(value))) {
-                    return Promise.reject(
-                      t("employees.labels.endmustbeafterstart")
-                    );
-                  } else {
-                    return Promise.resolve();
-                  }
-                } else {
-                  return Promise.resolve();
-                }
-              },
-            }),
-          ]}
-        >
-          <FormDatePicker />
-        </Form.Item>
+    const overlay = (
+        <Card>
+            <Form form={form} layout="vertical" onFinish={handleFinish}>
+                <Form.Item
+                    label={t("employees.fields.vacation.start")}
+                    name="start"
+                    rules={[
+                        {
+                            required: true,
+                            //message: t("general.validation.required"),
+                        },
+                    ]}
+                >
+                    <FormDatePicker/>
+                </Form.Item>
+                <Form.Item
+                    label={t("employees.fields.vacation.end")}
+                    name="end"
+                    rules={[
+                        {
+                            required: true,
+                            //message: t("general.validation.required"),
+                        },
+                        ({getFieldValue}) => ({
+                            async validator(rule, value) {
+                                if (value) {
+                                    const {start} = form.getFieldsValue();
+                                    if (dayjs(start).isAfter(dayjs(value))) {
+                                        return Promise.reject(
+                                            t("employees.labels.endmustbeafterstart")
+                                        );
+                                    } else {
+                                        return Promise.resolve();
+                                    }
+                                } else {
+                                    return Promise.resolve();
+                                }
+                            },
+                        }),
+                    ]}
+                >
+                    <FormDatePicker/>
+                </Form.Item>
 
-        <Space wrap>
-          <Button type="primary" htmlType="submit">
-            {t("general.actions.save")}
-          </Button>
-          <Button onClick={() => setVisibility(false)}>
-            {t("general.actions.cancel")}
-          </Button>
-        </Space>
-      </Form>
-    </Card>
-  );
+                <Space wrap>
+                    <Button type="primary" htmlType="submit">
+                        {t("general.actions.save")}
+                    </Button>
+                    <Button onClick={() => setVisibility(false)}>
+                        {t("general.actions.cancel")}
+                    </Button>
+                </Space>
+            </Form>
+        </Card>
+    );
 
-  const handleClick = (e) => {
-    setVisibility(true);
-  };
+    const handleClick = (e) => {
+        setVisibility(true);
+    };
 
-  return (
-    <Popover content={overlay} open={visibility}>
-      <Button
-        loading={loading}
-        disabled={!employee?.active}
-        onClick={handleClick}
-      >
-        {t("employees.actions.addvacation")}
-      </Button>
-    </Popover>
-  );
+    return (
+        <Popover content={overlay} open={visibility}>
+            <Button
+                loading={loading}
+                disabled={!employee?.active}
+                onClick={handleClick}
+            >
+                {t("employees.actions.addvacation")}
+            </Button>
+        </Popover>
+    );
 }