feat: add notification on task cancel; fix refresh logic on mobile

Author: KirillKirill

packages/apps/human-app/frontend/src/modules/worker/jobs/components/more-button.tsx

@@ -6,6 +6,7 @@ import { useParams } from 'react-router-dom';
 import { useTranslation } from 'react-i18next';
 import { useModal } from '@/shared/contexts/modal-context';
 import { useIsMobile } from '@/shared/hooks/use-is-mobile';
+import { TopNotificationType, useNotification } from '@/shared/hooks';
 import { useResignJobMutation } from '../my-jobs/hooks';
 import { type MyJob } from '../schemas';
 import { ReportAbuseModal } from './report-abuse-modal';
@@ -18,19 +19,33 @@ interface MoreButtonProps {
 export function MoreButton({ job, isDisabled }: MoreButtonProps) {
   const [anchorEl, setAnchorEl] = useState<HTMLButtonElement | null>(null);
   const { address: oracleAddress } = useParams<{ address: string }>();
-  const { mutate: rejectTaskMutation } = useResignJobMutation();
+  const { mutateAsync: rejectTaskMutation } = useResignJobMutation();
   const { openModal, closeModal } = useModal();
   const isMobile = useIsMobile();
   const { t } = useTranslation();
+  const { showNotification } = useNotification();
 
   const isOpen = Boolean(anchorEl);
 
-  const handleCancelTask = () => {
+  const handleCancelTask = async () => {
     setAnchorEl(null);
-    rejectTaskMutation({
-      oracle_address: oracleAddress ?? '',
-      assignment_id: job.assignment_id,
-    });
+    try {
+      await rejectTaskMutation({
+        oracle_address: oracleAddress ?? '',
+        assignment_id: job.assignment_id,
+      });
+      showNotification({
+        message: 'Task cancelled. Press Refresh button to see the changes',
+        type: TopNotificationType.SUCCESS,
+        durationMs: 5000,
+      });
+    } catch (error) {
+      showNotification({
+        message: 'Something went wrong',
+        type: TopNotificationType.WARNING,
+        durationMs: 5000,
+      });
+    }
   };
 
   const handleOpenReportAbuseModal = () => {
@@ -90,7 +105,7 @@ export function MoreButton({ job, isDisabled }: MoreButtonProps) {
         }}
       >
         <MenuList>
-          <ListItemButton onClick={handleCancelTask}>
+          <ListItemButton onClick={() => void handleCancelTask()}>
             {t('worker.reportAbuse.cancel')}
           </ListItemButton>
           <ListItemButton onClick={handleOpenReportAbuseModal}>

packages/apps/human-app/frontend/src/modules/worker/jobs/my-jobs/hooks/use-refresh-jobs.ts

@@ -18,6 +18,7 @@ export function useRefreshJobsMutation(callbacks?: {
         void callbacks.onSuccess();
       }
       await queryClient.invalidateQueries({ queryKey: ['fetchMyJobs'] });
+      await queryClient.invalidateQueries({ queryKey: ['myJobsInfinite'] });
     },
     onError: (error) => {
       if (callbacks?.onError) {