Progress Commit

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

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

@@ -1,4 +1,4 @@
-import { SyncOutlined } from "@ant-design/icons";
+import { SyncOutlined, UnorderedListOutlined } from "@ant-design/icons";
 import { useApolloClient } from "@apollo/client";
 import Board from "../../components/trello-board/index";
 import { Button, Grid, notification, Space, Statistic } from "antd";
@@ -54,7 +54,10 @@ export function ProductionBoardKanbanComponent({
 
   const [isMoving, setIsMoving] = useState(false);
 
+  const [orientation, setOrientation] = useState("vertical");
+
   const { t } = useTranslation();
+
   useEffect(() => {
     const boardData = createBoardData(
       [...bodyshop.md_ro_statuses.production_statuses, ...(bodyshop.md_ro_statuses.additional_board_statuses || [])],
@@ -71,6 +74,11 @@ export function ProductionBoardKanbanComponent({
 
   const client = useApolloClient();
 
+  // Create a function that toggles the orientation when the button is clicked
+  const toggleOrientation = () => {
+    setOrientation((prevOrientation) => (prevOrientation === "horizontal" ? "vertical" : "horizontal"));
+  };
+
   const handleDragEnd = async (cardId, sourceLaneId, targetLaneId, position, cardDetails) => {
     logImEXEvent("kanban_drag_end");
 
@@ -106,33 +114,41 @@ export function ProductionBoardKanbanComponent({
     }
     const newChildCardNewParent = newChildCard ? cardId : null;
 
-    const update = await client.mutate({
-      mutation: generate_UPDATE_JOB_KANBAN(
-        oldChildCard ? oldChildCard.id : null,
-        oldChildCardNewParent,
-        cardId,
-        movedCardNewKanbanParent,
-        targetLaneId,
-        newChildCard ? newChildCard.id : null,
-        newChildCardNewParent
-      )
-    });
+    try {
+      const update = await client.mutate({
+        mutation: generate_UPDATE_JOB_KANBAN(
+          oldChildCard ? oldChildCard.id : null,
+          oldChildCardNewParent,
+          cardId,
+          movedCardNewKanbanParent,
+          targetLaneId,
+          newChildCard ? newChildCard.id : null,
+          newChildCardNewParent
+        )
+      });
 
-    insertAuditTrail({
-      jobid: cardId,
-      operation: AuditTrailMapping.jobstatuschange(targetLaneId),
-      type: "jobstatuschange"
-    });
+      insertAuditTrail({
+        jobid: cardId,
+        operation: AuditTrailMapping.jobstatuschange(targetLaneId),
+        type: "jobstatuschange"
+      });
 
-    if (update.errors) {
+      if (update.errors) {
+        notification["error"]({
+          message: t("production.errors.boardupdate", {
+            message: JSON.stringify(update.errors)
+          })
+        });
+      }
+    } catch (error) {
       notification["error"]({
         message: t("production.errors.boardupdate", {
-          message: JSON.stringify(update.errors)
+          message: error.message
         })
       });
+    } finally {
+      setIsMoving(false);
     }
-
-    setIsMoving(false);
   };
 
   const totalHrs = data
@@ -174,7 +190,7 @@ export function ProductionBoardKanbanComponent({
     <Sticky>
       {({ style }) => (
         <div className="react-trello-column-header" style={{ ...style, zIndex: "99", backgroundColor: "#e3e3e3" }}>
-          {title}
+          <UnorderedListOutlined style={{ marginRight: "5px" }} /> {title}
         </div>
       )}
     </Sticky>
@@ -182,7 +198,7 @@ export function ProductionBoardKanbanComponent({
 
   const NormalHeader = ({ title }) => (
     <div className="react-trello-column-header" style={{ backgroundColor: "#e3e3e3" }}>
-      {title}
+      <UnorderedListOutlined style={{ marginRight: "5px" }} /> {title}
     </div>
   );
 
@@ -229,6 +245,7 @@ export function ProductionBoardKanbanComponent({
             </Button>
             <ProductionBoardFilters filter={filter} setFilter={setFilter} loading={isMoving} />
             <ProductionBoardKanbanCardSettings associationSettings={associationSettings} />
+            <Button onClick={toggleOrientation}>Toggle Orientation</Button>
           </Space>
         }
       />
@@ -242,6 +259,8 @@ export function ProductionBoardKanbanComponent({
             handleDragEnd={handleDragEnd}
             style={{ height: "100%", backgroundColor: "transparent" }}
             components={components}
+            orientation={orientation}
+            collapsibleLanes
           />
         </StickyContainer>
       ) : (
@@ -252,6 +271,8 @@ export function ProductionBoardKanbanComponent({
             handleDragEnd={handleDragEnd}
             style={{ backgroundColor: "transparent" }}
             components={components}
+            collapsibleLanes
+            orientation={orientation}
           />
         </div>
       )}