Refetch instance data on task change by adding task id to query key

src/features/instance/InstanceContext.tsx

@@ -1,4 +1,5 @@
 import React, { useEffect } from 'react';
+import { useParams } from 'react-router-dom';
 import type { PropsWithChildren } from 'react';
 
 import { skipToken, useQuery } from '@tanstack/react-query';
@@ -101,22 +102,32 @@ const {
     })),
 });
 
+const instanceQueryKeys = {
+  instanceData: (
+    instanceOwnerPartyId: string | undefined,
+    instanceGuid: string | undefined,
+    taskId: string | undefined,
+  ) => ['instanceData', instanceOwnerPartyId, instanceGuid, taskId],
+};
+
 // Also used for prefetching @see appPrefetcher.ts
 export function useInstanceDataQueryDef(
   hasResultFromInstantiation: boolean,
-  partyId?: string,
-  instanceGuid?: string,
+  partyId: string | undefined,
+  instanceGuid: string | undefined,
+  taskId: string | undefined,
 ): QueryDefinition<IInstance> {
   const { fetchInstanceData } = useAppQueries();
   return {
-    queryKey: ['fetchInstanceData', partyId, instanceGuid],
+    queryKey: instanceQueryKeys.instanceData(partyId, instanceGuid, taskId),
     queryFn: partyId && instanceGuid ? () => fetchInstanceData(partyId, instanceGuid) : skipToken,
     enabled: !!partyId && !!instanceGuid && !hasResultFromInstantiation,
   };
 }
 
 function useGetInstanceDataQuery(hasResultFromInstantiation: boolean, partyId: string, instanceGuid: string) {
-  const utils = useQuery(useInstanceDataQueryDef(hasResultFromInstantiation, partyId, instanceGuid));
+  const { taskId } = useParams();
+  const utils = useQuery(useInstanceDataQueryDef(hasResultFromInstantiation, partyId, instanceGuid, taskId));
 
   useEffect(() => {
     utils.error && window.logError('Fetching instance data failed:\n', utils.error);

src/queries/appPrefetcher.ts

@@ -18,6 +18,12 @@ import { useProfileQueryDef } from 'src/features/profile/ProfileProvider';
 export function AppPrefetcher() {
   const { instanceOwnerPartyId, instanceGuid } =
     matchPath({ path: '/instance/:instanceOwnerPartyId/:instanceGuid/*' }, window.location.hash.slice(1))?.params ?? {};
+
+  const taskId = matchPath(
+    { path: '/instance/:instanceOwnerPartyId/:instanceGuid/:taskId/*' },
+    window.location.hash.slice(1),
+  )?.params?.taskId;
+
   const instanceId = instanceOwnerPartyId && instanceGuid ? `${instanceOwnerPartyId}/${instanceGuid}` : undefined;
 
   usePrefetchQuery(getApplicationMetadataQueryDef(instanceGuid));
@@ -28,7 +34,7 @@ export function AppPrefetcher() {
   usePrefetchQuery(usePartiesQueryDef(true), Boolean(instanceOwnerPartyId));
   usePrefetchQuery(useCurrentPartyQueryDef(true), Boolean(instanceOwnerPartyId));
 
-  usePrefetchQuery(useInstanceDataQueryDef(false, instanceOwnerPartyId, instanceGuid));
+  usePrefetchQuery(useInstanceDataQueryDef(false, instanceOwnerPartyId, instanceGuid, taskId));
   usePrefetchQuery(getProcessQueryDef(instanceId));
 
   return null;