Majority of Dropdown Overlay Menu refactors.

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

client/src/components/notes-preset-button/notes-preset-button.component.jsx

@@ -1,53 +1,52 @@
-import { DownOutlined } from "@ant-design/icons";
-import { Dropdown, Menu } from "antd";
+import {DownOutlined} from "@ant-design/icons";
+import {Dropdown} from "antd";
 import React from "react";
-import { useTranslation } from "react-i18next";
-import { connect } from "react-redux";
-import { createStructuredSelector } from "reselect";
-import { selectBodyshop } from "../../redux/user/user.selectors";
+import {useTranslation} from "react-i18next";
+import {connect} from "react-redux";
+import {createStructuredSelector} from "reselect";
+import {selectBodyshop} from "../../redux/user/user.selectors";
 
 const mapStateToProps = createStructuredSelector({
-  //currentUser: selectCurrentUser
-  bodyshop: selectBodyshop,
+    //currentUser: selectCurrentUser
+    bodyshop: selectBodyshop,
 });
 const mapDispatchToProps = (dispatch) => ({
-  //setUserLanguage: language => dispatch(setUserLanguage(language))
+    //setUserLanguage: language => dispatch(setUserLanguage(language))
 });
 
-export function NotesPresetButton({ bodyshop, form }) {
-  const { t } = useTranslation();
+export function NotesPresetButton({bodyshop, form}) {
+    const {t} = useTranslation();
 
-  const handleSelect = (item) => {
-    form.setFieldsValue({ text: item.text });
-  };
+    const handleSelect = (item) => {
+        form.setFieldsValue({text: item.text});
+    };
 
-  const menu = (
-    <Menu
-      style={{
-        columnCount: Math.floor(bodyshop.md_notes_presets.length / 10) + 1,
-      }}
-      items={bodyshop.md_notes_presets.map((i, idx) => ({
-        key: idx,
-        label: i.label,
-        style: { breakInside: "avoid" },
-        onClick: () => handleSelect(i),
-      }))}
-    />
-  );
 
-  return (
-    <div>
-      <Dropdown trigger={["click"]} menu={menu}>
-        <a
-          className="ant-dropdown-link"
-          href="# "
-          onClick={(e) => e.preventDefault()}
-        >
-          {t("messaging.labels.presets")} <DownOutlined />
-        </a>
-      </Dropdown>
-    </div>
-  );
+    const menu = {
+        items: bodyshop.md_notes_presets.map((i, idx) => ({
+            key: idx,
+            label: i.label,
+            style: {breakInside: "avoid"},
+            onClick: () => handleSelect(i),
+        })),
+        style: {
+            columnCount: Math.floor(bodyshop.md_notes_presets.length / 10) + 1,
+        },
+    }
+
+    return (
+        <div>
+            <Dropdown trigger={["click"]} menu={menu}>
+                <a
+                    className="ant-dropdown-link"
+                    href="# "
+                    onClick={(e) => e.preventDefault()}
+                >
+                    {t("messaging.labels.presets")} <DownOutlined/>
+                </a>
+            </Dropdown>
+        </div>
+    );
 }
 
 export default connect(mapStateToProps, mapDispatchToProps)(NotesPresetButton);