IO-1661 Add parts order comments presets.

client/src/components/parts-order-modal/parts-order-modal.component.jsx

@@ -1,4 +1,4 @@
-import { DeleteFilled, WarningFilled } from "@ant-design/icons";
+import { DeleteFilled, WarningFilled, DownOutlined } from "@ant-design/icons";
 import { useTreatments } from "@splitsoftware/splitio-react";
 import {
   Divider,
@@ -9,6 +9,8 @@ import {
   Space,
   Tag,
   Select,
+  Menu,
+  Dropdown,
 } from "antd";
 import React from "react";
 import { useTranslation } from "react-i18next";
@@ -39,6 +41,7 @@ export function PartsOrderModalComponent({
   isReturn,
   preferredMake,
   job,
+  form,
 }) {
   const [sendType, setSendType] = sendTypeState;
   const { OEConnection } = useTreatments(
@@ -52,6 +55,21 @@ export function PartsOrderModalComponent({
     bodyshop.imexshopid
   );
   const { t } = useTranslation();
+  const handleClick = ({ item, key, keyPath }) => {
+    form.setFieldsValue({ comments: item.props.value });
+  };
+
+  const menu = (
+    <div>
+      <Menu onClick={handleClick}>
+        {bodyshop.md_parts_order_comment.map((comment, idx) => (
+          <Menu.Item value={comment.comment} key={idx}>
+            {comment.label}
+          </Menu.Item>
+        ))}
+      </Menu>
+    </div>
+  );
 
   return (
     <div>
@@ -243,7 +261,23 @@ export function PartsOrderModalComponent({
           );
         }}
       </Form.List>
-      <Form.Item name="comments" label={t("parts_orders.fields.comments")}>
+      <Form.Item
+        name="comments"
+        label={
+          <Space>
+            {t("parts_orders.fields.comments")}
+            <Dropdown overlay={menu}>
+              <a
+                className="ant-dropdown-link"
+                href=" #"
+                onClick={(e) => e.preventDefault()}
+              >
+                <DownOutlined />
+              </a>
+            </Dropdown>
+          </Space>
+        }
+      >
         <Input.TextArea rows={3} />
       </Form.Item>
       <Radio.Group

client/src/components/parts-order-modal/parts-order-modal.container.jsx

@@ -346,6 +346,7 @@ export function PartsOrderModalContainer({
           <LoadingSpinner />
         ) : (
           <PartsOrderModalComponent
+            form={form}
             vendorList={(data && data.vendors) || []}
             sendTypeState={sendTypeState}
             isReturn={isReturn}