From 1f76846706554de88c6782029a0c42967b59ef2f Mon Sep 17 00:00:00 2001
From: Pascal Barth <pak.barth@gmail.com>
Date: Mon, 20 Jan 2025 15:40:50 +0100
Subject: [PATCH] PB-1355 : don't show drawing lost warning when we open
 download PDFs

using window.open to trigger a download (of the print results) was triggering the beforeUnload event in MapView.vue's code, and showing the "you'll lose your drawing" warning, while we stay on the page in the end.

Also fixing some usage of the old $t to the new Composition API equivalent
---
 .../drawing/components/DrawingToolbox.vue        | 14 ++++++++------
 .../menu/components/print/MenuPrintSection.vue   |  4 ++++
 src/store/modules/ui.store.js                    | 16 ++++++++++++++++
 src/views/MapView.vue                            |  8 ++++++--
 4 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/src/modules/drawing/components/DrawingToolbox.vue b/src/modules/drawing/components/DrawingToolbox.vue
index 57a44966a5..05a1fac164 100644
--- a/src/modules/drawing/components/DrawingToolbox.vue
+++ b/src/modules/drawing/components/DrawingToolbox.vue
@@ -241,7 +241,7 @@ const debounceSaveDrawingName = debounce(async (newName) => {
                                 data-cy="drawing-toolbox-delete-button"
                                 @click="showClearConfirmationModal = true"
                             >
-                                {{ $t('delete') }}
+                                {{ i18n.t('delete') }}
                             </button>
                         </div>
                         <div class="col d-grid">
@@ -255,7 +255,7 @@ const debounceSaveDrawingName = debounce(async (newName) => {
                                 data-cy="drawing-toolbox-share-button"
                                 @click="showShareModal = true"
                             >
-                                {{ $t('share') }}
+                                {{ i18n.t('share') }}
                             </button>
                         </div>
                     </div>
@@ -292,7 +292,9 @@ const debounceSaveDrawingName = debounce(async (newName) => {
                     @click="drawMenuOpen = !drawMenuOpen"
                 >
                     <FontAwesomeIcon :icon="drawMenuOpen ? 'caret-up' : 'caret-down'" />
-                    <span class="ms-2">{{ $t(drawMenuOpen ? 'close_menu' : 'open_menu') }}</span>
+                    <span class="ms-2">{{
+                        i18n.t(drawMenuOpen ? 'close_menu' : 'open_menu')
+                    }}</span>
                 </button>
             </div>
         </div>
@@ -302,12 +304,12 @@ const debounceSaveDrawingName = debounce(async (newName) => {
             fluid
             @close="onCloseClearConfirmation"
         >
-            {{ $t('confirm_remove_all_features') }}
+            {{ i18n.t('confirm_remove_all_features') }}
         </ModalWithBackdrop>
         <ModalWithBackdrop
             v-if="showShareModal"
             fluid
-            :title="$t('share')"
+            :title="i18n.t('share')"
             @close="showShareModal = false"
         >
             <SharePopup :kml-layer="activeKmlLayer" />
@@ -315,7 +317,7 @@ const debounceSaveDrawingName = debounce(async (newName) => {
         <ModalWithBackdrop
             v-if="showNotSharedDrawingWarningModal"
             fluid
-            :title="$t('warning')"
+            :title="i18n.t('warning')"
             @close="onCloseWarningModal()"
         >
             <ShareWarningPopup :kml-layer="activeKmlLayer" @accept="onAcceptWarningModal()" />
diff --git a/src/modules/menu/components/print/MenuPrintSection.vue b/src/modules/menu/components/print/MenuPrintSection.vue
index 27e2604878..a7a7c9d9db 100644
--- a/src/modules/menu/components/print/MenuPrintSection.vue
+++ b/src/modules/menu/components/print/MenuPrintSection.vue
@@ -100,6 +100,8 @@ function close() {
 async function printMap() {
     try {
         const documentUrl = await print(printGrid.value, printLegend.value)
+        // force hides the "drawing lost" warning when we open the print result
+        await store.dispatch('setIsOpeningNewTab', { isOpeningNewTab: true, ...dispatcher })
         if (documentUrl) {
             if (window.navigator.userAgent.indexOf('MSIE ') > -1) {
                 window.open(documentUrl)
@@ -115,6 +117,8 @@ async function printMap() {
         }
     } catch (error) {
         log.error('Print failed', error)
+    } finally {
+        await store.dispatch('setIsOpeningNewTab', { isOpeningNewTab: false, ...dispatcher })
     }
 }
 
diff --git a/src/store/modules/ui.store.js b/src/store/modules/ui.store.js
index 17b936e0c2..33adace5e8 100644
--- a/src/store/modules/ui.store.js
+++ b/src/store/modules/ui.store.js
@@ -175,6 +175,17 @@ export default {
          * @type Boolean
          */
         showDragAndDropOverlay: false,
+
+        /**
+         * Flag set to true when the app is opening a new tab.
+         *
+         * This helps us decide to show or not show a warning popup for lost changes if the user
+         * closes the tab. In some cases, we are opening a new tab ourselves (print result) and
+         * don't want this popup to show up.
+         *
+         * @type Boolean
+         */
+        isOpeningNewTab: false,
     },
     getters: {
         showLoadingBar(state) {
@@ -451,6 +462,9 @@ export default {
         setShowDragAndDropOverlay({ commit }, { showDragAndDropOverlay, dispatcher }) {
             commit('setShowDragAndDropOverlay', { showDragAndDropOverlay, dispatcher })
         },
+        setIsOpeningNewTab({ commit }, { isOpeningNewTab, dispatcher }) {
+            commit('setIsOpeningNewTab', { isOpeningNewTab, dispatcher })
+        },
     },
     mutations: {
         setSize(state, { height, width }) {
@@ -520,5 +534,7 @@ export default {
         removeWarning: (state, { warning }) => state.warnings.delete(warning),
         setShowDragAndDropOverlay: (state, { showDragAndDropOverlay }) =>
             (state.showDragAndDropOverlay = showDragAndDropOverlay),
+        setIsOpeningNewTab: (state, { isOpeningNewTab }) =>
+            (state.isOpeningNewTab = isOpeningNewTab),
     },
 }
diff --git a/src/views/MapView.vue b/src/views/MapView.vue
index e21ffffd6f..dcb78c1910 100644
--- a/src/views/MapView.vue
+++ b/src/views/MapView.vue
@@ -1,5 +1,6 @@
 <script setup>
 import { computed, defineAsyncComponent, onMounted, onUnmounted, ref } from 'vue'
+import { useI18n } from 'vue-i18n'
 import { useStore } from 'vuex'
 
 import { IS_TESTING_WITH_CYPRESS } from '@/config/staging.config'
@@ -27,6 +28,8 @@ import log from '@/utils/logging'
 const DrawingModule = defineAsyncComponent(() => import('@/modules/drawing/DrawingModule.vue'))
 
 const store = useStore()
+const i18n = useI18n()
+
 const showNotSharedDrawingWarningModal = ref(false)
 const is3DActive = computed(() => store.state.cesium.active)
 const isDrawingMode = computed(() => store.state.drawing.drawingOverlay.show)
@@ -34,6 +37,7 @@ const activeKmlLayer = computed(() => store.getters.activeKmlLayer)
 const isPhoneMode = computed(() => store.state.ui.mode === UIModes.PHONE)
 const showLoadingBar = computed(() => store.getters.showLoadingBar)
 const showDragAndDropOverlay = computed(() => store.state.ui.showDragAndDropOverlay)
+const isOpeningNewTab = computed(() => store.state.ui.isOpeningNewTab)
 const showNotSharedDrawingWarning = computed(() => store.getters.showNotSharedDrawingWarning)
 const loadDrawingModule = computed(() => {
     return (
@@ -49,7 +53,7 @@ onMounted(() => {
 })
 
 const beforeUnloadHandler = (event) => {
-    if (showNotSharedDrawingWarning.value) {
+    if (showNotSharedDrawingWarning.value && !isOpeningNewTab.value) {
         showNotSharedDrawingWarningModal.value = true
         // This provokes the alert message to appear when trying to close the tab.
         // During Cypress tests this causes the test to run indefinitely, so to prevent this we skip the alert.
@@ -71,7 +75,7 @@ onUnmounted(() => {
         <ModalWithBackdrop
             v-if="showNotSharedDrawingWarningModal"
             fluid
-            :title="$t('warning')"
+            :title="i18n.t('warning')"
             @close="showNotSharedDrawingWarningModal = false"
         >
             <ShareWarningPopup