stronk/LivepeerEvents
1
0
Fork 0
mirror of https://github.com/stronk-dev/LivepeerEvents.git synced 2025-07-05 10:45:10 +02:00
Code Issues Packages Projects Releases Wiki Activity

Clear now also clears the amount of items shown and the minimum amount filter

Browse Source
This commit is contained in:
Marco van Dijk 2022-03-08 17:29:13 +01:00
parent 02173f15f0
commit 4bb3a22c8b
2 changed files with 25 additions and 20 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

36
src/eventViewer.js
View File

@ -17,8 +17,6 @@ const defaultMaxShown = 100;
const defaultIncrementMaxShown = 100;
const EventViewer = (obj) => {
const [amountFilter, setAmountFilter] = useState("0");
const [maxAmount, setMaxAmount] = useState(defaultMaxShown);
const [filterActivated, setFilterActivated] = useState(true);
const [rewardActivated, setRewardActivated] = useState(true);
const [updateActivated, setUpdateActivated] = useState(true);
@ -47,17 +45,17 @@ const EventViewer = (obj) => {
let prevBlock = 0;
let showMoreBlock;
if (maxAmount < limitShown) {
if (obj.maxAmount < limitShown) {
showMoreBlock = <button className={"nonHomeButton"} style={{ backgroundColor: greyColour, margin: 0, padding: '0', width: '5em' }} onClick={() => {
setMaxAmount(maxAmount + defaultIncrementMaxShown);
obj.setMaxAmount(obj.maxAmount + defaultIncrementMaxShown);
}}>
<h3>Show more</h3>
</button>
}
let showLessBlock;
if (defaultMaxShown < maxAmount) {
if (defaultMaxShown < obj.maxAmount) {
showLessBlock = <button className={"nonHomeButton"} style={{ backgroundColor: greyColour, margin: 0, padding: '0', width: '5em' }} onClick={() => {
setMaxAmount(defaultMaxShown);
obj.setMaxAmount(defaultMaxShown);
}}>
<h3>Show {defaultMaxShown}</h3>
</button>
@ -78,12 +76,12 @@ const EventViewer = (obj) => {
let eventList = [];
for (const eventObj of obj.events) {
if (unfiltered > maxAmount) {
if (unfiltered > obj.maxAmount) {
break;
}
// Filter by minimum value
if (amountFilter !== "") {
if (parseFloat(amountFilter) > eventObj.eventValue) {
if (obj.amountFilter !== "") {
if (parseFloat(obj.amountFilter) > eventObj.eventValue) {
continue;
}
}
@ -151,7 +149,7 @@ const EventViewer = (obj) => {
continue;
}
if (unfiltered < maxAmount) {
if (unfiltered < obj.maxAmount) {
unfiltered++;
if (prevBlock === eventObj.transactionBlock) {
eventList.push(<EventButton
@ -178,7 +176,7 @@ const EventViewer = (obj) => {
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0, flex: 1 }}>
<div className="stroke" style={{ margin: "0", padding: 0 }}>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0 }}>
<h3>Showing max {maxAmount} results</h3>
<h3>Showing max {obj.maxAmount} results</h3>
</div>
<div className="row" style={{ margin: 0, padding: 0 }}>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0 }}>
@ -212,34 +210,34 @@ const EventViewer = (obj) => {
</div>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0, flex: 2 }}>
<div className="row" style={{ margin: 0, padding: 0 }}>
<h3>{parseFloat(amountFilter) > 0 ? ("Only showing higher than " + amountFilter) : "Filter by minimum value"}</h3>
<h3>{parseFloat(obj.amountFilter) > 0 ? ("Only showing higher than " + obj.amountFilter) : "Filter by minimum value"}</h3>
</div>
<div className="row" style={{ margin: 0, padding: 0 }}>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0 }}>
<button className={"nonHomeButton"} style={{ backgroundColor: greyColour, margin: 0, padding: '0', width: '5em' }} onClick={() => {
setAmountFilter(0);
obj.setAmountFilter(0);
}}>
<h3>0</h3>
</button>
</div>
<input className="searchField" style={{ margin: 0, padding: 0, height: '2em', width: '80%', paddingLeft: '1em', paddingRight: '1em' }}
value={amountFilter}
onChange={(evt) => setAmountFilter(evt.target.value)}
value={obj.amountFilter}
onChange={(evt) => obj.setAmountFilter(evt.target.value)}
placeholder='Filter by minimum value'
type="number"
/>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0 }}>
<button className={"nonHomeButton"} style={{ backgroundColor: greyColour, margin: 0, padding: '0', width: '4em' }} onClick={() => {
const curVal = parseFloat(amountFilter);
setAmountFilter(curVal + 100);
const curVal = parseFloat(obj.amountFilter);
obj.setAmountFilter(curVal + 100);
}}>
<h3>+100</h3>
</button>
</div>
<div className="strokeSmollLeft" style={{ margin: 0, padding: 0 }}>
<button className={"nonHomeButton"} style={{ backgroundColor: greyColour, margin: 0, padding: '0', width: '5em' }} onClick={() => {
const curVal = parseFloat(amountFilter);
setAmountFilter(curVal + 1000);
const curVal = parseFloat(obj.amountFilter);
obj.setAmountFilter(curVal + 1000);
}}>
<h3>+1000</h3>
</button>

9
src/livepeer.js
View File

@ -8,8 +8,11 @@ import Orchestrator from "./orchestratorViewer";
import Stat from "./statViewer";
// Shows the EventViewer and other Livepeer related info
const defaultMaxShown = 100;
const Livepeer = (obj) => {
const [amountFilter, setAmountFilter] = useState("0");
const [maxAmount, setMaxAmount] = useState(defaultMaxShown);
const [prefill, setPrefill] = useSearchParams();
const [searchTerm, setSearchTerm] = useState("");
const dispatch = useDispatch();
@ -176,6 +179,8 @@ const Livepeer = (obj) => {
<button className="homeButton" style={{ padding: 0, paddingRight: '1em', paddingLeft: '1em' }} onClick={() => {
dispatch(clearOrchestrator());
setSearchTerm("");
setAmountFilter(0);
setMaxAmount(defaultMaxShown);
}}>
<h4>✖️ Clear</h4>
</button>
@ -194,7 +199,9 @@ const Livepeer = (obj) => {
<div id='bodyContent'>
{sidebar}
<div className="mainContent">
<EventViewer events={eventsList} searchTerm={searchTerm} setSearchTerm={setSearchTerm} forceVertical={true} showFilter={showFilter} />
<EventViewer events={eventsList} searchTerm={searchTerm} setSearchTerm={setSearchTerm}
forceVertical={true} showFilter={showFilter} setAmountFilter={setAmountFilter} amountFilter={amountFilter}
maxAmount={maxAmount} setMaxAmount={setMaxAmount}/>
</div>
</div>
</div >