diff --git a/frontend/src/features/permits/hooks/cart.ts b/frontend/src/features/permits/hooks/cart.ts index 5299c7724..4ee9ba31a 100644 --- a/frontend/src/features/permits/hooks/cart.ts +++ b/frontend/src/features/permits/hooks/cart.ts @@ -9,6 +9,9 @@ import { getCartCount, removeFromCart, } from "../apiManager/cart"; +import { AxiosError } from "axios"; +import { ERROR_ROUTES } from "../../../routes/constants"; +import { useNavigate } from "react-router-dom"; const CART_KEY = "cart"; const CART_COUNT_KEY = "cart-count"; @@ -19,6 +22,7 @@ const CART_ITEM = "cart-item"; * @returns Mutation object for adding items to cart */ export const useAddToCart = () => { + const navigate = useNavigate(); return useMutation({ mutationFn: ({ companyId, @@ -27,6 +31,13 @@ export const useAddToCart = () => { companyId: number; applicationIds: string[]; }) => addToCart(companyId, applicationIds), + onError: (error: AxiosError) => { + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); + }, }); }; diff --git a/frontend/src/features/permits/hooks/hooks.ts b/frontend/src/features/permits/hooks/hooks.ts index d3a39aeb2..541d1a037 100644 --- a/frontend/src/features/permits/hooks/hooks.ts +++ b/frontend/src/features/permits/hooks/hooks.ts @@ -11,7 +11,11 @@ import { import { Application, ApplicationFormData } from "../types/application"; import { IssuePermitsResponse } from "../types/permit"; import { StartTransactionResponseData } from "../types/payment"; -import { APPLICATION_STEPS, ApplicationStep } from "../../../routes/constants"; +import { + APPLICATION_STEPS, + ApplicationStep, + ERROR_ROUTES, +} from "../../../routes/constants"; import { isPermitTypeValid } from "../types/PermitType"; import { isPermitIdNumeric } from "../helpers/permitState"; import { deserializeApplicationResponse } from "../helpers/deserializeApplication"; @@ -36,6 +40,7 @@ import { getPendingPermits, } from "../apiManager/permitsAPI"; import { getDefaultRequiredVal } from "../../../common/helpers/util"; +import { useNavigate } from "react-router-dom"; const QUERY_KEYS = { PERMIT_DETAIL: ( @@ -58,6 +63,7 @@ const QUERY_KEYS = { */ export const useSaveApplicationMutation = () => { const queryClient = useQueryClient(); + const navigate = useNavigate(); return useMutation({ mutationFn: async ({ data, @@ -86,6 +92,14 @@ export const useSaveApplicationMutation = () => { }; } }, + onError: (error: AxiosError) => { + console.error(error); + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); + }, }); }; @@ -196,10 +210,7 @@ export const useApplicationDetailsQuery = ({ * @param permitId permit id for the permit * @returns Query object containing the permit details */ -export const usePermitDetailsQuery = ( - companyId: number, - permitId: string, -) => { +export const usePermitDetailsQuery = (companyId: number, permitId: string) => { return useQuery({ queryKey: QUERY_KEYS.PERMIT_DETAIL(permitId, companyId), queryFn: async () => { @@ -221,7 +232,7 @@ export const useStartTransaction = () => { const [transaction, setTransaction] = useState>(undefined); const queryClient = useQueryClient(); - + const navigate = useNavigate(); const mutation = useMutation({ mutationFn: startTransaction, retry: false, @@ -232,9 +243,14 @@ export const useStartTransaction = () => { queryClient.setQueryData(["transaction"], transactionData); setTransaction(transactionData); }, - onError: (err: unknown) => { - console.error(err); + onError: (error: AxiosError) => { + console.error(error); setTransaction(undefined); + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); }, }); @@ -335,12 +351,9 @@ export const useIssuePermits = () => { useState>(undefined); const queryClient = useQueryClient(); - + const navigate = useNavigate(); const mutation = useMutation({ - mutationFn: (data: { - companyId: number; - applicationIds: string[]; - }) => + mutationFn: (data: { companyId: number; applicationIds: string[] }) => issuePermits(data.companyId, data.applicationIds), retry: false, onSuccess: (issueResponseData) => { @@ -349,9 +362,14 @@ export const useIssuePermits = () => { }); setIssueResults(issueResponseData); }, - onError: (err: unknown) => { - console.error(err); + onError: (error: AxiosError) => { + console.error(error); setIssueResults(null); + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); }, }); @@ -368,6 +386,7 @@ export const useIssuePermits = () => { */ export const useAmendPermit = (companyId: number) => { const queryClient = useQueryClient(); + const navigate = useNavigate(); return useMutation({ mutationFn: async (data: AmendPermitFormData) => { const amendResult = await amendPermit(data, companyId); @@ -382,10 +401,7 @@ export const useAmendPermit = (companyId: number) => { ), }); queryClient.invalidateQueries({ - queryKey: QUERY_KEYS.PERMIT_HISTORY( - data.originalPermitId, - companyId, - ), + queryKey: QUERY_KEYS.PERMIT_HISTORY(data.originalPermitId, companyId), }); return { @@ -398,11 +414,20 @@ export const useAmendPermit = (companyId: number) => { status: amendResult.status, }; }, + onError: (error: AxiosError) => { + console.error(error); + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); + }, }); }; export const useModifyAmendmentApplication = () => { const queryClient = useQueryClient(); + const navigate = useNavigate(); return useMutation({ mutationFn: async (data: { application: AmendPermitFormData; @@ -435,6 +460,14 @@ export const useModifyAmendmentApplication = () => { status: amendResult.status, }; }, + onError: (error: AxiosError) => { + console.error(error); + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); + }, }); }; @@ -481,14 +514,11 @@ export const useApplicationsInProgressQuery = (companyId: number) => { sorting, ], queryFn: () => - getApplicationsInProgress( - companyId, - { - page: pagination.pageIndex, - take: pagination.pageSize, - orderBy, - }, - ), + getApplicationsInProgress(companyId, { + page: pagination.pageIndex, + take: pagination.pageSize, + orderBy, + }), refetchOnWindowFocus: false, // prevent unnecessary multiple queries on page showing up in foreground refetchOnMount: "always", placeholderData: keepPreviousData, @@ -518,13 +548,10 @@ export const usePendingPermitsQuery = (companyId: number) => { const { data: pendingPermits } = useQuery({ queryKey: ["pendingPermits", pagination.pageIndex, pagination.pageSize], queryFn: () => - getPendingPermits( - companyId, - { - page: pagination.pageIndex, - take: pagination.pageSize, - }, - ), + getPendingPermits(companyId, { + page: pagination.pageIndex, + take: pagination.pageSize, + }), refetchOnWindowFocus: false, // prevent unnecessary multiple queries on page showing up in foreground refetchOnMount: "always", placeholderData: keepPreviousData, diff --git a/frontend/src/features/settings/hooks/creditAccount.ts b/frontend/src/features/settings/hooks/creditAccount.ts index 064cca7c2..e0a78c4b3 100644 --- a/frontend/src/features/settings/hooks/creditAccount.ts +++ b/frontend/src/features/settings/hooks/creditAccount.ts @@ -290,8 +290,12 @@ export const useUpdateCreditAccountStatusMutation = () => { ...getResultingSnackbarOptionsFromAction(updateStatusAction), }); }, - onError: () => { - navigate(ERROR_ROUTES.UNEXPECTED); + onError: (error: AxiosError) => { + navigate(ERROR_ROUTES.UNEXPECTED, { + state: { + correlationId: error?.response?.headers["x-correlation-id"], + }, + }); }, }); };