Begin hooking up staking update events

apps/extension/src/background/approvals/service.ts

@@ -22,7 +22,7 @@ export class ApprovalsService {
     protected readonly connectedTabsStore: KVStore<TabStore[]>,
     protected readonly keyRingService: KeyRingService,
     protected readonly ledgerService: LedgerService
-  ) { }
+  ) {}
 
   // Deserialize transfer details and prompt user
   async approveTransfer(txMsg: string, type?: AccountType): Promise<void> {
@@ -136,6 +136,7 @@ export class ApprovalsService {
 
     if (tx) {
       await this.keyRingService.submitBond(tx, msgId);
+      await this.ledgerService.broadcastUpdateStaking();
 
       return await this._clearPendingTx(msgId);
     }

apps/extension/src/background/index.ts

@@ -102,7 +102,8 @@ const { REACT_APP_NAMADA_URL = DEFAULT_URL } = process.env;
     connectedTabsStore,
     txStore,
     defaultChainId,
-    sdk
+    sdk,
+    requester
   );
   const approvalsService = new ApprovalsService(
     txStore,

apps/extension/src/background/keyring/service.ts

@@ -404,7 +404,7 @@ export class KeyRingService {
     return Sdk.has_masp_params();
   }
 
-  private async broadcastUpdateBalance(): Promise<void> {
+  async broadcastUpdateBalance(): Promise<void> {
     const tabs = await syncTabs(
       this.connectedTabsStore,
       this.requester,

apps/extension/src/background/ledger/service.ts

@@ -17,8 +17,16 @@ import { IStore, KVStore, Store } from "@anoma/storage";
 import { chains } from "@anoma/chains";
 import { makeBip44Path } from "@anoma/utils";
 
-import { AccountStore, KeyRingService, TabStore } from "background/keyring";
+import {
+  AccountStore,
+  KeyRingService,
+  TabStore,
+  syncTabs,
+} from "background/keyring";
 import { generateId } from "utils";
+import { ExtensionRequester } from "extension";
+import { Ports } from "router";
+import { UpdatedStakingEventMsg } from "content/events";
 
 export const LEDGERSTORE_KEY = "ledger-store";
 const UUID_NAMESPACE = "be9fdaee-ffa2-11ed-8ef1-325096b39f47";
@@ -32,7 +40,8 @@ export class LedgerService {
     protected readonly connectedTabsStore: KVStore<TabStore[]>,
     protected readonly txStore: KVStore<string>,
     protected readonly chainId: string,
-    protected readonly sdk: Sdk
+    protected readonly sdk: Sdk,
+    protected readonly requester: ExtensionRequester
   ) {
     this._ledgerStore = new Store(LEDGERSTORE_KEY, kvStore);
   }
@@ -257,11 +266,15 @@ export class LedgerService {
         new Uint8Array(rawSig)
       );
 
+      await this.broadcastUpdateStaking();
+
       // Clear pending tx if successful
       await this.txStore.set(msgId, null);
     } catch (e) {
       console.warn(e);
     }
+
+    await this.keyring.broadcastUpdateBalance();
   }
 
   /**
@@ -301,4 +314,25 @@ export class LedgerService {
     // Set active account ID
     await this.keyring.setActiveAccount(id, AccountType.Ledger);
   }
+
+  async broadcastUpdateStaking(): Promise<void> {
+    const tabs = await syncTabs(
+      this.connectedTabsStore,
+      this.requester,
+      this.chainId
+    );
+    try {
+      tabs?.forEach(({ tabId }: TabStore) => {
+        this.requester.sendMessageToTab(
+          tabId,
+          Ports.WebBrowser,
+          new UpdatedStakingEventMsg(this.chainId)
+        );
+      });
+    } catch (e) {
+      console.warn(e);
+    }
+
+    return;
+  }
 }

apps/extension/src/content/events.ts

@@ -102,11 +102,36 @@ export class UpdatedBalancesEventMsg extends Message<void> {
   }
 }
 
+export class UpdatedStakingEventMsg extends Message<void> {
+  public static type(): Events {
+    return Events.UpdatedStaking;
+  }
+
+  constructor(public readonly chainId: string) {
+    super();
+  }
+
+  validate(): void {
+    if (!this.chainId) {
+      throw new Error("chainId must not be empty");
+    }
+  }
+
+  route(): string {
+    return Routes.InteractionForeground;
+  }
+
+  type(): string {
+    return UpdatedBalancesEventMsg.type();
+  }
+}
+
 export function initEvents(router: Router): void {
   router.registerMessage(AccountChangedEventMsg);
   router.registerMessage(TransferStartedEvent);
   router.registerMessage(TransferCompletedEvent);
   router.registerMessage(UpdatedBalancesEventMsg);
+  router.registerMessage(UpdatedStakingEventMsg);
 
   router.addHandler(Routes.InteractionForeground, (_, msg) => {
     const clonedMsg =
@@ -135,6 +160,9 @@ export function initEvents(router: Router): void {
       case UpdatedBalancesEventMsg:
         window.dispatchEvent(new CustomEvent(Events.UpdatedBalances));
         break;
+      case UpdatedStakingEventMsg:
+        window.dispatchEvent(new CustomEvent(Events.UpdatedStaking));
+        break;
       default:
         throw new Error("Unknown msg type");
     }

apps/extension/src/test/init.ts

@@ -111,7 +111,8 @@ export const init = async (): Promise<{
     connectedTabsStore,
     txStore,
     chainId,
-    sdk
+    sdk,
+    requester
   );
 
   const approvalsService = new ApprovalsService(

apps/namada-interface/src/services/extensionEvents/handlers/anoma.ts

@@ -6,6 +6,7 @@ import { Anoma } from "@anoma/integrations";
 import { addAccounts, fetchBalances } from "slices/accounts";
 import { actions as notificationsActions } from "slices/notifications";
 import { getToast, Toasts } from "slices/transfers";
+import { fetchValidators } from "slices/StakingAndGovernance/actions";
 
 export const AnomaAccountChangedHandler =
   (dispatch: Dispatch<unknown>, integration: Anoma) =>
@@ -26,6 +27,11 @@ export const AnomaUpdatedBalancesHandler =
     dispatch(fetchBalances());
   };
 
+export const AnomaUpdatedStakingHandler =
+  (dispatch: Dispatch<unknown>) => async () => {
+    dispatch(fetchValidators());
+  };
+
 export const AnomaTransferStartedHandler =
   (dispatch: Dispatch<unknown>) => async (event: CustomEventInit) => {
     const { msgId } = event.detail;

apps/namada-interface/src/services/extensionEvents/provider.tsx

@@ -15,6 +15,7 @@ import {
   AnomaTransferCompletedHandler,
   AnomaTransferStartedHandler,
   AnomaUpdatedBalancesHandler,
+  AnomaUpdatedStakingHandler,
   KeplrAccountChangedHandler,
   MetamaskAccountChangedHandler,
 } from "./handlers";
@@ -35,6 +36,7 @@ export const ExtensionEventsProvider: React.FC = (props): JSX.Element => {
   const anomaTransferStartedHandler = AnomaTransferStartedHandler(dispatch);
   const anomaTransferCompletedHandler = AnomaTransferCompletedHandler(dispatch);
   const anomaUpdatedBalancesHandler = AnomaUpdatedBalancesHandler(dispatch);
+  const anomaUpdatedStakingHandler = AnomaUpdatedStakingHandler(dispatch);
 
   // Keplr handlers
   const keplrAccountChangedHandler = KeplrAccountChangedHandler(
@@ -53,6 +55,7 @@ export const ExtensionEventsProvider: React.FC = (props): JSX.Element => {
   useEventListenerOnce(Events.TransferStarted, anomaTransferStartedHandler);
   useEventListenerOnce(Events.TransferCompleted, anomaTransferCompletedHandler);
   useEventListenerOnce(Events.UpdatedBalances, anomaUpdatedBalancesHandler);
+  useEventListenerOnce(Events.UpdatedStaking, anomaUpdatedStakingHandler);
   useEventListenerOnce(KeplrEvents.AccountChanged, keplrAccountChangedHandler);
   useEventListenerOnce(
     MetamaskEvents.AccountChanged,

packages/types/src/events.ts

@@ -6,6 +6,7 @@ export enum Events {
   TransferStarted = "anoma-transfer-started",
   TransferCompleted = "anoma-transfer-completed",
   UpdatedBalances = "anoma-updated-balances",
+  UpdatedStaking = "anoma-updated-staking",
 }
 
 // Keplr extension events