Merge pull request #26692 from shubham1206agra/fix-25689

fixed race condition in task creation and onyx
Expensify · Sep 12, 2023 · 6246232 · 6246232
2 parents 73627ae + 89e8dbc
commit 6246232
Show file tree

Hide file tree

Showing 3 changed files with 22 additions and 20 deletions.
diff --git a/src/libs/actions/Task.js b/src/libs/actions/Task.js
@@ -187,6 +187,8 @@ function createTaskAndNavigate(parentReportID, title, description, assigneeEmail
         value: {[optimisticAddCommentReport.reportAction.reportActionID]: {pendingAction: null}},
     });
 
+    clearOutTaskInfo();
+
     API.write(
         'CreateTask',
         {

diff --git a/src/pages/tasks/NewTaskPage.js b/src/pages/tasks/NewTaskPage.js
@@ -1,4 +1,4 @@
-import React, {useEffect, useMemo} from 'react';
+import React, {useEffect, useMemo, useState} from 'react';
 import {View} from 'react-native';
 import {withOnyx} from 'react-native-onyx';
 import _ from 'underscore';
@@ -63,11 +63,12 @@ const defaultProps = {
 };
 
 function NewTaskPage(props) {
-    const [assignee, setAssignee] = React.useState({});
-    const [shareDestination, setShareDestination] = React.useState({});
-    const [errorMessage, setErrorMessage] = React.useState('');
-    const [parentReport, setParentReport] = React.useState({});
-    const shouldClearOutTaskInfoOnUnmount = React.useRef(false);
+    const [assignee, setAssignee] = useState({});
+    const [shareDestination, setShareDestination] = useState({});
+    const [title, setTitle] = useState('');
+    const [description, setDescription] = useState('');
+    const [errorMessage, setErrorMessage] = useState('');
+    const [parentReport, setParentReport] = useState({});
 
     const isAllowedToCreateTask = useMemo(() => _.isEmpty(parentReport) || ReportUtils.isAllowedToComment(parentReport), [parentReport]);
 
@@ -95,17 +96,17 @@ function NewTaskPage(props) {
             const displayDetails = Task.getShareDestination(props.task.shareDestination, props.reports, props.personalDetails);
             setShareDestination(displayDetails);
         }
-    }, [props]);
 
-    useEffect(
-        () => () => {
-            if (!shouldClearOutTaskInfoOnUnmount.current) {
-                return;
-            }
-            Task.clearOutTaskInfo();
-        },
-        [],
-    );
+        // If we have a title, we want to set the title
+        if (!_.isUndefined(props.task.title)) {
+            setTitle(props.task.title);
+        }
+
+        // If we have a description, we want to set the description
+        if (!_.isUndefined(props.task.description)) {
+            setDescription(props.task.description);
+        }
+    }, [props]);
 
     // On submit, we want to call the createTask function and wait to validate
     // the response
@@ -125,7 +126,6 @@ function NewTaskPage(props) {
             return;
         }
 
-        shouldClearOutTaskInfoOnUnmount.current = true;
         Task.createTaskAndNavigate(parentReport.reportID, props.task.title, props.task.description, props.task.assignee, props.task.assigneeAccountID, props.task.assigneeChatReport);
     }
 
@@ -153,13 +153,13 @@ function NewTaskPage(props) {
                     <View style={styles.mb5}>
                         <MenuItemWithTopDescription
                             description={props.translate('task.title')}
-                            title={props.task.title || ''}
+                            title={title}
                             onPress={() => Navigation.navigate(ROUTES.NEW_TASK_TITLE)}
                             shouldShowRightIcon
                         />
                         <MenuItemWithTopDescription
                             description={props.translate('task.description')}
-                            title={props.task.description || ''}
+                            title={description}
                             onPress={() => Navigation.navigate(ROUTES.NEW_TASK_DESCRIPTION)}
                             shouldShowRightIcon
                             numberOfLinesTitle={2}

diff --git a/src/pages/tasks/TaskAssigneeSelectorModal.js b/src/pages/tasks/TaskAssigneeSelectorModal.js
@@ -190,7 +190,7 @@ function TaskAssigneeSelectorModal(props) {
             const assigneeChatReport = Task.setAssigneeValue(option.login, option.accountID, props.route.params.reportID, OptionsListUtils.isCurrentUser(option));
 
             // Pass through the selected assignee
-            Task.editTaskAssigneeAndNavigate(props.task.report, props.session.accountID, option.login, option.accountID, assigneeChatReport);
+            Task.editTaskAssigneeAndNavigate(report, props.session.accountID, option.login, option.accountID, assigneeChatReport);
         }
     };