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 unauthorized access
A basic not authorized component displays a title, body text, and custom actions.
Unauthorized access 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 bodyText of appropriate context for the error, and the actions that a user can take instead.
Props
UnauthorizedAccess
| Name | Type | Default | Description |
|---|---|---|---|
| bodyText | React.ReactNode | 'Contact your system administrator(s) for more information.' | Custom body text |
| className | string | Custom className | |
| icon | React.ComponentType | LockIcon | Icon displayed above the title |
| ouiaId | string | number | 'UnauthorizedAccess' | 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 |
| titleText | React.ReactNode | `You do not have access to ${serviceName}` | Custom title text |
| toLandingPageText | React.ReactNode | 'Go to landing page' | Custom landing page button text |
| toLandingPageUrl | string | "." | Custom landing page button URL |
