React router errorElement navigating to previous page

I am using errorElement prop in the createBrowserRouter function from react-router-dom. I have only one errorElement in root – FallBackError component.

When I get an error in one of the child routes I get an error page from FallBackError component.

My problem:
When an error occurs, I get an error page. When I try to go to the previous page, the URL changes to the previous page, but I still have an error page, even though thats not where the error occurred and I shouldn’t see an error page.

How to fix this, so that I can go to the previous page and not get an error page anymore without having to refresh the page?

import { createBrowserRouter } from 'react-router-dom';
import { wrapCreateBrowserRouter } from '@sentry/react';

export default function getRouter(user) {
  const sentryCreateBrowserRouter = wrapCreateBrowserRouter(createBrowserRouter);
  const router = sentryCreateBrowserRouter([
    {
      path: '/',
      element: <AppLayout />,
      errorElement: <FallBackError />,
      children: [
        { index: true, element: <Home /> },
        ...

import { useRouteError } from 'react-router-dom';

const FallBackError = () => {
  const error = useRouteError();

  if (error.message === 'ERR_NOT_FOUND') return <ErrorPage404 />;

  return <DefaultErrorPage />;
};

export default FallBackError;