Error Handling¶

The handling of errors in the Module Federation is designed to ensure that global errors are captured and managed gracefully, allowing the application to continue functioning or providing users with appropriate feedback. This documentation outlines the process and mechanisms used to handle errors, including the information captured, how errors are displayed, and the fallback behavior.

Global Error Interception¶

All globally occurring errors are intercepted and trigger an error dialog. This ensures that the user is informed of the issue and can take appropriate action. The error dialog provides the following details:

1. UserID: The ID of the user experiencing the error
2. BCON-ID: The user's ID in BCON
3. ModuleID: The identifier of the module where the error occurred (if available)
4. ActiveOrg-ID: The active organization ID
5. Code: A code representing the type of error (e.g., an HTTP error code)
6. Error Message: A message either derived from the error code or provided by the module/trigger of the error

Error Dialog¶

The error dialog is designed to inform the user of the error (and all related information) and provides options for proceeding:

• Closable Dialog: Users can close the error dialog. For HTTP errors, the application can generally continue functioning normally after the dialog is closed.
• Fallback Behavior: In the case of unexpected application errors, the error handling mechanism redirects the user back to the dashboard as a fallback.

The error details are hidden by default but can be expanded by the user:

Manually Trigger an Error¶

Errors can be manually triggered using the throwError method, which is part of the Base-Properties that will be passed to a module. When this method is called, the error information is automatically determined (excluding the error code and message) and passed to the error dialog.

If you use the Base-Template, you can just import it via the BasePropsStore and call it with a message and code:

export const Component = () => {
  const throwError = useBasePropsStore(state => state.throwError);

  return (
    <Button onClick={() => throwError('Custom error message', 123)}>Raise an error</Button>
  );
};

All error-related information is automatically gathered and passed to the error dialog by the HV Platform, ensuring a consistent and comprehensive error reporting mechanism.

Detailed Workflow / Platform Integration¶

1. Error Interception: Global errors are intercepted by a centralized error handling mechanism.
2. Error Information Collection: Relevant error information (UserID, BCON-ID, ModuleID, ActiveOrg-ID, ErrorCode, ErrorMessage) is collected.
3. Error Dialog Display: The error dialog is displayed to the user with the collected information.
4. Error Tracing: The error information is traced/tracked via Application Insights per best effort. You can also track/trace your own events¹ if required.
5. User Action: The user can close the dialog and, for HTTP errors, continue using the application normally. For unexpected application errors, the user is redirected to the dashboard.
6. Manual Error Trigger: Developers can manually trigger an error using throwError, which will then follow the same error handling process.