Wallet construct with parameter (#676)

* Add walletURL to the the WalletSession

* Update type for walletURL and changelog.md

* Add type HttpNetworkConfig to types

* Solve conflict changelog.md

* Update changelog.md and fix export function algoexploer

* Update changelog.md

* push develop to this branch

Co-authored-by: Trương Long <[email protected]>

Author: thdailong

CHANGELOG.md

@@ -119,7 +119,8 @@ console.log("txn1 information: ", receipts[2]);
 - Allow token to be empty.
 - Throw error when issue inner transactions in clear program. Fixed in [#667](https://github.com/scale-it/algo-builder/pull/667).
 - Parameters in `extract*` opcodes can greater than uint8. Fixed in [#666](https://github.com/scale-it/algo-builder/pull/666).
-- Restirct duplicate transaction in group transaction.
+- Wallet contructor come from a parameter walletURL(token, server, port)
+- Restirct duplicate transaction in group transaction. 
 
 ### Infrastructure
 

docs/tutorials/t-08.md

@@ -72,7 +72,12 @@ We use `connectAlgoSigner()` method to connect the AlgoSigner wallet. Next, we c
 ```js
    async connectMyAlgoWallet() {
       try {
-        let myAlgo = new MyAlgoWalletSession(ChainType.MainNet);
+        let walletURL = {
+          token: "",
+          server: "https://node.algoexplorerapi.io",
+          port: "",
+        }
+        let myAlgo = new MyAlgoWalletSession(walletURL);
         await myAlgo.connectToMyAlgo();
         if (myAlgo.accounts.length) {
           this.walletAddress = myAlgo.accounts[0].address;
@@ -88,7 +93,12 @@ We use `connectAlgoSigner()` method to connect the AlgoSigner wallet. Next, we c
 ```js
    async connectWalletConnect() {
       try {
-        let walletConnector = new WallectConnectSession(ChainType.MainNet);
+        let walletURL = {
+          token: "",
+          server: "https://node.algoexplorerapi.io",
+          port: "",
+        }
+        let walletConnector = new WallectConnectSession(walletURL);
         await walletConnector.create(true);
         walletConnector.onConnect((error, response) => {
           if (response.accounts.length) {

packages/web/README.md

@@ -34,19 +34,33 @@ You can connect to `web` package in your react app by using different wallets. C
 ```
 2.  ### MyAlgo Wallet:
 
-    Create an instance of the `MyAlgoWalletSession` class by passing the chain name and connect it using `connectToMyAlgo`.
+    Create an instance of the `MyAlgoWalletSession` class by passing the walletURL(token, server, port) and connect it using `connectToMyAlgo`.
 
-```js
-    const wcSession = new MyAlgoWalletSession(CHAIN_NAME)
+
+    ```js
+    const walletURL = {
+         token: token,
+         host: host,
+         port: port,
+    }
+    const wcSession = new MyAlgoWalletSession(walletURL)  
     await wcSession.connectToMyAlgo();
-```
+    ```
+
 
 3.  ### Wallet Connect:
 
-    Create an instance of the `WallectConnectSession` class by passing the chain name and create a new session using `create` and connect to it using `onConnect`.
+    Create an instance of the `WallectConnectSession` class by passing the walletURL(token, server, port) and create a new session using `create` and connect to it using `onConnect`.
+
+
+    ```js
+    const walletURL = {
+         token: token,
+         host: host,
+         port: port,
+    }
+    const wcSession = new WallectConnectSession(walletURL);
 
-```js
-    const wcSession = new WallectConnectSession(CHAIN_NAME);
     await wcSession.create(true);
     wcSession.onConnect((error, response) => console.log(error, response));
 ```

packages/web/src/lib/api.ts

@@ -1,22 +1,9 @@
 import algosdk, { Algodv2, ALGORAND_MIN_TX_FEE, SuggestedParams } from "algosdk";
 
-import { ChainType, TxParams } from "../types";
-import { betanetURL, mainnetURL, testnetURL } from "./constants";
+import { HttpNetworkConfig, TxParams } from "../types";
 
-export function algoexplorerAlgod(chain: string): algosdk.Algodv2 {
-	const mainnetAlgoExplorer = new Algodv2("", mainnetURL, "");
-	const testnetAlgoExplorer = new Algodv2("", testnetURL, "");
-	const betanetAlgoExplorer = new Algodv2("", betanetURL, "");
-	switch (chain) {
-		case ChainType.MainNet:
-			return mainnetAlgoExplorer;
-		case ChainType.TestNet:
-			return testnetAlgoExplorer;
-		case ChainType.BetaNet:
-			return betanetAlgoExplorer;
-		default:
-			throw new Error(`Unknown chain type: ${chain}`);
-	}
+export function algoexplorerAlgod(walletURL: HttpNetworkConfig): algosdk.Algodv2 {
+	return new Algodv2(walletURL.token, walletURL.server, walletURL.port);
 }
 
 /**

packages/web/src/lib/myalgowallet-mode.ts

@@ -10,7 +10,7 @@ import type {
 import algosdk, { Transaction } from "algosdk";
 
 import { mkTxParams } from "..";
-import { ExecParams, TransactionInGroup } from "../types";
+import { ExecParams, HttpNetworkConfig, TransactionInGroup } from "../types";
 import { algoexplorerAlgod } from "./api";
 import { WAIT_ROUNDS } from "./constants";
 import { error, log } from "./logger";
@@ -57,8 +57,8 @@ export class MyAlgoWalletSession {
 	accounts: Accounts[] = [];
 	addresses: Address[] = [];
 
-	constructor(chain: string, connector?: MyAlgoConnect) {
-		this.algodClient = algoexplorerAlgod(chain);
+	constructor(walletURL: HttpNetworkConfig, connector?: MyAlgoConnect) {
+		this.algodClient = algoexplorerAlgod(walletURL);
 		try {
 			const MyAlgoConnect = require("@randlabs/myalgo-connect"); // eslint-disable-line @typescript-eslint/no-var-requires
 			if (connector) {

packages/web/src/lib/wallectconnect-mode.ts

@@ -6,6 +6,7 @@ import algosdk, { Transaction } from "algosdk";
 import { WalletTransaction } from "../algo-signer-types";
 import {
 	ExecParams,
+	HttpNetworkConfig,
 	isSDKTransactionAndSign,
 	SessionConnectResponse,
 	SessionDisconnectResponse,
@@ -24,8 +25,8 @@ export class WallectConnectSession {
 	private readonly algodClient: algosdk.Algodv2;
 	wcAccounts: string[];
 
-	constructor(chain: string, connector?: WalletConnect) {
-		this.algodClient = algoexplorerAlgod(chain);
+	constructor(walletURL: HttpNetworkConfig, connector?: WalletConnect) {
+		this.algodClient = algoexplorerAlgod(walletURL);
 		if (connector) {
 			this.connector = connector;
 		} else {

packages/web/src/types.ts

@@ -370,3 +370,18 @@ export interface TransactionInGroup {
 	msig?: WalletMultisigMetadata;
 	message?: string;
 }
+
+export interface AlgodTokenHeader {
+	"X-Algo-API-Token": string;
+}
+
+export interface CustomTokenHeader {
+	[headerName: string]: string;
+}
+
+export interface HttpNetworkConfig {
+	server: string; // with optional http o https prefix
+	port: string | number;
+	token: string | AlgodTokenHeader | CustomTokenHeader;
+	httpHeaders?: { [name: string]: string };
+}