From ebc5173bd0ff4b57403c5b2ff28bdcddee9b627c Mon Sep 17 00:00:00 2001
From: Peter Lewis <peter@peterlew.is>
Date: Sun, 25 Feb 2024 22:02:53 +0000
Subject: [PATCH] usage -> traffic

---
 README.md          |  2 +-
 docker-compose.yml |  2 +-
 src/config.js      |  2 +-
 src/lib/Server.js  |  6 +++---
 src/www/index.html |  8 ++++----
 src/www/js/api.js  |  4 ++--
 src/www/js/app.js  | 10 +++++-----
 7 files changed, 17 insertions(+), 17 deletions(-)

diff --git a/README.md b/README.md
index 07881ff2..45164ca4 100644
--- a/README.md
+++ b/README.md
@@ -98,7 +98,7 @@ These options can be configured by setting environment variables using `-e KEY="
 | `WG_PRE_DOWN` | `...` | - | See [config.js](https://github.com/wg-easy/wg-easy/blob/master/src/config.js#L27) for the default value. |
 | `WG_POST_DOWN` | `...` | `iptables ...` | See [config.js](https://github.com/wg-easy/wg-easy/blob/master/src/config.js#L28) for the default value. |
 | `LANG` | `en` | `de` | Web UI language (Supports: en, ru, tr, no, pl, fr, de, ca, es, vi, nl, is, chs, cht,). |
-| `UI_USAGE_STATS` | `false` | `true` | Enable detailed RX / TX client stats in Web UI |
+| `UI_TRAFFIC_STATS` | `false` | `true` | Enable detailed RX / TX client stats in Web UI |
 
 > If you change `WG_PORT`, make sure to also change the exposed port.
 
diff --git a/docker-compose.yml b/docker-compose.yml
index be54a22a..afe1be88 100644
--- a/docker-compose.yml
+++ b/docker-compose.yml
@@ -24,7 +24,7 @@ services:
       # - WG_POST_UP=echo "Post Up" > /etc/wireguard/post-up.txt
       # - WG_PRE_DOWN=echo "Pre Down" > /etc/wireguard/pre-down.txt
       # - WG_POST_DOWN=echo "Post Down" > /etc/wireguard/post-down.txt
-      # - UI_USAGE_STATS=true 
+      # - UI_TRAFFIC_STATS=true 
 
     image: ghcr.io/wg-easy/wg-easy
     container_name: wg-easy
diff --git a/src/config.js b/src/config.js
index 14fde767..4d71f96c 100644
--- a/src/config.js
+++ b/src/config.js
@@ -29,4 +29,4 @@ iptables -A FORWARD -o wg0 -j ACCEPT;
 module.exports.WG_PRE_DOWN = process.env.WG_PRE_DOWN || '';
 module.exports.WG_POST_DOWN = process.env.WG_POST_DOWN || '';
 module.exports.LANG = process.env.LANG || 'en';
-module.exports.UI_USAGE_STATS = process.env.UI_USAGE_STATS || 'false';
+module.exports.UI_TRAFFIC_STATS = process.env.UI_TRAFFIC_STATS || 'false';
diff --git a/src/lib/Server.js b/src/lib/Server.js
index ccead598..13a5d51d 100644
--- a/src/lib/Server.js
+++ b/src/lib/Server.js
@@ -18,7 +18,7 @@ const {
   RELEASE,
   PASSWORD,
   LANG,
-  UI_USAGE_STATS,
+  UI_TRAFFIC_STATS,
 } = require('../config');
 
 module.exports = class Server {
@@ -45,8 +45,8 @@ module.exports = class Server {
       .get('/api/lang', (Util.promisify(async () => {
         return LANG;
       })))
-      .get('/api/ui-usage-stats', (Util.promisify(async () => {
-        return UI_USAGE_STATS === 'true';
+      .get('/api/ui-traffic-stats', (Util.promisify(async () => {
+        return UI_TRAFFIC_STATS === 'true';
       })))
 
     // Authentication
diff --git a/src/www/index.html b/src/www/index.html
index 4c5b239f..ff208499 100644
--- a/src/www/index.html
+++ b/src/www/index.html
@@ -162,7 +162,7 @@
                           </span>
                         </span>
                         <!-- Inline Transfer TX -->
-                        <span v-if="!uiUsageStats && client.transferTx" :title="$t('totalDownload') + bytes(client.transferTx)">
+                        <span v-if="!uiTrafficStats && client.transferTx" :title="$t('totalDownload') + bytes(client.transferTx)">
                           ·
                           <svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
                             <path fill-rule="evenodd"
@@ -173,7 +173,7 @@
                         </span>
                         
                         <!-- Inline Transfer RX -->
-                        <span v-if="!uiUsageStats && client.transferRx" :title="$t('totalUpload') + bytes(client.transferRx)">
+                        <span v-if="!uiTrafficStats && client.transferRx" :title="$t('totalUpload') + bytes(client.transferRx)">
                           ·
                           <svg class="align-middle h-3 inline" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor">
                             <path fill-rule="evenodd"
@@ -185,13 +185,13 @@
                         <!-- Last seen -->
                         <span class="text-gray-400 dark:text-neutral-500" v-if="client.latestHandshakeAt"
                           :title="$t('lastSeen') + dateTime(new Date(client.latestHandshakeAt))">
-                          {{!uiUsageStats ? " · " : ""}}{{new Date(client.latestHandshakeAt) | timeago}}
+                          {{!uiTrafficStats ? " · " : ""}}{{new Date(client.latestHandshakeAt) | timeago}}
                         </span>
                       </div>
                     </div>
 
                     <!-- Info -->
-                    <div v-if="uiUsageStats"
+                    <div v-if="uiTrafficStats"
                       class="flex gap-2 items-center shrink-0 text-gray-400 dark:text-neutral-400 text-xs mt-px justify-end">
 
                       <!-- Transfer TX -->
diff --git a/src/www/js/api.js b/src/www/js/api.js
index c4440ef2..e69e5a3a 100644
--- a/src/www/js/api.js
+++ b/src/www/js/api.js
@@ -43,10 +43,10 @@ class API {
     });
   }
 
-  async getuiUsageStats() {
+  async getuiTrafficStats() {
     return this.call({
       method: 'get',
-      path: '/ui-usage-stats',
+      path: '/ui-traffic-stats',
     });
   }
 
diff --git a/src/www/js/app.js b/src/www/js/app.js
index cc6dd5f1..22fe3bfc 100644
--- a/src/www/js/app.js
+++ b/src/www/js/app.js
@@ -53,7 +53,7 @@ new Vue({
     latestRelease: null,
 
     isDark: null,
-    uiUsageStats: false,
+    uiTrafficStats: false,
 
     chartOptions: {
       chart: {
@@ -293,13 +293,13 @@ new Vue({
       }).catch(console.error);
     }, 1000);
 
-    this.api.getuiUsageStats()
+    this.api.getuiTrafficStats()
       .then((res) => {
-        this.uiUsageStats = res;
+        this.uiTrafficStats = res;
       })
       .catch(() => {
-        console.log('Failed to get ui-usage-stats');
-        this.uiUsageStats = false;
+        console.log('Failed to get ui-traffic-stats');
+        this.uiTrafficStats = false;
       });
 
     Promise.resolve().then(async () => {