A not authorized component displays an error screen to users when they attempt to view a page that they don't have permission to access.
Examples
Basic not authorized
A basic not authorized component displays a title, a description, and custom actions.
Not authorized with custom actions
You can customize the not authorized component to fit your use case by specifying the serviceName to appear in the title, a description of appropriate context for the error, and the actions that a user can take instead.
Props
NotAuthorized
| Name | Type | Default | Description |
|---|---|---|---|
| className | string | Custom className | |
| description | React.ReactNode | 'Contact your system administrator(s) for more information.' | Custom description |
| icon | React.ComponentType | LockIcon | Icon displayed above the title |
| ouiaId | string | number | 'NotAuthorized' | Custom OUIA ID |
| prevPageButtonText | React.ReactNode | 'Return to previous page' | Custom previous page button text |
| primaryAction | React.ReactNode | null | Custom primary action - there should only be one defined |
| secondaryActions | React.ReactNode | null | Custom secondary actions |
| serviceName | string | Service name displayed in the title | |
| showReturnButton | boolean | true | Shows link to the previous page |
| title | React.ReactNode | `You do not have access to ${serviceName}` | Custom title |
| toLandingPageText | React.ReactNode | 'Go to landing page' | Custom landing page button text |
| toLandingPageUrl | string | "." | Custom landing page button URL |
View source on GitHub
