RBAC
You can add RBAC in NextShield by adding 2 properties:
- RBAC: Object literal where you define the existing roles and the routes, you must add the
accessRoute
on each role. - userRole: String prop, must match with the defined roles in RBAC.
#
Examplecomponents/Shield.tsx
import { useRouter } from 'next/router'import { NextShield, NextShieldProps } from 'next-shield'
export function Shield({ children }: Props) { const router = useRouter()
const shieldConfig: NextShieldProps< ['/private', '/control-panel', '/dashboard'], ['/', '/login'] > = { router, isAuth: true, isLoading: false, LoadingComponent: <p>Loading...</p>, privateRoutes: ['/private', '/control-panel', '/dashboard'], publicRoutes: ['/', '/login'], loginRoute: '/login', RBAC: { ADMIN: { grantedRoutes: ['/dashboard', '/control-panel'], accessRoute: '/dashboard', }, EMPLOYEE: { grantedRoutes: ['/private', '/dashboard'], accessRoute: '/private', }, }, userRole: 'ADMIN' | 'EMPLOYEE', }
return <NextShield {...shieldConfig}>{children}</NextShield>}