fix(background): if wallet not connected, display default icon (#506)

* If not connected, display default icon

* Fix lint

* reduce code nesting

* Update src/background/services/tabEvents.ts

---------

Co-authored-by: Sid Vishnoi <8426945+sidvishnoi@users.noreply.github.com>

src/background/services/background.ts

@@ -150,6 +150,7 @@ export class Background {
             case PopupToBackgroundAction.DISCONNECT_WALLET:
               await this.openPaymentsService.disconnectWallet()
               await this.browser.alarms.clear(ALARM_RESET_OUT_OF_FUNDS)
+              await this.updateVisualIndicatorsForCurrentTab()
               this.sendToPopup.send('SET_STATE', { state: {}, prevState: {} })
               return
 

src/background/services/tabEvents.ts

@@ -104,9 +104,14 @@ export class TabEvents {
       ? this.tabState.tabHasAllSessionsInvalid(tabId)
       : false
   ) => {
-    const { enabled, state } = await this.storage.get(['enabled', 'state'])
+    const { enabled, connected, state } = await this.storage.get([
+      'enabled',
+      'connected',
+      'state'
+    ])
     const { path, title, isMonetized } = this.getIconAndTooltip({
       enabled,
+      connected,
       state,
       isTabMonetized,
       hasTabAllSessionsInvalid
@@ -129,18 +134,22 @@ export class TabEvents {
 
   private getIconAndTooltip({
     enabled,
+    connected,
     state,
     isTabMonetized,
     hasTabAllSessionsInvalid
   }: {
     enabled: Storage['enabled']
+    connected: Storage['connected']
     state: Storage['state']
     isTabMonetized: boolean
     hasTabAllSessionsInvalid: boolean
   }) {
     let title = this.t('appName')
     let iconData = ICONS.default
-    if (!isOkState(state) || hasTabAllSessionsInvalid) {
+    if (!connected) {
+      // use defaults
+    } else if (!isOkState(state) || hasTabAllSessionsInvalid) {
       iconData = enabled ? ICONS.enabled_warn : ICONS.disabled_warn
       const tabStateText = this.t('icon_state_actionRequired')
       title = `${title} - ${tabStateText}`