From 000b076ca033303535b84f8c0e3608ed41bd7ce4 Mon Sep 17 00:00:00 2001
From: 3thibaut1304 <thibaut.husser@free.fr>
Date: Wed, 2 Jul 2025 14:11:34 +0200
Subject: [PATCH] fix version mobile hidden connection on mobile

---
 docs/customservices.md             | 2 +-
 src/components/services/Sftpgo.vue | 8 +++++++-
 2 files changed, 8 insertions(+), 2 deletions(-)

diff --git a/docs/customservices.md b/docs/customservices.md
index 90163f0..a6afb12 100644
--- a/docs/customservices.md
+++ b/docs/customservices.md
@@ -650,7 +650,7 @@ This service displays info about the total number of disk passed and failed S.M.
 ## SFTPGo
 
 This service displays a version string instead of a subtitle.  
-And this service display the number of active connections    
+And this service display the number of active connections is hidden on small screen.  
 The indicator shows SFTPGo is online, offline. Example configuration:
 
 ```yaml
diff --git a/src/components/services/Sftpgo.vue b/src/components/services/Sftpgo.vue
index d8bf8bb..d94957c 100644
--- a/src/components/services/Sftpgo.vue
+++ b/src/components/services/Sftpgo.vue
@@ -8,7 +8,7 @@
         </template>
         <template v-else>
           <span v-if="versionstring">Version {{ versionstring }}</span>
-          <span v-if="activeConnections !== null">
+          <span v-if="activeConnections !== null && !this.showUpdateAvailable">
             – Active connections: {{ activeConnections }}
           </span>
         </template>
@@ -40,11 +40,17 @@ export default {
     status: function () {
       return this.fetchOk ? "online" : "offline";
     },
+    showUpdateAvailable: function () {
+      return this.isSmallScreenMethod();
+    },
   },
   created() {
     this.fetchStatus();
   },
   methods: {
+    isSmallScreenMethod: function () {
+      return window.matchMedia("screen and (max-width: 1023px)").matches;
+    },
     fetchStatus: async function () {
       let headers = {};
       if (this.item.sftpgo_api_key) {