Alert user if they have unsaved changes

[gerrycampion]

Howto: https://javascript.plainenglish.io/how-to-alert-a-user-before-leaving-a-page-in-react-a2858104ca94

AC

• If a rule is dirty (does not match the rule saved in the database) and the user tries to navigate away from the page, they should receive a notification that their progress has not been saved.
• Rule Editor should notify the user when they try to select a new rule if the current rule has been edited without being saved or discarded.

[gerrycampion]

Problem The rue editor does not select any other rule if an opened rule is not according to schema . Clicking multiple times or idle waiting also does not work.

Steps To Reproduce

open rule editor select any rule in edit pane change to rule so it is not according to schema. Now try selecting any other rule from the left rules pane Following above steps you should be able to note that, selecting a new rule does not work anymore.

Recommendations Rule Editor should notify the user when they try to select a new rule if the current rule has been edited without being saved or discarded.