Skip to main content

Error Page

Overview

Understand the significance of managing error messages within the Passport JS SUI SDK, as it can greatly affect user experience and application reliability. Developers benefit from clear and actionable error handling to create a more robust and seamless interface.

Displaying Error page programmatically

To display the Error page programmatically in Credenza, you can use the passport.openUI function. This function allows you to navigate to different pages within the application using code.

To open the Error page, use the following code snippet:

typescript
passport.openUI(Passport.pages.ERROR, { description: "description", title: "title" } );

The passport.openUI function takes a parameter specifying the page to navigate to. In this case, Passport.pages.ERROR is used to specify the Error page.

Error Component Props

The Error Component in the Passport JS SUI SDK is designed to handle and display error messages efficiently. Below is an overview of the props that can be used to customize this component.

errorMessage

The errorMessage prop allows you to specify the message that will be displayed when an error occurs. This message should be clear and provide guidance to the user on what went wrong or what they can do next.

image

The image prop is used to display an image that corresponds with the error. This can help make the error page more visually engaging. Provide a URL to the image you want to display.

description

The description prop offers additional details about the error. Use this to provide a more thorough explanation or steps to resolve the issue.

title

The title prop sets the title for the error page. This should be a brief and direct statement indicating that an error has occurred.

shouldRenderBackButton

The shouldRenderBackButton prop is a boolean that determines whether a back button should be rendered on the error page. This can help users navigate back to a previous page or section of the app.

  • true: Render a back button

  • false: Do not render a back button