Use forceRefetch for task update (#2695)

front/src/modules/activities/components/ActivityEditor.tsx

@@ -78,9 +78,7 @@ export const ActivityEditor = ({
     useState<boolean>(false);
 
   const [title, setTitle] = useState<string | null>(activity.title ?? '');
-  const [completedAt, setCompletedAt] = useState<string | null>(
+
-    activity.completedAt ?? '',
-  );
   const containerRef = useRef<HTMLDivElement>(null);
   const { updateOneObject } = useUpdateOneObjectRecord<Activity>({
     objectNameSingular: 'activity',
@@ -91,6 +89,7 @@ export const ActivityEditor = ({
     objectRecordId: activity.id,
     fieldMetadataName: 'dueAt',
     fieldPosition: 0,
+    forceRefetch: true,
   });
 
   const { FieldContextProvider: AssigneeFieldContextProvider } =
@@ -99,6 +98,7 @@ export const ActivityEditor = ({
       objectRecordId: activity.id,
       fieldMetadataName: 'assignee',
       fieldPosition: 1,
+      forceRefetch: true,
     });
 
   const updateTitle = useCallback(
@@ -119,8 +119,8 @@ export const ActivityEditor = ({
         input: {
           completedAt: value ? new Date().toISOString() : null,
         },
+        forceRefetch: true,
       });
-      setCompletedAt(value ? new Date().toISOString() : null);
     },
     [activity.id, updateOneObject],
   );
@@ -146,7 +146,7 @@ export const ActivityEditor = ({
           <ActivityTypeDropdown activity={activity} />
           <ActivityTitle
             title={title ?? ''}
-            completed={!!completedAt}
+            completed={!!activity.completedAt}
             type={activity.type}
             onTitleChange={(newTitle) => {
               setTitle(newTitle);

front/src/modules/activities/components/ActivityTitle.tsx

@@ -38,12 +38,6 @@ const StyledContainer = styled.div`
   width: 100%;
 `;
 
-const StyledCheckboxContainer = styled.div`
-  align-items: center;
-  display: flex;
-  justify-content: center;
-`;
-
 type ActivityTitleProps = {
   title: string;
   type: ActivityType;
@@ -61,13 +55,12 @@ export const ActivityTitle = ({
 }: ActivityTitleProps) => (
   <StyledContainer>
     {type === 'Task' && (
-      <StyledCheckboxContainer onClick={() => onCompletionChange(!completed)}>
+      <Checkbox
-        <Checkbox
+        size={CheckboxSize.Large}
-          size={CheckboxSize.Large}
+        shape={CheckboxShape.Rounded}
-          shape={CheckboxShape.Rounded}
+        checked={completed}
-          checked={completed}
+        onCheckedChange={(value) => onCompletionChange(value)}
-        />
+      />
-      </StyledCheckboxContainer>
     )}
     <StyledEditableTitleInput
       autoComplete="off"

front/src/modules/activities/tasks/hooks/useCompleteTask.ts

@@ -18,6 +18,7 @@ export const useCompleteTask = (task: Task) => {
         input: {
           completedAt,
         },
+        forceRefetch: true,
       });
     },
     [task.id, updateOneObject],

front/src/modules/object-record/hooks/useFieldContext.tsx

@@ -11,11 +11,13 @@ export const useFieldContext = ({
   fieldMetadataName,
   objectRecordId,
   fieldPosition,
+  forceRefetch,
 }: {
   objectNameSingular: string;
   objectRecordId: string;
   fieldMetadataName: string;
   fieldPosition: number;
+  forceRefetch?: boolean;
 }) => {
   const { objectMetadataItem } = useObjectMetadataItem({
     objectNameSingular,
@@ -43,6 +45,7 @@ export const useFieldContext = ({
       updateOneObject?.({
         idToUpdate: variables.where.id,
         input: variables.data,
+        forceRefetch,
       });
     };
 

front/src/modules/object-record/hooks/useUpdateOneObjectRecord.ts

@@ -1,4 +1,5 @@
 import { useApolloClient, useMutation } from '@apollo/client';
+import { getOperationName } from '@apollo/client/utilities';
 
 import { useObjectMetadataItem } from '@/object-metadata/hooks/useObjectMetadataItem';
 import { ObjectMetadataItemIdentifier } from '@/object-metadata/types/ObjectMetadataItemIdentifier';
@@ -12,6 +13,7 @@ export const useUpdateOneObjectRecord = <T>({
     objectNotFoundInMetadata,
     updateOneMutation,
     cacheFragment,
+    findManyQuery,
   } = useObjectMetadataItem({
     objectNameSingular,
   });
@@ -24,9 +26,11 @@ export const useUpdateOneObjectRecord = <T>({
   const updateOneObject = async ({
     idToUpdate,
     input,
+    forceRefetch,
   }: {
     idToUpdate: string;
     input: Record<string, any>;
+    forceRefetch?: boolean;
   }) => {
     if (!foundObjectMetadataItem || !objectNameSingular) {
       return null;
@@ -54,6 +58,10 @@ export const useUpdateOneObjectRecord = <T>({
           ...input,
         },
       },
+      refetchQueries: forceRefetch
+        ? [getOperationName(findManyQuery) ?? '']
+        : undefined,
+      awaitRefetchQueries: forceRefetch,
     });
 
     return updatedObject.data[`update${capitalize(objectNameSingular)}`] as T;