supporting textareas as inputs

src/Pages/GroupTasks/GroupTasksViewModal.js

@@ -32,6 +32,7 @@ import {
   LockOutlined,
 } from "@ant-design/icons";
 import { StlViewer } from "react-stl-viewer";
+import TextArea from "antd/es/input/TextArea";
 
 export default function GroupTasksViewModal({ isOpen }) {
   const webSocketContext = useContext(WebSocketContext);
@@ -155,6 +156,26 @@ export default function GroupTasksViewModal({ isOpen }) {
           });
         }
       }
+
+      const specifiedTaskTextareas =
+        groupTasksViewModalRequiredInputsForm.getElementsByTagName("textarea");
+
+      if (specifiedTaskTextareas.length > 0) {
+        for (let i = 0; i < specifiedTaskTextareas.length; i++) {
+          if (specifiedTaskTextareas[i].value === "") {
+            canTaskContinued = false;
+            break;
+          }
+
+          taskInputs.push({
+            parameterName:
+              specifiedTaskTextareas[i].id.split(
+                "-"
+              )[6] /* Format: UUID-STEP-PARAMETER_NAME */,
+            value: specifiedTaskTextareas[i].value,
+          });
+        }
+      }
     }
 
     if (!canTaskContinued) {
@@ -659,7 +680,6 @@ function InputRequiredHandler({
                 required
               >
                 <Input
-                  key={"input-" + groupTaskParameter.parameterName}
                   id={`${currentGroupTask.Id}-${step}-${groupTaskParameter.parameterName}`}
                   defaultValue={getDefaultValue(groupTaskParameter)}
                   disabled={taskLockedByUserId !== ""}
@@ -685,7 +705,6 @@ function InputRequiredHandler({
                 required
               >
                 <InputNumber
-                  key={"fitem-" + groupTaskParameter.parameterName}
                   id={`${currentGroupTask.Id}-${step}-${groupTaskParameter.parameterName}`}
                   style={{ width: "100%" }}
                   defaultValue={getDefaultValue(groupTaskParameter)}
@@ -702,6 +721,32 @@ function InputRequiredHandler({
                 />
               </Form.Item>
             );
+          case "textarea":
+            return (
+              <Form.Item
+                key={"fitem-" + groupTaskParameter.parameterName}
+                label={getLabel(
+                  groupTaskParameter.displayName,
+                  groupTaskParameter
+                )}
+                required
+              >
+                <TextArea
+                  id={`${currentGroupTask.Id}-${step}-${groupTaskParameter.parameterName}`}
+                  defaultValue={getDefaultValue(groupTaskParameter)}
+                  disabled={taskLockedByUserId !== ""}
+                  onChange={(e) =>
+                    onInputChange(
+                      e.target.value,
+                      currentGroupTask.Id,
+                      groupTaskParameter.parameterName
+                    )
+                  }
+                  value={inputFields[groupTaskParameter.parameterName]}
+                />
+              </Form.Item>
+            );
+            break;
           default:
             notificationApi["error"]({
               message: `Type ${groupTaskParameter.type} not implemented`,
@@ -709,8 +754,8 @@ function InputRequiredHandler({
             });
             return (
               <p>
-                Type ${groupTaskParameter.type} not implemented. Was specified
+                Type <b>{groupTaskParameter.type}</b> not implemented. Was
-                in: ${groupTaskParameter.displayName}
+                specified in: <b>{groupTaskParameter.displayName}</b>
               </p>
             );
         }

src/Pages/GroupTasks/GroupTypeSelectionModal.js

@@ -13,6 +13,7 @@ import {
 import { WebSocketContext, SentMessagesCommands } from "../../utils";
 import { useContext } from "react";
 import { InfoCircleOutlined } from "@ant-design/icons";
+import TextArea from "antd/es/input/TextArea";
 
 export default function GroupTypeSelectionModal({
   isOpen,
@@ -82,6 +83,23 @@ export default function GroupTypeSelectionModal({
           });
         }
       }
+
+      const userSpecifiedGlobalTextareas =
+        userSpecifiedGlobalInputForm.getElementsByTagName("textarea");
+
+      if (userSpecifiedGlobalTextareas.length > 0) {
+        for (let i = 0; i < userSpecifiedGlobalTextareas.length; i++) {
+          if (userSpecifiedGlobalTextareas[i].value === "") {
+            canTaskBeStarted = false;
+            break;
+          }
+
+          globalInputs.push({
+            parameterName: userSpecifiedGlobalTextareas[i].id,
+            value: userSpecifiedGlobalTextareas[i].value,
+          });
+        }
+      }
     }
 
     if (!canTaskBeStarted) {
@@ -221,10 +239,7 @@ function GroupGlobalInputs({
                   label={getLabel(globalInput.displayName)}
                   required
                 >
-                  <Input
+                  <Input id={globalInput.parameterName} />
-                    key={"input-" + globalInput.parameterName}
-                    id={globalInput.parameterName}
-                  />
                 </Form.Item>
               );
               break;
@@ -236,13 +251,24 @@ function GroupGlobalInputs({
                   required
                 >
                   <InputNumber
-                    key={"input-" + globalInput.parameterName}
                     style={{ width: "100%" }}
+                    max={Number.MAX_SAFE_INTEGER}
                     id={globalInput.parameterName}
                   />
                 </Form.Item>
               );
               break;
+            case "textarea":
+              elements.push(
+                <Form.Item
+                  key={"fitem-" + globalInput.parameterName}
+                  label={getLabel(globalInput.displayName)}
+                  required
+                >
+                  <TextArea id={globalInput.parameterName} />
+                </Form.Item>
+              );
+              break;
             default:
               notificationApi["error"]({
                 message: `Type ${globalInput.type} not implemented`,