diff --git a/app/scripts/controllers/bridge-status/bridge-status-controller.ts b/app/scripts/controllers/bridge-status/bridge-status-controller.ts index a39e260d4ca7..a1d17b0414a2 100644 --- a/app/scripts/controllers/bridge-status/bridge-status-controller.ts +++ b/app/scripts/controllers/bridge-status/bridge-status-controller.ts @@ -7,6 +7,7 @@ import { import { BridgeStatusControllerState, BridgeStatusControllerMessenger, + StatusRequest, } from './types'; import { fetchBridgeTxStatus } from './utils'; @@ -24,15 +25,7 @@ export default class BridgeStatusController extends BaseController< { bridgeStatusState: BridgeStatusControllerState }, BridgeStatusControllerMessenger > { - #provider: Provider; - - constructor({ - provider, - messenger, - }: { - provider: Provider; - messenger: BridgeStatusControllerMessenger; - }) { + constructor({ messenger }: { messenger: BridgeStatusControllerMessenger }) { super({ name: BRIDGE_STATUS_CONTROLLER_NAME, metadata, @@ -45,9 +38,6 @@ export default class BridgeStatusController extends BaseController< `${BRIDGE_STATUS_CONTROLLER_NAME}:getBridgeTxStatus`, this.getBridgeTxStatus.bind(this), ); - - // Assign vars - this.#provider = provider; } resetState = () => { @@ -58,12 +48,18 @@ export default class BridgeStatusController extends BaseController< }); }; - getBridgeTxStatus = async () => { + getBridgeTxStatus = async (statusRequest: StatusRequest) => { const { bridgeStatusState } = this.state; - const bridgeStatus = await fetchBridgeTxStatus(); + const bridgeStatus = await fetchBridgeTxStatus(statusRequest); this.update((_state) => { - _state.bridgeStatusState = { ...bridgeStatusState, bridgeStatus }; + _state.bridgeStatusState = { + ...bridgeStatusState, + txStatuses: { + ...bridgeStatusState.txStatuses, + [statusRequest.srcTxHash]: bridgeStatus, + }, + }; }); }; } diff --git a/app/scripts/controllers/bridge-status/constants.ts b/app/scripts/controllers/bridge-status/constants.ts index d00ea4e913bd..dd28d5db099b 100644 --- a/app/scripts/controllers/bridge-status/constants.ts +++ b/app/scripts/controllers/bridge-status/constants.ts @@ -4,4 +4,6 @@ import { BridgeStatusControllerState } from './types'; export const BRIDGE_STATUS_CONTROLLER_NAME = 'BridgeStatusController'; export const DEFAULT_BRIDGE_STATUS_CONTROLLER_STATE: BridgeStatusControllerState = - {}; + { + txStatuses: {}, + }; diff --git a/app/scripts/controllers/bridge-status/types.ts b/app/scripts/controllers/bridge-status/types.ts index 51392ef1e7d8..6454627844b3 100644 --- a/app/scripts/controllers/bridge-status/types.ts +++ b/app/scripts/controllers/bridge-status/types.ts @@ -19,21 +19,21 @@ export interface StatusRequest { refuel?: boolean; //lifi } -export interface Asset { +export type Asset = { chainId: DecChainId; address: string; symbol: string; name: string; decimals: number; icon?: string; -} +}; -export interface ChainStatus { +export type ChainStatus = { chainId: DecChainId; txHash: string; amount?: string; token?: Asset; -} +}; export enum StatusTypes { UNKNOWN = 'UNKNOWN', @@ -57,7 +57,7 @@ export enum BridgeId { STARGATE = 'stargate', } -export interface StatusResponse { +export type StatusResponse = { status: StatusTypes; srcChain: ChainStatus; destChain?: ChainStatus; @@ -65,7 +65,7 @@ export interface StatusResponse { isExpectedToken?: boolean; isUnrecognizedRouterAddress?: boolean; refuel?: RefuelStatusResponse; -} +}; export enum FeeType { METABRIDGE = 'metabridge', @@ -135,7 +135,12 @@ export type BridgeHistoryItem = { targetContractAddress?: string; }; -export type BridgeStatusControllerState = {}; +// All fields need to be types not interfaces, same with their children fields +// o/w you get a type error +export type BridgeStatusControllerState = { + txStatuses: Record; + // txHistory: Record; +}; export enum BridgeStatusAction { GET_BRIDGE_TX_STATUS = 'getBridgeTxStatus', diff --git a/app/scripts/controllers/bridge-status/utils.ts b/app/scripts/controllers/bridge-status/utils.ts index 6d6a747d5669..62862019619f 100644 --- a/app/scripts/controllers/bridge-status/utils.ts +++ b/app/scripts/controllers/bridge-status/utils.ts @@ -34,6 +34,6 @@ export const fetchBridgeTxStatus = async (statusRequest: StatusRequest) => { // Convert to Extension format // Return - console.log('fetchBridgeTxStatus', statusRequest); - return 'connected'; + console.log('fetchBridgeTxStatus', { statusRequest, rawTxStatus }); + return rawTxStatus; }; diff --git a/ui/ducks/bridge-status/actions.ts b/ui/ducks/bridge-status/actions.ts new file mode 100644 index 000000000000..74d894f725c2 --- /dev/null +++ b/ui/ducks/bridge-status/actions.ts @@ -0,0 +1,28 @@ +import BridgeStatusController from '../../../app/scripts/controllers/bridge-status/bridge-status-controller'; +import { + BridgeStatusAction, + StatusRequest, +} from '../../../app/scripts/controllers/bridge-status/types'; +import { forceUpdateMetamaskState } from '../../store/actions'; +import { submitRequestToBackground } from '../../store/background-connection'; +import { MetaMaskReduxDispatch } from '../../store/store'; + +const callBridgeStatusControllerMethod = ( + bridgeAction: BridgeStatusAction, + args?: T, +) => { + return async (dispatch: MetaMaskReduxDispatch) => { + await submitRequestToBackground(bridgeAction, args); + await forceUpdateMetamaskState(dispatch); + }; +}; + +export const getBridgeTxStatus = (statusRequest: StatusRequest) => { + return async (dispatch: MetaMaskReduxDispatch) => { + return dispatch( + callBridgeStatusControllerMethod< + Parameters + >(BridgeStatusAction.GET_BRIDGE_TX_STATUS, [statusRequest]), + ); + }; +}; diff --git a/ui/ducks/bridge-status/selectors.ts b/ui/ducks/bridge-status/selectors.ts new file mode 100644 index 000000000000..589f9ade724b --- /dev/null +++ b/ui/ducks/bridge-status/selectors.ts @@ -0,0 +1,19 @@ +import { createSelector } from 'reselect'; +import { BridgeStatusControllerState } from '../../../app/scripts/controllers/bridge-status/types'; + +export type BridgeStatusAppState = { + metamask: { + bridgeStatusState: BridgeStatusControllerState; + }; +}; + +export const selectBridgeStatusState = (state: BridgeStatusAppState) => + state.metamask.bridgeStatusState; + +export const selectBridgeTxStatuses = createSelector( + [ + selectBridgeStatusState, + (_: BridgeStatusAppState, txHash: string) => txHash, + ], + (bridgeStatusState) => bridgeStatusState.txStatuses, +);