I have translated the messages, but 'il y a' is not displaying on the correct side.

src/internal_time_ago.js

@@ -1,4 +1,6 @@
-export function time_ago(time) {
+import {useI18n} from "vue-i18n";
+
+export function time_ago(time) {
     const time_date = new Date(time)
     const now_date = new Date(Date.now())
     const ago = now_date - time_date
@@ -20,27 +22,53 @@ function internal_time_ago(time) {
             time = +new Date();
     }
     
+    const {t} = useI18n();
+    const I18nseconds = t('time.seconds');
+    const I18nminuteago = t('time.1minuteago');
+    const I181minutefromnow = t('time.1minutefromnow');
+    const I181minutes = t('time.minutes');
+    const I1811hourago = t('time.1hourago');
+    const I1811hourfromnow = t('time.1hourfromnow');
+    const I18n1hours = t('time.hours');
+    const I18nyesterday = t('time.yesterday');
+    const I18ntomorrow = t('time.tomorrow');
+    const I18ndays = t('time.days');
+    const I18nlastweek = t('time.lastweek');
+    const I18nnextweek = t('time.nextweek');
+    const I18nweeks = t('time.weeks');
+    const I18nlastmonth = t('time.lastmonth');
+    const I18nnextmonth = t('time.nextmonth');
+    const I18nmonths = t('time.months');
+    const I18nlastyear = t('time.lastyear');
+    const I18nnextyear = t('time.nextyear');
+    const I18nyears = t('time.years');
+    const I18nlastcentury = t('time.lastcentury');
+    const I18nnextcentury = t('time.nextcentury');
+    const I18ncenturies = t('time.centuries');
+    const I18nago = t('time.ago');
+    
+    
     const time_formats = [
-        [60, 'seconds', 1], // 60
+        [60, I18nseconds, 1], // 60
-        [120, '1 minute ago', '1 minute from now'], // 60*2
+        [120, I18nminuteago, I181minutefromnow], // 60*2
-        [3600, 'minutes', 60], // 60*60, 60
+        [3600, I181minutes, 60], // 60*60, 60
-        [7200, '1 hour ago', '1 hour from now'], // 60*60*2
+        [7200, I1811hourago, I1811hourfromnow], // 60*60*2
-        [86400, 'hours', 3600], // 60*60*24, 60*60
+        [86400, I18n1hours, 3600], // 60*60*24, 60*60
-        [172800, 'Yesterday', 'Tomorrow'], // 60*60*24*2
+        [172800, I18nyesterday, I18ntomorrow], // 60*60*24*2
-        [604800, 'days', 86400], // 60*60*24*7, 60*60*24
+        [604800, I18ndays, 86400], // 60*60*24*7, 60*60*24
-        [1209600, 'Last week', 'Next week'], // 60*60*24*7*4*2
+        [1209600, I18nlastweek, I18nnextweek], // 60*60*24*7*4*2
-        [2419200, 'weeks', 604800], // 60*60*24*7*4, 60*60*24*7
+        [2419200, I18nweeks, 604800], // 60*60*24*7*4, 60*60*24*7
-        [4838400, 'Last month', 'Next month'], // 60*60*24*7*4*2
+        [4838400, I18nlastmonth, I18nnextmonth], // 60*60*24*7*4*2
-        [29030400, 'months', 2419200], // 60*60*24*7*4*12, 60*60*24*7*4
+        [29030400, I18nmonths, 2419200], // 60*60*24*7*4*12, 60*60*24*7*4
-        [58060800, 'Last year', 'Next year'], // 60*60*24*7*4*12*2
+        [58060800, I18nlastyear, I18nnextyear], // 60*60*24*7*4*12*2
-        [2903040000, 'years', 29030400], // 60*60*24*7*4*12*100, 60*60*24*7*4*12
+        [2903040000, I18nyears, 29030400], // 60*60*24*7*4*12*100, 60*60*24*7*4*12
-        [5806080000, 'Last century', 'Next century'], // 60*60*24*7*4*12*100*2
+        [5806080000, I18nlastcentury, I18nnextcentury], // 60*60*24*7*4*12*100*2
-        [58060800000, 'centuries', 2903040000] // 60*60*24*7*4*12*100*20, 60*60*24*7*4*12*100
+        [58060800000, I18ncenturies, 2903040000] // 60*60*24*7*4*12*100*20, 60*60*24*7*4*12*100
     ];
 
     let seconds = time / 1000
 
-    let token = 'ago'
+    let token = I18nago
     let list_choice = 1
 
     if (seconds === 0) {

src/locales/en.json

@@ -73,6 +73,7 @@
     "years": "years",
     "lastcentury": "Last century",
     "nextcentury": "Next century",
-    "centuries": "centuries"
+    "centuries": "centuries",
+    "ago": "ago"
   }
 }

src/locales/fr.json

@@ -53,27 +53,28 @@
   },
   "time": {
     "seconds": "secondes",
-    "1minuteago": "il y a 1 minute",
+    "1minuteago": "Il y a 1 minute",
     "1minutefromnow": "dans 1 minute",
     "minutes": "minutes",
-    "1hourago": "il y a 1 heure",
+    "1hourago": "Il y a 1 heure",
     "1hourfromnow": "dans 1 heure",
     "hours": "heures",
     "yesterday": "hier",
     "tomorrow": "demain",
     "days": "jours",
-    "lastweek": "la semaine dernière",
+    "lastweek": "La semaine dernière.",
-    "nextweek": "la semaine prochaine",
+    "nextweek": "La semaine prochaine",
     "weeks": "semaines",
-    "lastmonth": "le mois dernier",
+    "lastmonth": "Le mois dernier",
-    "nextmonth": "le mois prochain",
+    "nextmonth": "Le mois prochain",
     "months": "mois",
-    "lastyear": "l'année dernière",
+    "lastyear": "L'année dernière",
-    "nextyear": "l'année prochaine",
+    "nextyear": "L'année prochaine",
     "years": "années",
-    "lastcentury": "le siècle dernier",
+    "lastcentury": "Le siècle dernier",
-    "nextcentury": "le siècle prochain",
+    "nextcentury": "Le siècle prochain",
-    "centuries": "siècles"
+    "centuries": "siècles",
+    "ago": ""
   }
 
 }

src/views/messages/Message.vue

@@ -22,6 +22,7 @@
                     <span v-bind="props" class="text-sm-caption text-gray-700 mt-1 ">
                       {{ time_ago(message.createdAt) }}
                     </span>
+                  
                   </template>
                 </v-tooltip>
               </div>