How to make site usable only for logged in users

[xdabuss]

Is there a clever way to "lock" the site so that only logged in users can see anything besides the sign-in page? I've been adding this in all the loaders of each route, but not sure if there's a cleaner/ more robust way?

const { activeCustomer } = await getActiveCustomerDetails({ request });
  if (!activeCustomer) {
    return redirect('/sign-in');
  }

[oidt]

I am not really an export on this topic, but how i tried this:

root.tsx in the loader function: const url = new URL(request.url); if(url.pathname !== '/sign-in') { return redirect('/sign-in'); }

in the App() function if(!loaderData?.activeCustomer?.activeCustomer) { return (); //no header or footer } else { return (); //show all }

[parkashay]

You can just check for activeCustomer in the root loader and redirect to /sign-in if it doesn't exist.

[xdabuss]

That makes sense and seems to do the trick, thanks!