Merged in feature/IO-2743-Production-Board-GridDND (pull request #1551)

Feature/IO-2743 Production Board GridDND

client/src/components/production-board-kanban/production-board-kanban.component.jsx

@@ -22,6 +22,7 @@ import ProductionBoardKanbanSettings from "./production-board-kanban.settings.co
 import cloneDeep from "lodash/cloneDeep";
 import isEqual from "lodash/isEqual";
 import { defaultKanbanSettings } from "./defaultKanbanSettings.js";
+import NoteUpsertModal from "../../components/note-upsert-modal/note-upsert-modal.container";
 
 const mapStateToProps = createStructuredSelector({
   bodyshop: selectBodyshop
@@ -215,6 +216,7 @@ function ProductionBoardKanbanComponent({ data, bodyshop, refetch, insertAuditTr
         }
       />
 
+      <NoteUpsertModal />
       <ProductionListDetailComponent jobs={data} />
 
       <Board

client/src/components/production-board-kanban/production-board-kanban.settings.component.jsx

@@ -13,35 +13,51 @@ const LayoutSettings = ({ t }) => (
         {
           name: "orientation",
           label: t("production.labels.orientation"),
-          options: [t("production.labels.vertical"), t("production.labels.horizontal")]
+          options: [
+            { value: "vertical", label: t("production.labels.vertical") },
+            { value: "horizontal", label: t("production.labels.horizontal") }
+          ]
         },
         {
           name: "cardSize",
           label: t("production.labels.card_size"),
-          options: [t("production.options.small"), t("production.options.medium"), t("production.options.large")]
+          options: [
+            { value: "small", label: t("production.options.small") },
+            { value: "medium", label: t("production.options.medium") },
+            { value: "large", label: t("production.options.large") }
+          ]
         },
         {
           name: "compact",
           label: t("production.labels.compact"),
-          options: [t("production.labels.tall"), t("production.labels.wide")]
+          options: [
+            { value: "tall", label: t("production.labels.tall") },
+            { value: "wide", label: t("production.labels.wide") }
+          ]
         },
         {
           name: "cardcolor",
           label: t("production.labels.cardcolor"),
-          options: [t("production.labels.on"), t("production.labels.off")]
+          options: [
+            { value: "on", label: t("production.labels.on") },
+            { value: "off", label: t("production.labels.off") }
+          ]
         },
         {
           name: "kiosk",
           label: t("production.labels.kiosk_mode"),
-          options: [t("production.labels.on"), t("production.labels.off")]
+          options: [
+            { value: "on", label: t("production.labels.on") },
+            { value: "off", label: t("production.labels.off") }
+          ]
         }
       ].map(({ name, label, options }) => (
         <Col span={4} key={name}>
           <Form.Item name={name} label={label}>
             <Radio.Group>
-              {options.map((option, idx) => (
-                <Radio.Button key={idx} value={idx === 0}>
-                  {option}
+              {options.map((option) => (
+                <Radio.Button key={option.value} value={option.value}>
+                  {option.label}
                 </Radio.Button>
               ))}
             </Radio.Group>
@@ -51,7 +67,6 @@ const LayoutSettings = ({ t }) => (
     </Row>
   </Card>
 );
-
 const InformationSettings = ({ t }) => (
   <Card title={t("production.settings.information")} style={{ minWidth: "50vw", marginTop: 10 }}>
     <Row gutter={[16, 16]}>