Merge branch 'develop' into feat/iframes-chrome-allowed-dapps

* develop:
  chore(release): 1.0.25 [skip ci]
  fix: rpc urls for mainnet
  chore: removed console log
  fix: allow custom provider for argent mobile connector
  fix: allow custom provider for webwallet connector
  fix: allow custom provider for injected connectors
  chore(release): 1.0.24 [skip ci]
  fix: argent mobile connector icon url parameter
  chore(release): 1.0.23 [skip ci]
  fix: prevent creating multiple root divs
  chore: update sn.js version
  chore(release): 1.0.22 [skip ci]
  fix: use rpc provider instead of sequencer for webwallet

package.json

@@ -1,6 +1,6 @@
 {
   "name": "starknetkit",
-  "version": "1.0.21",
+  "version": "1.0.25",
   "repository": "github:argentlabs/starknetkit",
   "private": false,
   "browser": {
@@ -104,7 +104,7 @@
     "zod": "^3.20.6"
   },
   "peerDependencies": {
-    "starknet": "^5.18.0"
+    "starknet": "^5.24.3"
   },
   "gitHead": "b16688a8638cc138938e74e1a39d004760165d75"
 }

src/connectors/argentMobile/index.ts

@@ -2,7 +2,7 @@ import type {
   AccountChangeEventHandler,
   StarknetWindowObject,
 } from "get-starknet-core"
-import type { AccountInterface } from "starknet"
+import type { AccountInterface, ProviderInterface } from "starknet"
 import { constants } from "starknet"
 import { DEFAULT_ARGENT_MOBILE_ICON, DEFAULT_PROJECT_ID } from "./constants"
 import {
@@ -25,6 +25,8 @@ export interface ArgentMobileConnectorOptions {
   chainId?: constants.NetworkName
   description?: string
   url?: string
+  icons?: string[]
+  provider?: ProviderInterface
 }
 
 export class ArgentMobileConnector extends Connector {
@@ -143,13 +145,19 @@ export class ArgentMobileConnector extends Connector {
 
   private async ensureWallet(): Promise<void> {
     const { getStarknetWindowObject } = await import("./modal")
-    const { chainId, projectId, dappName, description, url } = this._options
+    const { chainId, projectId, dappName, description, url, icons } =
+      this._options
     const options = {
       chainId: chainId ?? constants.NetworkName.SN_MAIN,
       name: dappName,
       projectId: projectId ?? DEFAULT_PROJECT_ID,
       description,
       url,
+      icons,
+      rpcUrl:
+        chainId === constants.NetworkName.SN_MAIN
+          ? "https://cloud.argent-api.com/v1/starknet/mainnet/rpc/v0.5"
+          : "https://api.hydrogen.argent47.net/v1/starknet/goerli/rpc/v0.5",
     }
 
     if (projectId === DEFAULT_PROJECT_ID) {
@@ -168,6 +176,14 @@ export class ArgentMobileConnector extends Connector {
     }
 
     const _wallet = await getStarknetWindowObject(options)
+
+    const { provider } = this._options
+    if (provider) {
+      Object.assign(_wallet, {
+        provider,
+      })
+    }
+
     this._wallet = _wallet
 
     // wallet connect rpc enable

src/connectors/argentMobile/modal/login.ts

@@ -15,6 +15,7 @@ export interface IArgentLoginOptions {
   name?: string
   description?: string
   url?: string
+  icons?: string[]
   chainId?: string | number
   rpcUrl?: string
   bridgeUrl?: string
@@ -34,6 +35,7 @@ export const login = async <TAdapter extends NamespaceAdapter>(
     mobileUrl = getMobileUrl(chainId),
     modalType = "overlay",
     url,
+    icons,
     walletConnect,
   }: IArgentLoginOptions,
   Adapter: new (options: NamespaceAdapterOptions) => TAdapter,
@@ -55,7 +57,7 @@ export const login = async <TAdapter extends NamespaceAdapter>(
       name: name ?? "Unknown dapp",
       description: description ?? "Unknown dapp description",
       url: url ?? "#",
-      icons: ["https://walletconnect.com/walletconnect-logo.png"],
+      icons: icons ?? [],
       ...walletConnect?.metadata,
     },
   }

src/connectors/argentMobile/modal/starknet/adapter.ts

@@ -11,7 +11,7 @@ import type {
   ProviderInterface,
   SignerInterface,
 } from "starknet"
-import { Provider, constants } from "starknet"
+import { RpcProvider, constants } from "starknet"
 
 import type { NamespaceAdapterOptions } from "../adapter"
 import { NamespaceAdapter } from "../adapter"
@@ -84,12 +84,7 @@ export class StarknetAdapter
 
     this.remoteSigner = new StarknetRemoteSigner(this.walletRpc)
 
-    if (rpcUrl) {
-      this.provider = new Provider({ rpc: { nodeUrl: rpcUrl } })
-    } else {
-      const network = this.getNetworkName(this.chainId)
-      this.provider = new Provider({ sequencer: { network } })
-    }
+    this.provider = new RpcProvider({ nodeUrl: rpcUrl })
     this.account = new StarknetRemoteAccount(
       this.provider,
       "",

src/connectors/injected/index.ts

@@ -1,5 +1,5 @@
 import type { StarknetWindowObject } from "get-starknet-core"
-import { AccountInterface, constants } from "starknet"
+import { AccountInterface, ProviderInterface, constants } from "starknet"
 import {
   ConnectorNotConnectedError,
   ConnectorNotFoundError,
@@ -23,6 +23,8 @@ export interface InjectedConnectorOptions {
   name?: string
   /** Wallet icons. */
   icon?: ConnectorIcons
+  /** Provider */
+  provider?: ProviderInterface
 }
 
 export class InjectedConnector extends Connector {
@@ -211,6 +213,13 @@ export class InjectedConnector extends Connector {
     const installed = getAvailableWallets(globalThis)
     const wallet = installed.filter((w) => w.id === this._options.id)[0]
     if (wallet) {
+      const { provider } = this._options
+      if (provider) {
+        Object.assign(wallet, {
+          provider,
+        })
+      }
+
       this._wallet = wallet
     }
   }

src/connectors/webwallet/constants.ts

@@ -20,3 +20,8 @@ export const TESTNET_WHITELIST_URL =
 
 export const MAINNET_WHITELIST_URL =
   "https://static.argent.xyz/webwallet/iframe_whitelist_mainnet.json"
+export const RPC_NODE_URL_TESTNET =
+  "https://api.hydrogen.argent47.net/v1/starknet/goerli/rpc/v0.5"
+
+export const RPC_NODE_URL_MAINNET =
+  "https://cloud.argent-api.com/v1/starknet/mainnet/rpc/v0.5"

src/connectors/webwallet/helpers/mapTargetUrlToNodeUrl.ts

@@ -0,0 +1,24 @@
+import { RPC_NODE_URL_MAINNET, RPC_NODE_URL_TESTNET } from "../constants"
+
+export function mapTargetUrlToNodeUrl(target: string): string {
+  try {
+    const { origin } = new URL(target)
+    if (origin.includes("localhost") || origin.includes("127.0.0.1")) {
+      return RPC_NODE_URL_TESTNET
+    }
+    if (origin.includes("hydrogen")) {
+      return RPC_NODE_URL_TESTNET
+    }
+    if (origin.includes("staging")) {
+      return RPC_NODE_URL_MAINNET
+    }
+    if (origin.includes("argent.xyz")) {
+      return RPC_NODE_URL_MAINNET
+    }
+  } catch (e) {
+    console.warn(
+      "Could not determine rpc nodeUrl from target URL, defaulting to mainnet",
+    )
+  }
+  return RPC_NODE_URL_MAINNET
+}

src/connectors/webwallet/helpers/openWebwallet.ts

@@ -4,6 +4,7 @@ import { trpcProxyClient } from "./trpc"
 import type { StarknetWindowObject } from "get-starknet-core"
 import { mapTargetUrlToNetworkId } from "../../../helpers/mapTargetUrlToNetworkId"
 import { fetchAllowedDapps } from "./fetchAllowedDapps"
+import { ProviderInterface } from "starknet"
 
 const checkIncognitoChrome = async (isChrome: boolean) => {
   return new Promise((resolve) => {
@@ -33,6 +34,7 @@ const checkIncognitoChrome = async (isChrome: boolean) => {
 
 export const openWebwallet = async (
   origin: string,
+  provider: ProviderInterface,
 ): Promise<StarknetWindowObject | null> => {
   const { userAgent } = navigator
   const isChrome = Boolean(
@@ -49,7 +51,12 @@ export const openWebwallet = async (
   // use the popup mode and avoid checking allowed dapps for iframes
   if (!isChrome || isChromeIncognito) {
     const windowProxyClient = trpcProxyClient({})
-    return await getWebWalletStarknetObject(origin, windowProxyClient)
+    return await getWebWalletStarknetObject(
+      origin,
+      windowProxyClient,
+      null,
+      provider,
+    )
   }
 
   const network = mapTargetUrlToNetworkId(origin)
@@ -64,11 +71,17 @@ export const openWebwallet = async (
         origin,
         trpcProxyClient({ iframe: iframe.contentWindow }),
         { modal, iframe },
+        provider,
       )
       return starknetWindowObject
     }
   } else {
     const windowProxyClient = trpcProxyClient({})
-    return await getWebWalletStarknetObject(origin, windowProxyClient)
+    return await getWebWalletStarknetObject(
+      origin,
+      windowProxyClient,
+      null,
+      provider,
+    )
   }
 }

src/connectors/webwallet/index.ts

@@ -2,7 +2,7 @@ import type {
   AccountChangeEventHandler,
   StarknetWindowObject,
 } from "get-starknet-core"
-import type { AccountInterface } from "starknet"
+import type { AccountInterface, ProviderInterface } from "starknet"
 import {
   Connector,
   type ConnectorData,
@@ -23,6 +23,7 @@ let _wallet: StarknetWindowObject | null = null
 
 interface WebWalletConnectorOptions {
   url?: string
+  provider?: ProviderInterface
 }
 
 export class WebWalletConnector extends Connector {
@@ -168,7 +169,7 @@ export class WebWalletConnector extends Connector {
       location: "/interstitialLogin",
     })
 
-    _wallet = await openWebwallet(origin)
+    _wallet = await openWebwallet(origin, this._options.provider)
 
     this._wallet = _wallet
   }

src/connectors/webwallet/starknetWindowObject/getWebWalletStarknetObject.ts

@@ -1,11 +1,11 @@
 import type { CreateTRPCProxyClient } from "@trpc/client"
-import { SequencerProvider } from "starknet"
+import { ProviderInterface, RpcProvider } from "starknet"
 
+import { mapTargetUrlToNodeUrl } from "../helpers/mapTargetUrlToNodeUrl"
 import type { AppRouter } from "../helpers/trpc"
 import type { WebWalletStarknetWindowObject } from "./argentStarknetWindowObject"
 import { getArgentStarknetWindowObject } from "./argentStarknetWindowObject"
 import { hideModal, setIframeHeight, showModal } from "./wormhole"
-import { mapTargetUrlToNetworkId } from "../../../helpers/mapTargetUrlToNetworkId"
 
 type IframeProps = {
   modal: HTMLDivElement
@@ -23,14 +23,15 @@ export const getWebWalletStarknetObject = async (
   target: string,
   proxyLink: CreateTRPCProxyClient<AppRouter>,
   iframeProps?: IframeProps,
+  provider?: ProviderInterface,
 ): Promise<WebWalletStarknetWindowObject> => {
   const globalWindow = typeof window !== "undefined" ? window : undefined
   if (!globalWindow) {
     throw new Error("window is not defined")
   }
 
-  const network = mapTargetUrlToNetworkId(target)
-  const defaultProvider = new SequencerProvider({ network })
+  const nodeUrl = mapTargetUrlToNodeUrl(target)
+  const defaultProvider = provider ?? new RpcProvider({ nodeUrl })
   const starknetWindowObject = getArgentStarknetWindowObject(
     {
       host: globalWindow.location.origin,