[Feature] Track navigating away from the the APD outside of the app

[thetif]

Description and related issues

Implement way to catch the following cases:

• user closing the APD tab
• user closing their browser
• user clicking a link that opens in the same tab
• user entering another url in the same tab

It looks like there is a window listener for this. But we need it across the application, maybe this could go in the Root component. Before the tab unloads the application call a closing APD action. This action should only be called if they are in a locked APD when they leave the application.

Example

useEffect(() => {
    window.addEventListener('beforeunload', alertUser)
    window.addEventListener('unload', handleTabClosing)
    return () => {
        window.removeEventListener('beforeunload', alertUser)
        window.removeEventListener('unload', handleTabClosing)
    }
})

const handleTabClosing = () => {
    removePlayerFromGame()
}

const alertUser = (event:any) => {
    event.preventDefault()
    event.returnValue = ''
}

Acceptance criteria

• [ ] before leaving the application, call the closing APD action

Testing criteria

Given	When	Then	Covered
user is inside a locked APD	a user closes the tab	the browser prevents the action long enough to call the close APD action
user is inside a locked APD	a user closes the browser	the browser prevents the action long enough to call the close APD action
user is inside a locked APD	a user clicks a link that goes navigates to another site in the same tab	the browser prevents the action long enough to call the close APD action
user is inside a locked APD	a user changes the url to another site in the same tab	the browser prevents the action long enough to call the close APD action
user is outside of a locked APD	user closes the tab	tab closes normally
user is outside of a locked APD	user closes the browser	browser closes normally
user is outside of a locked APD	a user clicks a link that goes navigates to another site in the same tab	the browser navigates normall
user is outside of a locked APD	a user changes the url to another site in the same tab	the browser navigates normally

[stephanieboydcms]

Good to go!

[jeromeleecms]

Just a few clarification in the acceptance criteria