show connection status poc

src/render/components/connectionStatus.vue

@@ -1,26 +1,37 @@
 <template>
-    <div>
-        <div v-if="isAlive">Nominal</div>
-        <div v-else>Connecting</div>
+    <div class="statusContainer">
+        <div>{{status}}</div>
     </div>
+
 </template>
 
 
 <script lang="ts">
 
 import { defineComponent } from 'vue'
-import { isAlive } from "@/render/shared/connectionStatus";
+import { status } from "@/render/shared/connectionStatus";
 
 export default defineComponent({
     name: "ConnectionStatus",
 
     setup() {
         return {
-            isAlive
+            status
         }
     }
 
-})
+});
 
 </script>
 
+
+<style lang="scss">
+.statusContainer {
+    width: 100vw;
+    display: flex;
+    justify-content: center;
+    :first-child {
+        margin-right: 2px;
+    }
+}
+</style>