From 4211a1a1ac001478bfa41f4d809e3e633969c348 Mon Sep 17 00:00:00 2001
From: alex <alex@roese.dev>
Date: Fri, 26 May 2023 08:59:53 +0200
Subject: [PATCH] task locking

---
 src/Pages/GroupTasks/GroupTasksViewModal.js   | 108 +++++++++++++-----
 .../GroupTasks/GroupTypeSelectionModal.js     |  59 +++++-----
 src/utils.js                                  |  13 +++
 3 files changed, 118 insertions(+), 62 deletions(-)

diff --git a/src/Pages/GroupTasks/GroupTasksViewModal.js b/src/Pages/GroupTasks/GroupTasksViewModal.js
index 5ac2e3e..c2c1030 100644
--- a/src/Pages/GroupTasks/GroupTasksViewModal.js
+++ b/src/Pages/GroupTasks/GroupTasksViewModal.js
@@ -20,6 +20,7 @@ import {
   SentMessagesCommands,
   GetDuration,
   MyAvatar,
+  getUserId,
 } from "../../utils";
 import { InfoCircleOutlined } from "@ant-design/icons";
 
@@ -326,15 +327,19 @@ export default function GroupTasksViewModal({ isOpen }) {
                 )}
               </p>
 
+              {console.log("stepLocked", groupTaskSteps[index].Locked)}
+
               <Alert
                 message={<b>{getAlertMessage(groupTaskSteps[index].Status)}</b>}
                 description={
                   groupTaskSteps[index].Status ===
                   Constants.GROUP_TASKS_STATUS.INPUT_REQUIRED ? (
                     <InputRequiredHandler
+                      webSocketContext={webSocketContext}
                       currentGroupTask={currentGroupTask}
                       groupTaskParameters={groupTask.parameters}
                       notificationApi={notificationApi}
+                      step={index}
                     />
                   ) : (
                     getGroupTaskStepLog(groupTaskSteps[index].Log)
@@ -493,9 +498,11 @@ export default function GroupTasksViewModal({ isOpen }) {
 }
 
 function InputRequiredHandler({
+  webSocketContext,
   currentGroupTask,
   groupTaskParameters,
   notificationApi,
+  step,
 }) {
   const globalInputs = JSON.parse(currentGroupTask.GlobalInputs);
 
@@ -508,8 +515,8 @@ function InputRequiredHandler({
     ).value;
   };
 
-  const MyFormItem = ({ children, displayName, groupTaskParameter }) => {
-    const label = groupTaskParameter.global ? (
+  const getLabel = (displayName, groupTaskParameter) => {
+    return groupTaskParameter.global ? (
       <>
         {displayName}
         <Tag style={{ marginLeft: 6 }} color="purple">
@@ -519,12 +526,39 @@ function InputRequiredHandler({
     ) : (
       displayName
     );
+  };
 
-    return (
-      <Form.Item label={label} required>
-        {children}
-      </Form.Item>
+  let lastChanges = [];
+
+  const onInputChange = (currentGroupTaskId, parameterName) => {
+    console.log(
+      "change",
+
+      currentGroupTaskId,
+      parameterName,
+      step
     );
+
+    lastChanges = lastChanges.filter(
+      (lc) => Date.now() - new Date(lc.changeTime) < 3000
+    );
+
+    const lastChange = lastChanges.find((lC) => lC.step === step);
+
+    if (lastChange === undefined) {
+      lastChanges.push({
+        step: step,
+        changeTime: Date.now(),
+      });
+
+      console.warn("lock");
+
+      webSocketContext.SendSocketMessage(SentMessagesCommands.TaskLocking, {
+        lockedByUserId: getUserId(),
+        groupTaskId: currentGroupTaskId,
+        step: step,
+      });
+    }
   };
 
   return (
@@ -533,34 +567,50 @@ function InputRequiredHandler({
         switch (groupTaskParameter.type) {
           case "text":
             return (
-              <MyFormItem
+              <Form.Item
                 key={"fitem-" + groupTaskParameter.parameterName}
-                displayName={groupTaskParameter.displayName}
-                groupTaskParameter={groupTaskParameter}
-                children={
-                  <Input
-                    key={"input-" + groupTaskParameter.parameterName}
-                    id={groupTaskParameter.parameterName}
-                    defaultValue={getDefaultValue(groupTaskParameter)}
-                  />
-                }
-              />
+                label={getLabel(
+                  groupTaskParameter.displayName,
+                  groupTaskParameter
+                )}
+                required
+              >
+                <Input
+                  key={"input-" + groupTaskParameter.parameterName}
+                  id={groupTaskParameter.parameterName}
+                  defaultValue={getDefaultValue(groupTaskParameter)}
+                  onChange={() =>
+                    onInputChange(
+                      currentGroupTask.Id,
+                      groupTaskParameter.parameterName
+                    )
+                  }
+                />
+              </Form.Item>
             );
           case "number":
             return (
-              <MyFormItem
+              <Form.Item
                 key={"fitem-" + groupTaskParameter.parameterName}
-                displayName={groupTaskParameter.displayName}
-                groupTaskParameter={groupTaskParameter}
-                children={
-                  <InputNumber
-                    key={"fitem-" + groupTaskParameter.parameterName}
-                    id={groupTaskParameter.parameterName}
-                    style={{ width: "100%" }}
-                    defaultValue={getDefaultValue(groupTaskParameter)}
-                  />
-                }
-              />
+                label={getLabel(
+                  groupTaskParameter.displayName,
+                  groupTaskParameter
+                )}
+                required
+              >
+                <InputNumber
+                  key={"fitem-" + groupTaskParameter.parameterName}
+                  id={groupTaskParameter.parameterName}
+                  style={{ width: "100%" }}
+                  defaultValue={getDefaultValue(groupTaskParameter)}
+                  onChange={() =>
+                    onInputChange(
+                      currentGroupTask.Id,
+                      groupTaskParameter.parameterName
+                    )
+                  }
+                />
+              </Form.Item>
             );
           default:
             notificationApi["error"]({
diff --git a/src/Pages/GroupTasks/GroupTypeSelectionModal.js b/src/Pages/GroupTasks/GroupTypeSelectionModal.js
index 3e7e6bb..d28006c 100644
--- a/src/Pages/GroupTasks/GroupTypeSelectionModal.js
+++ b/src/Pages/GroupTasks/GroupTypeSelectionModal.js
@@ -193,21 +193,14 @@ function GroupGlobalInputs({
   currentSelectedModalGroupType,
   notificationApi,
 }) {
-  const MyFormItem = ({ children, displayName }) => {
+  const getLabel = (displayName) => {
     return (
-      <Form.Item
-        label={
-          <>
-            {displayName}
-            <Tag style={{ marginLeft: 6 }} color="purple">
-              Global
-            </Tag>
-          </>
-        }
-        required
-      >
-        {children}
-      </Form.Item>
+      <>
+        {displayName}
+        <Tag style={{ marginLeft: 6 }} color="purple">
+          Global
+        </Tag>
+      </>
     );
   };
 
@@ -223,31 +216,31 @@ function GroupGlobalInputs({
           switch (globalInput.type) {
             case "text":
               elements.push(
-                <MyFormItem
+                <Form.Item
                   key={"fitem-" + globalInput.parameterName}
-                  displayName={globalInput.displayName}
-                  children={
-                    <Input
-                      key={"input-" + globalInput.parameterName}
-                      id={globalInput.parameterName}
-                    />
-                  }
-                />
+                  label={getLabel(globalInput.displayName)}
+                  required
+                >
+                  <Input
+                    key={"input-" + globalInput.parameterName}
+                    id={globalInput.parameterName}
+                  />
+                </Form.Item>
               );
               break;
             case "number":
               elements.push(
-                <MyFormItem
+                <Form.Item
                   key={"fitem-" + globalInput.parameterName}
-                  displayName={globalInput.displayName}
-                  children={
-                    <InputNumber
-                      key={"input-" + globalInput.parameterName}
-                      style={{ width: "100%" }}
-                      id={globalInput.parameterName}
-                    />
-                  }
-                />
+                  label={getLabel(globalInput.displayName)}
+                  required
+                >
+                  <InputNumber
+                    key={"input-" + globalInput.parameterName}
+                    style={{ width: "100%" }}
+                    id={globalInput.parameterName}
+                  />
+                </Form.Item>
               );
               break;
             default:
diff --git a/src/utils.js b/src/utils.js
index 48d8223..3a42285 100644
--- a/src/utils.js
+++ b/src/utils.js
@@ -108,6 +108,7 @@ const ReceivedMessagesCommands = {
   UpdateScannerUsedByUserId: 13,
   ScanResult: 14,
   UpdateScannerLastUsed: 15,
+  TaskLocked: 16,
 };
 
 // commands sent to the backend server
@@ -116,6 +117,7 @@ export const SentMessagesCommands = {
   TaskFailedTryAgainRunTaskStep: 2,
   TaskContinueTaskStep: 3,
   ReloadGroupTasks: 4,
+  TaskLocking: 5,
 };
 
 export function WebSocketProvider({
@@ -308,6 +310,17 @@ export function WebSocketProvider({
             return newArr;
           });
           break;
+        case ReceivedMessagesCommands.TaskLocked:
+          setGroupTasksSteps((arr) => {
+            const newArr = [...arr];
+
+            newArr[
+              arr.findIndex((arr1) => arr1.GroupTasksId === body.groupTaskId)
+            ].Locked = true;
+
+            return newArr;
+          });
+          break;
         default:
           console.error("unknown command", cmd);
           break;