Refactor Header Provider Info & Details
This commit is contained in:
parent
a2d10c6da8
commit
b86dae7ede
|
@ -3,10 +3,10 @@ import { storiesOf } from '@storybook/react'
|
||||||
import * as React from 'react'
|
import * as React from 'react'
|
||||||
import styles from '~/components/layout/PageFrame/index.scss'
|
import styles from '~/components/layout/PageFrame/index.scss'
|
||||||
import Layout from './Layout'
|
import Layout from './Layout'
|
||||||
import ProviderInfo from './ProviderInfo'
|
import ProviderAccesible from './ProviderInfo/ProviderAccesible'
|
||||||
import ProviderDetails from './ProviderInfo/UserDetails'
|
import UserDetails from './ProviderDetails/UserDetails'
|
||||||
import ProviderDisconnected from './ProviderDisconnected'
|
import ProviderDisconnected from './ProviderInfo/ProviderDisconnected'
|
||||||
import ConnectDetails from './ProviderDisconnected/ConnectDetails'
|
import ConnectDetails from './ProviderDetails/ConnectDetails'
|
||||||
|
|
||||||
const FrameDecorator = story => (
|
const FrameDecorator = story => (
|
||||||
<div className={styles.frame}>
|
<div className={styles.frame}>
|
||||||
|
@ -20,8 +20,8 @@ storiesOf('Components /Header', module)
|
||||||
const provider = 'Metamask'
|
const provider = 'Metamask'
|
||||||
const userAddress = '0x873faa4cddd5b157e8e5a57e7a5479afc5d30moe'
|
const userAddress = '0x873faa4cddd5b157e8e5a57e7a5479afc5d30moe'
|
||||||
const network = 'RINKEBY'
|
const network = 'RINKEBY'
|
||||||
const info = <ProviderInfo provider={provider} network={network} userAddress={userAddress} connected />
|
const info = <ProviderAccesible provider={provider} network={network} userAddress={userAddress} connected />
|
||||||
const details = <ProviderDetails provider={provider} network={network} userAddress={userAddress} connected />
|
const details = <UserDetails provider={provider} network={network} userAddress={userAddress} connected />
|
||||||
|
|
||||||
return <Layout providerInfo={info} providerDetails={details} />
|
return <Layout providerInfo={info} providerDetails={details} />
|
||||||
})
|
})
|
||||||
|
@ -35,8 +35,8 @@ storiesOf('Components /Header', module)
|
||||||
const provider = 'Metamask'
|
const provider = 'Metamask'
|
||||||
const userAddress = '0x873faa4cddd5b157e8e5a57e7a5479afc5d30moe'
|
const userAddress = '0x873faa4cddd5b157e8e5a57e7a5479afc5d30moe'
|
||||||
const network = 'RINKEBY'
|
const network = 'RINKEBY'
|
||||||
const info = <ProviderInfo provider={provider} network={network} userAddress={userAddress} connected={false} />
|
const info = <ProviderAccesible provider={provider} network={network} userAddress={userAddress} connected={false} />
|
||||||
const details = (<ProviderDetails
|
const details = (<UserDetails
|
||||||
provider={provider}
|
provider={provider}
|
||||||
network={network}
|
network={network}
|
||||||
userAddress={userAddress}
|
userAddress={userAddress}
|
||||||
|
|
|
@ -4,10 +4,10 @@ import { connect } from 'react-redux'
|
||||||
import { logComponentStack, type Info } from '~/utils/logBoundaries'
|
import { logComponentStack, type Info } from '~/utils/logBoundaries'
|
||||||
import { SharedSnackbarConsumer, type Variant } from '~/components/SharedSnackBar/Context'
|
import { SharedSnackbarConsumer, type Variant } from '~/components/SharedSnackBar/Context'
|
||||||
import { WALLET_ERROR_MSG } from '~/logic/wallets/store/actions'
|
import { WALLET_ERROR_MSG } from '~/logic/wallets/store/actions'
|
||||||
import ProviderInfo from './component/ProviderInfo'
|
import ProviderAccesible from './component/ProviderInfo/ProviderAccesible'
|
||||||
import ProviderDetails from './component/ProviderInfo/UserDetails'
|
import UserDetails from './component/ProviderDetails/UserDetails'
|
||||||
import ProviderDisconnected from './component/ProviderDisconnected'
|
import ProviderDisconnected from './component/ProviderInfo/ProviderDisconnected'
|
||||||
import ConnectDetails from './component/ProviderDisconnected/ConnectDetails'
|
import ConnectDetails from './component/ProviderDetails/ConnectDetails'
|
||||||
import Layout from './component/Layout'
|
import Layout from './component/Layout'
|
||||||
import actions, { type Actions } from './actions'
|
import actions, { type Actions } from './actions'
|
||||||
import selector, { type SelectorProps } from './selector'
|
import selector, { type SelectorProps } from './selector'
|
||||||
|
@ -54,7 +54,7 @@ class HeaderComponent extends React.PureComponent<Props, State> {
|
||||||
return <ProviderDisconnected />
|
return <ProviderDisconnected />
|
||||||
}
|
}
|
||||||
|
|
||||||
return <ProviderInfo provider={provider} network={network} userAddress={userAddress} connected={available} />
|
return <ProviderAccesible provider={provider} network={network} userAddress={userAddress} connected={available} />
|
||||||
}
|
}
|
||||||
|
|
||||||
getProviderDetailsBased = () => {
|
getProviderDetailsBased = () => {
|
||||||
|
@ -67,7 +67,7 @@ class HeaderComponent extends React.PureComponent<Props, State> {
|
||||||
return <ConnectDetails onConnect={this.onConnect} />
|
return <ConnectDetails onConnect={this.onConnect} />
|
||||||
}
|
}
|
||||||
|
|
||||||
return (<ProviderDetails
|
return (<UserDetails
|
||||||
provider={provider}
|
provider={provider}
|
||||||
network={network}
|
network={network}
|
||||||
userAddress={userAddress}
|
userAddress={userAddress}
|
||||||
|
|
Loading…
Reference in New Issue