IO-1891 Add owner Note.

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

@@ -14,7 +14,6 @@ export default function OwnerDetailFormComponent({ form, loading }) {
   return (
     <div>
       <FormFieldsChanged form={form} />
-
       <LayoutFormRow header={t("owners.forms.name")}>
         <Form.Item label={t("owners.fields.ownr_title")} name="ownr_title">
           <Input />
@@ -29,7 +28,6 @@ export default function OwnerDetailFormComponent({ form, loading }) {
           <Input />
         </Form.Item>
       </LayoutFormRow>
-
       <LayoutFormRow header={t("owners.forms.address")}>
         <Form.Item label={t("owners.fields.ownr_addr1")} name="ownr_addr1">
           <Input />
@@ -50,7 +48,6 @@ export default function OwnerDetailFormComponent({ form, loading }) {
           <Input />
         </Form.Item>
       </LayoutFormRow>
-
       <LayoutFormRow header={t("owners.forms.contact")}>
         <Form.Item
           label={t("owners.fields.allow_text_message")}
@@ -98,6 +95,9 @@ export default function OwnerDetailFormComponent({ form, loading }) {
           <Input />
         </Form.Item>
       </LayoutFormRow>
+      <Form.Item label={t("owners.fields.note")} name="note">
+        <Input.TextArea rows={4} />
+      </Form.Item>
     </div>
   );
 }

client/src/components/owner-find-modal/owner-find-modal.component.jsx

@@ -59,6 +59,14 @@ export default function OwnerFindModalComponent({
         <PhoneFormatter>{record.ownr_ph2}</PhoneFormatter>
       ),
     },
+    {
+      title: t("owners.fields.note"),
+      dataIndex: "note",
+      key: "note",
+      render: (text, record) => (
+        <span style={{ whiteSpace: "pre" }}>{record.note}</span>
+      ),
+    },
   ];
 
   const handleOnRowClick = (record) => {

client/src/components/production-list-columns/production-list-columns.add.component.jsx

@@ -42,17 +42,24 @@ export function ProductionColumnsComponent({
   };
 
   const columnKeys = columns.map((i) => i.key);
-
+  const cols = dataSource({
+    technician,
+    state: tableState,
+    activeStatuses: bodyshop.md_ro_statuses.active_statuses,
+  });
   const menu = (
-    <Menu onClick={handleAdd}>
-      {dataSource({
-        technician,
-        state: tableState,
-        activeStatuses: bodyshop.md_ro_statuses.active_statuses,
-      })
+    <Menu
+      onClick={handleAdd}
+      style={{
+        columnCount: Math.max(Math.floor(cols.length / 10), 1),
+      }}
+    >
+      {cols
         .filter((i) => !columnKeys.includes(i.key))
         .map((item) => (
-          <Menu.Item key={item.key}>{item.title}</Menu.Item>
+          <Menu.Item key={item.key} style={{ breakInside: "avoid" }}>
+            {item.title}
+          </Menu.Item>
         ))}
     </Menu>
   );