mirror of
https://github.com/embarklabs/embark.git
synced 2025-02-16 23:57:11 +00:00
refactor(embark-ui): filter silent contracts from contracts listings (#1444)
Filter silent contracts in the views that display contracts lists rather than with `formatContractForDisplay` because the old approach prevents interaction with a silent contract if a link to it is followed from the blocks or transactions explorer, which is not desirable.
This commit is contained in:
parent
9afdbd9848
commit
f60c979c75
@ -15,32 +15,34 @@ const Contracts = ({contracts, title = "Contracts"}) => (
|
|||||||
</CardHeader>
|
</CardHeader>
|
||||||
<CardBody>
|
<CardBody>
|
||||||
{
|
{
|
||||||
contracts.map((contract, key) => {
|
contracts
|
||||||
const contractDisplay = formatContractForDisplay(contract);
|
.filter(contract => !contract.silent)
|
||||||
if (!contractDisplay) {
|
.map((contract, key) => {
|
||||||
return '';
|
const contractDisplay = formatContractForDisplay(contract);
|
||||||
}
|
if (!contractDisplay) {
|
||||||
|
return '';
|
||||||
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="explorer-row border-top" key={`contract-${key}`}>
|
<div className="explorer-row border-top" key={`contract-${key}`}>
|
||||||
<CardTitleIdenticon id={contract.className}>
|
<CardTitleIdenticon id={contract.className}>
|
||||||
<Link to={`/explorer/contracts/${contract.className}`}>{contract.className}</Link>
|
<Link to={`/explorer/contracts/${contract.className}`}>{contract.className}</Link>
|
||||||
</CardTitleIdenticon>
|
</CardTitleIdenticon>
|
||||||
<Row>
|
<Row>
|
||||||
<Col>
|
<Col>
|
||||||
<strong>Address</strong>
|
<strong>Address</strong>
|
||||||
<div>{contract.address}</div>
|
<div>{contract.address}</div>
|
||||||
</Col>
|
</Col>
|
||||||
<Col>
|
<Col>
|
||||||
<strong>State</strong>
|
<strong>State</strong>
|
||||||
<div className={contractDisplay.stateColor}>
|
<div className={contractDisplay.stateColor}>
|
||||||
{contractDisplay.state}
|
{contractDisplay.state}
|
||||||
</div>
|
</div>
|
||||||
</Col>
|
</Col>
|
||||||
</Row>
|
</Row>
|
||||||
</div>
|
</div>
|
||||||
)
|
)
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
</CardBody>
|
</CardBody>
|
||||||
</Card>
|
</Card>
|
||||||
|
@ -15,19 +15,21 @@ const ContractsList = ({contracts}) => (
|
|||||||
</thead>
|
</thead>
|
||||||
<tbody>
|
<tbody>
|
||||||
{
|
{
|
||||||
contracts.map((contract) => {
|
contracts
|
||||||
const contractDisplay = formatContractForDisplay(contract);
|
.filter(contract => !contract.silent)
|
||||||
if (!contractDisplay) {
|
.map((contract) => {
|
||||||
return null;
|
const contractDisplay = formatContractForDisplay(contract);
|
||||||
}
|
if (!contractDisplay) {
|
||||||
return (
|
return null;
|
||||||
<tr key={contract.className} className={contractDisplay.stateColor}>
|
}
|
||||||
<td><Link to={`/explorer/contracts/${contract.className}`}>{contract.className}</Link></td>
|
return (
|
||||||
<td>{contractDisplay.address}</td>
|
<tr key={contract.className} className={contractDisplay.stateColor}>
|
||||||
<td>{contractDisplay.state}</td>
|
<td><Link to={`/explorer/contracts/${contract.className}`}>{contract.className}</Link></td>
|
||||||
</tr>
|
<td>{contractDisplay.address}</td>
|
||||||
);
|
<td>{contractDisplay.state}</td>
|
||||||
})
|
</tr>
|
||||||
|
);
|
||||||
|
})
|
||||||
}
|
}
|
||||||
</tbody>
|
</tbody>
|
||||||
</Table>
|
</Table>
|
||||||
|
@ -29,7 +29,7 @@ class ContractsContainer extends Component {
|
|||||||
{this.props.updatePageHeader && <PageHead title="Contracts" description="Summary of all deployed contracts" />}
|
{this.props.updatePageHeader && <PageHead title="Contracts" description="Summary of all deployed contracts" />}
|
||||||
<DataWrapper shouldRender={this.props.contracts.length > 0} {...this.props} render={({contracts}) => {
|
<DataWrapper shouldRender={this.props.contracts.length > 0} {...this.props} render={({contracts}) => {
|
||||||
if (this.props.mode === "list") return <ContractsList contracts={contracts} />;
|
if (this.props.mode === "list") return <ContractsList contracts={contracts} />;
|
||||||
if (this.props.mode === "detail") return <Contracts contracts={contracts} />;
|
if (this.props.mode === "detail") return <Contracts contracts={contracts} />;
|
||||||
}} />
|
}} />
|
||||||
</React.Fragment>
|
</React.Fragment>
|
||||||
);
|
);
|
||||||
@ -38,8 +38,8 @@ class ContractsContainer extends Component {
|
|||||||
|
|
||||||
function mapStateToProps(state) {
|
function mapStateToProps(state) {
|
||||||
return {
|
return {
|
||||||
contracts: getContracts(state),
|
contracts: getContracts(state),
|
||||||
error: state.errorMessage,
|
error: state.errorMessage,
|
||||||
loading: state.loading};
|
loading: state.loading};
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -1,7 +1,4 @@
|
|||||||
export function formatContractForDisplay(contract) {
|
export function formatContractForDisplay(contract) {
|
||||||
if (contract.silent) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
let address = (contract.address || contract.deployedAddress);
|
let address = (contract.address || contract.deployedAddress);
|
||||||
let state = 'Deployed';
|
let state = 'Deployed';
|
||||||
let stateColor = 'success';
|
let stateColor = 'success';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user