ml-opensource / admin-panel-template-reactjs

25 stars 10 forks source link

Feature(improve-unsaved-prompt): improving and updating Form Modal functionality #82

Closed rasmusThirslund closed 3 years ago

rasmusThirslund commented 3 years ago

Improve unsaved prompt

Form.tsx

new component with "custom" andt-form taken from DSF studio cms and slightly modified.

Hook useUnsavedPrompt

is moved fra modal components into FormModal.tsx
the prop "visible" is used a trigger and criteria inside the hook => this solves the issue with the dialogue failing in case of multiple Modals/Forms on a page.
window.unbeforeunload is utilised to prompt the user for confirming leaving a form with unsaved data at Page Refresh, Tab close etc

rasmusThirslund commented 3 years ago

I am considering if the beforeunload event inside useUnsavedPrompt can be refactored to its own hook with visible and form as arguments. That will then need to be imported in FormModal.tsx. ... thoughts?