feat: add ability to disable "There are unsaved changes" popup for the resource

https://web.tracklify.com/project/2b7ZVgE5/AdminForth/1280/cFz46RGr/is-it-possible-to-remove-this-

Author: yaroslav8765

adminforth/documentation/docs/tutorial/03-Customization/07-alert.md

@@ -169,4 +169,21 @@ You can notify users of important information by displaying an announcement badg
 ```
 
 Here's what the announcement will look like:
-![alt text](image-11.png)
+![alt text](image-11.png)
+
+## Disable "There are unsaved changed" popup for resource
+
+By default, when you want to leave create/edit pages with usaved changes, there will be shown an confirmation popup. If you don't like this behaviour, you can disable it for resource:
+
+```ts title='./resources/cusom_resource.ts'
+    ...
+
+    options: {
+      listPageSize: 12,
+      //diff-add
+      dontShowWarningAboutUnsavedChanges: true,
+        ...
+    }
+    ...
+
+```

adminforth/spa/src/utils/utils.ts

@@ -630,12 +630,16 @@ export class leaveGuardActiveClass {
   }
 }
 
-export async function onBeforeRouteLeaveCreateEditViewGuard(initialValues: any, record: any, checkIfWeCanLeavePage: () => boolean, leaveGuardActive: leaveGuardActiveClass): Promise<boolean> {
+export async function onBeforeRouteLeaveCreateEditViewGuard(initialValues: any, record: any, checkIfWeCanLeavePage: () => boolean, leaveGuardActive: leaveGuardActiveClass, isActive: { value: boolean }): Promise<void> {
 
   const { confirm } = useAdminforth();
   const { t } = useI18n();
 
   onBeforeRouteLeave(async (to, from) => {
+    if (!isActive.value) {
+      return true;
+    }
+
 
     if (leaveGuardActive.isActive()) {
       return false;

adminforth/spa/src/views/CreateView.vue

@@ -115,6 +115,7 @@ const readonlyColumns = ref([]);
 
 const cancelButtonClicked = ref(false);
 const wasSaveSuccessful = ref(false);
+const useLeaveGuard = ref( false );
 
 async function onUpdateRecord(newRecord: any) {
   record.value = newRecord;
@@ -125,6 +126,9 @@ function checkIfWeCanLeavePage() {
 }
 
 function onBeforeUnload(event: BeforeUnloadEvent) {
+  if (!useLeaveGuard.value) {
+    return;
+  }
   if (!checkIfWeCanLeavePage()) {
     event.preventDefault();
     event.returnValue = '';
@@ -140,15 +144,17 @@ onBeforeUnmount(() => {
 
 const leaveGuardActive = new leaveGuardActiveClass();
 
+onBeforeRouteLeaveCreateEditViewGuard(initialValues, record, checkIfWeCanLeavePage, leaveGuardActive, useLeaveGuard);
 
-onBeforeRouteLeaveCreateEditViewGuard(initialValues, record, checkIfWeCanLeavePage, leaveGuardActive);
 
 
 onBeforeMount(() => {
   clearSaveInterceptors(route.params.resourceId as string);
 });
 
 onMounted(async () => {
+  useLeaveGuard.value = coreStore.resource?.options?.dontShowWarningAboutUnsavedChanges !== true;
+
   loading.value = true;
   await coreStore.fetchResourceFull({
     resourceId: route.params.resourceId as string,

adminforth/spa/src/views/EditView.vue

@@ -104,8 +104,12 @@ const record: Ref<Record<string, any>> = ref({});
 const initialRecord = computed(() => coreStore.record);
 const wasSaveSuccessful = ref(false);
 const cancelButtonClicked = ref(false);
-
+const useLeaveGuard = ref( false );
+  
 function onBeforeUnload(event: BeforeUnloadEvent) {
+  if (!useLeaveGuard.value) {
+    return;
+  }
   if (!checkIfWeCanLeavePage()) {
     event.preventDefault();
     event.returnValue = '';
@@ -123,7 +127,7 @@ onBeforeUnmount(() => {
 });
 
 const leaveGuardActive = new leaveGuardActiveClass();
-onBeforeRouteLeaveCreateEditViewGuard(initialRecord, record, checkIfWeCanLeavePage, leaveGuardActive);
+onBeforeRouteLeaveCreateEditViewGuard(initialRecord, record, checkIfWeCanLeavePage, leaveGuardActive, useLeaveGuard);
 
 const resourceFormRef = ref<InstanceType<typeof ResourceForm> | null>(null);
 
@@ -153,6 +157,7 @@ onBeforeMount(() => {
 });
 
 onMounted(async () => {
+  useLeaveGuard.value = coreStore.resource?.options?.dontShowWarningAboutUnsavedChanges !== true;
   loading.value = true;
 
   await coreStore.fetchResourceFull({

adminforth/types/Common.ts

@@ -361,6 +361,12 @@ export interface AdminForthResourceInputCommon {
     recordLabel?: (item: any) => string,
 
 
+    /**
+     * If true, user will not see warning about unsaved changes when tries to leave edit or create page with unsaved changes.
+     * default is false
+     */
+    dontShowWarningAboutUnsavedChanges?: boolean,
+
     /**
      * General options for resource.
      */