From 02969a634e2d6a64aca0454ea928d6c9fdec505d Mon Sep 17 00:00:00 2001 From: Marco van Dijk Date: Fri, 11 Mar 2022 15:28:40 +0100 Subject: [PATCH] Merge tickets with events in render --- src/actions/livepeer.js | 6 ++-- src/eventViewer.js | 80 ++++++++++++++++++++++++++++++----------- src/livepeer.js | 17 +-------- src/ticketViewer.js | 49 ------------------------- 4 files changed, 63 insertions(+), 89 deletions(-) delete mode 100644 src/ticketViewer.js diff --git a/src/actions/livepeer.js b/src/actions/livepeer.js index 08eadf2..5032efc 100644 --- a/src/actions/livepeer.js +++ b/src/actions/livepeer.js @@ -10,7 +10,7 @@ const unbondColour = "rgba(122, 23, 51, 0.3)"; const claimColour = "rgba(77, 91, 42, 0.3)"; const ticketTransferColour = "rgba(88, 91, 42, 0.3)"; -const ticketRedeemColour = "rgba(42, 91, 44, 0.3)"; +const ticketRedeemColour = "rgba(42, 44, 91, 0.3)"; const thresholdStaking = 0.001; const thresholdFees = 0.00009; @@ -96,7 +96,7 @@ export const getEvents = () => async dispatch => { let tmpWhen = ""; // Group Events into transactions. Always reset when the transactionID changes { - for (const eventObj of data.slice(0).reverse()) { + for (const eventObj of data) { if (currentTx === "") { currentTx = eventObj.transactionHash; currentUrl = eventObj.transactionUrl; @@ -370,7 +370,7 @@ export const getTickets = () => async dispatch => { let currentTime = 0; // Parse Tickets { - for (const eventObj of data.slice(0).reverse()) { + for (const eventObj of data) { if (currentTx === "") { currentTx = eventObj.transactionHash; currentUrl = eventObj.transactionUrl; diff --git a/src/eventViewer.js b/src/eventViewer.js index f782c0f..06719e8 100644 --- a/src/eventViewer.js +++ b/src/eventViewer.js @@ -11,6 +11,7 @@ const withdrawStakeColour = "rgba(115, 110, 22, 0.3)"; const stakeColour = "rgba(71, 23, 122, 0.3)"; const claimColour = "rgba(77, 91, 42, 0.3)"; const unbondColour = "rgba(122, 23, 51, 0.3)"; +const ticketRedeemColour = "rgba(42, 44, 91, 0.3)"; const greyColour = "rgba(122, 128, 127, 0.3)"; const defaultMaxShown = 100; @@ -23,6 +24,7 @@ const EventViewer = (obj) => { const [withdrawActivated, setWithdrawActivated] = useState(true); const [stakeActivated, setStakeActivated] = useState(true); const [delegatorRewardActivated, setDelegatorRewardActivated] = useState(true); + const [ticketRedemptionActivated, setTicketRedemptionActivated] = useState(true); const [unbondActivated, setUnbondActivated] = useState(true); console.log("Rendering EventViewer"); let unfiltered = 0; @@ -40,6 +42,8 @@ const EventViewer = (obj) => { stakeActivatedColour = stakeActivated ? stakeColour : greyColour; let delegatorActivatedColour; delegatorActivatedColour = delegatorRewardActivated ? claimColour : greyColour; + let ticketActivatedColour; + ticketActivatedColour = ticketRedemptionActivated ? ticketRedeemColour : greyColour; let unbondActivatedColour; unbondActivatedColour = unbondActivated ? unbondColour : greyColour; @@ -75,72 +79,101 @@ const EventViewer = (obj) => { } let eventList = []; - for (const eventObj of obj.events) { + let thisEvent = {}; + let eventIdx = obj.events.length - 1; + let ticketIdx = obj.tickets.length - 1; + while (eventIdx >= 0 || ticketIdx >= 0) { + const latestEvent = obj.events[eventIdx]; + let latestEventTime = 0; + if (eventIdx >= 0){ + latestEventTime = latestEvent.transactionTime; + } + const latestTicket = obj.tickets[ticketIdx]; + let latestTicketTime = 0; + if (ticketIdx >= 0){ + latestTicketTime = latestTicket.transactionTime; + } + if (latestEventTime > latestTicketTime){ + thisEvent = latestEvent; + eventIdx -= 1; + }else if (latestTicketTime){ + thisEvent = latestTicket; + ticketIdx -= 1; + }else{ + console.log("error, breaky breaky"); + break; + } if (unfiltered > obj.maxAmount) { break; } // Filter by minimum value if (obj.amountFilter !== "") { - if (parseFloat(obj.amountFilter) > eventObj.eventValue) { + if (parseFloat(obj.amountFilter) > thisEvent.eventValue) { continue; } } // Filter name on from, to, caller if (obj.searchTerm !== "") { let isFiltered = true; - if (eventObj.eventCaller.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; - if (eventObj.eventFrom.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; - if (eventObj.eventTo.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; + if (thisEvent.eventCaller.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; + if (thisEvent.eventFrom.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; + if (thisEvent.eventTo.toLowerCase().includes(obj.searchTerm.toLowerCase())) isFiltered = false; if (isFiltered) continue; } // Filter Events on filter buttons let isFiltered = true; - // Check boolean filters on eventObj.eventType + // Check boolean filters on thisEvent.eventType let count = 0; if (filterActivated) { - if (eventObj.eventType === "Activate") { + if (thisEvent.eventType === "Activate") { isFiltered = false; } count++; } if (rewardActivated) { - if (eventObj.eventType === "Reward") { + if (thisEvent.eventType === "Reward") { isFiltered = false; } count++; } if (updateActivated) { - if (eventObj.eventType === "Update") { + if (thisEvent.eventType === "Update") { isFiltered = false; } count++; } if (withdrawActivated) { - if (eventObj.eventType === "Withdraw") { + if (thisEvent.eventType === "Withdraw") { isFiltered = false; } count++; } if (stakeActivated) { - if (eventObj.eventType === "Stake") { + if (thisEvent.eventType === "Stake") { isFiltered = false; } count++; } if (stakeActivated) { - if (eventObj.eventType === "Migrate") { + if (thisEvent.eventType === "Migrate") { isFiltered = false; } count++; } if (unbondActivated) { - if (eventObj.eventType === "Unbond") { + if (thisEvent.eventType === "Unbond") { isFiltered = false; } count++; } if (delegatorRewardActivated) { - if (eventObj.eventType === "Claim") { + if (thisEvent.eventType === "Claim") { + isFiltered = false; + } + count++; + } + if (ticketRedemptionActivated) { + if (thisEvent.eventType === "RedeemTicket") { isFiltered = false; } count++; @@ -151,19 +184,19 @@ const EventViewer = (obj) => { if (unfiltered < obj.maxAmount) { unfiltered++; - if (prevBlock === eventObj.transactionBlock) { + if (prevBlock === thisEvent.transactionBlock) { eventList.push(); } else { - prevBlock = eventObj.transactionBlock; + prevBlock = thisEvent.transactionBlock; eventList.push(); } @@ -296,6 +329,11 @@ const EventViewer = (obj) => { }}>

Unbond

+ diff --git a/src/livepeer.js b/src/livepeer.js index 5b6b6f6..f4bef50 100644 --- a/src/livepeer.js +++ b/src/livepeer.js @@ -6,7 +6,6 @@ import { getOrchestratorInfo, clearOrchestrator } from "./actions/livepeer"; import EventViewer from "./eventViewer"; import Orchestrator from "./orchestratorViewer"; import Stat from "./statViewer"; -import TicketViewer from './ticketViewer'; // Shows the EventViewer and other Livepeer related info const defaultMaxShown = 100; @@ -16,7 +15,6 @@ const Livepeer = (obj) => { const [maxAmount, setMaxAmount] = useState(defaultMaxShown); const [prefill, setPrefill] = useSearchParams(); const [searchTerm, setSearchTerm] = useState(""); - const [showTickets, setShowTickets] = useState(""); const dispatch = useDispatch(); const livepeer = useSelector((state) => state.livepeerstate); const [redirectToHome, setRedirectToHome] = useState(false); @@ -136,12 +134,6 @@ const Livepeer = (obj) => { if (livepeer.tickets) { ticketList = livepeer.tickets; } - if (showTickets) { - ticketBit = -
- -
- } let thisOrchObj; let headerString; @@ -199,12 +191,6 @@ const Livepeer = (obj) => { }}>

✖️ Clear

-

Tickets

-
setShowTickets(!showTickets)}> -
- {showTickets ? "Show" : "Hide"} -
-

Sidebar

setShowSidebar(!showSidebar)}>
@@ -224,9 +210,8 @@ const Livepeer = (obj) => {
+ maxAmount={maxAmount} setMaxAmount={setMaxAmount} tickets={ticketList} />
- {ticketBit}
); diff --git a/src/ticketViewer.js b/src/ticketViewer.js deleted file mode 100644 index ac3ed76..0000000 --- a/src/ticketViewer.js +++ /dev/null @@ -1,49 +0,0 @@ -import React, { useState } from "react"; -import EventButton from "./eventButton"; -import ScrollContainer from 'react-indiana-drag-scroll'; - -const TicketViewer = (obj) => { - console.log("Rendering TicketViewer"); - let unfiltered = 0; - let prevBlock = 0; - let ticketList = []; - for (const ticketObj of obj.tickets) { - unfiltered++; - if (prevBlock === ticketObj.transactionBlock) { - ticketList.push(); - } else { - prevBlock = ticketObj.transactionBlock; - ticketList.push(); - } - } - - return ( -
-
-
-
- -
-
- {ticketList} -
-
-
-
-
-
-
- ) -} - -export default TicketViewer; \ No newline at end of file