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

UI improvements

Browse Source 
Backend now only syncs to DB once on boot and returns blockNumber correctly
This commit is contained in:
Marco van Dijk 2022-03-05 14:41:31 +01:00
parent 4d3858cd4d
commit daf1dc51c2
6 changed files with 81 additions and 47 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

17
backend/src/routes/livepeer.js
View File

@ -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
View 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;

31
src/actions/livepeer.js
View File

@ -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

13
src/eventButton.js
View File

@ -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,8 +41,17 @@ 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="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" />
@ -60,6 +70,7 @@ const EventButton = (obj) => {
{eventRightAddr}
</div>
</div >
</div>
)
}

10
src/eventViewer.js
View File

@ -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++;
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>

2
src/orchestratorViewer.js
View File

@ -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>