Refresh device manager with options bridge status and propagate to popup

ext/src/ui/options/Bridge.svelte

@@ -10,9 +10,10 @@
         BridgeAuthenticationError
     } from "../../lib/bridge";
     import logger from "../../lib/logger";
-
     import type { Options } from "../../lib/options";
 
+    import messaging from "../../messaging";
+
     const _ = browser.i18n.getMessage;
 
     export let opts: Options;
@@ -26,13 +27,15 @@
     let statusTitle: string;
     let statusText: Nullable<string> = null;
 
-    async function checkBridgeStatus() {
+    async function refreshBridgeStatus() {
         // Reset state
         bridgeInfo = null;
         bridgeInfoError = null;
         isLoadingInfo = true;
         statusText = null;
 
+        messaging.sendMessage({ subject: "main:refreshDeviceManager" });
+
         try {
             bridgeInfo = await bridge.getInfo();
         } catch (err) {
@@ -78,7 +81,7 @@
     }
 
     onMount(() => {
-        checkBridgeStatus();
+        refreshBridgeStatus();
     });
 
     // Updates
@@ -197,7 +200,7 @@
                     type="button"
                     class="ghost bridge__refresh"
                     title={_("optionsBridgeRefresh")}
-                    on:click={checkBridgeStatus}
+                    on:click={refreshBridgeStatus}
                 />
             </div>
 

ext/src/ui/popup/Popup.svelte

@@ -174,10 +174,11 @@
             case "popup:init":
                 appInfo = message.data.appInfo;
                 pageInfo = message.data.pageInfo;
-                isBridgeCompatible = message.data.isBridgeCompatible;
                 break;
 
             case "popup:update": {
+                isBridgeCompatible = message.data.isBridgeCompatible;
+
                 updateKnownApp();
 
                 if (

ext/src/ui/popup/styles/index.css

@@ -92,6 +92,7 @@ body {
 
 .receiver-list__not-found {
     align-items: center;
+    color: var(--secondary-color);
     display: flex;
     height: 50px;
     justify-content: center;