feat: update examples and wallet selector

Author: matiasbenary

examples/react/contexts/WalletSelectorContext.tsx

@@ -32,7 +32,6 @@ import { setupEthereumWallets } from "@near-wallet-selector/ethereum-wallets";
 
 import { CONTRACT_ID, NETWORK_ID } from "../constants";
 import { setupCoin98Wallet } from "@near-wallet-selector/coin98-wallet";
-import { WalletSelectorContextProvider } from "../contexts/WalletSelectorContext";
 
 const walletSelectorConfig = {
   network: NETWORK_ID,
@@ -91,11 +90,9 @@ const Home: NextPage = () => {
           <ExportContent />
         </ExportAccountSelectorContextProvider>
       ) : (
-        <WalletSelectorContextProvider>
-          <WalletSelectorProvider config={walletSelectorConfig}>
-            <Content />
-          </WalletSelectorProvider>
-        </WalletSelectorContextProvider>
+        <WalletSelectorProvider config={walletSelectorConfig}>
+          <Content />
+        </WalletSelectorProvider>
       )}
     </Fragment>
   );

examples/react/pages/index.tsx

@@ -49,10 +49,6 @@
             />
             <span title="NEAR Tokens">Ⓝ</span>
           </p>
-          <!-- <p>
-            <label htmlFor="multiple">Multiple Transactions:</label>
-            <input id="multiple" type="checkbox" />
-          </p> -->
           <button type="submit">Sign</button>
         </fieldset>
       </form>

examples/vanilla/index.html

@@ -1,15 +1,8 @@
 import { utils } from 'near-api-js';
 import { Wallet } from './near-wallet';
-import Observable from './Observable';
 
 const wallet = new Wallet({ network: 'testnet' });
 
-const observable = new Observable();
-observable.subscribe((signedAccount) => {
-  signedAccount ? signedInUI(signedAccount) : signedOutUI();
-  document.querySelector('#account-id').innerText = `, ${signedAccount}!`;
-});
-
 // Button clicks
 document.querySelector('#sign-in-button').onclick = () => { wallet.signIn(); };
 document.querySelector('#sign-out-button').onclick = () => { wallet.signOut(); };
@@ -32,10 +25,11 @@ function signedInUI(signedAccount) {
 }
 
 function renderMessages(messages, container) {
-
   container.innerHTML = '';
 
-  messages.forEach((message) => {
+  const reversedMessages = [...messages].reverse();
+
+  reversedMessages.forEach((message) => {
     const messageElement = document.createElement('p');
     messageElement.className = message.premium ? 'is-premium' : '';
     messageElement.innerHTML = `
@@ -46,10 +40,11 @@ function renderMessages(messages, container) {
   });
 }
 
-
-//
 window.onload = async () => {
-  await wallet.startUp((data) => observable.notify(data));
+  await wallet.startUp((signedAccount) =>{
+    signedAccount ? signedInUI(signedAccount) : signedOutUI();
+    document.querySelector('#account-id').innerText = `, ${signedAccount}!`;
+  });
   const messages = await wallet.viewMethod({ contractId: 'guest-book.testnet', method: 'getMessages' });
   renderMessages(messages, document.querySelector('#messages'));