Enhancement to the Alert modal indicating the resources with unsaved data

[elsylambert]

A modal should inform the user of what resources have unsaved changes: The dialog should read:

Some resources have unsaved changes that will be lost if you continue: TranslationAcademy TranslationWords

This is separated from #255

DoD:

When a user attempts to navigate away from a book or the page, the user should be informed as to what resources have been changed without saving.

Additional Context

User Workflow

1. Viewing Cards: User opens the main page and sees multiple resource cards.

2. Editing: User edits one or more cards and makes changes to the text.

3. Navigating Away: User tries to navigate away from the page or close the app.

4. Detecting Changes: System detects that some resource cards have unsaved changes.

5. Warning Dialog: A dialog appears, warning the user about the unsaved changes. This dialog lists the names of the resources corresponding to the changed cards.

6. Decision Point:

   • *Cancel: User clicks the 'Cancel' button. This allows to save the resources that were changed.
   • OK: User clicks an 'OK' button. The dialog closes, and no changes are saved. The user navigates away, understanding the risk of losing changes.

[birchamp]

@kintsoogi does this have any overlap with what the merge dialog does when it informs users of unmerged resources?

[birchamp]

@PhotoNomad0 says that you "add in the handler and change the prompt that gets shown" on the beforeunload event handler.