cleanup bitrate/byterate i18n formatter

public/locales/en/common.json

@@ -4,8 +4,8 @@
         "bits": "{{value, bytes(bits: true)}}",
         "bbytes": "{{value, bytes(binary: true)}}",
         "bbits": "{{value, bytes(bits: true, binary: true)}}",
-        "byterate": "{{value, bytes}}",
-        "bitrate": "{{value, bytes(bits: true)}}",
+        "byterate": "{{value, rate}}",
+        "bitrate": "{{value, rate(bits: true)}}",
         "percent": "{{value, percent}}",
         "number": "{{value, number}}",
         "ms": "{{value, number}}"

src/components/services/widgets/service/docker.jsx

@@ -4,7 +4,7 @@ import { useTranslation } from "react-i18next";
 import Widget from "../widget";
 import Block from "../block";
 
-import { calculateCPUPercent } from "utils/stats-helpers";
+import calculateCPUPercent from "utils/stats-helpers";
 
 export default function Docker({ service }) {
   const { t } = useTranslation();

src/utils/i18n.js

@@ -25,6 +25,24 @@ i18n
 i18n.services.formatter.add("bytes", (value, lng, options) =>
   prettyBytes(parseFloat(value), { locale: lng, ...options })
 );
+
+i18n.services.formatter.add("rate", (value, lng, options) => {
+  if (value === 0) return "0 Bps";
+
+  const bits = options.bits ? value : value / 8;
+  const k = 1024;
+  const dm = options.decimals ? options.decimals : 0;
+  const sizes = ["Bps", "Kbps", "Mbps", "Gbps", "Tbps", "Pbps", "Ebps", "Zbps", "Ybps"];
+
+  const i = Math.floor(Math.log(bits) / Math.log(k));
+
+  const formatted = new Intl.NumberFormat(lng, { maximumFractionDigits: dm, minimumFractionDigits: dm }).format(
+    parseFloat(bits / k ** i)
+  );
+
+  return `${formatted} ${sizes[i]}`;
+});
+
 i18n.services.formatter.add("percent", (value, lng, options) =>
   new Intl.NumberFormat(lng, { style: "percent", ...options }).format(parseFloat(value) / 100.0)
 );

src/utils/stats-helpers.js

@@ -1,4 +1,4 @@
-export function calculateCPUPercent(stats) {
+export default function calculateCPUPercent(stats) {
   let cpuPercent = 0.0;
   const cpuDelta = stats.cpu_stats.cpu_usage.total_usage - stats.precpu_stats.cpu_usage.total_usage;
   const systemDelta = stats.cpu_stats.system_cpu_usage - stats.precpu_stats.system_cpu_usage;
@@ -9,27 +9,3 @@ export function calculateCPUPercent(stats) {
 
   return Math.round(cpuPercent * 10) / 10;
 }
-
-export function formatBytes(bytes, decimals = 2) {
-  if (bytes === 0) return "0 Bytes";
-
-  const k = 1024;
-  const dm = decimals < 0 ? 0 : decimals;
-  const sizes = ["B", "KB", "MB", "GB", "TB", "PB", "EB", "ZB", "YB"];
-
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-
-  return `${parseFloat(bytes / k ** i).toFixed(dm)} ${sizes[i]}`;
-}
-
-export function formatBits(bytes, decimals = 2) {
-  if (bytes === 0) return "0 Bytes";
-
-  const k = 1024;
-  const dm = decimals < 0 ? 0 : decimals;
-  const sizes = ["B", "Kb", "Mb", "Gb", "Tb", "Pb", "Eb", "Zb", "Yb"];
-
-  const i = Math.floor(Math.log(bytes) / Math.log(k));
-
-  return `${parseFloat(bytes / k ** i).toFixed(dm)} ${sizes[i]}`;
-}