show confirm dialog before opening external link

src/lib/ui/mobile.ts

@@ -319,12 +319,38 @@ export function useI18nUIComponents() {
         });
     }
 
+    function openExternalUrl(url: string): void {
+        const textDirection = getCurrentLanguageTextDirection();
+
+        const cancelButton: Dialog.DialogButton = {
+            text: tt('Cancel')
+        };
+
+        const confirmButton: Dialog.DialogButton = {
+            text: tt('OK'),
+            onClick: () => {
+                window.open(url, '_blank');
+            }
+        };
+
+        f7ready((f7) => {
+            f7.dialog.create({
+                title: tt('global.app.title'),
+                text: tt('Are you sure you want to open this link?'),
+                content: `<div style="word-break: break-all">${url}</div>`,
+                animate: isEnableAnimate(),
+                buttons: textDirection == TextDirection.RTL ? [confirmButton, cancelButton] : [cancelButton, confirmButton]
+            }).open();
+        });
+    }
+
     return {
         showAlert: showAlert,
         showConfirm: showConfirm,
         showPrompt: showPrompt,
         showCancelableLoading: showCancelableLoading,
         showToast: showToast,
+        openExternalUrl,
         routeBackOnError
     }
 }

src/locales/de.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Problem melden",
     "Getting help": "Getting help",
     "License": "Lizenz",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Ein Fehler ist aufgetreten",
     "Parameter Invalid": "Parameter ungültig",
     "Numeric Overflow": "Numerischer Überlauf",

src/locales/en.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Report Issue",
     "Getting help": "Getting help",
     "License": "License",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "An error occurred",
     "Parameter Invalid": "Parameter Invalid",
     "Numeric Overflow": "Numeric Overflow",

src/locales/es.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Informar problema",
     "Getting help": "Getting help",
     "License": "Licencia",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Se produjo un error",
     "Parameter Invalid": "Parámetro no válido",
     "Numeric Overflow": "Desbordamiento numérico",

src/locales/fr.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Signaler un problème",
     "Getting help": "Obtenir de l'aide",
     "License": "Licence",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Une erreur s'est produite",
     "Parameter Invalid": "Paramètre invalide",
     "Numeric Overflow": "Dépassement numérique",

src/locales/it.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Segnala problema",
     "Getting help": "Ottenere aiuto",
     "License": "Licenza",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Si è verificato un errore",
     "Parameter Invalid": "Parametro non valido",
     "Numeric Overflow": "Overflow numerico",

src/locales/ja.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "問題を報告",
     "Getting help": "Getting help",
     "License": "ライセンス",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "エラーが発生しました",
     "Parameter Invalid": "パラメーターが無効です",
     "Numeric Overflow": "数値オーバーフロー",

src/locales/ko.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "문제 보고",
     "Getting help": "도움 받기",
     "License": "라이선스",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "오류가 발생했습니다.",
     "Parameter Invalid": "잘못된 매개변수",
     "Numeric Overflow": "숫자 오버플로우",

src/locales/nl.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Probleem melden",
     "Getting help": "Hulp krijgen",
     "License": "Licentie",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Er is een fout opgetreden",
     "Parameter Invalid": "Ongeldige parameter",
     "Numeric Overflow": "Numerieke overloop",

src/locales/pt_BR.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Relatar problema",
     "Getting help": "Obtendo ajuda",
     "License": "Licença",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Ocorreu um erro",
     "Parameter Invalid": "Parâmetro inválido",
     "Numeric Overflow": "Transbordo numérico",

src/locales/ru.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Сообщить о проблеме",
     "Getting help": "Getting help",
     "License": "Лицензия",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Произошла ошибка",
     "Parameter Invalid": "Неверный параметр",
     "Numeric Overflow": "Числовое переполнение",

src/locales/th.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "รายงานปัญหา",
     "Getting help": "ขอความช่วยเหลือ",
     "License": "สิทธิ์การใช้งาน",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "เกิดข้อผิดพลาด",
     "Parameter Invalid": "พารามิเตอร์ไม่ถูกต้อง",
     "Numeric Overflow": "ตัวเลขล้น",

src/locales/uk.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Повідомити про проблему",
     "Getting help": "Getting help",
     "License": "Ліцензія",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Сталася помилка",
     "Parameter Invalid": "Неправильний параметр",
     "Numeric Overflow": "Числове переповнення",

src/locales/vi.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "Báo cáo sự cố",
     "Getting help": "Getting help",
     "License": "Giấy phép",
+    "Are you sure you want to open this link?": "Are you sure you want to open this link?",
     "An error occurred": "Đã xảy ra lỗi",
     "Parameter Invalid": "Tham số không hợp lệ",
     "Numeric Overflow": "Tràn số",

src/locales/zh_Hans.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "报告问题",
     "Getting help": "获取帮助",
     "License": "许可协议",
+    "Are you sure you want to open this link?": "您确定要打开该链接？",
     "An error occurred": "发生错误",
     "Parameter Invalid": "参数错误",
     "Numeric Overflow": "数值溢出",

src/locales/zh_Hant.json

@@ -2361,6 +2361,7 @@
     "Report Issue": "回報問題",
     "Getting help": "取得協助",
     "License": "授權條款",
+    "Are you sure you want to open this link?": "您確定要開啟此連結？",
     "An error occurred": "發生錯誤",
     "Parameter Invalid": "參數無效",
     "Numeric Overflow": "數值溢位",

src/views/mobile/AboutPage.vue

@@ -14,23 +14,23 @@
         <f7-list strong inset dividers>
             <f7-list-item :title="tt('Version')" :after="clientVersion" @click="showVersion"></f7-list-item>
             <f7-list-item :title="tt('Build Time')" :after="clientBuildTime" v-if="clientBuildTime"></f7-list-item>
-            <f7-list-item external :title="tt('Official Website')" link="https://github.com/mayswind/ezbookkeeping" target="_blank"></f7-list-item>
+            <f7-list-item :title="tt('Official Website')" link="#" @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping')"></f7-list-item>
-            <f7-list-item external :title="tt('Report Issue')" link="https://github.com/mayswind/ezbookkeeping/issues" target="_blank"></f7-list-item>
+            <f7-list-item :title="tt('Report Issue')" link="#" @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping/issues')"></f7-list-item>
-            <f7-list-item external :title="tt('Getting help')" link="https://ezbookkeeping.mayswind.net" target="_blank"></f7-list-item>
+            <f7-list-item :title="tt('Getting help')" link="#" @click="openExternalUrl('https://ezbookkeeping.mayswind.net')"></f7-list-item>
             <f7-list-item :title="tt('License')" link="#" popup-open=".license-popup"></f7-list-item>
         </f7-list>
 
         <f7-block-title class="margin-top" v-if="exchangeRatesData && !isUserCustomExchangeRates">{{ tt('Exchange Rates Data') }}</f7-block-title>
         <f7-list strong inset dividers v-if="exchangeRatesData && !isUserCustomExchangeRates">
-            <f7-list-item external :title="tt('Provider')" :after="exchangeRatesData.dataSource"
+            <f7-list-item :title="tt('Provider')" :after="exchangeRatesData.dataSource" link="#"
-                          :link="exchangeRatesData.referenceUrl" target="_blank" v-if="exchangeRatesData.referenceUrl"></f7-list-item>
+                          @click="openExternalUrl(exchangeRatesData.referenceUrl)" v-if="exchangeRatesData.referenceUrl"></f7-list-item>
             <f7-list-item :title="tt('Provider')" :after="exchangeRatesData.dataSource" v-if="!exchangeRatesData.referenceUrl"></f7-list-item>
         </f7-list>
 
         <f7-block-title class="margin-top" v-if="mapProviderName">{{ tt('Map') }}</f7-block-title>
         <f7-list strong inset dividers v-if="mapProviderName">
-            <f7-list-item external :title="tt('Provider')" :after="mapProviderName"
+            <f7-list-item :title="tt('Provider')" :after="mapProviderName" link="#"
-                          :link="mapProviderWebsite" target="_blank" v-if="mapProviderWebsite"></f7-list-item>
+                          @click="openExternalUrl(mapProviderWebsite)" v-if="mapProviderWebsite"></f7-list-item>
             <f7-list-item :title="tt('Provider')" :after="mapProviderName" v-if="!mapProviderWebsite"></f7-list-item>
         </f7-list>
 
@@ -82,7 +82,7 @@ import { useI18nUIComponents } from '@/lib/ui/mobile.ts';
 import { useAboutPageBase } from '@/views/base/AboutPageBase.ts';
 
 const { tt } = useI18n();
-const { showAlert } = useI18nUIComponents();
+const { showAlert, openExternalUrl } = useI18nUIComponents();
 const {
     clientVersion,
     clientVersionMatchServerVersion,

src/views/mobile/LoginPage.vue

@@ -37,7 +37,7 @@
             <f7-list-item>
                 <template #title>
                     <small>
-                        <f7-link external :class="{ 'disabled': loggingInByPassword || loggingInByOAuth2 }" :href="getDesktopVersionPath()">{{ tt('Switch to Desktop Version') }}</f7-link>
+                        <f7-link :class="{ 'disabled': loggingInByPassword || loggingInByOAuth2 }" @click="switchToDesktopVersion">{{ tt('Switch to Desktop Version') }}</f7-link>
                     </small>
                 </template>
                 <template #after>
@@ -72,7 +72,7 @@
 
                 <div class="login-page-powered-by margin-top-half">
                     <span>Powered by</span>
-                    <f7-link external href="https://github.com/mayswind/ezbookkeeping" target="_blank">ezBookkeeping</f7-link>
+                    <f7-link @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping')" target="_blank">ezBookkeeping</f7-link>
                     <span>{{ version }}</span>
                 </div>
             </f7-block-footer>
@@ -83,7 +83,7 @@
 
             <div class="login-page-powered-by margin-top-half">
                 <span>Powered by</span>
-                <f7-link external href="https://github.com/mayswind/ezbookkeeping" target="_blank">ezBookkeeping</f7-link>
+                <f7-link @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping')" target="_blank">ezBookkeeping</f7-link>
                 <span>{{ version }}</span>
             </div>
         </f7-toolbar>
@@ -205,7 +205,7 @@ const props = defineProps<{
 }>();
 
 const { tt } = useI18n();
-const { showAlert, showToast } = useI18nUIComponents();
+const { showAlert, showConfirm, showToast, openExternalUrl } = useI18nUIComponents();
 
 const rootStore = useRootStore();
 
@@ -247,6 +247,12 @@ const twoFAVerifyTypeSwitchName = computed<string>(() => {
     }
 });
 
+function switchToDesktopVersion(): void {
+    showConfirm('Are you sure you want to switch to desktop version?', () => {
+        window.location.replace(getDesktopVersionPath());
+    });
+}
+
 function login(): void {
     const router = props.f7router;
 

src/views/mobile/UnlockPage.vue

@@ -32,7 +32,7 @@
 
                 <div class="login-page-powered-by margin-top-half">
                     <span>Powered by</span>
-                    <f7-link external href="https://github.com/mayswind/ezbookkeeping" target="_blank">ezBookkeeping</f7-link>
+                    <f7-link @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping')" target="_blank">ezBookkeeping</f7-link>
                     <span>{{ version }}</span>
                 </div>
             </f7-block-footer>
@@ -43,7 +43,7 @@
 
             <div class="login-page-powered-by margin-top-half">
                 <span>Powered by</span>
-                <f7-link external href="https://github.com/mayswind/ezbookkeeping" target="_blank">ezBookkeeping</f7-link>
+                <f7-link @click="openExternalUrl('https://github.com/mayswind/ezbookkeeping')" target="_blank">ezBookkeeping</f7-link>
                 <span>{{ version }}</span>
             </div>
         </f7-toolbar>
@@ -79,7 +79,7 @@ const props = defineProps<{
 }>();
 
 const { tt } = useI18n();
-const { showToast, showConfirm } = useI18nUIComponents();
+const { showToast, showConfirm, openExternalUrl } = useI18nUIComponents();
 const { version, pinCode, isWebAuthnAvailable, isPinCodeValid, doAfterUnlocked, doRelogin } = useUnlockPageBase();
 
 const settingsStore = useSettingsStore();

src/views/mobile/exchangerates/ListPage.vue

@@ -91,7 +91,7 @@
             <f7-list-item>
                 <small>{{ tt('Data source') }}</small>
                 <small>
-                    <f7-link external target="_blank" :href="exchangeRatesData.referenceUrl" v-if="!isUserCustomExchangeRates && exchangeRatesData.referenceUrl">{{ exchangeRatesData.dataSource }}</f7-link>
+                    <f7-link @click="openExternalUrl(exchangeRatesData.referenceUrl)" v-if="!isUserCustomExchangeRates && exchangeRatesData.referenceUrl">{{ exchangeRatesData.dataSource }}</f7-link>
                     <span v-else-if="!isUserCustomExchangeRates && !exchangeRatesData.referenceUrl">{{ exchangeRatesData.dataSource }}</span>
                     <span v-else-if="isUserCustomExchangeRates">{{ tt('User Custom') }}</span>
                 </small>
@@ -159,7 +159,7 @@ const {
     formatExchangeRateAmountToWesternArabicNumerals
 } = useI18n();
 
-const { showAlert, showToast } = useI18nUIComponents();
+const { showAlert, showToast, openExternalUrl } = useI18nUIComponents();
 
 const {
     baseCurrency,