Events

You can use a custom window event that the federated component sends to communicate the status of a specific process. This event helps the host application understand the result of operations handled by the component. You can use the event to trigger UI changes, update logs, or perform other actions based on the process status.

mistStatus

Event details

• process (String): specifies the process that triggered the event. The value can be one of the following:
  • checkout
  • refund
  • deviceregistration
  • cashmanagement
• status (String): indicates the outcome of the process. The value can be one of the following:
  • success: the process completed successfully.
  • cancelled: the process was cancelled by the user or system.
  • error: an error occurred during the process.
  • activated: the process was successfully activated.
• message (String): a description of the error, only present when the status is error. This property provides additional context about the failure. Use try...catch blocks, where necessary, to handle potential errors when processing event details.

Example usage

window.addEventListener('mistStatus', (event) => {
  const { process, status, message } = event.detail;

  switch (status) {
    case 'success':
      console.log(`Process ${process} completed successfully.`);
      break;
    case 'cancelled':
      console.log(`Process ${process} was cancelled.`);
      break;
    case 'error':
      console.error(`Process ${process} failed: ${message}`);
      break;
    case 'activated':
      console.log(`Process ${process} was activated.`);
      break;
    default:
      console.log(`Unknown status: ${status}`);
  }
});