fix(web-client): list of changes:

1. Changing default values in the template editor 2. Fixed updating the process when its state changes 3. Fix sending a comment from the task page
pneumaticapp · Nov 11, 2024 · bf42765 · bf42765
1 parent 6533809
commit bf42765
Show file tree

Hide file tree

Showing 44 changed files with 495 additions and 282 deletions.
diff --git a/web-client/src/public/components/Sidebar/Sidebar.tsx b/web-client/src/public/components/Sidebar/Sidebar.tsx
@@ -2,7 +2,7 @@
 /* prettier-ignore */
 import React, { useEffect, useState } from 'react';
 import { RouteComponentProps } from 'react-router-dom';
-import * as classnames from 'classnames';
+import classnames from 'classnames';
 import PerfectScrollbar from 'react-perfect-scrollbar';
 import { IntlShape } from 'react-intl';
 

diff --git a/web-client/src/public/components/TaskCard/TaskCard.tsx b/web-client/src/public/components/TaskCard/TaskCard.tsx
@@ -79,12 +79,12 @@ export interface ITaskCardProps {
   authUser: IAuthUser;
   addTaskPerformer(payload: TAddTaskPerformerPayload): void;
   removeTaskPerformer(payload: TRemoveTaskPerformerPayload): void;
-  changeWorkflowLog(value: Partial<IWorkflowLog>): void;
+  changeTaskWorkflowLog(value: Partial<IWorkflowLog>): void;
   setTaskCompleted(payload: TSetTaskCompletedPayload): void;
   setTaskReverted(payload: TSetTaskRevertedPayload): void;
   setWorkflowFinished(payload: TSetWorkflowFinishedPayload): void;
-  sendWorkflowLogComments(payload: ISendWorkflowLogComment): void;
-  changeWorkflowLogViewSettings(payload: IChangeWorkflowLogViewSettingsPayload): void;
+  sendTaskWorkflowLogComments(payload: ISendWorkflowLogComment): void;
+  changeTaskWorkflowLogViewSettings(payload: IChangeWorkflowLogViewSettingsPayload): void;
   setCurrentTask(task: ITask | null): void;
   clearWorkflow(): void;
   openWorkflowLogPopup(payload: TOpenWorkflowLogPopupPayload): void;
@@ -103,12 +103,12 @@ export function TaskCard({
   accountId,
   users,
   authUser,
-  changeWorkflowLog,
+  changeTaskWorkflowLog,
   setCurrentTask,
   setTaskCompleted,
   setTaskReverted,
-  sendWorkflowLogComments,
-  changeWorkflowLogViewSettings,
+  sendTaskWorkflowLogComments,
+  changeTaskWorkflowLogViewSettings,
   clearWorkflow,
   addTaskPerformer,
   removeTaskPerformer,
@@ -490,21 +490,21 @@ export function TaskCard({
           isCommentsShown={workflowLog.isCommentsShown}
           isOnlyAttachmentsShown={workflowLog.isOnlyAttachmentsShown}
           workflowId={workflowLog.workflowId}
-          changeWorkflowLogViewSettings={changeWorkflowLogViewSettings}
           includeHeader
-          sendComment={sendWorkflowLogComments}
           currentTask={workflow?.currentTask}
           isLogMinimized={isLogMinimized && viewMode !== ETaskCardViewMode.Guest}
           areTasksClickable={viewMode === ETaskCardViewMode.Single}
+          minimizedLogMaxEvents={MINIMIZED_LOG_MAX_EVENTS}
+          isCommentFieldHidden={viewMode === ETaskCardViewMode.Guest && status === ETaskStatus.Completed}
+          isToggleCommentHidden={viewMode === ETaskCardViewMode.Guest}
+          sendComment={sendTaskWorkflowLogComments}
+          changeWorkflowLogViewSettings={changeTaskWorkflowLogViewSettings}
           onUnmount={() =>
-            changeWorkflowLog({
+            changeTaskWorkflowLog({
               isOnlyAttachmentsShown: false,
               sorting: EWorkflowsLogSorting.New,
             })
           }
-          minimizedLogMaxEvents={MINIMIZED_LOG_MAX_EVENTS}
-          isCommentFieldHidden={viewMode === ETaskCardViewMode.Guest && status === ETaskStatus.Completed}
-          isToggleCommentHidden={viewMode === ETaskCardViewMode.Guest}
         />
         {isWorkflowInfoVisible && (
           <div className={styles['workflow-info']}>

diff --git a/web-client/src/public/components/TaskCard/container.ts b/web-client/src/public/components/TaskCard/container.ts
@@ -4,18 +4,18 @@ import {
   setTaskCompleted,
   setTaskReverted,
   setWorkflowFinished,
-  changeWorkflowLogViewSettings,
-  sendWorkflowLogComments,
   ETaskStatus,
   setCurrentTask,
-  changeWorkflowLog,
   clearWorkflow,
   addTaskPerformer,
   removeTaskPerformer,
   openWorkflowLogPopup,
   setCurrentTaskDueDate,
   deleteCurrentTaskDueDate,
   openSelectTemplateModal,
+  changeTaskWorkflowLogViewSettings,
+  changeTaskWorkflowLog,
+  sendTaskWorkflowLogComments,
 } from '../../redux/actions';
 import { IApplicationState } from '../../types/redux';
 import { getNotDeletedUsers } from '../../utils/users';
@@ -29,10 +29,10 @@ type TDispatchProps = Pick<
   | 'setTaskCompleted'
   | 'setTaskReverted'
   | 'setWorkflowFinished'
-  | 'changeWorkflowLogViewSettings'
-  | 'sendWorkflowLogComments'
+  | 'changeTaskWorkflowLogViewSettings'
+  | 'sendTaskWorkflowLogComments'
   | 'setCurrentTask'
-  | 'changeWorkflowLog'
+  | 'changeTaskWorkflowLog'
   | 'clearWorkflow'
   | 'addTaskPerformer'
   | 'removeTaskPerformer'
@@ -43,9 +43,8 @@ type TDispatchProps = Pick<
 >;
 
 export function mapStateToProps({
-  workflows: { workflowLog, workflow, isWorkflowLoading },
   authUser,
-  task: { data: task, status },
+  task: { data: task, status, workflowLog, workflow, isWorkflowLoading },
   accounts: { users },
 }: IApplicationState): TStoreProps {
   const taskStatus = task?.isCompleted ? ETaskStatus.Completed : status;
@@ -66,10 +65,10 @@ export const mapDispatchToProps: TDispatchProps = {
   setTaskCompleted,
   setTaskReverted,
   setWorkflowFinished,
-  changeWorkflowLogViewSettings,
-  sendWorkflowLogComments,
+  changeTaskWorkflowLogViewSettings,
+  sendTaskWorkflowLogComments,
   setCurrentTask,
-  changeWorkflowLog,
+  changeTaskWorkflowLog,
   clearWorkflow,
   addTaskPerformer,
   removeTaskPerformer,

diff --git a/web-client/src/public/components/TemplateEdit/TaskForm/Conditions/Conditions.tsx b/web-client/src/public/components/TemplateEdit/TaskForm/Conditions/Conditions.tsx
@@ -1,7 +1,7 @@
 import * as React from 'react';
 import produce from 'immer';
 import { useIntl } from 'react-intl';
-import * as classnames from 'classnames';
+import classnames from 'classnames';
 
 import { isArrayWithItems } from '../../../../utils/helpers';
 import { DropdownList } from '../../../UI/DropdownList';

diff --git a/...client/src/public/components/TemplateEdit/TaskForm/Conditions/utils/getEmptyConditions.ts b/...client/src/public/components/TemplateEdit/TaskForm/Conditions/utils/getEmptyConditions.ts
@@ -1,5 +1,3 @@
-/* eslint-disable */
-/* prettier-ignore */
 import { createConditionApiName } from '../../../../../utils/createId';
 import { EConditionAction, ICondition } from '../types';
 import { getEmptyRule } from './getEmptyRule';
@@ -12,7 +10,7 @@ export function getEmptyConditions(isSubscribed: boolean): ICondition[] {
       order: 1,
       apiName: createConditionApiName(),
       rules,
-      action: EConditionAction.EndProcess,
+      action: EConditionAction.StartTask,
     },
   ];
 }
diff --git a/web-client/src/public/components/TemplateEdit/TaskForm/DueDate/DueDate.tsx b/web-client/src/public/components/TemplateEdit/TaskForm/DueDate/DueDate.tsx
@@ -19,57 +19,41 @@ interface IDueInProps {
 }
 
 type TDueDateKeys = keyof ITemplateTask['rawDueDate'];
-export function DueDate({
-  dueDate,
-  currentTask,
-  tasks,
-  kickoff,
-  onChange,
-}: IDueInProps) {
+export function DueDate({ dueDate, currentTask, tasks, kickoff, onChange }: IDueInProps) {
   const { formatMessage } = useIntl();
 
   const prepositionOptions = React.useMemo(() => {
-    return getRulePrepositionOptions(dueDate.ruleTarget)
+    return getRulePrepositionOptions(dueDate.ruleTarget);
   }, [dueDate.ruleTarget]);
 
-  const [
-    systemRules,
-    dateFieldsRules,
-    tasksRules,
-  ] = React.useMemo(() => {
-    return getRuleTargetOptions(
-      currentTask,
-      tasks,
-      kickoff,
-    );
+  const [systemRules, dateFieldsRules, tasksRules] = React.useMemo(() => {
+    return getRuleTargetOptions(currentTask, tasks, kickoff);
   }, [tasks, kickoff]);
 
   const currentPrepositionOption = React.useMemo(() => {
-    return prepositionOptions.find(rule => rule.rulePreposition === dueDate.rulePreposition) || null;
+    return prepositionOptions.find((rule) => rule.rulePreposition === dueDate.rulePreposition) || null;
   }, [dueDate.rulePreposition]);
 
   const currentTargetOption = React.useMemo(() => {
-    return [
-      ...systemRules,
-      ...dateFieldsRules,
-      ...tasksRules,
-    ].find(rule => rule.sourceId === dueDate.sourceId && rule.ruleTarget === dueDate.ruleTarget) || null;
+    return (
+      [...systemRules, ...dateFieldsRules, ...tasksRules].find(
+        (rule) => rule.sourceId === dueDate.sourceId && rule.ruleTarget === dueDate.ruleTarget,
+      ) || null
+    );
   }, [dueDate.sourceId, dueDate.ruleTarget]);
 
-  useUpdatePreposition(
-    prepositionOptions,
-    currentPrepositionOption,
-    currentTargetOption,
-    option => onChange({
+  useUpdatePreposition(prepositionOptions, currentPrepositionOption, currentTargetOption, (option) =>
+    onChange({
       ...dueDate,
       rulePreposition: option,
-    })
+    }),
   );
 
-  const handleChange = <T extends TDueDateKeys>(field: T) =>
-    (value: ITemplateTask['rawDueDate'][T]) => {
-      onChange({ ...dueDate, [field]: value });
-    }
+  const handleChange =
+    <T extends TDueDateKeys>(field: T) =>
+      (value: ITemplateTask['rawDueDate'][T]) => {
+        onChange({ ...dueDate, [field]: value });
+      };
 
   return (
     <div className={styles['container']}>
@@ -88,7 +72,7 @@ export function DueDate({
               onChange({
                 ...dueDate,
                 rulePreposition: option.rulePreposition,
-              })
+              });
             }}
             isClearable={false}
             options={prepositionOptions}
@@ -104,7 +88,7 @@ export function DueDate({
                 ...dueDate,
                 sourceId: option.sourceId,
                 ruleTarget: option.ruleTarget,
-              })
+              });
             }}
             isClearable={false}
             options={[

diff --git a/web-client/src/public/components/TemplateEdit/TaskItem/TaskItemUsers/TaskItemUsers.tsx b/web-client/src/public/components/TemplateEdit/TaskItem/TaskItemUsers/TaskItemUsers.tsx
@@ -59,7 +59,7 @@ export function TaskItemUsers({ task, maxUsers = MAX_SHOW_USERS, onClick }: ITas
       },
     };
 
-    return performerRenderMap[performer.type](performer);
+    return performer.type && performerRenderMap[performer.type](performer);
   };
 
   return (

diff --git a/web-client/src/public/components/TemplateEdit/TemplateEdit.tsx b/web-client/src/public/components/TemplateEdit/TemplateEdit.tsx
@@ -16,7 +16,6 @@ import { EMPTY_DURATION, DEFAULT_TEMPLATE_NAME } from './constants';
 import { getVariables } from './TaskForm/utils/getTaskVariables';
 import { TemplateIntegrations } from './Integrations';
 import { TemplateControllsContainer } from './TemplateControlls';
-
 import { NAVBAR_HEIGHT } from '../../constants/defaultValues';
 import { TemplateLastUpdateInfo } from './TemplateLastUpdateInfo';
 import { ERoutes } from '../../constants/routes';
@@ -29,15 +28,47 @@ import { NotificationManager } from '../UI/Notifications';
 import { isArrayWithItems } from '../../utils/helpers';
 import { createTaskApiName, createUUID } from '../../utils/createId';
 import { EMoveDirections } from '../../types/workflow';
-import { ITemplate, ITemplateTask } from '../../types/template';
+import { ETaskPerformerType, ITemplate, ITemplateTask } from '../../types/template';
 import { EditableText } from '../UI/EditableText';
 import { TLoadTemplateVariablesSuccessPayload } from '../../redux/actions';
 import { ETemplateStatus, IAuthUser } from '../../types/redux';
-import { createEmptyDueDate } from '../../utils/dueDate/createEmptyDueDate';
-
-import styles from './TemplateEdit.css';
+import { createStartedTaskDueDate } from '../../utils/dueDate/createStartedTaskDueDate';
 import { usePrevious } from '../../hooks/usePrevious';
 import { ConditionsBanner } from './ConditionsBanner';
+import { getUserFullName } from '../../utils/users';
+
+import styles from './TemplateEdit.css';
+
+export interface ITemplateEditProps {
+  match: any;
+  location: any;
+  authUser: IAuthUser;
+  template: ITemplate;
+  aiTemplate: ITemplate | null;
+  templateStatus: ETemplateStatus;
+  users: TUserListItem[];
+  isSubscribed: boolean;
+  loadTemplate(id: number): void;
+  loadTemplateFromSystem(id: string): void;
+  resetTemplateStore(): void;
+  saveTemplate(): void;
+  setTemplate(payload: ITemplate): void;
+  setTemplateStatus(status: ETemplateStatus): void;
+  loadTemplateVariablesSuccess(payload: TLoadTemplateVariablesSuccessPayload): void;
+}
+
+export type TTemplateEditProps = ITemplateEditProps & RouteComponentProps;
+
+export interface ITemplateEditParams {
+  id: string;
+}
+
+export interface ITemplateEditState {
+  isInfoWarningsModaOpen: boolean;
+  infoWarnings: ((props: IInfoWarningProps) => JSX.Element)[];
+  openedTasks: { [key: string]: boolean };
+  openedDelays: { [key: string]: boolean };
+}
 
 export function TemplateEdit({
   match,
@@ -156,20 +187,28 @@ export function TemplateEdit({
   };
 
   const sortedTasks = () => [...tasks].sort((a, b) => a.number - b.number);
-
   const getNewTask = (templateTask?: Partial<ITemplateTask>): ITemplateTask => {
+    const taskApiName = createTaskApiName();
+
     return {
-      apiName: createTaskApiName(),
+      apiName: taskApiName,
       delay: null,
       description: '',
       name: 'New Step',
       number: 1,
       fields: [],
-      rawPerformers: [],
+      rawPerformers: [
+        {
+          id: authUser.id,
+          label: getUserFullName(authUser),
+          type: ETaskPerformerType.User,
+          sourceId: String(authUser.id),
+        },
+      ],
       uuid: createUUID(),
-      requireCompletionByAll: true,
+      requireCompletionByAll: false,
       conditions: getEmptyConditions(isSubscribed),
-      rawDueDate: createEmptyDueDate(),
+      rawDueDate: createStartedTaskDueDate(taskApiName),
       checklists: [],
       ...templateTask,
     };
@@ -464,34 +503,3 @@ export function TemplateEdit({
     </div>
   );
 }
-
-export interface ITemplateEditProps {
-  match: any;
-  location: any;
-  authUser: IAuthUser;
-  template: ITemplate;
-  aiTemplate: ITemplate | null;
-  templateStatus: ETemplateStatus;
-  users: TUserListItem[];
-  isSubscribed: boolean;
-  loadTemplate(id: number): void;
-  loadTemplateFromSystem(id: string): void;
-  resetTemplateStore(): void;
-  saveTemplate(): void;
-  setTemplate(payload: ITemplate): void;
-  setTemplateStatus(status: ETemplateStatus): void;
-  loadTemplateVariablesSuccess(payload: TLoadTemplateVariablesSuccessPayload): void;
-}
-
-export type TTemplateEditProps = ITemplateEditProps & RouteComponentProps;
-
-export interface ITemplateEditParams {
-  id: string;
-}
-
-export interface ITemplateEditState {
-  isInfoWarningsModaOpen: boolean;
-  infoWarnings: ((props: IInfoWarningProps) => JSX.Element)[];
-  openedTasks: { [key: string]: boolean };
-  openedDelays: { [key: string]: boolean };
-}
-Original file line number
+Diff line change
@@ Expand Up @@
           },
         };
-        return performerRenderMap[performer.type](performer);
+        return performer.type && performerRenderMap[performer.type](performer);
       };
       return (
@@ Expand Down @@