diff --git a/src/lavinmq/mqtt/client.cr b/src/lavinmq/mqtt/client.cr
index 086e745c16..db5a451e6b 100644
--- a/src/lavinmq/mqtt/client.cr
+++ b/src/lavinmq/mqtt/client.cr
@@ -135,11 +135,17 @@ module LavinMQ
 
       def details_tuple
         {
-          vhost:        @broker.vhost.name,
-          user:         @user.name,
-          protocol:     "MQTT",
-          client_id:    @client_id,
-          connected_at: @connected_at,
+          vhost:             @broker.vhost.name,
+          user:              @user.name,
+          protocol:          "MQTT 3.1.1",
+          client_id:         @client_id,
+          name:              @name,
+          connected_at:      @connected_at,
+          state:             state,
+          ssl:               @connection_info.ssl?,
+          tls_version:       @connection_info.ssl_version,
+          cipher:            @connection_info.ssl_cipher,
+          client_properties: NamedTuple.new,
         }.merge(stats_details)
       end
 
@@ -167,6 +173,10 @@ module LavinMQ
         @waitgroup.wait
       end
 
+      def state
+        @closed ? "closed" : (@broker.vhost.flow? ? "running" : "flow")
+      end
+
       def force_close
         close_socket
       end
diff --git a/static/js/connections.js b/static/js/connections.js
index 42063775d8..533fe72683 100644
--- a/static/js/connections.js
+++ b/static/js/connections.js
@@ -19,13 +19,9 @@ Table.renderTable('table', tableOptions, function (tr, item, all) {
   if (all) {
     const connectionLink = document.createElement('a')
     connectionLink.href = `connection#name=${encodeURIComponent(item.name)}`
-    if (item.client_properties.connection_name) {
-      connectionLink.appendChild(document.createElement('span')).textContent = item.name
-      connectionLink.appendChild(document.createElement('br'))
-      connectionLink.appendChild(document.createElement('small')).textContent = item.client_properties.connection_name
-    } else {
-      connectionLink.textContent = item.name
-    }
+    connectionLink.appendChild(document.createElement('span')).textContent = item.name
+    connectionLink.appendChild(document.createElement('br'))
+    connectionLink.appendChild(document.createElement('small')).textContent = item.client_properties.connection_name
     Table.renderCell(tr, 0, item.vhost)
     Table.renderCell(tr, 1, connectionLink)
     Table.renderCell(tr, 2, item.user)
@@ -37,11 +33,13 @@ Table.renderTable('table', tableOptions, function (tr, item, all) {
     Table.renderCell(tr, 9, item.channel_max, 'right')
     Table.renderCell(tr, 10, item.timeout, 'right')
     const clientDiv = document.createElement('span')
-    if (item?.client_properties) {
-      clientDiv.textContent = `${item.client_properties.product} / ${item.client_properties.platform || ''}`
-      clientDiv.appendChild(document.createElement('br'))
-      clientDiv.appendChild(document.createElement('small')).textContent = item.client_properties.version
+    if (item.client_properties.product) {
+      clientDiv.textContent = `${item.client_properties.product || ''} / ${item.client_properties.platform || ''}`
+    } else {
+      clientDiv.textContent = item.client_properties.platform || ''
     }
+    clientDiv.appendChild(document.createElement('br'))
+    clientDiv.appendChild(document.createElement('small')).textContent = item.client_properties.version
     Table.renderCell(tr, 11, clientDiv)
     Table.renderCell(tr, 12, new Date(item.connected_at).toLocaleString(), 'center')
   }