feat(i18n): use compact number format instead K/M suffix (#678)

composables/i18n.ts

@@ -8,18 +8,18 @@ export const formattedNumber = (num: number, useFormatter: Intl.NumberFormat = f
 }
 
 export const useHumanReadableNumber = () => {
-  const { t, n, locale } = useI18n()
+  const { n, locale } = useI18n()
 
   const fn = (num: number) => {
-    if (num < 10000)
+    return n(
-      return n(num, 'smallCounting', locale.value)
+      num,
-
+      num < 10000
-    // show 1 decimal: we cannot use toFixed(1), it is a string
+        ? 'smallCounting'
-    if (num < 1000000)
+        : num < 1000000
-      return `${n(Math.floor(num / 100) / 10, 'kiloCounting', locale.value)}${t('common.kiloSuffix')}`
+          ? 'kiloCounting'
-
+          : 'millionCounting',
-    // show 2 decimals: we cannot use toFixed(2), it is a string
+      locale.value,
-    return `${n(Math.floor(num / 10000) / 100, 'millionCounting', locale.value)}${t('common.megaSuffix')}`
+    )
   }
 
   return {

config/i18n.ts

@@ -107,11 +107,13 @@ const numberFormats = Object.values(locales).reduce((acc, data) => {
         maximumFractionDigits: 0,
       },
       kiloCounting: {
-        style: 'decimal',
+        notation: 'compact',
+        compactDisplay: 'short',
         maximumFractionDigits: 1,
       },
       millionCounting: {
-        style: 'decimal',
+        notation: 'compact',
+        compactDisplay: 'short',
         maximumFractionDigits: 2,
       },
     }

locales/ar-EG.json

@@ -85,8 +85,6 @@
     "end_of_list": "نهاية القائمة",
     "error": "حدث خطأ",
     "in": "في",
-    "kiloSuffix": "ألف",
-    "megaSuffix": "مليون",
     "not_found": "404 غير معثور عليه",
     "offline_desc": "يبدو أنك غير متصل بالإنترنت. يرجى التحقق من اتصالك."
   },

locales/cs-CZ.json

@@ -64,8 +64,6 @@
   "common": {
     "end_of_list": "Konec seznamu",
     "error": "CHYBA",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "404 Nenalezeno!",
     "offline_desc": "Zdá se, že jste offline. Zkontrolujte připojení k internetu."
   },

locales/de-DE.json

@@ -64,8 +64,6 @@
   "common": {
     "end_of_list": "Ende der Liste",
     "error": "FEHLER",
-    "kiloSuffix": "T",
-    "megaSuffix": "M",
     "not_found": "404 Nicht Gefunden",
     "offline_desc": "Anscheinend bist du offline. Bitte überprüfe deine Netzwerkverbindung."
   },

locales/en-GB.json

@@ -85,8 +85,6 @@
     "end_of_list": "End of the list",
     "error": "ERROR",
     "in": "in",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "404 Not Found",
     "offline_desc": "Seems like you are offline. Please check your network connection."
   },

locales/en-US.json

@@ -85,8 +85,6 @@
     "end_of_list": "End of the list",
     "error": "ERROR",
     "in": "in",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "404 Not Found",
     "offline_desc": "Seems like you are offline. Please check your network connection."
   },

locales/es-ES.json

@@ -83,8 +83,6 @@
     "end_of_list": "Fin",
     "error": "ERROR",
     "in": "en",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "404 No Encontrado",
     "offline_desc": "Al parecer estás fuera de línea. Por favor, comprueba tu conexión a la red."
   },

locales/fr-FR.json

@@ -82,8 +82,6 @@
     "end_of_list": "Fin de liste",
     "error": "ERREUR",
     "in": "sur",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "404 Introuvable",
     "offline_desc": "Il semble que vous soyez hors-ligne. Vérifiez votre connexion internet."
   },

locales/zh-CN.json

@@ -85,8 +85,6 @@
     "end_of_list": "列表到底啦",
     "error": "错误",
     "in": "在",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "无法找到相关内容",
     "offline_desc": "您目前已离线，请检查网络连接。"
   },

locales/zh-TW.json

@@ -85,8 +85,6 @@
     "end_of_list": "列表到底啦",
     "error": "錯誤",
     "in": "在",
-    "kiloSuffix": "K",
-    "megaSuffix": "M",
     "not_found": "無法找到相關內容",
     "offline_desc": "您目前已離線，請檢查網絡連接。"
   },