Handle assign errors better in the frontend

packages/frontend/src/model/periods.ts

@@ -26,7 +26,7 @@ import {
   periodReceiverPraiseListKey,
 } from '@/utils/periods';
 import { useApiAuthClient } from '@/utils/api';
-import { ApiAuthGet, isResponseOk } from './api';
+import { ApiAuthGet, isApiResponseAxiosError, isResponseOk } from './api';
 import { ActiveUserId } from './auth';
 import { AllPraiseList, PraiseIdList, SinglePraise } from './praise';
 // eslint-disable-next-line @typescript-eslint/no-explicit-any
@@ -353,6 +353,10 @@ export const useAssignQuantifiers = (
         status: 'QUANTIFY' as PeriodStatusType,
       };
       setPeriod(updatedPeriod);
+      return response as AxiosResponse<PeriodDetailsDto>;
+    }
+    if (isApiResponseAxiosError(response)) {
+      throw response;
     }
     return response as AxiosResponse | AxiosError;
   };

packages/frontend/src/pages/Periods/Details/components/PeriodDetails.tsx

@@ -58,22 +58,29 @@ export const PeriodDetails = (): JSX.Element | null => {
   };
 
   const handleAssign = (): void => {
+    const toastId = 'assignToast';
     const promise = assignQuantifiers();
     void toast.promise(
       promise,
       {
         loading: 'Assigning quantifiers …',
-        success: 'Quantifiers assigned',
-        error: 'Assign failed',
+        success: () => {
+          setTimeout(() => history.go(0), 2000);
+          return 'Quantifiers assigned';
+        },
+        error: () => {
+          setTimeout(() => toast.remove(toastId), 2000);
+          return 'Assign failed';
+        },
       },
       {
+        id: toastId,
         position: 'top-center',
         loading: {
           duration: Infinity,
         },
       }
     );
-    promise.finally(() => setTimeout(() => history.go(0), 1000));
   };
 
   const handleExport = (): void => {