Reduce refresh of live view to 1s and fix connection status

static/js/BLE.js

@@ -26,7 +26,7 @@ async function connect(props) {
   console.log("> Characteristic value changed event listener added");
   socket = io();
 
-  socket.addEventListener("open", () => {
+  socket.on("connect", () => {
     btn.classList.remove("bg-red-600");
     btn.classList.add("bg-green-600");
   });

templates/device.html

@@ -29,7 +29,7 @@
     </nav>
 </div>
 
-<div hx-get="{{ url_for('overview', device_id=device['id']) }}" hx-trigger="load, every 2s">
+<div hx-get="{{ url_for('overview', device_id=device['id']) }}" hx-trigger="load, every 1s">
     <div class="flex justify-center">
         <div role="status">
             <svg aria-hidden="true" class="w-8 h-8 mr-2 text-gray-200 animate-spin dark:text-gray-600 fill-blue-600"