Skip Navigation

Search

React @programming.dev
OwlPaste @lemmy.world

How to properly throw a 404 status in react router 6?

Using react router and have a route definition:

 undefined
      
    {
         path: '/',
         element: <Root pageTitle={pageTitle} />,
         errorElement: <ErrorPage setPageTitle={updatePageTitle} />,
         children: [
            ...
            {
               path: '*',
               element: <ErrorPage setPageTitle={updatePageTitle} />,
               loader: async () => {
                  throw new Response('Not Found', { status: 404 });
               },
            },
         ],
      },

  

This shows me 404 page how I want but without the rest of the root element but also the http status is reported as 200. How do I properly throw it as a 404 and show it inside root element?