added group task description

src/Pages/GroupTasks/GroupTasksTableList.js

@@ -27,6 +27,11 @@ const columns = [
     dataIndex: "groupName",
     key: "groupName",
   },
+  {
+    title: "Description",
+    dataIndex: "description",
+    key: "description",
+  },
   {
     title: "Step",
     dataIndex: "step",
@@ -110,6 +115,7 @@ export default function GroupTaskTableList({
             </>
           ),
           groupName: groupTask.GroupName,
+          description: groupTask.Description,
           step: `${groupTask.CurrentTasksStep} / ${groupTask.NumberOfSteps}`,
           status: getStatusBadge(groupTask.Status),
           startedAt: FormatDatetime(groupTask.StartedAt),

src/Pages/GroupTasks/GroupTasksViewModal.js

@@ -377,6 +377,7 @@ export default function GroupTasksViewModal({ isOpen }) {
                 style={{
                   color: Constants.COLORS.PRIMARY,
                   fontWeight: "bold",
+                  marginBottom: 0,
                 }}
               >
                 {currentGroupTask.GroupName}{" "}
@@ -475,7 +476,11 @@ export default function GroupTasksViewModal({ isOpen }) {
                   allUsers={webSocketContext.AllUsers}
                   userId={currentGroupTask.CreatorUserId}
                 />
+                <br />
               </h1>
+              <div style={{ marginBottom: 16 }}>
+                <span>{currentGroupTask.Description}</span>
+              </div>
 
               <Steps direction="vertical" items={stepsItemHandler()} />
             </div>

src/Pages/GroupTasks/GroupTypeSelectionModal.js

@@ -12,6 +12,7 @@ import {
 } from "antd";
 import { WebSocketContext, SentMessagesCommands } from "../../utils";
 import { useContext } from "react";
+import { InfoCircleOutlined } from "@ant-design/icons";
 
 export default function GroupTypeSelectionModal({
   isOpen,
@@ -48,14 +49,23 @@ export default function GroupTypeSelectionModal({
   };
 
   const handleStartTask = () => {
+    let canTaskBeStarted = true;
+
+    const groupTaskDescription = document.getElementById(
+      "fitem-grouptypedescription"
+    ).value;
+
+    if (groupTaskDescription === "") {
+      canTaskBeStarted = false;
+    }
+
     const userSpecifiedGlobalInputForm = document.getElementById(
       "groupTypeSelectionUserSpecifiedGlobalInputForm"
     );
 
     let globalInputs = [];
-    let canTaskBeStarted = true;
 
-    if (userSpecifiedGlobalInputForm !== null) {
+    if (canTaskBeStarted && userSpecifiedGlobalInputForm !== null) {
       const userSpecifiedGlobalInputs =
         userSpecifiedGlobalInputForm.getElementsByTagName("input");
 
@@ -103,6 +113,7 @@ export default function GroupTypeSelectionModal({
       category: categoryGroup.category,
       id: currentSelectedModalGroupType,
       groupName: groupName,
+      description: groupTaskDescription,
       numberOfSteps: parseInt(numberOfSteps),
       globalInputs: globalInputs,
       rememberId: rememberId, // used to open the modal when group task is started by backend and send via websocket back
@@ -151,6 +162,25 @@ export default function GroupTypeSelectionModal({
           : null}
       </Select>
 
+      {console.log(currentSelectedModalGroupType)}
+
+      {currentSelectedModalGroupType !== null && (
+        <Form layout="vertical">
+          <br />
+          <Form.Item
+            label="Description"
+            tooltip={{
+              title:
+                "This description helps to understand afterwards what this task was about",
+              icon: <InfoCircleOutlined />,
+            }}
+            required
+          >
+            <Input id="fitem-grouptypedescription" />
+          </Form.Item>
+        </Form>
+      )}
+
       <GroupGlobalInputs
         categoryGroup={categoryGroup}
         currentSelectedModalGroupType={currentSelectedModalGroupType}
@@ -165,7 +195,7 @@ function GroupGlobalInputs({
   currentSelectedModalGroupType,
   notificationApi,
 }) {
-  const MyFormItem = ({ children, displayName, parameterName }) => {
+  const MyFormItem = ({ children, displayName }) => {
     return (
       <Form.Item
         label={
@@ -198,7 +228,6 @@ function GroupGlobalInputs({
                 <MyFormItem
                   key={"fitem-" + globalInput.parameterName}
                   displayName={globalInput.displayName}
-                  parameterName={globalInput.parameterName}
                   children={
                     <Input
                       key={"input-" + globalInput.parameterName}
@@ -213,7 +242,6 @@ function GroupGlobalInputs({
                 <MyFormItem
                   key={"fitem-" + globalInput.parameterName}
                   displayName={globalInput.displayName}
-                  parameterName={globalInput.parameterName}
                   children={
                     <InputNumber
                       key={"input-" + globalInput.parameterName}