@ozdao/martyrs 0.2.604 → 0.2.605

package/src/modules/notifications/notifications.client.js

@@ -5,7 +5,8 @@ console.log('[LOADING 37] Notifications module import started...');
 import { toRefs, watch } from 'vue';
 // Router import
 import addRoutes from '@martyrs/src/modules/core/views/router/addRoutes.js';
-import { getRoutes } from './router/notifications.router.js';
+import notificationsRoutes from './router/notifications.router.js';
+import notificationsBackofficeRoutes from './router/notifications.backoffice.router.js';
 // Store
 import * as storeNotifications from './store/notifications.store.js';
 // Global WebSocket import
@@ -208,7 +209,7 @@ class CapacitorPushHandler {
    * Remove push notification listeners
    */
   removeListeners() {
-    if (typeof window === 'undefined') {
+    if (typeof window === 'undefined' || !this.isInitialized) {
       return;
     }
 
@@ -229,6 +230,108 @@ class NotificationManager {
     this.pushHandler = new CapacitorPushHandler(store);
     this.initialized = false;
     this.isServer = typeof window === 'undefined';
+    this._visibilityHandler = null;
+    this._pageshowHandler = null;
+    this._onlineHandler = null;
+  }
+
+  /**
+   * Re-check push subscription on foreground return (iOS kills SW and may wipe subscriptions)
+   */
+  async recheckPushSubscription() {
+    if (this.isServer || !('serviceWorker' in navigator) || !('PushManager' in window)) return;
+
+    try {
+      const registration = await navigator.serviceWorker.getRegistration();
+      if (!registration) {
+        console.warn('[WebPush] No SW registration on foreground return, re-registering...');
+        await navigator.serviceWorker.register('/sw.js');
+        return;
+      }
+
+      // Force SW update check
+      registration.update();
+
+      const subscription = await registration.pushManager.getSubscription();
+      if (!subscription) {
+        // iOS wiped subscription — resubscribe
+        console.log('[WebPush] Subscription lost, resubscribing...');
+        await this.registerWebPush(this.store);
+        return;
+      }
+
+      // Check if endpoint rotated (Apple may change it)
+      const savedEndpoint = localStorage.getItem('push_endpoint');
+      if (savedEndpoint && subscription.endpoint !== savedEndpoint) {
+        console.log('[WebPush] Endpoint rotated, syncing with server...');
+        await this.registerWebPush(this.store);
+      }
+    } catch (err) {
+      console.error('[WebPush] recheckPushSubscription error:', err);
+    }
+  }
+
+  /**
+   * Setup visibilitychange/pageshow/online handlers for iOS PWA foreground recovery
+   */
+  setupForegroundHandlers() {
+    if (this.isServer) return;
+
+    this._visibilityHandler = () => {
+      if (document.visibilityState === 'visible') {
+        console.log('[Notifications] App became visible, rechecking...');
+        // Reconnect WebSocket if needed
+        const userId = this.store.core.state.session.userId;
+        if (userId && wsManager.ws?.readyState !== WebSocket.OPEN) {
+          wsManager.connect(userId).catch(err => console.error('[Notifications] WS reconnect error:', err));
+        }
+        // Revalidate push subscription
+        this.recheckPushSubscription();
+      }
+    };
+
+    this._pageshowHandler = (event) => {
+      if (event.persisted) {
+        // Page restored from bfcache — connections are dead
+        console.log('[Notifications] Page restored from bfcache, reconnecting...');
+        const userId = this.store.core.state.session.userId;
+        if (userId) {
+          wsManager.connect(userId).catch(err => console.error('[Notifications] WS reconnect error:', err));
+        }
+        this.recheckPushSubscription();
+      }
+    };
+
+    this._onlineHandler = () => {
+      console.log('[Notifications] Network online, reconnecting...');
+      const userId = this.store.core.state.session.userId;
+      if (userId && wsManager.ws?.readyState !== WebSocket.OPEN) {
+        wsManager.connect(userId).catch(err => console.error('[Notifications] WS reconnect error:', err));
+      }
+      this.recheckPushSubscription();
+    };
+
+    document.addEventListener('visibilitychange', this._visibilityHandler);
+    window.addEventListener('pageshow', this._pageshowHandler);
+    window.addEventListener('online', this._onlineHandler);
+  }
+
+  /**
+   * Remove foreground handlers
+   */
+  teardownForegroundHandlers() {
+    if (this._visibilityHandler) {
+      document.removeEventListener('visibilitychange', this._visibilityHandler);
+      this._visibilityHandler = null;
+    }
+    if (this._pageshowHandler) {
+      window.removeEventListener('pageshow', this._pageshowHandler);
+      this._pageshowHandler = null;
+    }
+    if (this._onlineHandler) {
+      window.removeEventListener('online', this._onlineHandler);
+      this._onlineHandler = null;
+    }
   }
 
   async registerWebPush(store) {
@@ -237,20 +340,25 @@ class NotificationManager {
       return;
     }
 
-    // Skip permission request if already granted (component handles the prompt)
-    if ('Notification' in window && Notification.permission !== 'granted') {
-      const permission = await Notification.requestPermission();
-      if (permission !== 'granted') {
-        console.warn('[WebPush] Permission not granted:', permission);
-        return;
-      }
-    }
+    // НЕ проверяем Notification.permission — на iOS он врёт ("denied" когда реально granted)
+    // pushManager.subscribe() сам выкинет NotAllowedError если реально нет разрешения
 
     console.log('[WebPush] Subscribing to push manager...');
-    const registration = await navigator.serviceWorker.ready;
+    // Use getRegistration() instead of .ready — .ready hangs on iOS PWA
+    let registration = await navigator.serviceWorker.getRegistration();
+    if (!registration) {
+      console.log('[WebPush] No SW registration, registering /sw.js...');
+      registration = await navigator.serviceWorker.register('/sw.js');
+      // Wait for SW to be active
+      await new Promise(resolve => {
+        if (registration.active) return resolve();
+        const sw = registration.installing || registration.waiting;
+        if (sw) sw.addEventListener('statechange', () => { if (sw.state === 'activated') resolve(); });
+      });
+    }
     const subscription = await registration.pushManager.subscribe({
       userVisibleOnly: true,
-      applicationServerKey: 'BJtNnRrx05VQS0abnkHC-8gHJWpnmoqC_iQveENCmZOZIs-adWzqAiqFCdGVVd7CbiaLW-Q5iuIBDRgM9G-VnKg',
+      applicationServerKey: process.env.VAPID_PUBLIC_KEY,
     });
 
     console.log('[WebPush] Subscription:', JSON.stringify(subscription));
@@ -297,6 +405,10 @@ class NotificationManager {
     // Register device
     console.log('[WebPush] Registering device:', deviceData);
     await store.notifications.actions.registerDevice(deviceData);
+    // Save endpoint for rotation detection
+    try {
+      localStorage.setItem('push_endpoint', subscription.endpoint);
+    } catch (e) {}
     console.log('[WebPush] Device registered successfully');
   }
 
@@ -320,6 +432,50 @@ class NotificationManager {
     }
   }
 
+  async unregisterWebPush() {
+    try {
+      const registration = await navigator.serviceWorker.getRegistration();
+      if (registration) {
+        const subscription = await registration.pushManager.getSubscription();
+        if (subscription) await subscription.unsubscribe();
+      }
+      const deviceIdResult = await Preferences.get({ key: 'notifications_device_id' });
+      if (deviceIdResult.value) {
+        await this.store.notifications.actions.unregisterDevice(deviceIdResult.value);
+      }
+      try { localStorage.removeItem('push_endpoint'); } catch (e) {}
+    } catch (err) {
+      console.error('[WebPush] unregisterWebPush error:', err);
+    }
+  }
+
+  async getSubscriptionState() {
+    if (this.isServer || !('serviceWorker' in navigator) || !('PushManager' in window)) {
+      return { permission: 'unsupported', subscribed: false };
+    }
+    try {
+      const registration = await navigator.serviceWorker.getRegistration();
+      if (!registration) return { permission: 'default', subscribed: false };
+
+      // 1. Реальная подписка — главный source of truth
+      //    НО на iOS может вернуть null даже если нотификации реально приходят
+      const subscription = await registration.pushManager.getSubscription();
+
+      // 2. permissionState() — надёжнее Notification.permission на iOS
+      let permission = 'default';
+      try {
+        permission = await registration.pushManager.permissionState({ userVisibleOnly: true });
+      } catch (e) {
+        // 3. Fallback на Notification.permission (может врать на iOS)
+        permission = 'Notification' in window ? Notification.permission : 'default';
+      }
+
+      return { permission, subscribed: !!subscription };
+    } catch (err) {
+      return { permission: 'default', subscribed: false };
+    }
+  }
+
   async initialize() {
     console.log('[NOTIF DEBUG] NotificationManager.initialize() called, initialized:', this.initialized, 'isServer:', this.isServer);
     if (this.initialized || this.isServer) return;
@@ -348,6 +504,12 @@ class NotificationManager {
         wsManager.addEventListener(
           'notification',
           data => {
+            // Handle Telegram connection event
+            if (data.type === 'telegram_connected') {
+              this.store.notifications.state.telegramConnected = true;
+              this.store.notifications.state.telegramChatId = data.data?.chatId || null;
+              return;
+            }
             this.store.notifications.actions.addLocalNotification(data.data);
           },
           { module: 'notification' }
@@ -370,12 +532,25 @@ class NotificationManager {
     // Skip auto-init for mobile apps - will be triggered manually from Walkthrough
     if (this.options.enablePush !== false && !process.env.MOBILE_APP) {
       this.pushHandler.requestPermissions().catch(() => {});
-      // Only register web push if permission already granted (no popup without user gesture)
-      if ('Notification' in window && Notification.permission === 'granted') {
-        this.registerWebPush(this.store).catch(err => console.error('[Notifications] WebPush registration error:', err));
+      // Ре-регистрация только если подписка уже есть (не промптить, не опираться на Notification.permission)
+      if ('serviceWorker' in navigator && 'PushManager' in window) {
+        try {
+          const reg = await navigator.serviceWorker.getRegistration();
+          if (reg) {
+            const sub = await reg.pushManager.getSubscription();
+            if (sub) {
+              this.registerWebPush(this.store).catch(err => console.error('[Notifications] WebPush re-registration error:', err));
+            }
+          }
+        } catch (err) {
+          console.error('[Notifications] Subscription check error:', err);
+        }
       }
     }
 
+    // Setup foreground recovery handlers (iOS PWA: reconnect WS + revalidate push on visibility)
+    this.setupForegroundHandlers();
+
     this.initialized = true;
     console.log('[NOTIF DEBUG] NotificationManager initialized successfully');
   }
@@ -385,6 +560,7 @@ class NotificationManager {
 
     wsManager.removeModuleListeners('notification');
     this.pushHandler.removeListeners();
+    this.teardownForegroundHandlers();
     this.initialized = false;
   }
 }
@@ -419,12 +595,26 @@ const SSRUtils = {
  * @param {Object} options - Configuration options
  */
 function initializeNotifications(app, store, router, options = {}) {
-  // Add routes and store
-  const routes = getRoutes(options);
-  routes.forEach(({ parentName, config }) => {
-    addRoutes(router, { ...config, parentName });
+  // User context
+  const routeUsers = options.routeUsers || 'User Profile Root';
+  addRoutes(router, {
+    parentName: routeUsers,
+    basePath: 'notifications',
+    routes: notificationsRoutes,
   });
 
+  // Backoffice context
+  if (!options.contexts || options.contexts.includes('backoffice')) {
+    const routeBackoffice = options.routeBackoffice || 'Backoffice Root';
+    addRoutes(router, {
+      parentName: routeBackoffice,
+      basePath: 'notifications',
+      routes: notificationsBackofficeRoutes,
+      routeNamePrefix: 'Backoffice',
+      meta: { context: 'backoffice' },
+    });
+  }
+
   store.addStore('notifications', storeNotifications);
 
   // Initialize global WebSocket if needed
@@ -495,6 +685,8 @@ function initializeNotifications(app, store, router, options = {}) {
       init: notificationManager.initialize.bind(notificationManager),
       disconnect: notificationManager.disconnect.bind(notificationManager),
       registerWebPush: () => notificationManager.registerWebPush(store),
+      unregisterWebPush: () => notificationManager.unregisterWebPush(),
+      getSubscriptionState: () => notificationManager.getSubscriptionState(),
       isServer,
     };
   });
@@ -511,7 +703,8 @@ const ModuleNotifications = {
       storeNotifications,
     },
     router: {
-      getRoutes,
+      notificationsRoutes,
+      notificationsBackofficeRoutes,
     },
     components: {
       // Elements

package/src/modules/notifications/router/notifications.backoffice.router.js

@@ -0,0 +1,16 @@
+const notificationsBackofficeRoutes = [
+  {
+    path: '',
+    name: 'Notifications',
+    meta: {
+      title: {
+        en: 'Notifications',
+        ru: 'Уведомления',
+      },
+      authorize: [],
+    },
+    component: () => import(/* webpackChunkName: 'BackofficeNotifications' */ '../components/pages/Notifications.vue'),
+  },
+];
+
+export default notificationsBackofficeRoutes;

package/src/modules/notifications/router/notifications.router.js

@@ -1,47 +1,15 @@
-function buildNotificationRoutes() {
-  return [
-    {
-      path: '',
-      name: 'Notifications',
-      component: () => import(
-        /* webpackChunkName: 'notifications-page' */
-        '../components/pages/Notifications.vue'
-      ),
-      meta: {
-        title: 'Notifications',
-      },
+const notificationsRoutes = [
+  {
+    path: '',
+    name: 'Notifications',
+    component: () => import(
+      /* webpackChunkName: 'notifications-page' */
+      '../components/pages/Notifications.vue'
+    ),
+    meta: {
+      title: 'Notifications',
     },
-    {
-      path: 'preferences',
-      name: 'NotificationPreferences',
-      component: () => import(
-        /* webpackChunkName: 'notifications-preferences' */
-        '../components/sections/NotificationPreferences.vue'
-      ),
-      meta: {
-        title: 'Notification Preferences',
-      },
-    },
-  ];
-}
-
-export function getRoutes(options = {}) {
-  const routes = [];
-  const routeUsers = options.routeUsers || 'User Profile Root';
-
-  routes.push({
-    parentName: routeUsers,
-    config: {
-      basePath: options.basePath || 'notifications',
-      component: options.layoutComponent || (() => import(
-        /* webpackChunkName: 'notifications-layout' */
-        '../components/layouts/NotificationsLayout.vue'
-      )),
-      routes: buildNotificationRoutes(options),
-    },
-  });
-
-  return routes;
-}
+  },
+];
 
-export default { getRoutes };
+export default notificationsRoutes;

package/src/modules/notifications/routes/notifications.routes.js

@@ -14,6 +14,10 @@ const notificationsRoutes = (app, db, wss, origins, publicPath, notificationServ
   app.put('/api/notifications/user/:userId/read-all', controller.markAllAsRead);
   // Register a device for push notifications
   app.post('/api/notifications/devices/register', controller.registerDevice);
+  // Deactivate a device (unsubscribe from push)
+  app.post('/api/notifications/devices/deactivate', controller.deactivateDevice);
+  // Update subscription when endpoint rotates (called from SW pushsubscriptionchange)
+  app.post('/api/notifications/devices/update-subscription', controller.updateSubscription);
   // Add this to routes/notifications.routes.js
   app.get('/api/notifications/preferences/:userId', controller.getUserPreferences);
   // Update notification preferences
@@ -22,5 +26,10 @@ const notificationsRoutes = (app, db, wss, origins, publicPath, notificationServ
   app.post('/api/notifications/send-to-tokens', controller.sendToTokens);
   // Send notifications to anonymous devices
   app.post('/api/notifications/send-to-anonymous', controller.sendToAnonymous);
+  // Telegram integration
+  app.post('/api/notifications/telegram/generate-link', controller.generateTelegramLink);
+  app.get('/api/notifications/telegram/status/:userId', controller.getTelegramStatus);
+  app.post('/api/notifications/telegram/disconnect', controller.disconnectTelegram);
+  app.post('/api/notifications/telegram/webhook', controller.telegramWebhook);
 };
 export default notificationsRoutes;

package/src/modules/notifications/services/notification.service.js

@@ -35,7 +35,7 @@ export default (function (db, wss) {
         push: sendPushNotification,
         email: sendEmailNotification,
         sms: sendSmsNotification,
-        // telegram: sendTelegramNotification,
+        telegram: sendTelegramNotification,
         // whatsapp: sendWhatsAppNotification
       };
       // Get all active devices for push notifications
@@ -202,35 +202,59 @@ export default (function (db, wss) {
       return webPush;
     }
   };
+  // Per-channel content: metadata.channels.{channel} overrides default title/body
+  // String → replaces body. Object → merges with defaults (title, body, html, subject).
+  // No override → falls back to notification.title + notification.body
+  const getChannelContent = (notification, channel) => {
+    const override = notification.metadata?.channels?.[channel];
+    if (!override) return { title: notification.title, body: notification.body };
+    if (typeof override === 'string') return { title: notification.title, body: override };
+    return { title: override.title || notification.title, body: override.body || notification.body, ...override };
+  };
+
   // Send email notification
   const sendEmailNotification = async (notification, user) => {
+    const content = getChannelContent(notification, 'email');
     return emailService.send({
       to: user.email,
-      subject: notification.title,
-      text: notification.body,
-      html: `<h1>${notification.title}</h1><p>${notification.body}</p>`,
+      subject: content.subject || content.title,
+      text: content.body,
+      html: content.html || `<h1>${content.title}</h1><p>${content.body}</p>`,
       metadata: notification.metadata,
     });
   };
   // Send SMS notification
   const sendSmsNotification = async (notification, user) => {
+    const content = getChannelContent(notification, 'sms');
     return smsService.send({
       to: user.phoneNumber,
-      message: `${notification.title}: ${notification.body}`,
+      message: `${content.title}: ${content.body}`,
     });
   };
-  // Send Telegram notification (for future expansion)
+  // Send Telegram notification — reads chatId from preferences
   const sendTelegramNotification = async (notification, user) => {
+    const telegramPref = await db.notificationPreference.findOne({
+      userId: user._id,
+      channelType: 'telegram',
+      isEnabled: true,
+    });
+    if (!telegramPref?.telegramChatId) {
+      console.log(`[Telegram] No chatId for user ${user._id}, skipping`);
+      return;
+    }
+    const content = getChannelContent(notification, 'telegram');
     return telegramService.send({
-      chatId: user.telegramChatId,
-      message: `${notification.title}\n\n${notification.body}`,
+      chatId: telegramPref.telegramChatId,
+      message: content.body,
+      options: content.options || {},
     });
   };
   // Send WhatsApp notification (for future expansion)
   const sendWhatsAppNotification = async (notification, user) => {
+    const content = getChannelContent(notification, 'whatsapp');
     return whatsappService.send({
       to: user.phoneNumber,
-      message: `${notification.title}\n\n${notification.body}`,
+      message: `${content.title}\n\n${content.body}`,
     });
   };
   // Batch process pending notifications

package/src/modules/notifications/services/telegram.service.js

@@ -2,11 +2,11 @@ import mailing from '@martyrs/src/modules/core/controllers/utils/mailing.js';
 // services/telegram.service.js
 const { sendChatMessageTelegram } = mailing;
 const TelegramService = {
-  send: async ({ chatId, message }) => {
+  send: async ({ chatId, message, options = {} }) => {
     try {
       // Send Telegram message using the utility function
       // Note: our utility expects an array of chatIds
-      const result = await sendChatMessageTelegram([chatId], message);
+      const result = await sendChatMessageTelegram([chatId], message, options);
       if (!result) {
         throw new Error('Failed to send Telegram message');
       }

package/src/modules/notifications/services/web-push.service.js

@@ -17,9 +17,13 @@ const WebPushService = {
         badge: process.env.NOTIFICATION_BADGE_URL || '/favicon.ico',
         data: data,
       });
-      // Send the notification
+      // Send the notification with delivery options
       console.log('[WebPush] Sending to endpoint:', subscription.endpoint);
-      const result = await webpush.sendNotification(subscription, payload);
+      const result = await webpush.sendNotification(subscription, payload, {
+        TTL: 86400, // 24 hours — push stays on server if device offline
+        urgency: 'high', // immediate delivery, required by Safari
+        topic: data?.type || 'notification', // deduplication — same topic overwrites previous
+      });
       console.log('[WebPush] Result:', result.statusCode, result.headers);
       return { success: true, statusCode: result.statusCode };
     } catch (error) {

package/src/modules/notifications/store/notifications.store.js

@@ -41,6 +41,10 @@ const state = reactive({
   deviceRegistered: false,
   loading: false,
   lastSync: null,
+  // Telegram
+  telegramConnected: false,
+  telegramChatId: null,
+  telegramDeepLink: null,
 });
 
 const actions = {
@@ -145,6 +149,21 @@ const actions = {
     }
   },
 
+  /**
+   * Unregister (deactivate) device on server
+   */
+  async unregisterDevice(deviceId) {
+    try {
+      const userId = auth.state.user?._id;
+      const payload = { deviceId };
+      if (userId) payload.userId = userId;
+      await $axios.post('/api/notifications/devices/deactivate', payload);
+      state.deviceRegistered = false;
+    } catch (error) {
+      console.error('[Notifications Store] Unregister device error:', error);
+    }
+  },
+
   /**
    * Re-register device after user login
    */
@@ -242,6 +261,56 @@ const actions = {
     }
   },
 
+  /**
+   * Generate Telegram deep link for connecting bot
+   */
+  async generateTelegramLink() {
+    try {
+      const userId = auth.state.user._id;
+      if (!userId) return null;
+      const response = await $axios.post('/api/notifications/telegram/generate-link', { userId });
+      state.telegramDeepLink = response.data.deepLink;
+      return response.data;
+    } catch (error) {
+      setError(error);
+      throw error;
+    }
+  },
+
+  /**
+   * Get Telegram connection status
+   */
+  async getTelegramStatus() {
+    try {
+      const userId = auth.state.user._id;
+      if (!userId) return;
+      const response = await $axios.get(`/api/notifications/telegram/status/${userId}`);
+      state.telegramConnected = response.data.connected;
+      state.telegramChatId = response.data.chatId;
+      return response.data;
+    } catch (error) {
+      console.error('Error getting Telegram status:', error);
+    }
+  },
+
+  /**
+   * Disconnect Telegram
+   */
+  async disconnectTelegram() {
+    try {
+      const userId = auth.state.user._id;
+      if (!userId) return;
+      await $axios.post('/api/notifications/telegram/disconnect', { userId });
+      state.telegramConnected = false;
+      state.telegramChatId = null;
+      state.telegramDeepLink = null;
+      state.preferences.telegram = false;
+    } catch (error) {
+      setError(error);
+      throw error;
+    }
+  },
+
   /**
    * Add a local notification (for handling push notifications or WebSocket notifications)
    */

package/src/modules/orders/components/blocks/CardApplication.vue

@@ -3,7 +3,7 @@
     <div class="mn-b-small flex">
       <div class="mn-r-auto">
         <h3 class="mn-b-thin">{{ application.contacts?.name || application.contacts?.email || application.contacts?.phone || 'Unnamed Application' }}</h3>
-        <p class="t-transp">{{ application.contacts?.email || application.contacts?.phone }}</p>
+        <p class="opacity-50">{{ application.contacts?.email || application.contacts?.phone }}</p>
       </div>
       <div class="flex-center">
         <StatusBadge :value="application.status" />
@@ -11,17 +11,17 @@
     </div>
 
     <div class="mn-b-thin pd-small bg-white radius-small flex">
-      <p class="mn-r-auto t-transp">Type</p>
+      <p class="mn-r-auto opacity-50">Type</p>
       <p class="truncate">{{ application.type || 'Unknown' }}</p>
     </div>
 
     <div class="mn-b-thin pd-small bg-white radius-small flex">
-      <p class="mn-r-auto t-transp">Phone</p>
-      <p>{{ application.contacts?.phone || 'No phone' }}</p>
+      <p class="mn-r-auto opacity-50">Phone</p>
+      <p>{{ application.contacts?.phone ? formatPhone(application.contacts.phone) : 'No phone' }}</p>
     </div>
 
     <div class="mn-b-thin pd-small bg-white radius-small flex">
-      <p class="mn-r-auto t-transp">ID</p>
+      <p class="mn-r-auto opacity-50">ID</p>
       <p>#{{ application._id.slice(0, 4) + '...' + application._id.slice(-4) }}</p>
     </div>
 
@@ -30,7 +30,7 @@
     </div>
 
     <div class="pd-small bg-white radius-small gap-micro flex-v-center flex-nowrap flex">
-      <IconTime class="i-medium t-transp" fill="rgb(var(--black))" />
+      <IconTime class="i-medium opacity-50" fill="rgb(var(--black))" />
       <p class="fw-medium mn-r-auto">{{ formatDate(application.updatedAt) }}</p>
     </div>
   </div>
@@ -39,6 +39,9 @@
 <script setup>
   import IconTime from '@martyrs/src/modules/icons/entities/IconTime.vue';
   import StatusBadge from '@martyrs/src/components/Table/StatusBadge.vue';
+  import { useGlobalMixins } from '@martyrs/src/modules/core/views/mixins/mixins.js';
+
+  const { formatPhone } = useGlobalMixins();
 
   defineProps({
     application: {