Search fix
This commit is contained in:
vbaranov
Roman Storm
parent
e0ff441448
commit
4df197c83e
|
|
@ -1,6 +1,6 @@
|
|||
import React from 'react';
|
||||
import moment from 'moment';
|
||||
import { observable, action, computed, autorun } from "mobx";
|
||||
import { observable, action, computed } from "mobx";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { toAscii } from "../helpers";
|
||||
import { constants } from "../constants";
|
||||
|
|
@ -18,7 +18,6 @@ export class BallotCard extends React.Component {
|
|||
@observable progress;
|
||||
@observable totalVoters;
|
||||
@observable isFinalized;
|
||||
@observable isFiltered;
|
||||
|
||||
@computed get votesForNumber() {
|
||||
let votes = (this.totalVoters + this.progress) / 2;
|
||||
|
|
@ -197,22 +196,36 @@ export class BallotCard extends React.Component {
|
|||
this.getIsFinalized();
|
||||
}
|
||||
|
||||
hideCard = () => {
|
||||
let { commonStore } = this.props;
|
||||
let hideCard = commonStore.isActiveFilter && this.isFinalized;
|
||||
if (commonStore.searchTerm) {
|
||||
if (commonStore.searchTerm.length == 0) return hideCard;
|
||||
if (String(this.creator).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
} else {
|
||||
return hideCard;
|
||||
}
|
||||
componentDidMount() {
|
||||
this.interval = setInterval(() => {
|
||||
this.calcTimeToFinish()
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
window.clearInterval(this.interval);
|
||||
}
|
||||
|
||||
showCard = () => {
|
||||
let { commonStore } = this.props;
|
||||
let show = commonStore.isActiveFilter ? !this.isFinalized : true;
|
||||
return show;
|
||||
}
|
||||
|
||||
isCreatorPattern = () => {
|
||||
let { commonStore } = this.props;
|
||||
if (commonStore.searchTerm) {
|
||||
if (commonStore.searchTerm.length > 0) {
|
||||
const isCreatorPattern = String(this.creator).toLowerCase().includes(commonStore.searchTerm)
|
||||
return isCreatorPattern;
|
||||
}
|
||||
}
|
||||
return true;
|
||||
}
|
||||
|
||||
render () {
|
||||
let { contractsStore, ballotStore, votingType, children } = this.props;
|
||||
let ballotClass = this.hideCard() ? "ballots-i display-none" : "ballots-i";
|
||||
let { contractsStore, votingType, children, isSearchPattern } = this.props;
|
||||
let ballotClass = (this.showCard() && (this.isCreatorPattern() || isSearchPattern)) ? "ballots-i" : "ballots-i display-none";
|
||||
let threshold
|
||||
switch(votingType) {
|
||||
case "votingToChangeKeys":
|
||||
|
|
@ -224,6 +237,9 @@ export class BallotCard extends React.Component {
|
|||
case "votingToChangeProxy":
|
||||
threshold = contractsStore.proxyBallotThreshold
|
||||
break;
|
||||
default:
|
||||
threshold = contractsStore.keysBallotThreshold
|
||||
break;
|
||||
}
|
||||
return (
|
||||
<div className={ballotClass}>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react';
|
||||
import { observable, action, computed, autorun } from "mobx";
|
||||
import { observable, action } from "mobx";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { BallotCard } from './BallotCard';
|
||||
|
||||
|
|
@ -81,36 +81,21 @@ export class BallotKeysCard extends React.Component {
|
|||
this.getBallotType();
|
||||
}
|
||||
|
||||
componentDidMount() {
|
||||
this.interval = setInterval(() => {
|
||||
this.calcTimeToFinish()
|
||||
}, 1000)
|
||||
}
|
||||
|
||||
componentWillUnmount() {
|
||||
window.clearInterval(this.interval);
|
||||
}
|
||||
|
||||
hideCard = () => {
|
||||
isSearchPattern = () => {
|
||||
let { commonStore } = this.props;
|
||||
let hideCard = commonStore.isActiveFilter && this.isFinalized;
|
||||
if (commonStore.searchTerm) {
|
||||
if (commonStore.searchTerm.length == 0) return hideCard;
|
||||
if (String(this.affectedKey).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
if (String(this.affectedKeyTypeDisplayName).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
if (String(this.ballotTypeDisplayName).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
} else {
|
||||
return hideCard;
|
||||
const isAffectedKeyPattern = String(this.affectedKey).toLowerCase().includes(commonStore.searchTerm)
|
||||
const isAffectedKeyTypeDisplayNamePattern = String(this.affectedKeyTypeDisplayName).toLowerCase().includes(commonStore.searchTerm)
|
||||
const isBallotTypeDisplayNamePattern = String(this.ballotTypeDisplayName).toLowerCase().includes(commonStore.searchTerm)
|
||||
return (isAffectedKeyPattern || isAffectedKeyTypeDisplayNamePattern || isBallotTypeDisplayNamePattern);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
render () {
|
||||
let { contractsStore, id } = this.props;
|
||||
let ballotClass = this.hideCard() ? "ballots-i display-none" : "ballots-i";
|
||||
let { id } = this.props;
|
||||
return (
|
||||
<BallotCard votingType="votingToChangeKeys" id={id}>
|
||||
<BallotCard votingType="votingToChangeKeys" id={id} isSearchPattern={this.isSearchPattern()}>
|
||||
<div className="ballots-about-i ballots-about-i_action">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Action</p>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,8 @@
|
|||
import React from 'react';
|
||||
import moment from 'moment';
|
||||
import { observable, action, computed } from "mobx";
|
||||
import { observable, action } from "mobx";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { toAscii } from "../helpers";
|
||||
import { constants } from "../constants";
|
||||
import swal from 'sweetalert2';
|
||||
import { BallotCard } from './BallotCard';
|
||||
|
||||
const ACCEPT = 1;
|
||||
const REJECT = 2;
|
||||
@inject("commonStore", "contractsStore", "routing")
|
||||
@observer
|
||||
export class BallotMinThresholdCard extends React.Component {
|
||||
|
|
@ -26,25 +20,19 @@ export class BallotMinThresholdCard extends React.Component {
|
|||
this.getProposedValue(this.props.id);
|
||||
}
|
||||
|
||||
hideCard = () => {
|
||||
isSearchPattern = () => {
|
||||
let { commonStore } = this.props;
|
||||
let hideCard = commonStore.isActiveFilter && this.isFinalized;
|
||||
if (commonStore.searchTerm) {
|
||||
if (commonStore.searchTerm.length == 0) return hideCard;
|
||||
if (String(this.proposedValue).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
if (String(this.creator).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
} else {
|
||||
return hideCard;
|
||||
const isProposedValuePattern = String(this.proposedValue).toLowerCase().includes(commonStore.searchTerm)
|
||||
return (isProposedValuePattern);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
render () {
|
||||
let { contractsStore, id } = this.props;
|
||||
let ballotClass = this.hideCard() ? "ballots-i display-none" : "ballots-i";
|
||||
let { id } = this.props;
|
||||
return (
|
||||
<BallotCard votingType="votingToChangeMinThreshold" id={id}>
|
||||
<BallotCard votingType="votingToChangeMinThreshold" id={id} isSearchPattern={this.isSearchPattern()}>
|
||||
<div className="ballots-about-i ballots-about-i_proposed-min-threshold">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Proposed min threshold</p>
|
||||
|
|
@ -54,71 +42,6 @@ export class BallotMinThresholdCard extends React.Component {
|
|||
</div>
|
||||
</div>
|
||||
</BallotCard>
|
||||
/*<div className={ballotClass}>
|
||||
<div className="ballots-about">
|
||||
<div className="ballots-about-i ballots-about-i_name">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Name</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-i--name">{this.creator}</p>
|
||||
<p className="ballots-i--created">{this.startTime}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-about-i ballots-about-i_proposed-min-threshold">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Proposed min threshold</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p>{this.proposedValue}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-about-i ballots-about-i_time">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Time</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-i--time">{this.timeToFinish}</p>
|
||||
<p className="ballots-i--to-close">To close</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-i-scale">
|
||||
<div className="ballots-i-scale-column">
|
||||
<button type="button" onClick={(e) => this.vote({choice: REJECT})} className="ballots-i--vote ballots-i--vote_no">No</button>
|
||||
<div className="vote-scale--container">
|
||||
<p className="vote-scale--value">No</p>
|
||||
<p className="vote-scale--votes">Votes: {this.votesAgainstNumber}</p>
|
||||
<p className="vote-scale--percentage">{this.votesAgainstPercents}%</p>
|
||||
<div className="vote-scale">
|
||||
<div className="vote-scale--fill vote-scale--fill_yes" style={{width: `${this.votesAgainstPercents}%`}}></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-i-scale-column">
|
||||
<div className="vote-scale--container">
|
||||
<p className="vote-scale--value">Yes</p>
|
||||
<p className="vote-scale--votes">Votes: {this.votesForNumber}</p>
|
||||
<p className="vote-scale--percentage">{this.votesForPercents}%</p>
|
||||
<div className="vote-scale">
|
||||
<div className="vote-scale--fill vote-scale--fill_no" style={{width: `${this.votesForPercents}%`}}></div>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" onClick={(e) => this.vote({choice: ACCEPT})} className="ballots-i--vote ballots-i--vote_yes">Yes</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info">
|
||||
Minimum {contractsStore.minThresholdBallotThreshold} from {contractsStore.validatorsLength} validators is required to pass the proposal
|
||||
</div>
|
||||
<hr />
|
||||
<div className="ballots-footer">
|
||||
<div className="ballots-footer-left">
|
||||
<button type="button" onClick={(e) => this.finalize(e)} className="ballots-footer-finalize">Finalize ballot</button>
|
||||
<p>{constants.CARD_FINALIZE_DESCRIPTION}</p>
|
||||
</div>
|
||||
<div type="button" className="ballots-i--vote ballots-i--vote_no">Consensus Ballot ID: {this.props.id}</div>
|
||||
</div>
|
||||
</div>*/
|
||||
);
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
import React from 'react';
|
||||
import { observable, action, computed } from "mobx";
|
||||
import { observable, action } from "mobx";
|
||||
import { inject, observer } from "mobx-react";
|
||||
import { BallotCard } from './BallotCard';
|
||||
|
||||
|
|
@ -29,25 +29,20 @@ export class BallotProxyCard extends React.Component {
|
|||
this.getContractType();
|
||||
}
|
||||
|
||||
hideCard = () => {
|
||||
isSearchPattern = () => {
|
||||
let { commonStore } = this.props;
|
||||
let hideCard = commonStore.isActiveFilter && this.isFinalized;
|
||||
if (commonStore.searchTerm) {
|
||||
if (commonStore.searchTerm.length == 0) return hideCard;
|
||||
if (String(this.proposedAddress).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
if (String(this.contractType).toLowerCase().includes(commonStore.searchTerm)) return (hideCard && false);
|
||||
} else {
|
||||
return hideCard;
|
||||
const isProposedAddressPattern = String(this.proposedAddress).toLowerCase().includes(commonStore.searchTerm)
|
||||
const isContractTypePattern = String(this.contractType).toLowerCase().includes(commonStore.searchTerm)
|
||||
return (isProposedAddressPattern || isContractTypePattern);
|
||||
}
|
||||
|
||||
return true;
|
||||
}
|
||||
|
||||
render () {
|
||||
const { contractsStore, ballotStore, id } = this.props;
|
||||
let ballotClass = this.hideCard() ? "ballots-i display-none" : "ballots-i";
|
||||
const { ballotStore, id } = this.props;
|
||||
return (
|
||||
<BallotCard votingType="votingToChangeProxy" id={id}>
|
||||
<BallotCard votingType="votingToChangeProxy" id={id} isSearchPattern={this.isSearchPattern()}>
|
||||
<div className="ballots-about-i ballots-about-i_contract-type">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Contract type</p>
|
||||
|
|
@ -66,78 +61,5 @@ export class BallotProxyCard extends React.Component {
|
|||
</div>
|
||||
</BallotCard>
|
||||
);
|
||||
/* <div className={ballotClass}>
|
||||
<div className="ballots-about">
|
||||
<div className="ballots-about-i ballots-about-i_name">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Name</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-i--name">{this.creator}</p>
|
||||
<p className="ballots-i--created">{this.startTime}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-about-i ballots-about-i_contract-type">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Contract type</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p>{ballotStore.ProxyBallotType[this.contractType]}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-about-i ballots-about-i_proposed-address">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Proposed contract address</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p>{this.proposedAddress}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-about-i ballots-about-i_time">
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-about-i--title">Time</p>
|
||||
</div>
|
||||
<div className="ballots-about-td">
|
||||
<p className="ballots-i--time">{this.timeToFinish}</p>
|
||||
<p className="ballots-i--to-close">To close</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-i-scale">
|
||||
<div className="ballots-i-scale-column">
|
||||
<button type="button" onClick={(e) => this.vote({choice: REJECT})} className="ballots-i--vote ballots-i--vote_no">No</button>
|
||||
<div className="vote-scale--container">
|
||||
<p className="vote-scale--value">No</p>
|
||||
<p className="vote-scale--votes">Votes: {this.votesAgainstNumber}</p>
|
||||
<p className="vote-scale--percentage">{this.votesAgainstPercents}%</p>
|
||||
<div className="vote-scale">
|
||||
<div className="vote-scale--fill vote-scale--fill_yes" style={{width: `${this.votesAgainstPercents}%`}}></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="ballots-i-scale-column">
|
||||
<div className="vote-scale--container">
|
||||
<p className="vote-scale--value">Yes</p>
|
||||
<p className="vote-scale--votes">Votes: {this.votesForNumber}</p>
|
||||
<p className="vote-scale--percentage">{this.votesForPercents}%</p>
|
||||
<div className="vote-scale">
|
||||
<div className="vote-scale--fill vote-scale--fill_no" style={{width: `${this.votesForPercents}%`}}></div>
|
||||
</div>
|
||||
</div>
|
||||
<button type="button" onClick={(e) => this.vote({choice: ACCEPT})} className="ballots-i--vote ballots-i--vote_yes">Yes</button>
|
||||
</div>
|
||||
</div>
|
||||
<div className="info">
|
||||
Minimum {contractsStore.proxyBallotThreshold} from {contractsStore.validatorsLength} validators is required to pass the proposal
|
||||
</div>
|
||||
<hr />
|
||||
<div className="ballots-footer">
|
||||
<div className="ballots-footer-left">
|
||||
<button type="button" onClick={(e) => this.finalize(e)} className="ballots-footer-finalize">Finalize ballot</button>
|
||||
<p>{constants.CARD_FINALIZE_DESCRIPTION}</p>
|
||||
</div>
|
||||
<div type="button" className="ballots-i--vote ballots-i--vote_no">Proxy Ballot ID: {this.props.id}</div>
|
||||
</div>
|
||||
</div>*/
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue