useAuthRequired

useAuthRequired(auth)

import { useAuthRequired } from "@mvd/auth/react";

Use useAuthRequired inside components that should only render after sign-in has already been confirmed.

It returns the authenticated auth data directly, including token and tokenData.

Best for

• account panels
• protected dashboards
• small UI sections that only make sense for signed-in users
• components that rely on typed token claims

Example

function LoginGate() {
  const snapshot = useAuth(auth);

  if (snapshot.status !== "authenticated") {
    return <p>Not logged in</p>;
  }

  return <Dashboard />;
}

function Dashboard() {
  const { tokenData } = useAuthRequired(auth);

  return <p>Welcome, {tokenData.name}</p>;
}

Choose the right hook

• Use useAuth when the component needs to handle loading, signed-out, and signed-in states.
• Use useAuthRequired when the component only makes sense after the user is already signed in.

If you call this hook too early, it throws to tell you the screen still needs a guard.