Skip to content

AuthOutlet

Import

import NextAuth from '@auth-kit/next/NextAuth'

Function Signature

NextAuth({fallbackPath: string}): React.ReactNode

NextAuth provides an easy solution to implement private route solutions using the next js route system

Parameters

Name Type Description
fallbackPath string Path to redirect if the user is not authenticated

Example

Wrap the children of the secure layout in the NextAuth to make the page private.

If the user is authenticated, then the route will be visible to the user, else the user will be redirected to the fallback path provided.

layout.jsx
// Implement in the layout.jsx
import NextAuth from '@auth-kit/next/NextAuth';

export default function Layout({
    children,
}: {
    children: React.ReactNode
}) {
    return <NextAuth fallbackPath={'/login'}>{children}</NextAuth>
}
page.jsx
// Implement in the page.jsx
import NextAuth from '@auth-kit/next/NextAuth';

export default function Page() {
    return (
        <NextAuth fallbackPath={'/login'}>
            ...
        </NextAuth>
    );
}

Defined in

packages/next/src/NextAuth.tsx


— 🔑 —

React Auth Kit is MIT License code