chore(frontend): support updated nonce (#671)

Author: nikitayutanov

js/frontend/src/features/history/graphql/graphql.ts

@@ -864,6 +864,8 @@ export type Transfer = Node & {
   completedAtTxHash: Maybe<Scalars['String']['output']>;
   destNetwork: NetworkEnum;
   destination: Scalars['String']['output'];
+  ethBridgeBuiltInMsgHash: Maybe<Scalars['String']['output']>;
+  ethBridgeBuiltInQueueId: Maybe<Scalars['BigInt']['output']>;
   id: Scalars['String']['output'];
   /** A globally unique identifier. Can be used in various places throughout the system to identify this single value. */
   nodeId: Scalars['ID']['output'];
@@ -900,6 +902,10 @@ export type TransferCondition = {
   destNetwork: InputMaybe<NetworkEnum>;
   /** Checks for equality with the object’s `destination` field. */
   destination: InputMaybe<Scalars['String']['input']>;
+  /** Checks for equality with the object’s `ethBridgeBuiltInMsgHash` field. */
+  ethBridgeBuiltInMsgHash: InputMaybe<Scalars['String']['input']>;
+  /** Checks for equality with the object’s `ethBridgeBuiltInQueueId` field. */
+  ethBridgeBuiltInQueueId: InputMaybe<Scalars['BigInt']['input']>;
   /** Checks for equality with the object’s `id` field. */
   id: InputMaybe<Scalars['String']['input']>;
   /** Checks for equality with the object’s `nonce` field. */
@@ -942,6 +948,10 @@ export type TransferFilter = {
   destNetwork: InputMaybe<NetworkEnumFilter>;
   /** Filter by the object’s `destination` field. */
   destination: InputMaybe<StringFilter>;
+  /** Filter by the object’s `ethBridgeBuiltInMsgHash` field. */
+  ethBridgeBuiltInMsgHash: InputMaybe<StringFilter>;
+  /** Filter by the object’s `ethBridgeBuiltInQueueId` field. */
+  ethBridgeBuiltInQueueId: InputMaybe<BigIntFilter>;
   /** Filter by the object’s `id` field. */
   id: InputMaybe<StringFilter>;
   /** Filter by the object’s `nonce` field. */
@@ -1008,6 +1018,10 @@ export enum TransfersOrderBy {
   DestinationDesc = 'DESTINATION_DESC',
   DestNetworkAsc = 'DEST_NETWORK_ASC',
   DestNetworkDesc = 'DEST_NETWORK_DESC',
+  EthBridgeBuiltInMsgHashAsc = 'ETH_BRIDGE_BUILT_IN_MSG_HASH_ASC',
+  EthBridgeBuiltInMsgHashDesc = 'ETH_BRIDGE_BUILT_IN_MSG_HASH_DESC',
+  EthBridgeBuiltInQueueIdAsc = 'ETH_BRIDGE_BUILT_IN_QUEUE_ID_ASC',
+  EthBridgeBuiltInQueueIdDesc = 'ETH_BRIDGE_BUILT_IN_QUEUE_ID_DESC',
   IdAsc = 'ID_ASC',
   IdDesc = 'ID_DESC',
   Natural = 'NATURAL',

js/frontend/src/features/swap/components/relay-tx-button/relay-tx-button.tsx

@@ -11,7 +11,7 @@ import { getErrorMessage, isUndefined, logger } from '@/utils';
 import { useIsEthRelayAvailable, useIsVaraRelayAvailable, useRelayEthTx, useRelayVaraTx } from '../../hooks';
 
 type VaraProps = {
-  nonce: HexString;
+  nonce: bigint;
   blockNumber: string;
   onReceipt: () => void;
   onConfirmation: () => void;

js/frontend/src/features/swap/hooks/vara/use-relay-vara-tx.ts

@@ -1,4 +1,3 @@
-import { HexString } from '@gear-js/api';
 import { relayVaraToEth } from '@gear-js/bridge';
 import { useMutation } from '@tanstack/react-query';
 import { useConfig, usePublicClient, useWalletClient } from 'wagmi';
@@ -16,7 +15,7 @@ type Params = {
   onError: (error: Error) => void;
 };
 
-function useRelayVaraTx(nonce: HexString, blockNumber: bigint) {
+function useRelayVaraTx(nonce: bigint, blockNumber: bigint) {
   const publicClient = usePublicClient();
   const { data: walletClient } = useWalletClient();
   const config = useConfig();

js/frontend/src/pages/transaction/transaction.tsx

@@ -117,7 +117,6 @@ function Transaction() {
   const formattedReceiverAddress = isVaraNetwork ? receiver : getVaraAddress(receiver);
 
   const isAwaitingPayment = status === StatusEnum.AwaitingPayment;
-  const rawNonce = isVaraNetwork ? `0x${nonce.padStart(64, '0')}` : nonce;
 
   return (
     <Container className={styles.container}>
@@ -135,13 +134,13 @@ function Transaction() {
           <div className={styles.sidebar}>
             <div className={styles.buttons}>
               {isVaraNetwork && (
-                <PayVaraFeeButton nonce={rawNonce} onInBlock={optimisticTxUpdate} onFinalization={refetch} />
+                <PayVaraFeeButton nonce={nonce} onInBlock={optimisticTxUpdate} onFinalization={refetch} />
               )}
 
               {isVaraNetwork ? (
                 bridgingStartedAtBlock && (
                   <RelayTxButton.Vara
-                    nonce={rawNonce as HexString}
+                    nonce={BigInt(nonce)}
                     blockNumber={bridgingStartedAtBlock}
                     onReceipt={optimisticTxUpdate}
                     onConfirmation={refetch}
@@ -251,8 +250,8 @@ function Transaction() {
           </Field>
 
           <Field label="Transaction Nonce">
-            <Address value={rawNonce} />
-            <CopyButton value={rawNonce} message="Transaction nonce copied to clipboard" />
+            <Address value={nonce} />
+            <CopyButton value={nonce} message="Transaction nonce copied to clipboard" />
           </Field>
 
           <Field label="Block Number">