feat: introduce new API connection management

packages/extension-polkagate/src/class/endpointManager.ts

@@ -5,90 +5,88 @@ import type { EndpointType } from '../util/types';
 
 import { NO_PASS_PERIOD as ENDPOINT_TIMEOUT } from '../util/constants';
 
+const ENDPOINTS_NAME_IN_STORAGE = 'endpoints2';
+
 // Define types for saved endpoints and listener function
-type SavedEndpoints = Record<string, Record<string, EndpointType>>;
-type Listener = (address: string, genesisHash: string, endpoint: EndpointType) => void;
+type SavedEndpoints = Record<string, EndpointType>;
+type Listener = (genesisHash: string, endpoint: EndpointType) => void;
 
 export default class EndpointManager {
   // Store endpoints and listeners
   private endpoints: SavedEndpoints = {};
   private listeners = new Set<Listener>();
 
-  constructor() {
+  constructor () {
     // Load endpoints from storage and set up storage change listener
     this.loadFromStorage();
     chrome.storage.onChanged.addListener(this.handleStorageChange);
   }
 
   // Load endpoints from chrome storage
-  private loadFromStorage() {
-    chrome.storage.local.get('endpoints', (result: { endpoints?: SavedEndpoints }) => {
-      if (result.endpoints) {
-        this.endpoints = result.endpoints;
+  private loadFromStorage () {
+    chrome.storage.local.get(ENDPOINTS_NAME_IN_STORAGE, (result: { [ENDPOINTS_NAME_IN_STORAGE]?: SavedEndpoints }) => {
+      if (result[ENDPOINTS_NAME_IN_STORAGE]) {
+        this.endpoints = result[ENDPOINTS_NAME_IN_STORAGE];
         this.notifyListeners();
       }
     });
   }
 
   // Save endpoints to chrome storage
-  private saveToStorage() {
+  private saveToStorage () {
     try {
-      chrome.storage.local.set({ endpoints: this.endpoints }).catch(console.error);
+      chrome.storage.local.set({ [ENDPOINTS_NAME_IN_STORAGE]: this.endpoints }).catch(console.error);
     } catch (error) {
       console.error('Unable to save the endpoint inside the storage!', error);
     }
   }
 
   // Handle changes in chrome storage
   private handleStorageChange = (changes: Record<string, chrome.storage.StorageChange>, areaName: string) => {
-    if (areaName === 'local' && changes['endpoints']) {
-      this.endpoints = changes['endpoints'].newValue as SavedEndpoints;
+    if (areaName === 'local' && changes[ENDPOINTS_NAME_IN_STORAGE]) {
+      this.endpoints = changes[ENDPOINTS_NAME_IN_STORAGE].newValue as SavedEndpoints;
       this.notifyListeners();
     }
   };
 
   // Notify all listeners about endpoint changes
-  private notifyListeners() {
-    Object.entries(this.endpoints).forEach(([address, endpointInfo]) => {
-      Object.entries(endpointInfo).forEach(([genesisHash, endpoint]) => {
-        this.listeners.forEach((listener) => listener(address, genesisHash, endpoint));
-      });
+  private notifyListeners () {
+    Object.entries(this.endpoints).forEach(([genesisHash, endpointInfo]) => {
+      this.listeners.forEach((listener) => listener(genesisHash, endpointInfo));
     });
   }
 
   // Get a specific endpoint
-  get(address: string, genesisHash: string): EndpointType | undefined {
-    return this.endpoints[address]?.[genesisHash];
+  get (genesisHash: string): EndpointType | undefined {
+    return this.endpoints?.[genesisHash];
   }
 
   // Get all endpoints
-  getEndpoints(): SavedEndpoints | undefined {
+  getEndpoints (): SavedEndpoints | undefined {
     return this.endpoints;
   }
 
   // Set a specific endpoint
-  set(address: string, genesisHash: string, endpoint: EndpointType) {
-    if (!this.endpoints[address]) {
-      this.endpoints[address] = {};
+  set (genesisHash: string, endpoint: EndpointType) {
+    if (!this.endpoints[genesisHash]) {
+      this.endpoints[genesisHash] = {} as EndpointType;
     }
 
-    this.endpoints[address][genesisHash] = endpoint;
+    this.endpoints[genesisHash] = endpoint;
     this.saveToStorage();
     this.notifyListeners();
   }
 
   // Check if an endpoint should be in auto mode
-  shouldBeOnAutoMode(endpoint: EndpointType) {
+  shouldBeOnAutoMode (endpoint: EndpointType) {
     return endpoint.isAuto && (Date.now() - (endpoint.timestamp ?? 0) > ENDPOINT_TIMEOUT);
   }
 
-  // Subscribe a listener to endpoint changes
-  subscribe(listener: Listener) {
+  subscribe (listener: Listener) {
     this.listeners.add(listener);
   }
 
-  // Unsubscribe a listener from endpoint changes
-  unsubscribe(listener: Listener) {
+  unsubscribe (listener: Listener) {
     this.listeners.delete(listener);
   }
 }

packages/extension-polkagate/src/components/contexts.tsx

@@ -13,7 +13,7 @@ import { noop } from '@polkadot/util';
 const AccountContext = React.createContext<AccountsContext>({ accounts: [], hierarchy: [], master: undefined });
 const AccountsAssetsContext = React.createContext<AccountsAssetsContextType>({ accountsAssets: undefined, setAccountsAssets: noop });
 const ActionContext = React.createContext<(to?: string) => void>(noop);
-const APIContext = React.createContext<APIsContext>({ apis: {}, setIt: noop });
+const APIContext = React.createContext<APIsContext>({ apis: {}, getApi: () => Promise.resolve(undefined) });
 const AlertContext = React.createContext<AlertContextType>({ alerts: [], setAlerts: noop });
 const AuthorizeReqContext = React.createContext<AuthorizeRequest[]>([]);
 const CurrencyContext = React.createContext<CurrencyContextType>({ currency: undefined, setCurrency: noop });

packages/extension-polkagate/src/fullscreen/settings/partials/useEndpointsSetting.ts

@@ -5,7 +5,7 @@ import type React from 'react';
 
 import { useCallback, useEffect, useMemo, useReducer, useRef } from 'react';
 
-import EndpointManager2 from '../../../class/endpointManager2';
+import EndpointManager from '../../../class/endpointManager';
 import { useEndpoint, useEndpoints, useIsExtensionPopup } from '../../../hooks';
 import CalculateNodeDelay from '../../../util/calculateNodeDelay';
 import { AUTO_MODE } from '../../../util/constants';
@@ -60,7 +60,7 @@ function reducer (state: State, action: Action): State {
   }
 }
 
-const endpointManager = new EndpointManager2();
+const endpointManager = new EndpointManager();
 
 export default function useEndpointsSetting (genesisHash: string | undefined, isEnabled: boolean, onEnableChain?: (value: string, checked: boolean) => void, onClose?: () => void) {
   const isExtension = useIsExtensionPopup();