mirror of
https://github.com/stronk-dev/LivepeerEvents.git
synced 2025-07-05 10:45:10 +02:00
UI improvements
Backend now only syncs to DB once on boot and returns blockNumber correctly
This commit is contained in:
parent
4d3858cd4d
commit
daf1dc51c2
@ -65,13 +65,11 @@ const defaultOrch = "0x847791cbf03be716a7fe9dc8c9affe17bd49ae5e";
|
||||
// Will contain addr, lastGet, and obj of any requested O's
|
||||
let orchestratorCache = [];
|
||||
|
||||
// Listen to smart contract emitters. Resync with DB every 5 minutes
|
||||
const timeoutEvents = 300000;
|
||||
// Listen to smart contract emitters. Only re-syncs on boot!
|
||||
let eventsCache = [];
|
||||
let latestMissedDuringSync = 0;
|
||||
let lastBlockDataAdded = 0;
|
||||
let syncCache = [];
|
||||
let eventsGet = 0;
|
||||
// Set to true to drop the entire collection on boot and get all events
|
||||
const fullSync = false;
|
||||
// https://arbiscan.io/address/0x35Bcf3c30594191d53231E4FF333E8A770453e40#events
|
||||
@ -367,19 +365,6 @@ apiRouter.get("/quotes", async (req, res) => {
|
||||
// Exports list of smart contract events
|
||||
apiRouter.get("/getEvents", async (req, res) => {
|
||||
try {
|
||||
const now = new Date().getTime();
|
||||
// Update cmc once their data has expired
|
||||
if (now - eventsGet > timeoutEvents) {
|
||||
eventsCache = await Event.find({}, {
|
||||
address: 1,
|
||||
transactionHash: 1,
|
||||
transactionUrl: 1,
|
||||
name: 1,
|
||||
data: 1,
|
||||
_id: 0
|
||||
});
|
||||
eventsGet = now;
|
||||
}
|
||||
res.send(eventsCache);
|
||||
} catch (err) {
|
||||
res.status(400).send(err);
|
||||
|
||||
13
src/BlockViewer.js
Normal file
13
src/BlockViewer.js
Normal file
@ -0,0 +1,13 @@
|
||||
import React from "react";
|
||||
|
||||
const Block = (obj) => {
|
||||
return (
|
||||
<div className="rowAlignLeft" style={{ width: '100%' }}>
|
||||
<span className="rowAlignRight elipsText">
|
||||
Block {obj.block}
|
||||
</span>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
export default Block;
|
||||
@ -63,6 +63,7 @@ export const getEvents = () => async dispatch => {
|
||||
let txCounter = 0;
|
||||
let currentTx = "";
|
||||
let currentUrl = "";
|
||||
let currentBlock = 0;
|
||||
// Current Event we are processing
|
||||
let eventType = ""; // Named type: Withdraw, Update, Claim, Reward, Activate, Unbond, Stake
|
||||
let eventDescription = ""; // Descriptive text, also containing Amount, AmountOther and When
|
||||
@ -88,6 +89,7 @@ export const getEvents = () => async dispatch => {
|
||||
if (currentTx === "") {
|
||||
currentTx = eventObj.transactionHash;
|
||||
currentUrl = eventObj.transactionUrl;
|
||||
currentBlock = eventObj.blockNumber;
|
||||
}
|
||||
// New transaction found
|
||||
if (currentTx !== eventObj.transactionHash) {
|
||||
@ -155,7 +157,8 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo,
|
||||
eventColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
}
|
||||
|
||||
@ -180,11 +183,15 @@ export const getEvents = () => async dispatch => {
|
||||
txCounter++;
|
||||
currentTx = eventObj.transactionHash;
|
||||
currentUrl = eventObj.transactionUrl;
|
||||
currentBlock = eventObj.blockNumber;
|
||||
}
|
||||
// Always split off WithdrawStake as a separate Withdraw Event
|
||||
if (eventObj.name === "WithdrawStake") {
|
||||
const amount = parseFloat(eventObj.data.amount) / 1000000000000000000;
|
||||
const txt = " withdrew a " + amount + " LPT stake in round " + eventObj.data.withdrawRound;
|
||||
if (amount < thresholdFees){
|
||||
continue;
|
||||
}
|
||||
const txt = " withdrew a " + amount.toFixed(2) + " LPT stake in round " + eventObj.data.withdrawRound;
|
||||
finalEventList.push({
|
||||
eventType: "Withdraw",
|
||||
eventDescription: txt,
|
||||
@ -193,11 +200,15 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo: "",
|
||||
eventColour: withdrawStakeColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
} else if (eventObj.name === "WithdrawFees") {
|
||||
const amount = parseFloat(eventObj.data.amount) / 1000000000000000000;
|
||||
const txt = " withdrew " + amount + " LPT earned fees";
|
||||
if (amount < thresholdFees){
|
||||
continue;
|
||||
}
|
||||
const txt = " withdrew " + amount.toFixed(2) + " LPT earned fees";
|
||||
finalEventList.push({
|
||||
eventType: "Withdraw",
|
||||
eventDescription: txt,
|
||||
@ -206,7 +217,8 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo: "",
|
||||
eventColour: withdrawStakeColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
}
|
||||
// Always split off TranscoderUpdate as a separate Update Event
|
||||
@ -223,7 +235,8 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo: "",
|
||||
eventColour: updateColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
}
|
||||
// Always split off EarningsClaimed as a separate Claim Event
|
||||
@ -253,7 +266,8 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo: "",
|
||||
eventColour: claimColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
}
|
||||
// Always split off Reward as a separate Reward Event
|
||||
@ -272,7 +286,8 @@ export const getEvents = () => async dispatch => {
|
||||
eventTo: "",
|
||||
eventColour: rewardColour,
|
||||
transactionHash: currentTx,
|
||||
transactionUrl: currentUrl
|
||||
transactionUrl: currentUrl,
|
||||
transactionBlock: currentBlock
|
||||
});
|
||||
}
|
||||
// Extract useful info from other types of Event
|
||||
|
||||
@ -3,6 +3,7 @@ import {
|
||||
getOrchestratorInfo
|
||||
} from "./actions/livepeer";
|
||||
import { useDispatch } from 'react-redux';
|
||||
import Block from "./BlockViewer";
|
||||
|
||||
/// Displays a single event. Sets selected Orchestrator info in the redux store
|
||||
|
||||
@ -40,26 +41,36 @@ const EventButton = (obj) => {
|
||||
{eventTo}
|
||||
</div>
|
||||
}
|
||||
|
||||
let blockNumber;
|
||||
if (obj.isFirstOfBlock) {
|
||||
blockNumber = <Block block={obj.isFirstOfBlock} />
|
||||
|
||||
}
|
||||
|
||||
return (
|
||||
<div className="rowAlignLeft" style={{ backgroundColor: obj.eventObj.eventColour, borderRadius: "1.2em", width: 'unset' }}>
|
||||
<div className="rowAlignLeft" style={{ flex: '1', width: 'unset' }}>
|
||||
<a className="selectOrch" href={obj.eventObj.transactionUrl}>
|
||||
<img alt="" src="arb.svg" width="30" height="30" />
|
||||
</a>
|
||||
<a className="selectOrch" href={"https://explorer.livepeer.org/accounts/" + obj.eventObj.eventCaller}>
|
||||
<img alt="" src="livepeer.png" width="30" height="30" />
|
||||
</a>
|
||||
<div className="rowAlignLeft" style={{ flex: '1', width: '100%', padding: 0, margin: 0 }}>
|
||||
{eventCaller}
|
||||
<div className="stroke" style={{ width: '100%', padding: 0, margin: 0 }}>
|
||||
{blockNumber}
|
||||
<div className="rowAlignLeft" style={{ backgroundColor: obj.eventObj.eventColour, borderRadius: "1.2em", width: '100%' }}>
|
||||
<div className="rowAlignLeft" style={{ flex: '1', width: 'unset' }}>
|
||||
<a className="selectOrch" href={obj.eventObj.transactionUrl}>
|
||||
<img alt="" src="arb.svg" width="30" height="30" />
|
||||
</a>
|
||||
<a className="selectOrch" href={"https://explorer.livepeer.org/accounts/" + obj.eventObj.eventCaller}>
|
||||
<img alt="" src="livepeer.png" width="30" height="30" />
|
||||
</a>
|
||||
<div className="rowAlignLeft" style={{ flex: '1', width: '100%', padding: 0, margin: 0 }}>
|
||||
{eventCaller}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="rowAlignLeft" style={{ flex: '2', width: 'unset', padding: 0, margin: 0 }}>
|
||||
<span className="rowAlignLeft elipsText">
|
||||
{obj.eventObj.eventDescription}
|
||||
</span>
|
||||
{eventRightAddr}
|
||||
</div>
|
||||
</div >
|
||||
<div className="rowAlignLeft" style={{ flex: '2', width: 'unset', padding: 0, margin: 0 }}>
|
||||
<span className="rowAlignLeft elipsText">
|
||||
{obj.eventObj.eventDescription}
|
||||
</span>
|
||||
{eventRightAddr}
|
||||
</div>
|
||||
</div >
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
|
||||
@ -41,6 +41,7 @@ const EventViewer = (obj) => {
|
||||
let unbondActivatedColour;
|
||||
unbondActivatedColour = unbondActivated ? unbondColour : greyColour;
|
||||
|
||||
let prevBlock = 0;
|
||||
|
||||
return (
|
||||
<div className="stroke roundedOpaque" style={{ padding: 0, margin: 0, marginTop: '2em', position: 'absolute', bottom: 0, top: '300px', left: '0px', right: '0px', overflowY: 'auto', overflowX: 'hidden', width: '100%' }}>
|
||||
@ -129,10 +130,19 @@ const EventViewer = (obj) => {
|
||||
|
||||
if (unfiltered < maxShown) {
|
||||
unfiltered++;
|
||||
return <EventButton
|
||||
key={eventObj.transactionHash + idx}
|
||||
eventObj={eventObj}
|
||||
/>
|
||||
if (prevBlock === eventObj.transactionBlock) {
|
||||
return <EventButton
|
||||
key={eventObj.transactionHash + idx}
|
||||
eventObj={eventObj}
|
||||
/>
|
||||
} else {
|
||||
prevBlock = eventObj.transactionBlock;
|
||||
return <EventButton
|
||||
key={eventObj.transactionHash + idx}
|
||||
eventObj={eventObj}
|
||||
isFirstOfBlock={prevBlock}
|
||||
/>
|
||||
}
|
||||
}
|
||||
})}
|
||||
</div>
|
||||
|
||||
@ -113,7 +113,7 @@ const Orchestrator = (obj) => {
|
||||
return (
|
||||
<div className="rowAlignLeft" key={"delegator" + idx} style={{ marginLeft: '1em', borderBottom: '2px solid rgba(15,15,15,0.05)' }}>
|
||||
<Address address={delObj.id} seed={"delegator" + idx + delObj.id} />
|
||||
<div className="strokeSmollLeft">
|
||||
<div className="rowAlignRight">
|
||||
<p className="darkText">{parseFloat(delObj.bondedAmount).toFixed(2)} LPT since round {delObj.startRound}</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user