Section anchors / Refactor batch transactions (#167)

* Add anchors for transactions from web wallet provider

* Improve due to feedback

* Remove log

* Rename prop

* Update widgets

* Remove useCallback

* Update pingpong hook

* Update widget

* Remove useMemo

* Rename getCallbackUrl

* Extract function separately

* Remove log

* Rename type

* Update import

* Update import

* Fix callbackroute

* Rename function

* Update batch transactions

* Remove relative property

* Remove log

* Update based on feedback

* Update interface

* Add generic type for WidgetType

* Use TokenTransfer instead of formatAmount

* Fix interface

src/components/Card/Card.tsx

@@ -7,15 +7,17 @@ interface CardType extends PropsWithChildren, WithClassnameType {
   title: string;
   description?: string;
   reference: string;
+  anchor?: string;
 }
 
 export const Card = (props: CardType) => {
-  const { title, children, description, reference } = props;
+  const { title, children, description, reference, anchor } = props;
 
   return (
     <div
       className='flex flex-col flex-1 rounded-xl bg-white p-6 justify-center'
       data-testid={props['data-testid']}
+      id={anchor}
     >
       <h2 className='flex text-xl font-medium group'>
         {title}

src/config/sharedConfig.ts

@@ -3,3 +3,21 @@ export const walletConnectV2ProjectId = '9b1a9564f91cb659ffe21b73d5c4e2d8';
 export const apiTimeout = 6000;
 export const transactionSize = 10;
 export const nativeAuth = true;
+export const BATCH_TRANSACTIONS_SC = {
+  egld_wEGLD: {
+    contract: 'erd1qqqqqqqqqqqqqpgqpv09kfzry5y4sj05udcngesat07umyj70n4sa2c0rp',
+    data: 'wrapEgld'
+  },
+  wEGLD_USDC: {
+    contract: 'erd1qqqqqqqqqqqqqpgqtqfhy99su9xzjjrq59kpzpp25udtc9eq0n4sr90ax6',
+    data: 'ESDTTransfer@5745474C442D613238633539@06f05b59d3b20000@73776170546f6b656e734669786564496e707574@555344432D333530633465@01'
+  },
+  wEGLD_MEX: {
+    contract: 'erd1qqqqqqqqqqqqqpgqzw0d0tj25qme9e4ukverjjjqle6xamay0n4s5r0v9g',
+    data: 'ESDTTransfer@5745474C442D613238633539@06f05b59d3b20000@73776170546f6b656e734669786564496e707574@4D45582D613635396430@01'
+  },
+  lock_MEX: {
+    contract: 'erd1qqqqqqqqqqqqqpgq2l97gw2j4wnlem4y2rx7dudqlssjtwpu0n4sd0u3w2',
+    data: 'ESDTTransfer@4D45582D613635396430@0de0b6b3a7640000@6c6f636b546f6b656e73@05a0'
+  }
+};

src/helpers/index.ts

@@ -1,2 +1,3 @@
 export * from './sdkDappHelpers';
 export * from './pingPong';
+export * from './signAndSendTransactions';

src/helpers/sdkDappHelpers.ts

@@ -4,3 +4,4 @@ export { refreshAccount } from '@multiversx/sdk-dapp/utils/account/refreshAccoun
 export { logout } from '@multiversx/sdk-dapp/utils/logout';
 export { signTransactions } from '@multiversx/sdk-dapp/services/transactions/signTransactions';
 export { trimUsernameDomain } from '@multiversx/sdk-dapp/hooks/account/helpers';
+export { newTransaction } from '@multiversx/sdk-dapp/models';

src/helpers/signAndSendTransactions.ts

@@ -0,0 +1,26 @@
+import { Transaction, TransactionsDisplayInfoType } from 'types';
+
+import { refreshAccount, sendTransactions } from './sdkDappHelpers';
+
+type SignAndSendTransactionsProps = {
+  transactions: Transaction[];
+  callbackRoute: string;
+  transactionsDisplayInfo: TransactionsDisplayInfoType;
+};
+
+export const signAndSendTransactions = async ({
+  transactions,
+  callbackRoute,
+  transactionsDisplayInfo
+}: SignAndSendTransactionsProps) => {
+  await refreshAccount();
+
+  const { sessionId } = await sendTransactions({
+    transactions,
+    transactionsDisplayInfo,
+    redirectAfterSign: false,
+    callbackRoute
+  });
+
+  return sessionId;
+};

src/hooks/index.ts

@@ -1,3 +1,4 @@
 export * from './sdkDappHooks';
 export * from './withPageTitle';
 export * from './transactions';
+export * from './useScrollToElement';

src/hooks/sdkDappHooks.ts

@@ -15,3 +15,4 @@ export { useCheckBatch } from '@multiversx/sdk-dapp/hooks/transactions/batch/tra
 export { useSignTransactions } from '@multiversx/sdk-dapp/hooks/transactions/useSignTransactions';
 export { useBatchTransactionsTracker } from '@multiversx/sdk-dapp/hooks/transactions/batch/tracker/useBatchTransactionsTracker';
 export { useGetSignedTransactions } from '@multiversx/sdk-dapp/hooks/transactions/useGetSignedTransactions';
+export { useGetAccountProvider } from '@multiversx/sdk-dapp/hooks/account/useGetAccountProvider';