Fix/Loader size, token refetch, order dialog and deposits subscription (#228)

* fix loader size, balance refresh after faucet and string interpolation of market name in order dialog

* fix ts errors

* remove ts-ignores

* remove 0x from pubkey before starting sub for deposit event

* add remove0x helper

libs/deal-ticket/src/order-dialog.tsx

@@ -69,7 +69,7 @@ export const OrderDialog = ({
     >
       <p>{t(`Status: ${finalizedOrder.status}`)}</p>
       {finalizedOrder.market && (
-        <p>{t(`Market: {finalizedOrder.market.name}`)}</p>
+        <p>{t(`Market: ${finalizedOrder.market.name}`)}</p>
       )}
       <p>{t(`Type: ${finalizedOrder.type}`)}</p>
       <p>{t(`Amount: ${finalizedOrder.size}`)}</p>

libs/deposits/src/lib/__generated__/DepositEvent.ts

@@ -3,7 +3,7 @@
 // @generated
 // This file was automatically generated and should not be edited.
 
-import { BusEventType, DepositStatus } from "./../../../../types/src/__generated__/globalTypes";
+import { DepositStatus } from "./../../../../types/src/__generated__/globalTypes";
 
 // ====================================================
 // GraphQL subscription operation: DepositEvent
@@ -33,18 +33,6 @@ export type DepositEvent_busEvents_event = DepositEvent_busEvents_event_TimeUpda
 
 export interface DepositEvent_busEvents {
   __typename: "BusEvent";
-  /**
-   * the id for this event
-   */
-  eventId: string;
-  /**
-   * the block hash
-   */
-  block: string;
-  /**
-   * the type of event we're dealing with
-   */
-  type: BusEventType;
   /**
    * the payload - the wrapped event
    */

libs/deposits/src/lib/deposit-manager.tsx

@@ -11,6 +11,7 @@ import { useSubmitFaucet } from './use-submit-faucet';
 import {
   useTokenContract,
   useBridgeContract,
+  TxState,
 } from '@vegaprotocol/react-helpers';
 
 export interface Asset {
@@ -75,10 +76,10 @@ export const DepositManager = ({
 
   // Update balance after confirmation event has been received
   useEffect(() => {
-    if (confirmationEvent !== null) {
+    if (faucet.status === TxState.Complete || confirmationEvent !== null) {
       refetch();
     }
-  }, [confirmationEvent, refetch]);
+  }, [confirmationEvent, refetch, faucet.status]);
 
   return (
     <>

libs/deposits/src/lib/use-submit-deposit.ts

@@ -6,15 +6,12 @@ import type {
 } from './__generated__/DepositEvent';
 import { DepositStatus } from '@vegaprotocol/types';
 import { useState } from 'react';
-import { useEthereumTransaction } from '@vegaprotocol/react-helpers';
+import { remove0x, useEthereumTransaction } from '@vegaprotocol/react-helpers';
 import type { VegaErc20Bridge } from '@vegaprotocol/smart-contracts-sdk';
 
 const DEPOSIT_EVENT_SUB = gql`
   subscription DepositEvent($partyId: ID!) {
     busEvents(partyId: $partyId, batchSize: 0, types: [Deposit]) {
-      eventId
-      block
-      type
       event {
         ... on Deposit {
           id
@@ -57,7 +54,7 @@ export const useSubmitDeposit = (
   }, confirmations);
 
   useSubscription<DepositEvent, DepositEventVariables>(DEPOSIT_EVENT_SUB, {
-    variables: { partyId: partyId || '' },
+    variables: { partyId: partyId ? remove0x(partyId) : '' },
     skip: !partyId,
     onSubscriptionData: ({ subscriptionData }) => {
       if (!subscriptionData.data?.busEvents?.length) {

libs/react-helpers/src/index.ts

@@ -6,5 +6,6 @@ export * from './lib/generic-data-provider';
 export * from './lib/i18n';
 export * from './lib/ethereum-error';
 export * from './lib/validate';
+export * from './lib/remove-0x';
 
 export * from './hooks';

libs/react-helpers/src/lib/remove-0x.ts

@@ -0,0 +1,3 @@
+export const remove0x = (str: string) => {
+  return str.replace(/^0x/, '');
+};

libs/ui-toolkit/src/components/transaction-dialog/transaction-dialog.tsx

@@ -73,7 +73,7 @@ export const TransactionDialog = ({
       },
       [TxState.Pending]: {
         title: t(`${name} pending`),
-        icon: <Loader />,
+        icon: <Loader size="small" />,
         intent: Intent.Progress,
       },
       [TxState.Complete]: {