Function RedirectToSignIn

RedirectToSignIn(props: RedirectToSignInProps): null

A client side component that will redirect users to the sign in page.

Note⚠️: Since window.location is set as returnUrl query param by default, you need to set the env MONOCLOUD_AUTH_ALLOW_QUERY_PARAM_OVERRIDES=true or allowQueryParamOverrides should be true in the client initialization for returning to the same page.

Parameters

props: RedirectToSignInProps
The props for customizing RedirectToSignIn

Returns null

Example: App Router

"use client";

import { useAuth } from "@monocloud/auth-nextjs/client";
import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";

export default function Home() {
  const { isLoading, isAuthenticated } = useAuth();

  if (!isLoading && !isAuthenticated) {
    return <RedirectToSignIn />;
  }

  return <>You are signed in</>;
}

Example: App Router with options

You can customize the authorization request by passing in props. See RedirectToSignInProps.

"use client";

import { useAuth } from "@monocloud/auth-nextjs/client";
import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";

export default function Home() {
  const { isLoading, isAuthenticated } = useAuth();

  if (!isLoading && !isAuthenticated) {
    return <RedirectToSignIn returnUrl="/dashboard" loginHint="username" />;
  }

  return <>You are signed in</>;
}

Example: Pages Router

import { useAuth } from "@monocloud/auth-nextjs/client";
import { RedirectToSignIn } from "@monocloud/auth-nextjs/components/client";

export default function Home() {
  const { isLoading, isAuthenticated } = useAuth();

  if (!isLoading && !isAuthenticated) {
    return <RedirectToSignIn />;
  }

  return <>You are signed in</>;
}

Example: Pages Router with options