Development

.github/workflows/deploy-next.yml

@@ -0,0 +1,41 @@
+name: deploy-next
+
+on:
+  repository_dispatch:
+    types: deploy-next
+  workflow_dispatch:
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v2
+        with:
+          ref: main
+      - name: Use Node.js
+        uses: actions/setup-node@v1
+        with:
+          node-version: '16.x'
+      - name: Setup yarn
+        run: npm install -g yarn
+      - run: yarn install
+      - run: yarn build:devnet
+        env:
+          CI: false
+      - name: Configure AWS Credentials
+        uses: aws-actions/configure-aws-credentials@v1
+        with:
+          aws-access-key-id: ${{ secrets.AWS_ACCESS_KEY_ID }}
+          aws-secret-access-key: ${{ secrets.AWS_SECRET_ACCESS_KEY }}
+          aws-region: 'us-east-1'
+      - name: Deploy to S3 bucket
+        run: aws s3 sync ./build/ s3://${{ secrets.AWS_S3_BUCKET_NEXT }} --delete
+      - name: Slack Notification
+        uses: rtCamp/action-slack-notify@master
+        env:
+          SLACK_ICON_EMOJI: ':nerd_face:'
+          SLACK_USERNAME: ${{ secrets.AWS_S3_BUCKET_NEXT }}
+          SLACK_MESSAGE: ${{ secrets.AWS_S3_BUCKET_NEXT }}
+          SLACK_FOOTER: ''
+          MSG_MINIMAL: true
+          SLACK_WEBHOOK: ${{ secrets.SLACK_WEBHOOK }}

jest.config.js

@@ -12,7 +12,7 @@ module.exports = {
     '^.+\\.(ts|js|tsx|jsx)$': '@swc/jest'
   },
   transformIgnorePatterns: [
-    'node_modules/(?!@multiversx/sdk-guardians-provider|@multiversx/sdk-dapp-form|@multiversx/sdk-dapp-nft|@multiversx/sdk-dapp|@multiversx/sdk-wallet-connect-provider|@multiversx/sdk-guardians-provider|react-redux|swiper|ssr-window|dom7|axios|react-tooltip|uuid|uint8arrays|multiformats)'
+    'node_modules/(?!@multiversx/sdk-guardians-provider|@multiversx/sdk-dapp-form|@multiversx/sdk-dapp-nft|@multiversx/sdk-dapp|@multiversx/sdk-wallet-connect-provider|@multiversx/sdk-guardians-provider|react-redux|swiper|ssr-window|dom7|axios|react-tooltip|uuid|uint8arrays|multiformats|@lifeomic/axios-fetch)'
   ],
   moduleNameMapper: {
     '^react-native$': 'react-native-web',

package.json

@@ -10,7 +10,7 @@
     "@fortawesome/free-solid-svg-icons": "6.5.1",
     "@fortawesome/react-fontawesome": "0.2.0",
     "@multiversx/sdk-core": "13.0.0-beta.4",
-    "@multiversx/sdk-dapp": "2.29.0-beta.3",
+    "@multiversx/sdk-dapp": "2.29.0-beta.6",
     "@multiversx/sdk-network-providers": "2.2.1",
     "axios": "1.6.5",
     "classnames": "2.3.2",

src/components/Layout/Header/Header.tsx

@@ -5,9 +5,15 @@ import { logout } from 'helpers';
 import { useGetIsLoggedIn } from 'hooks';
 import { RouteNamesEnum } from 'localConstants';
 import MultiversXLogo from '../../../assets/img/multiversx-logo.svg?react';
+import { useMatch } from 'react-router-dom';
 
 export const Header = () => {
   const isLoggedIn = useGetIsLoggedIn();
+  const isUnlockRoute = Boolean(useMatch(RouteNamesEnum.unlock));
+
+  const ConnectButton = isUnlockRoute ? null : (
+    <MxLink to={RouteNamesEnum.unlock}>Connect</MxLink>
+  );
 
   const handleLogout = () => {
     sessionStorage.clear();
@@ -38,7 +44,7 @@ export const Header = () => {
               Close
             </Button>
           ) : (
-            <MxLink to={RouteNamesEnum.unlock}>Connect</MxLink>
+            ConnectButton
           )}
         </div>
       </nav>

src/components/OutputContainer/components/TransactionOutput.tsx

@@ -34,7 +34,7 @@ export const TransactionOutput = ({
           page={`/${ACCOUNTS_ENDPOINT}/${transaction.receiver}`}
           className='border-b border-dotted border-gray-500 hover:border-solid hover:border-gray-800'
         >
-          {transaction.hash}
+          {transaction.receiver}
         </ExplorerLink>
       </p>
 

src/components/sdkDappComponents.ts

@@ -15,6 +15,7 @@ export { TransactionsTable } from '@multiversx/sdk-dapp/UI/TransactionsTable/Tra
 export { TransactionsToastList } from '@multiversx/sdk-dapp/UI/TransactionsToastList/TransactionsToastList';
 export { WalletConnectLoginButton } from '@multiversx/sdk-dapp/UI/walletConnect/WalletConnectLoginButton/WalletConnectLoginButton';
 export { WebWalletLoginButton } from '@multiversx/sdk-dapp/UI/webWallet/WebWalletLoginButton/WebWalletLoginButton';
+export { CrossWindowLoginButton } from '@multiversx/sdk-dapp/UI/webWallet/CrossWindowLoginButton/CrossWindowLoginButton';
 export { XaliasLoginButton } from '@multiversx/sdk-dapp/UI/webWallet/XaliasLoginButton/XaliasLoginButton';
 export { AuthenticatedRoutesWrapper } from '@multiversx/sdk-dapp/wrappers/AuthenticatedRoutesWrapper/AuthenticatedRoutesWrapper';
 export { AxiosInterceptorContext } from '@multiversx/sdk-dapp/wrappers/AxiosInterceptorContext/AxiosInterceptorContext';

src/pages/Unlock/Unlock.tsx

@@ -10,11 +10,13 @@ import {
   LedgerLoginButton,
   OperaWalletLoginButton,
   WalletConnectLoginButton,
-  WebWalletLoginButton,
-  XaliasLoginButton
+  WebWalletLoginButton as WebWalletUrlLoginButton,
+  XaliasLoginButton,
+  CrossWindowLoginButton
 } from 'components/sdkDappComponents';
 import { nativeAuth } from 'config';
 import { RouteNamesEnum } from 'localConstants';
+import { useNavigate } from 'react-router-dom';
 import { AuthRedirectWrapper } from 'wrappers';
 
 type CommonPropsType =
@@ -24,12 +26,23 @@ type CommonPropsType =
   | LedgerLoginButtonPropsType
   | WalletConnectLoginButtonPropsType;
 
-const commonProps: CommonPropsType = {
-  callbackRoute: RouteNamesEnum.dashboard,
-  nativeAuth
-};
+// choose how you want to configure connecting to the web wallet
+const USE_WEB_WALLET_CROSS_WINDOW = true;
+
+const WebWalletLoginButton = USE_WEB_WALLET_CROSS_WINDOW
+  ? CrossWindowLoginButton
+  : WebWalletUrlLoginButton;
 
 export const Unlock = () => {
+  const navigate = useNavigate();
+  const commonProps: CommonPropsType = {
+    callbackRoute: RouteNamesEnum.dashboard,
+    nativeAuth,
+    onLoginRedirect: () => {
+      navigate(RouteNamesEnum.dashboard);
+    }
+  };
+
   return (
     <AuthRedirectWrapper requireAuth={false}>
       <div className='flex justify-center items-center'>