ALM: reorder warnings
This commit is contained in:
parent
910c3759c1
commit
735aa75f81
@ -11,6 +11,8 @@ import { Thead, AgeTd, StatusTd } from './commons/Table'
|
|||||||
import { ManualExecutionButton } from './ManualExecutionButton'
|
import { ManualExecutionButton } from './ManualExecutionButton'
|
||||||
import { useStateProvider } from '../state/StateProvider'
|
import { useStateProvider } from '../state/StateProvider'
|
||||||
import { matchesRule, MessageObject, WarnRule } from '../utils/web3'
|
import { matchesRule, MessageObject, WarnRule } from '../utils/web3'
|
||||||
|
import { WarningAlert } from './commons/WarningAlert'
|
||||||
|
import { ErrorAlert } from './commons/ErrorAlert'
|
||||||
|
|
||||||
const StyledExecutionConfirmation = styled.div`
|
const StyledExecutionConfirmation = styled.div`
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
@ -35,8 +37,10 @@ export const ExecutionConfirmation = ({
|
|||||||
executionEventsFetched,
|
executionEventsFetched,
|
||||||
setPendingExecution
|
setPendingExecution
|
||||||
}: ExecutionConfirmationParams) => {
|
}: ExecutionConfirmationParams) => {
|
||||||
const { foreign, setWarning } = useStateProvider()
|
const { foreign } = useStateProvider()
|
||||||
const [safeExecutionAvailable, setSafeExecutionAvailable] = useState(false)
|
const [safeExecutionAvailable, setSafeExecutionAvailable] = useState(false)
|
||||||
|
const [error, setError] = useState('')
|
||||||
|
const [warning, setWarning] = useState('')
|
||||||
const availableManualExecution =
|
const availableManualExecution =
|
||||||
!isHome &&
|
!isHome &&
|
||||||
(executionData.status === VALIDATOR_CONFIRMATION_STATUS.WAITING ||
|
(executionData.status === VALIDATOR_CONFIRMATION_STATUS.WAITING ||
|
||||||
@ -106,6 +110,8 @@ export const ExecutionConfirmation = ({
|
|||||||
|
|
||||||
return (
|
return (
|
||||||
<StyledExecutionConfirmation>
|
<StyledExecutionConfirmation>
|
||||||
|
{error && <ErrorAlert onClick={() => setError('')} error={error} />}
|
||||||
|
{warning && <WarningAlert onClick={() => setWarning('')} error={warning} />}
|
||||||
<table>
|
<table>
|
||||||
<Thead>
|
<Thead>
|
||||||
<tr>
|
<tr>
|
||||||
@ -148,6 +154,7 @@ export const ExecutionConfirmation = ({
|
|||||||
setExecutionData={setExecutionData}
|
setExecutionData={setExecutionData}
|
||||||
signatureCollected={signatureCollected as string[]}
|
signatureCollected={signatureCollected as string[]}
|
||||||
setPendingExecution={setPendingExecution}
|
setPendingExecution={setPendingExecution}
|
||||||
|
setError={setError}
|
||||||
/>
|
/>
|
||||||
</td>
|
</td>
|
||||||
)}
|
)}
|
||||||
|
@ -8,8 +8,6 @@ import { TransactionReceipt } from 'web3-eth'
|
|||||||
import { InfoAlert } from './commons/InfoAlert'
|
import { InfoAlert } from './commons/InfoAlert'
|
||||||
import { ExplorerTxLink } from './commons/ExplorerTxLink'
|
import { ExplorerTxLink } from './commons/ExplorerTxLink'
|
||||||
import { FOREIGN_NETWORK_NAME, HOME_NETWORK_NAME } from '../config/constants'
|
import { FOREIGN_NETWORK_NAME, HOME_NETWORK_NAME } from '../config/constants'
|
||||||
import { ErrorAlert } from './commons/ErrorAlert'
|
|
||||||
import { WarningAlert } from './commons/WarningAlert'
|
|
||||||
|
|
||||||
const StyledMainPage = styled.div`
|
const StyledMainPage = styled.div`
|
||||||
text-align: center;
|
text-align: center;
|
||||||
@ -53,7 +51,7 @@ export interface FormSubmitParams {
|
|||||||
|
|
||||||
export const MainPage = () => {
|
export const MainPage = () => {
|
||||||
const history = useHistory()
|
const history = useHistory()
|
||||||
const { home, foreign, error, setError, warning, setWarning } = useStateProvider()
|
const { home, foreign } = useStateProvider()
|
||||||
const [networkName, setNetworkName] = useState('')
|
const [networkName, setNetworkName] = useState('')
|
||||||
const [receipt, setReceipt] = useState<Maybe<TransactionReceipt>>(null)
|
const [receipt, setReceipt] = useState<Maybe<TransactionReceipt>>(null)
|
||||||
const [showInfoAlert, setShowInfoAlert] = useState(false)
|
const [showInfoAlert, setShowInfoAlert] = useState(false)
|
||||||
@ -133,8 +131,6 @@ export const MainPage = () => {
|
|||||||
</AlertP>
|
</AlertP>
|
||||||
</InfoAlert>
|
</InfoAlert>
|
||||||
)}
|
)}
|
||||||
{error && <ErrorAlert onClick={() => setError('')} error={error} />}
|
|
||||||
{warning && <WarningAlert onClick={() => setWarning('')} error={warning} />}
|
|
||||||
<Route exact path={['/']} children={<Form onSubmit={onFormSubmit} />} />
|
<Route exact path={['/']} children={<Form onSubmit={onFormSubmit} />} />
|
||||||
<Route
|
<Route
|
||||||
path={['/:chainId/:txHash/:messageIdParam', '/:chainId/:txHash']}
|
path={['/:chainId/:txHash/:messageIdParam', '/:chainId/:txHash']}
|
||||||
|
@ -33,6 +33,7 @@ interface ManualExecutionButtonParams {
|
|||||||
setExecutionData: Function
|
setExecutionData: Function
|
||||||
signatureCollected: string[]
|
signatureCollected: string[]
|
||||||
setPendingExecution: Function
|
setPendingExecution: Function
|
||||||
|
setError: Function
|
||||||
}
|
}
|
||||||
|
|
||||||
export const ManualExecutionButton = ({
|
export const ManualExecutionButton = ({
|
||||||
@ -40,9 +41,10 @@ export const ManualExecutionButton = ({
|
|||||||
messageData,
|
messageData,
|
||||||
setExecutionData,
|
setExecutionData,
|
||||||
signatureCollected,
|
signatureCollected,
|
||||||
setPendingExecution
|
setPendingExecution,
|
||||||
|
setError
|
||||||
}: ManualExecutionButtonParams) => {
|
}: ManualExecutionButtonParams) => {
|
||||||
const { foreign, setError } = useStateProvider()
|
const { foreign } = useStateProvider()
|
||||||
const { library, activate, account, active } = useWeb3React()
|
const { library, activate, account, active } = useWeb3React()
|
||||||
const [manualExecution, setManualExecution] = useState(false)
|
const [manualExecution, setManualExecution] = useState(false)
|
||||||
const [allowFailures, setAllowFailures] = useState(false)
|
const [allowFailures, setAllowFailures] = useState(false)
|
||||||
|
@ -33,7 +33,7 @@ export const ErrorAlert = ({ onClick, error }: { onClick: () => void; error: str
|
|||||||
}
|
}
|
||||||
return (
|
return (
|
||||||
<div className="row is-center">
|
<div className="row is-center">
|
||||||
<StyledErrorAlert className="col-10 is-vertical-align row">
|
<StyledErrorAlert className="col-12 is-vertical-align row">
|
||||||
<InfoIcon color="var(--failed-color)" />
|
<InfoIcon color="var(--failed-color)" />
|
||||||
<TextContainer className="col-10">
|
<TextContainer className="col-10">
|
||||||
{text}
|
{text}
|
||||||
|
@ -22,7 +22,7 @@ const TextContainer = styled.div`
|
|||||||
export const WarningAlert = ({ onClick, error }: { onClick: () => void; error: string }) => {
|
export const WarningAlert = ({ onClick, error }: { onClick: () => void; error: string }) => {
|
||||||
return (
|
return (
|
||||||
<div className="row is-center">
|
<div className="row is-center">
|
||||||
<StyledErrorAlert className="col-10 is-vertical-align row">
|
<StyledErrorAlert className="col-12 is-vertical-align row">
|
||||||
<InfoIcon color="var(--warning-color)" />
|
<InfoIcon color="var(--warning-color)" />
|
||||||
<TextContainer className="col-10">{error}</TextContainer>
|
<TextContainer className="col-10">{error}</TextContainer>
|
||||||
<CloseIconContainer className="col-1 is-vertical-align is-center" onClick={onClick}>
|
<CloseIconContainer className="col-1 is-vertical-align is-center" onClick={onClick}>
|
||||||
|
@ -1,4 +1,4 @@
|
|||||||
import React, { createContext, ReactNode, useState } from 'react'
|
import React, { createContext, ReactNode } from 'react'
|
||||||
import { useNetwork } from '../hooks/useNetwork'
|
import { useNetwork } from '../hooks/useNetwork'
|
||||||
import {
|
import {
|
||||||
HOME_RPC_URL,
|
HOME_RPC_URL,
|
||||||
@ -25,10 +25,6 @@ export interface StateContext {
|
|||||||
home: BaseNetworkParams
|
home: BaseNetworkParams
|
||||||
foreign: BaseNetworkParams
|
foreign: BaseNetworkParams
|
||||||
loading: boolean
|
loading: boolean
|
||||||
error: string
|
|
||||||
setError: Function
|
|
||||||
warning: string
|
|
||||||
setWarning: Function
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const initialState = {
|
const initialState = {
|
||||||
@ -46,11 +42,7 @@ const initialState = {
|
|||||||
bridgeAddress: FOREIGN_BRIDGE_ADDRESS,
|
bridgeAddress: FOREIGN_BRIDGE_ADDRESS,
|
||||||
bridgeContract: null
|
bridgeContract: null
|
||||||
},
|
},
|
||||||
loading: true,
|
loading: true
|
||||||
error: '',
|
|
||||||
setError: () => {},
|
|
||||||
warning: '',
|
|
||||||
setWarning: () => {}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
const StateContext = createContext<StateContext>(initialState)
|
const StateContext = createContext<StateContext>(initialState)
|
||||||
@ -62,8 +54,6 @@ export const StateProvider = ({ children }: { children: ReactNode }) => {
|
|||||||
homeWeb3: homeNetwork.web3,
|
homeWeb3: homeNetwork.web3,
|
||||||
foreignWeb3: foreignNetwork.web3
|
foreignWeb3: foreignNetwork.web3
|
||||||
})
|
})
|
||||||
const [error, setError] = useState('')
|
|
||||||
const [warning, setWarning] = useState('')
|
|
||||||
|
|
||||||
const value = {
|
const value = {
|
||||||
home: {
|
home: {
|
||||||
@ -78,11 +68,7 @@ export const StateProvider = ({ children }: { children: ReactNode }) => {
|
|||||||
bridgeContract: foreignBridge,
|
bridgeContract: foreignBridge,
|
||||||
...foreignNetwork
|
...foreignNetwork
|
||||||
},
|
},
|
||||||
loading: homeNetwork.loading || foreignNetwork.loading,
|
loading: homeNetwork.loading || foreignNetwork.loading
|
||||||
error,
|
|
||||||
setError,
|
|
||||||
warning,
|
|
||||||
setWarning
|
|
||||||
}
|
}
|
||||||
|
|
||||||
return <StateContext.Provider value={value}>{children}</StateContext.Provider>
|
return <StateContext.Provider value={value}>{children}</StateContext.Provider>
|
||||||
|
Loading…
Reference in New Issue
Block a user