From d4028da92e976b68dae1032b95ae33d5002fd68b Mon Sep 17 00:00:00 2001
From: jorgep <jorgep@verdnatura.es>
Date: Thu, 28 Nov 2024 10:25:50 +0100
Subject: [PATCH] fix: refs #6818 refactor phone parsing and improve error
 handling

---
 src/components/ui/VnLinkPhone.vue | 22 +++++++++-------------
 src/filters/parsePhone.js         | 13 +++++++++----
 2 files changed, 18 insertions(+), 17 deletions(-)

diff --git a/src/components/ui/VnLinkPhone.vue b/src/components/ui/VnLinkPhone.vue
index 6fefd1914..c5023f69e 100644
--- a/src/components/ui/VnLinkPhone.vue
+++ b/src/components/ui/VnLinkPhone.vue
@@ -1,12 +1,15 @@
 <script setup>
-import { reactive, useAttrs, onBeforeMount, capitalize } from 'vue';
+import { ref, reactive, useAttrs, onBeforeMount, capitalize } from 'vue';
 import axios from 'axios';
+import { parsePhone } from 'src/filters';
+
 const props = defineProps({
     phoneNumber: { type: [String, Number], default: null },
     channel: { type: Number, default: null },
     country: { type: String, default: null },
 });
 
+const phone = ref(props.phoneNumber);
 const config = reactive({
     sip: { icon: 'phone', href: `sip:${props.phoneNumber}` },
     'say-simple': {
@@ -25,23 +28,16 @@ onBeforeMount(async () => {
             .data;
         if (!channel) channel = defaultChannel;
 
-        const phone = await parsePhone(props.phoneNumber, props.country.toLowerCase());
-        config[type].href = `${url}?customerIdentity=%2B${phone}&channelId=${channel}`;
+        phone.value = await parsePhone(props.phoneNumber, props.country.toLowerCase());
+        config[
+            type
+        ].href = `${url}?customerIdentity=%2B${phone.value}&channelId=${channel}`;
     }
 });
-
-async function parsePhone(phone, country) {
-    if (phone.startsWith('+')) return `${phone.slice(1)}`;
-    if (phone.startsWith('00')) return `${phone.slice(2)}`;
-
-    const prefix = (await axios.get(`Prefixes/${country.toLowerCase()}`)).data?.prefix;
-    if (phone.startsWith(prefix)) return phone;
-    return `${prefix}${phone}`;
-}
 </script>
 <template>
     <QBtn
-        v-if="phoneNumber"
+        v-if="phone"
         flat
         round
         :icon="config[type].icon"
diff --git a/src/filters/parsePhone.js b/src/filters/parsePhone.js
index f99ab0646..4fcf1386d 100644
--- a/src/filters/parsePhone.js
+++ b/src/filters/parsePhone.js
@@ -3,8 +3,13 @@ import axios from 'axios';
 export default async function parsePhone(phone, country) {
     if (phone.startsWith('+')) return `${phone.slice(1)}`;
     if (phone.startsWith('00')) return `${phone.slice(2)}`;
-
-    const prefix = (await axios.get(`Prefixes/${country.toLowerCase()}`)).data?.prefix;
-    if (phone.startsWith(prefix)) return phone;
-    return `${prefix}${phone}`;
+    try {
+        const prefix = (
+            await axios.get(`Prefixes/${country.toLowerCase()}`)
+        ).data?.prefix.replace(/^0+/, '');
+        if (phone.startsWith(prefix)) return phone;
+        return `${prefix}${phone}`;
+    } catch (e) {
+        return null;
+    }
 }