improving user frendly toast message (#635)

public/locales/fr/translation.json

@@ -464,7 +464,7 @@
   "Provide Professional_Skills range between 1-2": "Fournir une gamme de compétences professionnelles comprise entre 1-2",
   "Sprint Ratings": "Sprint Notations",
   "Please wait to be added to a program or cohort": "Veuillez attendre d'être ajouté à un programme ou à une cohorte",
-  "Enter all the required information": "Entrez toutes les informations requises",
+  "Select all the required information": "Entrez toutes les informations requises",
   "Are you sure you want to delete this user?": "Êtes-vous sûr de vouloir supprimer cet utilisateur ?",
   "Come shape the future together": "Venez former l'avenir ensemble",
   "Content1": "Je suis extrêmement impressionné par Pulse et leur plateforme de gestion de la performance. Depuis que nous utilisons leurs services, cela a été un véritable changement pour notre organisation. La plateforme est intuitive, facile à naviguer et riche en fonctionnalités puissantes",

public/locales/kn/translation.json

@@ -452,7 +452,7 @@
   "Provide Professional_Skills range between 1-2": "Tanga ubuhanga buri hagati ya 1-2",
   "Sprint Ratings": "Amanota ya Sprint",
   "Please wait to be added to a program or cohort": "Tegereza tukongere muri porogarame cyangwa itsinda",
-  "Enter all the required information": "Shyiramo amakuru yose asabwa",
+  "Select all the required information": "Shyiramo amakuru yose asabwa",
   "Are you sure you want to delete this user?": "urashaka kwemeza ikigikorwa cyo gusiba uyumuntu ?",
   "Come shape the future together": "Dufatanye kwubaka ejo Hazaza",
   "Content1": "Nshimishijwe cyane na Pulse n'ikoranabuhanga ryabo ryo gucunga imikorere. Kuva natangira gukoresha serivisi zabo, byabaye impinduka ikomeye mu kigo cyacu. iri koranabuhanga  riroroshye kurikoresha, kandi ryubakanye ubuhanga n' ubushobozi buhanitse.",

src/components/Calendar.tsx

@@ -16,6 +16,7 @@ import moment from 'moment';
 import CalendarSkeleton from '../Skeletons/Calender.skeleton';
 import { toast } from 'react-toastify';
 import EventGuestList from './EventGuestList';
+import { handleError } from './ErrorHandle';
 /* istanbul ignore next */
 
 const Calendar = () => {
@@ -48,7 +49,7 @@ const Calendar = () => {
         fetchPolicy: 'network-only',
       });
     } catch (error: any) {
-      toast.error(error.message);
+      toast.error(handleError(error));
     }
   };
 
@@ -95,7 +96,7 @@ const Calendar = () => {
     })
       .then(() => {
         fetchData();
-        toast.success('Event has been added!'); // {{ edit_1 }}
+        toast.success('Event has been added!');
         setNewEvent({
           title: '',
           start: new Date(),
@@ -110,7 +111,7 @@ const Calendar = () => {
         }, 1000);
       })
       .catch((error) => {
-        toast.error(error.message); // Handle error if needed
+        toast.error(handleError(error)); 
       });
   };
 
@@ -189,7 +190,7 @@ const Calendar = () => {
         }, 1000);
       })
       .catch((error) => {
-        toast.error(error.message); // Handle error if needed
+        toast.error(handleError(error)); 
       });
   };
 
@@ -235,7 +236,7 @@ const Calendar = () => {
         }, 1000);
       })
       .catch((err) => {
-        toast.error(err.message);
+        toast.error(handleError(err));
       });
   };
 

src/components/CreateOrganizationModal.tsx

@@ -5,6 +5,7 @@ import { TFunction, useTranslation } from 'react-i18next';
 import { toast } from 'react-toastify';
 import Button from './Buttons';
 import { AddOrganization } from '../Mutations/OrganisationMutations';
+import { handleError } from './ErrorHandle';
 
 export default function CreateOrganizationModal({
   createOrganizationModel,
@@ -24,7 +25,7 @@ export default function CreateOrganizationModal({
   } = useForm();
   const [addOrganizationMutation, { loading }] = useMutation(AddOrganization, {
     onError(error) {
-      toast.error(error.message.toString());
+      toast.error(handleError(error).toString());
     },
     onCompleted() {
       toast.success(t('Organization added successfully') as TFunction);

src/components/DashHeader.tsx

@@ -96,7 +96,7 @@ function DashHeader({minimize}: any) {
         const { data } = await getProfile();
         setProfileData(data);
       } catch (error: any) {
-        toast.error(error?.message || 'Something went wrong');
+        toast.error('Something went wrong');
       }
     };
     /* istanbul ignore next */

src/components/Docs/AdminDocs.tsx

@@ -18,6 +18,7 @@ import {
   UPDATE_DOCUMENTATION,
 } from '../../Mutations/manageStudentMutations';
 import { GET_DOCUMENTATION } from '../../queries/manageStudent.queries';
+import { handleError } from '../ErrorHandle';
 
 function AdminDocs() {
   useDocumentTitle('Documentation');
@@ -68,7 +69,7 @@ function AdminDocs() {
       });
     },
     onError: (error) => {
-      toast.error(error.message);
+      toast.error(handleError(error));
     },
   });
 
@@ -87,7 +88,7 @@ function AdminDocs() {
       });
     },
     onError: (error) => {
-      toast.error(error.message);
+      toast.error(handleError(error));
     },
   });
 
@@ -104,7 +105,7 @@ function AdminDocs() {
       setIsUpdate(false);
     },
     onError: (error) => {
-      toast.error(error.message);
+      toast.error(handleError(error));
     },
   });
 
@@ -127,7 +128,7 @@ function AdminDocs() {
       getDocumentations();
     },
     onError: (error) => {
-      toast.error(error.message);
+      toast.error(handleError(error));
     },
   });
 
@@ -138,7 +139,7 @@ function AdminDocs() {
       getDocumentations();
     },
     onError: (error) => {
-      toast.error(error.message);
+      toast.error(handleError(error));
     },
   });
 

src/components/EditTicketModal.tsx

@@ -2,6 +2,7 @@ import React, { useState, useEffect } from 'react';
 import { useMutation } from '@apollo/client';
 import { toast } from 'react-toastify';
 import { UPDATE_TICKET } from '../queries/tickets.queries';
+import { handleError } from './ErrorHandle';
 
 interface EditTicketModalProps {
   isOpen: boolean;
@@ -54,7 +55,7 @@ function EditTicketModal({
     },
     onError: (error) => {
       setLoading(false);
-      toast.error(`Error updating ticket: ${error.message}`);
+      toast.error(`Error updating ticket: ${handleError(error)}`);
     },
   });
 
@@ -95,7 +96,7 @@ function EditTicketModal({
         },
       });
     } catch (error: any) {
-      toast.error(`Error updating ticket: ${error.message}`);
+      toast.error(`Error updating ticket: ${handleError(error)}`);
       setLoading(false);
     }
   };

src/components/ErrorHandle.tsx

@@ -0,0 +1,52 @@
+interface ErrorMessages {
+  [key: string]: string;
+}
+
+const DEFAULT_MESSAGE = "Something went wrong. Please try again.";
+
+const ERROR_MESSAGES: ErrorMessages = {
+  JWT_MISSING: "Please sign in to continue",
+  JWT_EXPIRED: "Please sign in to continue",
+  AUTHENTICATION_ERROR: "Please sign in to continue",
+  ORG_JWT_EXPIRED: "Please sign in to continue",
+  UNAUTHENTICATED: "Please sign in to continue",
+  INVALID_EVENT_TOKEN: "Please sign in to continue",
+  AccountNotFound: "Please sign in to continue",
+
+  FORBIDDEN: "You don't have permission for this action",
+  USER_NOT_ACTIVE: "You don't have permission for this action",
+
+  NOT_FOUND: DEFAULT_MESSAGE,
+  USER_NOT_FOUND: DEFAULT_MESSAGE,
+  ORG_NOT_FOUND: DEFAULT_MESSAGE,
+  EVENT_NOT_FOUND: DEFAULT_MESSAGE,
+
+  UserInputError: "Please check your input and try again",
+  INVALID_INPUT: "Please check your input and try again",
+  BAD_REQUEST: "Please check your input and try again",
+  VALIDATION_ERROR: "Please check your input and try again",
+  INVALID_TRAINEE_SCORE: "Please check your input and try again",
+
+  ATTENDANCE_WEEK_COMPLETE: "Attendance for this week is complete",
+  ATTENDANCE_ALREADY_RECORDED: "Attendance already recorded",
+  INCONSISTENT_TRAINEE_ATTENDANCE: "Please complete attendance for all trainees",
+  UPDATE_ATTENDANCE_ERROR: DEFAULT_MESSAGE,
+
+  INTERNAL_SERVER_ERROR: DEFAULT_MESSAGE,
+  SERVER_ERROR: DEFAULT_MESSAGE
+};
+
+export const handleError = (error: any): string => {
+  if (error?.graphQLErrors?.length > 0) {
+    const gqlError = error.graphQLErrors[0];
+    const errorCode = gqlError?.extensions?.code;
+
+    return ERROR_MESSAGES[errorCode] || DEFAULT_MESSAGE;
+  }
+
+  if (error?.networkError) {
+    return "Please check your internet connection and try again";
+  }
+
+  return DEFAULT_MESSAGE;
+};

src/components/EventGuestList.tsx

@@ -2,6 +2,7 @@ import React from "react";
 import { useQuery } from "@apollo/client";
 import { toast } from "react-toastify";
 import { GET_ALL_USERS_QUERY } from "../queries/manageStudent.queries";
+import { handleError } from "./ErrorHandle";
 
 export const getRoleColor = (role: string) => {
   switch (role) {
@@ -46,7 +47,7 @@ function EventGuestList({ selectedGuests, handleAddGuest }: { selectedGuests: st
       },
       fetchPolicy: 'network-only',
       onError: (error) => {
-        toast.error(error.message);
+        toast.error(handleError(error));
       },
     },
   );

src/components/ModalAttendance.tsx

@@ -77,9 +77,7 @@ function ModalAttendance({
       onClose();
     },
     onError: (error) => {
-      const errorMessage =
-        error.graphQLErrors?.[0]?.message || 'An unexpected error occurred';
-      toast.error(errorMessage);
+      toast.error("Something went wrong!");
     },
   });
 

src/components/NewTicketModal.tsx

@@ -2,6 +2,7 @@ import React, { useState, useMemo } from 'react';
 import { useMutation } from '@apollo/client';
 import { toast } from 'react-toastify';
 import CREATE_TICKET from '../Mutations/help.mutation';
+import { handleError } from './ErrorHandle';
 
 interface NewTicketModalProps {
   isOpen: boolean;
@@ -37,7 +38,7 @@ function NewTicketModal({
     },
     onError: (error) => {
       setLoading(false);
-      toast.error(`Error creating ticket: ${error.message}`);
+      toast.error(handleError(error));
     },
   });
 
@@ -85,7 +86,7 @@ function NewTicketModal({
         },
       });
     } catch (error: any) {
-      toast.error(`Error submitting ticket: ${error.message}`);
+      toast.error(handleError(error));
     }
   };
 

src/components/Organizations.tsx

@@ -17,6 +17,7 @@ import { AddOrganization } from '../Mutations/OrganisationMutations';
 import { GET_ORGANIZATIONS } from '../queries/organization.queries';
 import jwtDecode from 'jwt-decode';
 import { useSearchParams,useNavigate } from 'react-router-dom';
+import { handleError } from './ErrorHandle';
 
 export interface Admin {
   id: string;
@@ -151,7 +152,7 @@ const  ApproveNewOrganization= async (token:string)=>{
         toast.error(`${name} organization approval failed.`);
       }
   } catch (error:any) {
-    toast.error(`An error occurred, Try again`);
+    toast.error(handleError(error));
   }
 }
 
@@ -216,7 +217,7 @@ useEffect(() => {
 
   const [addOrganizationMutation, { loading }] = useMutation(AddOrganization, {
     onError(error) {
-      toast.error(error.message.toString());
+      toast.error(handleError(error).toString());
     },
     onCompleted() {
       toast.success('Email Sent Successfully');
@@ -227,7 +228,7 @@ useEffect(() => {
   const [RegisterOrganizationMutation] = useMutation(RegisterNewOrganization, {
     onError(error) {
       setIsLoad(false);
-      toast.error(error.message.toString());
+      toast.error(handleError(error).toString());
     },
     onCompleted() {
       setIsLoad(false);
@@ -238,11 +239,11 @@ useEffect(() => {
 
   const [deleteOrganizationMutation] = useMutation(DeleteOrganization, {
     onError(error) {
-      toast.error(error.message.toString());
+      toast.error(handleError(error).toString());
     },
     onCompleted() {
       setIsLoad(false);
-      toast.success('Organisation Deleted.');
+      toast.success('Organization Deleted Successfully');
       getRefetch();
     },
   });
@@ -265,7 +266,7 @@ useEffect(() => {
         return { success: false};
       }
     } catch (error:any) {
-      toast.error(`An error occurred, Try again`);
+      toast.error(handleError(error));
     }
   }
 

src/components/ProfileCoverpage.tsx

@@ -19,6 +19,7 @@ import Avatar from '../assets/avatar.png';
 import Spinner from '../components/ButtonLoading';
 import { UserContext } from '../hook/useAuth';
 import { UPDATE_AVATAR, UPDATE_COVER } from '../Mutations/coverMutations';
+import { handleError } from './ErrorHandle';
 
 export default function ProfileCoverpage({
   currentPage,
@@ -63,7 +64,7 @@ export default function ProfileCoverpage({
       if (updated) {
         setSpinner(false);
         setProfileImage(updated?.data?.updateAvatar?.avatar);
-        toast.success('updated');
+        toast.success('Updated successfully'); 
       }
       /* istanbul ignore next */
       if (updated?.data?.updateAvatar?.avatar) {
@@ -95,7 +96,7 @@ export default function ProfileCoverpage({
       setSpinnerCover(true);
       if (updated) {
         setSpinnerCover(false);
-        toast.success('updated');
+        toast.success('updated successfully');
       }
       /* istanbul ignore next */
       if (updated?.data?.updateCoverImage?.cover) {
@@ -117,7 +118,7 @@ export default function ProfileCoverpage({
         setProfileData(data);
       } catch (error: any) {
         /* istanbul ignore next */
-        toast.error(error?.message || 'Something went wrong');
+        toast.error(handleError(error));
       }
     };
     fetchData();