Invoice-App Solution

One of the difficult challenges I encountered was using the *Next.js library route interceptors. Trying to dismount the route intercepted was only to use router.back() which became a challenge because I was using react server action where i redirect to the invoice dashboard after a form submission was successful.

Since the router cannot be used in a server component the only way to dismount the interceptor was to use it in a client component which is when the submit button is clicked. This was a challenge because I send error messages using useFormState(), hence the create invoice page redirect sometimes before error messages are sent from the server.

Your feedbacks are welcomed on possible ways to fix this when using *NextJS route interceptors.