Added block calendar day for BOD-94

client/src/components/schedule-block-day/schedule-block-day.component.jsx

@@ -0,0 +1,61 @@
+import React from "react";
+import { MinusCircleTwoTone } from "@ant-design/icons";
+import { Dropdown, Menu } from "antd";
+import { useTranslation } from "react-i18next";
+import { useMutation } from "@apollo/react-hooks";
+import { INSERT_APPOINTMENT } from "../../graphql/appointments.queries";
+import moment from "moment";
+import { connect } from "react-redux";
+import { createStructuredSelector } from "reselect";
+import { selectBodyshop } from "../../redux/user/user.selectors";
+const mapStateToProps = createStructuredSelector({
+  bodyshop: selectBodyshop,
+});
+const mapDispatchToProps = (dispatch) => ({
+  //setUserLanguage: language => dispatch(setUserLanguage(language))
+});
+export default connect(mapStateToProps, mapDispatchToProps)(ScheduleBlockDay);
+
+export function ScheduleBlockDay({ date, children, refetch, bodyshop }) {
+  const { t } = useTranslation();
+  const [insertBlock] = useMutation(INSERT_APPOINTMENT);
+
+  const handleMenu = async (e) => {
+    e.domEvent.stopPropagation();
+    console.log("date", date);
+
+    if (e.key === "block") {
+      console.log("Block.");
+
+      const blockAppt = {
+        title: t("appointments.labels.blocked"),
+        block: true,
+        isintake: false,
+        bodyshopid: bodyshop.id,
+        start: moment(date).startOf("day"),
+        end: moment(date).endOf("day"),
+      };
+      console.log("handleMenu -> blockAppt", blockAppt);
+
+      const result = await insertBlock({
+        variables: { app: [blockAppt] },
+      });
+
+      if (!!refetch) refetch();
+    }
+  };
+
+  const menu = (
+    <Menu onClick={handleMenu}>
+      <Menu.Item key="block">{t("appointments.actions.block")}</Menu.Item>
+      <Menu.Item key="2">2nd menu item</Menu.Item>
+      <Menu.Item key="3">3rd menu item</Menu.Item>
+    </Menu>
+  );
+
+  return (
+    <Dropdown overlay={menu} trigger={["contextMenu"]}>
+      {children}
+    </Dropdown>
+  );
+}