migrate transaction tag list page to composition API and typescript

src/lib/tag.ts

@@ -1,4 +1,6 @@
-export function isNoAvailableTag(tags, showHidden) {
+import { TransactionTag } from '@/models/transaction_tag.ts';
+
+export function isNoAvailableTag(tags: TransactionTag[], showHidden: boolean): boolean {
     for (let i = 0; i < tags.length; i++) {
         if (showHidden || !tags[i].hidden) {
             return false;
@@ -8,7 +10,7 @@ export function isNoAvailableTag(tags, showHidden) {
     return true;
 }
 
-export function getAvailableTagCount(tags, showHidden) {
+export function getAvailableTagCount(tags: TransactionTag[], showHidden: boolean): number {
     let count = 0;
 
     for (let i = 0; i < tags.length; i++) {
@@ -20,7 +22,7 @@ export function getAvailableTagCount(tags, showHidden) {
     return count;
 }
 
-export function getFirstShowingId(tags, showHidden) {
+export function getFirstShowingId(tags: TransactionTag[], showHidden: boolean): string | null {
     for (let i = 0; i < tags.length; i++) {
         if (showHidden || !tags[i].hidden) {
             return tags[i].id;
@@ -30,7 +32,7 @@ export function getFirstShowingId(tags, showHidden) {
     return null;
 }
 
-export function getLastShowingId(tags, showHidden) {
+export function getLastShowingId(tags: TransactionTag[], showHidden: boolean): string | null {
     for (let i = tags.length - 1; i >= 0; i--) {
         if (showHidden || !tags[i].hidden) {
             return tags[i].id;

src/lib/ui/mobile.ts

@@ -1,3 +1,4 @@
+import { type Ref, watch } from 'vue';
 import { useI18n as useVueI18n } from 'vue-i18n';
 import { f7, f7ready } from 'framework7-vue';
 import type { Dialog, Picker, Router } from 'framework7/types';
@@ -211,9 +212,26 @@ export function scrollToSelectedItem(parentEl: Framework7Dom, containerSelector:
 export function useI18nUIComponents() {
     const i18nGlobal = useVueI18n();
 
+    function routeBackOnError<T>(f7router: Router.Router, errorRef: Ref<T>): void {
+        const unwatch = watch(errorRef, (newValue) => {
+            if (newValue) {
+                setTimeout(() => {
+                    if (unwatch) {
+                        unwatch();
+                    }
+
+                    f7router.back();
+                }, 200);
+            }
+        }, {
+            immediate: true
+        });
+    }
+
     return {
         showAlert: (message: string, confirmCallback: (dialog: Dialog.Dialog, e: Event) => void) => showAlert(message, confirmCallback, i18nGlobal.t),
         showConfirm: (message: string, confirmCallback: (dialog: Dialog.Dialog, e: Event) => void, cancelCallback: (dialog: Dialog.Dialog, e: Event) => void): void => showConfirm(message, confirmCallback, cancelCallback, i18nGlobal.t),
-        showToast: (message: string, timeout?: number): void => showToast(message, timeout, i18nGlobal.t)
+        showToast: (message: string, timeout?: number): void => showToast(message, timeout, i18nGlobal.t),
+        routeBackOnError
     }
 }