Merge pull request #345 from near/dev

v5.0.0 Release (dev -> main)
near · Jul 4, 2022 · 7f9f859 · 7f9f859
2 parents be3fa35 + 9b993ce
commit 7f9f859
Show file tree

Hide file tree

Showing 80 changed files with 2,002 additions and 647 deletions.
diff --git a/README.md b/README.md
@@ -9,6 +9,7 @@ NEAR Wallet Selector makes it easy for users to interact with your dApp by provi
 - [Nightly](https://www.npmjs.com/package/@near-wallet-selector/nightly) - Injected wallet.
 - [Ledger](https://www.npmjs.com/package/@near-wallet-selector/ledger) - Hardware wallet.
 - [WalletConnect](https://www.npmjs.com/package/@near-wallet-selector/wallet-connect) - Bridge wallet.
+- [Nightly Connect](https://www.npmjs.com/package/@near-wallet-selector/nightly-connect) - Bridge wallet.
 
 ## Preview
 
@@ -39,7 +40,8 @@ yarn add \
   @near-wallet-selector/math-wallet \
   @near-wallet-selector/nightly \
   @near-wallet-selector/ledger \
-  @near-wallet-selector/wallet-connect
+  @near-wallet-selector/wallet-connect \
+  @near-wallet-selector/nightly-connect 
 
 # Using NPM.
 npm install \
@@ -49,7 +51,8 @@ npm install \
   @near-wallet-selector/math-wallet \
   @near-wallet-selector/nightly \
   @near-wallet-selector/ledger \
-  @near-wallet-selector/wallet-connect
+  @near-wallet-selector/wallet-connect \
+  @near-wallet-selector/nightly-connect
 ```
 
 Optionally, you can install our [`modal-ui`](https://www.npmjs.com/package/@near-wallet-selector/modal-ui) package for a pre-built interface that wraps the `core` API and presents the supported wallets:
@@ -74,6 +77,7 @@ import { setupMathWallet } from "@near-wallet-selector/math-wallet";
 import { setupNightly } from "@near-wallet-selector/nightly";
 import { setupLedger } from "@near-wallet-selector/ledger";
 import { setupWalletConnect } from "@near-wallet-selector/wallet-connect";
+import { setupNightlyConnect } from "@near-wallet-selector/nightly-connect";
 
 const selector = await setupWalletSelector({
   network: "testnet",
@@ -93,6 +97,15 @@ const selector = await setupWalletSelector({
         icons: ["https://avatars.githubusercontent.com/u/37784886"],
       },
     }),
+    setupNightlyConnect({
+      url: "wss://ncproxy.nightly.app/app",
+      appMetadata: {
+        additionalInfo: "",
+        application: "NEAR Wallet Selector",
+        description: "Example dApp used by NEAR Wallet Selector",
+        icon: "https://near.org/wp-content/uploads/2020/09/cropped-favicon-192x192.png",
+      },
+    }),
   ],
 });
 

diff --git a/examples/angular/project.json b/examples/angular/project.json
@@ -52,6 +52,11 @@
             "glob": "**/*",
             "input": "packages/wallet-connect/assets/",
             "output": "assets/"
+          },
+          {
+            "glob": "**/*",
+            "input": "packages/nightly-connect/assets/",
+            "output": "assets/"
           }
         ],
         "styles": ["examples/angular/src/styles.scss"],

diff --git a/examples/angular/src/app/app.component.ts b/examples/angular/src/app/app.component.ts
@@ -8,6 +8,7 @@ import { setupMathWallet } from "@near-wallet-selector/math-wallet";
 import { setupNightly } from "@near-wallet-selector/nightly";
 import { setupLedger } from "@near-wallet-selector/ledger";
 import { setupWalletConnect } from "@near-wallet-selector/wallet-connect";
+import { setupNightlyConnect } from "@near-wallet-selector/nightly-connect";
 import { setupModal } from "@near-wallet-selector/modal-ui";
 import type { WalletSelectorModal } from "@near-wallet-selector/modal-ui";
 import { CONTRACT_ID } from "../constants";
@@ -37,30 +38,6 @@ export class AppComponent implements OnInit {
     });
   }
 
-  syncAccountState(
-    currentAccountId: string | null,
-    newAccounts: Array<AccountState>
-  ) {
-    if (!newAccounts.length) {
-      localStorage.removeItem("accountId");
-      this.accountId = null;
-      this.accounts = [];
-
-      return;
-    }
-
-    const validAccountId =
-      currentAccountId &&
-      newAccounts.some((x) => x.accountId === currentAccountId);
-    const newAccountId = validAccountId
-      ? currentAccountId
-      : newAccounts[0].accountId;
-
-    localStorage.setItem("accountId", newAccountId);
-    this.accountId = newAccountId;
-    this.accounts = newAccounts;
-  }
-
   async initialize() {
     const _selector = await setupWalletSelector({
       network: "testnet",
@@ -81,13 +58,24 @@ export class AppComponent implements OnInit {
             icons: ["https://avatars.githubusercontent.com/u/37784886"],
           },
         }),
+        setupNightlyConnect({
+          url: "wss://ncproxy.nightly.app/app",
+          appMetadata: {
+            additionalInfo: "",
+            application: "NEAR Wallet Selector",
+            description: "Example dApp used by NEAR Wallet Selector",
+            icon: "https://near.org/wp-content/uploads/2020/09/cropped-favicon-192x192.png",
+          },
+        }),
       ],
     });
 
     const _modal = setupModal(_selector, { contractId: CONTRACT_ID });
     const state = _selector.store.getState();
 
-    this.syncAccountState(localStorage.getItem("accountId"), state.accounts);
+    this.accounts = state.accounts;
+    this.accountId =
+      state.accounts.find((account) => account.active)?.accountId || null;
 
     window.selector = _selector;
     window.modal = _modal;

diff --git a/examples/angular/src/app/components/content/content.component.ts b/examples/angular/src/app/components/content/content.component.ts
@@ -106,37 +106,9 @@ export class ContentComponent implements OnInit, OnDestroy {
 
     const nextAccountId = this.accounts[nextIndex].accountId;
 
-    this.accountId = nextAccountId;
-    alert("Switched account to " + nextAccountId);
-
-    this.account = null;
-    this.getAccount().then((account) => {
-      this.account = account;
-    });
-  }
-
-  syncAccountState(
-    currentAccountId: string | null,
-    newAccounts: Array<AccountState>
-  ) {
-    if (!newAccounts.length) {
-      localStorage.removeItem("accountId");
-      this.accountId = null;
-      this.accounts = [];
-
-      return;
-    }
-
-    const validAccountId =
-      currentAccountId &&
-      newAccounts.some((x) => x.accountId === currentAccountId);
-    const newAccountId = validAccountId
-      ? currentAccountId
-      : newAccounts[0].accountId;
+    this.selector.setActiveAccount(nextAccountId);
 
-    localStorage.setItem("accountId", newAccountId);
-    this.accountId = newAccountId;
-    this.accounts = newAccounts;
+    alert("Switched account to " + nextAccountId);
   }
 
   subscribeToEvents() {
@@ -148,15 +120,13 @@ export class ContentComponent implements OnInit, OnDestroy {
       .subscribe((nextAccounts) => {
         console.log("Accounts Update", nextAccounts);
 
-        const prevAccountId = this.accountId;
+        this.accounts = nextAccounts;
+        this.accountId =
+          nextAccounts.find((account) => account.active)?.accountId || null;
 
-        this.syncAccountState(this.accountId, nextAccounts);
-
-        if (prevAccountId !== this.accountId) {
-          this.getAccount().then((account) => {
-            this.account = account;
-          });
-        }
+        this.getAccount().then((account) => {
+          this.account = account;
+        });
       });
   }
 

diff --git a/examples/react/project.json b/examples/react/project.json
@@ -52,6 +52,11 @@
             "glob": "**/*",
             "input": "packages/wallet-connect/assets/",
             "output": "assets/"
+          },
+          {
+            "glob": "**/*",
+            "input": "packages/nightly-connect/assets/",
+            "output": "assets/"
           }
         ],
         "styles": ["examples/react/src/styles.scss"],

diff --git a/examples/react/src/components/Content.tsx b/examples/react/src/components/Content.tsx
@@ -19,8 +19,7 @@ const SUGGESTED_DONATION = "0";
 const BOATLOAD_OF_GAS = utils.format.parseNearAmount("0.00000000003")!;
 
 const Content: React.FC = () => {
-  const { selector, modal, accounts, accountId, setAccountId } =
-    useWalletSelector();
+  const { selector, modal, accounts, accountId } = useWalletSelector();
   const [account, setAccount] = useState<Account | null>(null);
   const [messages, setMessages] = useState<Array<Message>>([]);
   const [loading, setLoading] = useState<boolean>(false);
@@ -103,73 +102,73 @@ const Content: React.FC = () => {
 
     const nextAccountId = accounts[nextIndex].accountId;
 
-    setAccountId(nextAccountId);
+    selector.setActiveAccount(nextAccountId);
+
     alert("Switched account to " + nextAccountId);
   };
 
-  const addMessages = async (
-    message: string,
-    donation: string,
-    multiple: boolean
-  ) => {
-    const { contract } = selector.store.getState();
-    const wallet = await selector.wallet();
+  const addMessages = useCallback(
+    async (message: string, donation: string, multiple: boolean) => {
+      const { contract } = selector.store.getState();
+      const wallet = await selector.wallet();
+
+      if (!multiple) {
+        return wallet
+          .signAndSendTransaction({
+            signerId: accountId!,
+            actions: [
+              {
+                type: "FunctionCall",
+                params: {
+                  methodName: "addMessage",
+                  args: { text: message },
+                  gas: BOATLOAD_OF_GAS,
+                  // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
+                  deposit: utils.format.parseNearAmount(donation)!,
+                },
+              },
+            ],
+          })
+          .catch((err) => {
+            alert("Failed to add message");
+            console.log("Failed to add message");
+
+            throw err;
+          });
+      }
+
+      const transactions: Array<Transaction> = [];
 
-    if (!multiple) {
-      return wallet
-        .signAndSendTransaction({
+      for (let i = 0; i < 2; i += 1) {
+        transactions.push({
           signerId: accountId!,
+          receiverId: contract!.contractId,
           actions: [
             {
               type: "FunctionCall",
               params: {
                 methodName: "addMessage",
-                args: { text: message },
+                args: {
+                  text: `${message} (${i + 1}/2)`,
+                },
                 gas: BOATLOAD_OF_GAS,
                 // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
                 deposit: utils.format.parseNearAmount(donation)!,
               },
             },
           ],
-        })
-        .catch((err) => {
-          alert("Failed to add message");
-          console.log("Failed to add message");
-
-          throw err;
         });
-    }
+      }
 
-    const transactions: Array<Transaction> = [];
-
-    for (let i = 0; i < 2; i += 1) {
-      transactions.push({
-        signerId: accountId!,
-        receiverId: contract!.contractId,
-        actions: [
-          {
-            type: "FunctionCall",
-            params: {
-              methodName: "addMessage",
-              args: {
-                text: `${message} (${i + 1}/2)`,
-              },
-              gas: BOATLOAD_OF_GAS,
-              // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-              deposit: utils.format.parseNearAmount(donation)!,
-            },
-          },
-        ],
-      });
-    }
+      return wallet.signAndSendTransactions({ transactions }).catch((err) => {
+        alert("Failed to add messages");
+        console.log("Failed to add messages");
 
-    return wallet.signAndSendTransactions({ transactions }).catch((err) => {
-      alert("Failed to add messages");
-      console.log("Failed to add messages");
-
-      throw err;
-    });
-  };
+        throw err;
+      });
+    },
+    [selector, accountId]
+  );
 
   const handleSubmit = useCallback(
     async (e: SubmitEvent) => {
@@ -205,7 +204,7 @@ const Content: React.FC = () => {
           fieldset.disabled = false;
         });
     },
-    [selector, accountId, getMessages]
+    [addMessages, getMessages]
   );
 
   if (loading) {