Add custom code on page close

In HERE Core UI Components v19.1 or later, you can call your own code when your users close a page or the entire Browser window. By default users see a confirmation modal for the page, but you can override this behavior to support your workflows or use cases.

How it works

The shouldPageClose and handlePagesAndWindowClose methods are available for the WorkspacePlatformProvider interface. You can override these methods to provide your own logic when users try to close a Page.

See the API reference for shouldPageClose and handlePagesAndWindowClose.

How to do it

This feature supports a range of use cases. The following example displays a modal window when users close a single page:

public async shouldPageClose(payload: {
  pageId: string;
  identity: WindowIdentity;
  closeType: 'page' | 'window' | 'view';
}) 
{
  const pageHasUnsavedChanges = hasUnsavedChanges(payload.pageId);
  if (pageHasUnsavedChanges) 
  {
    if (payload.closeType === 'page') 
    // or pass any other functionality or message you require
    {
      alert('This page has unsaved changes. You must save your changes before closing.');
    }
    return {shouldPageClose: false};
  }
  return super.shouldPageClose(payload);
}

For the case where users close the entire window:

public async handlePagesAndWindowClose(payload: {
  pagesPreventingClose: string[];
  pagesNotPreventingClose: string[];
  identity: OpenFin.Identity;
}): Promise<{ windowShouldClose: boolean }> 
{
  if (payload.pagesPreventingClose.length > 0) 
  // or pass any other functionality or message you require
  {
    const pageTitles = getPageTitles(payload.pagesPreventingClose);
    alert('Window cannot be closed. Save changes in the following pages and try again: ' + pageTitles);
    return {windowShouldClose: false};
  }
  return super.handlePagesAndWindowClose(payload);
}