When a user submits a user task the update to the tasks state might be delayed because the newest data is not instantly returned due to caching

Author: jjoderis

src/management-system-v2/app/(dashboard)/[environmentId]/tasklist/tasklist.tsx

@@ -57,7 +57,7 @@ const Tasklist: React.FC<TasklistProps> = ({ userId, pollingInterval }) => {
 
   const space = useEnvironment();
 
-  const { userTasks } = useUserTasks(space, pollingInterval, {
+  const { userTasks, refetch } = useUserTasks(space, pollingInterval, {
     hideNonOwnableTasks: true,
     hideUnassignedTasks: false,
   });
@@ -291,7 +291,7 @@ const Tasklist: React.FC<TasklistProps> = ({ userId, pollingInterval }) => {
         )}
       </div>
       {(selectedUserTaskID ?? breakpoint.xl) && (
-        <UserTaskView userId={userId} task={selectedUserTask} />
+        <UserTaskView userId={userId} task={selectedUserTask} refetch={refetch} />
       )}
     </div>
   );

src/management-system-v2/app/(dashboard)/[environmentId]/tasklist/user-task-view.tsx

@@ -98,9 +98,10 @@ export const UserTaskForm: React.FC<UserTaskFormProps> = ({
 type TaskListUserTaskFormProps = {
   userId: string;
   task?: ExtendedTaskListEntry;
+  refetch?: () => {};
 };
 
-const TaskListUserTaskForm: React.FC<TaskListUserTaskFormProps> = ({ task, userId }) => {
+const TaskListUserTaskForm: React.FC<TaskListUserTaskFormProps> = ({ task, userId, refetch }) => {
   const space = useEnvironment();
 
   const { message } = App.useApp();
@@ -148,7 +149,9 @@ const TaskListUserTaskForm: React.FC<TaskListUserTaskFormProps> = ({ task, userI
                 const updatedOwners = await addOwnerToTaskListEntry(space.spaceId, task.id, userId);
                 if ('error' in updatedOwners) return updatedOwners;
               }
-              return await completeTasklistEntry(space.spaceId, task.id, variables);
+              const res = await completeTasklistEntry(space.spaceId, task.id, variables, true);
+              refetch?.();
+              return res;
             },
           });
         }}

src/management-system-v2/lib/tasks/server-actions.ts

@@ -34,7 +34,7 @@ import { getProcessBPMN, getProcessHtmlFormHTML } from '../data/processes';
 import { saveInstanceArtifact } from '../data/file-manager-facade';
 import { getDBInstance } from '@/lib/data/instance';
 import Ability from '../ability/abilityHelper';
-import { revalidateTag } from 'next/cache';
+import { revalidateTag, updateTag } from 'next/cache';
 
 export async function getGlobalVariablesForHTML(
   spaceId: string,
@@ -255,6 +255,9 @@ export async function completeTasklistEntry(
   spaceId: string,
   userTaskId: string,
   variables: { [key: string]: any },
+  // defines if the request was made in the context of a browser session
+  // this allows us to use "updateTag" to instantly invalidate the cached instance data
+  isBrowserRequest = false,
 ) {
   try {
     const storedUserTask = await getUserTaskById(userTaskId);
@@ -292,11 +295,24 @@ export async function completeTasklistEntry(
       await completeTasklistEntryOnMachine(engine, instanceId, taskId, variables);
     }
 
-    await updateUserTask(spaceId, userTaskId, {
-      variableChanges: { ...variableChanges, ...variables },
-      state: 'COMPLETED',
-      endTime: !storedUserTask.instanceID ? new Date() : undefined,
+    await db.userTask.update({
+      where: {
+        id: userTaskId,
+      },
+      data: {
+        variableChanges: { ...variableChanges, ...variables },
+        state: 'COMPLETED',
+        endTime: !storedUserTask.instanceID ? new Date() : undefined,
+      },
     });
+
+    if (isBrowserRequest) {
+      updateTag(`userTask/${userTaskId}`);
+      updateTag(`space/${spaceId}/tasks`);
+    } else {
+      revalidateTag(`userTask/${userTaskId}`, 'max');
+      revalidateTag(`space/${spaceId}/tasks`, 'max');
+    }
   } catch (e) {
     const message = getErrorMessage(e);
     return userError(message);

src/management-system-v2/lib/use-user-tasks.ts

@@ -77,7 +77,7 @@ function useUserTasks(
     }
   }
 
-  return { userTasks };
+  return { userTasks, refetch: query.refetch };
 }
 
 export default useUserTasks;